From e066c1d0dcc474733093e09588047e76692f77a1 Mon Sep 17 00:00:00 2001 From: Katie Dektar Date: Mon, 8 Jun 2015 12:51:04 -0700 Subject: [PATCH 1/2] Adds JS fiddle button to share dialog. TODOs for fiddle data. --- content/src/controller.js | 9 +++++++++ content/src/view.js | 31 ++++++++++++++++++++++++++----- 2 files changed, 35 insertions(+), 5 deletions(-) diff --git a/content/src/controller.js b/content/src/controller.js index 106e4e3b..26351021 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 (meta.html || meta.text) { + opts.srcCode = { + 'html': meta.html, + 'css': meta.css, + 'text': meta.text, + 'lang': meta.lang + }; + } // Now bring up share dialog view.showShareDialog(opts); }); diff --git a/content/src/view.js b/content/src/view.js index fe2f805a..6d1bfd7b 100644 --- a/content/src/view.js +++ b/content/src/view.js @@ -818,8 +818,13 @@ function showShareDialog(opts) { '">' + '' : '') + '
' + - '' + + '' + ''; + if (opts.srcCode) { + opts.content += ''; + } + window.console.log(opts); opts.init = function(dialog) { dialog.find('a.quiet').tooltipster(); @@ -856,8 +861,18 @@ 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='+bodyText+'&subject='+subjectText); + } else if (innerHTML == 'JS Fiddle') { + alert('JS fiddle clicked!!'); + } else { + window.console.log('Error: unknown button clicked.'); + } } showDialog(opts); @@ -920,6 +935,8 @@ function showDialog(opts) { } } } + + // Gets the current state of the dialog. function state() { var retVal; @@ -947,7 +964,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 +1792,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) { From ac26e605d5908331dce876b02d56b729915a3bd3 Mon Sep 17 00:00:00 2001 From: Katie Dektar Date: Thu, 9 Jul 2015 10:31:26 -0700 Subject: [PATCH 2/2] Gets ready to do POST requests for sharing to fiddle. --- content/src/controller.js | 10 ++--- content/src/view.js | 87 ++++++++++++++++++++++++++++----------- 2 files changed, 67 insertions(+), 30 deletions(-) diff --git a/content/src/controller.js b/content/src/controller.js index 26351021..5d97676b 100644 --- a/content/src/controller.js +++ b/content/src/controller.js @@ -348,12 +348,12 @@ view.on('share', function() { } opts.shareEditURL = window.location.href; // Add data for sharing to a JS Fiddle. - if (meta.html || meta.text) { + if (doc.meta.html || doc.data) { opts.srcCode = { - 'html': meta.html, - 'css': meta.css, - 'text': meta.text, - 'lang': meta.lang + 'html': doc.meta.html, + 'css': doc.meta.css, + 'text': doc.data, + 'lang': doc.meta.type }; } // Now bring up share dialog diff --git a/content/src/view.js b/content/src/view.js index 6d1bfd7b..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)) { @@ -824,7 +859,6 @@ function showShareDialog(opts) { opts.content += ''; } - window.console.log(opts); opts.init = function(dialog) { dialog.find('a.quiet').tooltipster(); @@ -867,9 +901,12 @@ function showShareDialog(opts) { // between multiple 'ok' buttons. opts.done = function(state, innerHTML) { if (innerHTML == 'Email') { - window.open('mailto:?body='+bodyText+'&subject='+subjectText); + window.open('mailto:?body=' + emailParams.bodyText + '&subject=' + + emailParams.subjectText); } else if (innerHTML == 'JS Fiddle') { - alert('JS fiddle clicked!!'); + 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.'); }