diff --git a/content/src/controller.js b/content/src/controller.js index 106e4e3b..5d97676b 100644 --- a/content/src/controller.js +++ b/content/src/controller.js @@ -347,6 +347,15 @@ view.on('share', function() { modelatpos('left').filename; } opts.shareEditURL = window.location.href; + // Add data for sharing to a JS Fiddle. + if (doc.meta.html || doc.data) { + opts.srcCode = { + 'html': doc.meta.html, + 'css': doc.meta.css, + 'text': doc.data, + 'lang': doc.meta.type + }; + } // Now bring up share dialog view.showShareDialog(opts); }); diff --git a/content/src/view.js b/content/src/view.js index fe2f805a..11902f71 100644 --- a/content/src/view.js +++ b/content/src/view.js @@ -731,39 +731,74 @@ function showMiddleButton(which) { $('#middle button').tooltipster(); } -/////////////////////////////////////////////////////////////////////////// -// SHARE DIALOG -/////////////////////////////////////////////////////////////////////////// - -function showShareDialog(opts) { - if (!opts) { - opts = { }; - } - - // Adds a protocol ('http:') to a string path if it does not yet have one. - function addProtocol(path) { - if (/^\w+:/.test(path)) { return path; } - return 'http:' + path; - } +// Adds a protocol ('http:') to a string path if it does not yet have one. +function addProtocol(path) { + if (/^\w+:/.test(path)) { return path; } + return 'http:' + path; +} +// Creates the email params for sharing a program based on the options. +function getShareEmailParams(opts) { + var emailParams = {}; var newLines = '\r\n\r\n'; - bodyText = 'Check out this program that I created on ' + window.pencilcode.domain - + newLines; + emailParams.bodyText = 'Check out this program that I created on ' + + window.pencilcode.domain + newLines; if (opts.shareStageURL) { - bodyText += 'Posted program: ' + addProtocol(opts.shareStageURL) + newLines; + emailParams.bodyText += 'Posted program: ' + + addProtocol(opts.shareStageURL) + newLines; } if (opts.shareRunURL) { - bodyText += 'Latest program: ' + addProtocol(opts.shareRunURL) + newLines; + emailParams.bodyText += 'Latest program: ' + addProtocol(opts.shareRunURL) + + newLines; } if (opts.shareEditURL) { - bodyText += 'Program code: ' + addProtocol(opts.shareEditURL) + newLines; + emailParams.bodyText += 'Program code: ' + addProtocol(opts.shareEditURL) + + newLines; } - subjectText = 'Pencilcode program: ' + opts.title; + emailParams.subjectText = 'Pencilcode program: ' + opts.title; // Need to escape the text since it will go into a url link - bodyText = escape(bodyText); - subjectText = escape(subjectText); + emailParams.bodyText = escape(emailParams.bodyText); + emailParams.subjectText = escape(emailParams.subjectText); + + return emailParams; +} + +// Creates the JS Fiddle params for sharing a program over JS Fiddle. +function getShareFiddleParams(opts) { + var fiddleParams = {}; + fiddleParams.title = opts.title; + fiddleParams.description = 'Created with PencilCode at ' + + addProtocol(opts.shareStageURL) + '.'; + if (opts.srcCode) { + if (opts.srcCode.html) { + fiddleParams.panel_html = 0; + fiddleParams.html = opts.srcCode.html; + } + if (opts.srcCode.css) { + fiddleParams.panel_css = 0; + fiddleParams.css = opts.srcCode.css; + } + if (opts.srcCode.text) { + fiddleParams.panel_js = opts.srcCode.lang == 'javascript' ? 0 : 1; + fiddleParams.js = opts.srcCode.text; + } + } + return fiddleParams; +} + +/////////////////////////////////////////////////////////////////////////// +// SHARE DIALOG +/////////////////////////////////////////////////////////////////////////// + +function showShareDialog(opts) { + if (!opts) { + opts = { }; + } + + var emailParams = getShareEmailParams(opts); + var fiddleParams = getShareFiddleParams(opts); var embedText = null; if (opts.shareRunURL && !/[>"]/.test(opts.shareRunURL)) { @@ -818,8 +853,12 @@ function showShareDialog(opts) { '">' + '' : '') + '
' + - '' + + '' + ''; + if (opts.srcCode) { + opts.content += ''; + } opts.init = function(dialog) { dialog.find('a.quiet').tooltipster(); @@ -856,8 +895,21 @@ function showShareDialog(opts) { dialog.find('button.cancel').focus(); } - opts.done = function(state) { - window.open('mailto:?body='+bodyText+'&subject='+subjectText); + // Called when an 'ok' button is clicked. + // The args are the state of the dialog and the innerHTML + // of the 'ok' button, which can be used to differentiate + // between multiple 'ok' buttons. + opts.done = function(state, innerHTML) { + if (innerHTML == 'Email') { + window.open('mailto:?body=' + emailParams.bodyText + '&subject=' + + emailParams.subjectText); + } else if (innerHTML == 'JS Fiddle') { + window.console.log(fiddleParams); + // POST to http://jsfiddle.net/api/post/library/pure/ with fiddleParams as the + // POST params. + } else { + window.console.log('Error: unknown button clicked.'); + } } showDialog(opts); @@ -920,6 +972,8 @@ function showDialog(opts) { } } } + + // Gets the current state of the dialog. function state() { var retVal; @@ -947,7 +1001,7 @@ function showDialog(opts) { validate(); if (!dialog.find('button.ok').is(':disabled') && opts.done) { - opts.done(state()); + opts.done(state(), this.innerHTML); } }); overlay.on('click', function(e) { @@ -1775,7 +1829,11 @@ function showPaneEditorLanguagesDialog(pane) { } } - opts.done = function(state) { + // Called when an 'ok' button is clicked. + // The args are the state of the dialog and the innerHTML + // of the 'ok' button, which can be used to differentiate + // between multiple 'ok' buttons. + opts.done = function(state, innerHTML) { state.update({cancel:true}); var change = false; if (state.lang && state.lang != visibleMimeType) {