From ea6acdcd8ef9deddfe659600cf8031a51e838331 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Fri, 20 Jan 2017 01:03:17 +0530 Subject: [PATCH 01/10] add sass support. fixes #45 --- src/index.html | 1 + src/script.js | 10 ++++++---- src/style.css | 2 +- 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/src/index.html b/src/index.html index 2d42840..1d75e04 100644 --- a/src/index.html +++ b/src/index.html @@ -60,6 +60,7 @@ diff --git a/src/script.js b/src/script.js index b3084cf..dc4af33 100644 --- a/src/script.js +++ b/src/script.js @@ -23,6 +23,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD var CssModes = { CSS: 'css', SCSS: 'scss', + SASS: 'sass', LESS: 'less', STYLUS: 'stylus' }; @@ -42,6 +43,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD modes[JsModes.TS] = { label: 'TypeScript', cmMode: 'javascript', codepenVal: 'typescript' }; modes[CssModes.CSS] = { label: 'CSS', cmMode: 'css', codepenVal: 'none' }; modes[CssModes.SCSS] = { label: 'SCSS', cmMode: 'sass', codepenVal: 'scss' }; + modes[CssModes.SASS] = { label: 'SASS', cmMode: 'sass', codepenVal: 'sass' }; modes[CssModes.LESS] = { label: 'LESS', cmMode: 'text/x-less', codepenVal: 'less' }; modes[CssModes.STYLUS] = { label: 'Stylus', cmMode: 'stylus', codepenVal: 'stylus' }; @@ -388,7 +390,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD loadJS('lib/marked.js').then(setLoadedFlag); } else if (mode === CssModes.LESS) { loadJS('lib/less.min.js').then(setLoadedFlag); - } else if (mode === CssModes.SCSS) { + } else if (mode === CssModes.SCSS || mode === CssModes.SASS) { loadJS('lib/sass.js').then(function () { sass = new Sass('lib/sass.worker.js'); setLoadedFlag(); @@ -457,9 +459,9 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD if (cssMode === CssModes.CSS) { d.resolve(code); - } else if (cssMode === CssModes.SCSS) { - sass.compile(code, function(result) { - // Something as wrong + } else if (cssMode === CssModes.SCSS || cssMode === CssModes.SASS) { + sass.compile(code, { indentedSyntax: cssMode === CssModes.SASS }, function(result) { + // Something was wrong if (result.line && result.message) { showErrors('css', [ { lineNumber: result.line - 1, message: result.message } ]); } diff --git a/src/style.css b/src/style.css index 8e93578..8f6490f 100644 --- a/src/style.css +++ b/src/style.css @@ -552,7 +552,7 @@ select, input[type="text"], textarea { } .dropdown__menu > li > a { display: block; - padding: 15px; + padding: 10px 15px; color: #333; cursor: pointer; } From b0290f9ed0801a678d9ffaed06f567574cb57cf8 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Fri, 20 Jan 2017 02:25:16 +0530 Subject: [PATCH 02/10] add missed jsx mode files :P --- src/lib/codemirror/mode/jsx/jsx.js | 148 +++++++++++++++++++++++++++++ 1 file changed, 148 insertions(+) create mode 100644 src/lib/codemirror/mode/jsx/jsx.js diff --git a/src/lib/codemirror/mode/jsx/jsx.js b/src/lib/codemirror/mode/jsx/jsx.js new file mode 100644 index 0000000..45c3024 --- /dev/null +++ b/src/lib/codemirror/mode/jsx/jsx.js @@ -0,0 +1,148 @@ +// CodeMirror, copyright (c) by Marijn Haverbeke and others +// Distributed under an MIT license: http://codemirror.net/LICENSE + +(function(mod) { + if (typeof exports == "object" && typeof module == "object") // CommonJS + mod(require("../../lib/codemirror"), require("../xml/xml"), require("../javascript/javascript")) + else if (typeof define == "function" && define.amd) // AMD + define(["../../lib/codemirror", "../xml/xml", "../javascript/javascript"], mod) + else // Plain browser env + mod(CodeMirror) +})(function(CodeMirror) { + "use strict" + + // Depth means the amount of open braces in JS context, in XML + // context 0 means not in tag, 1 means in tag, and 2 means in tag + // and js block comment. + function Context(state, mode, depth, prev) { + this.state = state; this.mode = mode; this.depth = depth; this.prev = prev + } + + function copyContext(context) { + return new Context(CodeMirror.copyState(context.mode, context.state), + context.mode, + context.depth, + context.prev && copyContext(context.prev)) + } + + CodeMirror.defineMode("jsx", function(config, modeConfig) { + var xmlMode = CodeMirror.getMode(config, {name: "xml", allowMissing: true, multilineTagIndentPastTag: false}) + var jsMode = CodeMirror.getMode(config, modeConfig && modeConfig.base || "javascript") + + function flatXMLIndent(state) { + var tagName = state.tagName + state.tagName = null + var result = xmlMode.indent(state, "") + state.tagName = tagName + return result + } + + function token(stream, state) { + if (state.context.mode == xmlMode) + return xmlToken(stream, state, state.context) + else + return jsToken(stream, state, state.context) + } + + function xmlToken(stream, state, cx) { + if (cx.depth == 2) { // Inside a JS /* */ comment + if (stream.match(/^.*?\*\//)) cx.depth = 1 + else stream.skipToEnd() + return "comment" + } + + if (stream.peek() == "{") { + xmlMode.skipAttribute(cx.state) + + var indent = flatXMLIndent(cx.state), xmlContext = cx.state.context + // If JS starts on same line as tag + if (xmlContext && stream.match(/^[^>]*>\s*$/, false)) { + while (xmlContext.prev && !xmlContext.startOfLine) + xmlContext = xmlContext.prev + // If tag starts the line, use XML indentation level + if (xmlContext.startOfLine) indent -= config.indentUnit + // Else use JS indentation level + else if (cx.prev.state.lexical) indent = cx.prev.state.lexical.indented + // Else if inside of tag + } else if (cx.depth == 1) { + indent += config.indentUnit + } + + state.context = new Context(CodeMirror.startState(jsMode, indent), + jsMode, 0, state.context) + return null + } + + if (cx.depth == 1) { // Inside of tag + if (stream.peek() == "<") { // Tag inside of tag + xmlMode.skipAttribute(cx.state) + state.context = new Context(CodeMirror.startState(xmlMode, flatXMLIndent(cx.state)), + xmlMode, 0, state.context) + return null + } else if (stream.match("//")) { + stream.skipToEnd() + return "comment" + } else if (stream.match("/*")) { + cx.depth = 2 + return token(stream, state) + } + } + + var style = xmlMode.token(stream, cx.state), cur = stream.current(), stop + if (/\btag\b/.test(style)) { + if (/>$/.test(cur)) { + if (cx.state.context) cx.depth = 0 + else state.context = state.context.prev + } else if (/^ -1) { + stream.backUp(cur.length - stop) + } + return style + } + + function jsToken(stream, state, cx) { + if (stream.peek() == "<" && jsMode.expressionAllowed(stream, cx.state)) { + jsMode.skipExpression(cx.state) + state.context = new Context(CodeMirror.startState(xmlMode, jsMode.indent(cx.state, "")), + xmlMode, 0, state.context) + return null + } + + var style = jsMode.token(stream, cx.state) + if (!style && cx.depth != null) { + var cur = stream.current() + if (cur == "{") { + cx.depth++ + } else if (cur == "}") { + if (--cx.depth == 0) state.context = state.context.prev + } + } + return style + } + + return { + startState: function() { + return {context: new Context(CodeMirror.startState(jsMode), jsMode)} + }, + + copyState: function(state) { + return {context: copyContext(state.context)} + }, + + token: token, + + indent: function(state, textAfter, fullLine) { + return state.context.mode.indent(state.context.state, textAfter, fullLine) + }, + + innerMode: function(state) { + return state.context + } + } + }, "xml", "javascript") + + CodeMirror.defineMIME("text/jsx", "jsx") + CodeMirror.defineMIME("text/typescript-jsx", {name: "jsx", base: {name: "javascript", typescript: true}}) +}); From 176970e1dcbddd0a81cf1f4472f72d3a2d505fc1 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Fri, 20 Jan 2017 02:25:52 +0530 Subject: [PATCH 03/10] add full screen layout. fixes #24 --- src/index.html | 5 +++++ src/script.js | 9 ++++++++- src/style.css | 9 +++++++++ 3 files changed, 22 insertions(+), 1 deletion(-) diff --git a/src/index.html b/src/index.html index 1d75e04..aa72feb 100644 --- a/src/index.html +++ b/src/index.html @@ -127,6 +127,11 @@ + + + + +
diff --git a/src/script.js b/src/script.js index dc4af33..64cd05e 100644 --- a/src/script.js +++ b/src/script.js @@ -139,7 +139,10 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD mainSplitInstance = Split(['#js-code-side', '#js-demo-side' ], { direction: (currentLayoutMode === 2 ? 'vertical' : 'horizontal'), minSize: 34, - gutterSize: 6 + gutterSize: 6, + onDragEnd: function () { + scope.setPreviewContent(); + } }); } function toggleLayout(mode) { @@ -153,13 +156,16 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD layoutBtn1.classList.remove('selected'); layoutBtn2.classList.remove('selected'); layoutBtn3.classList.remove('selected'); + layoutBtn4.classList.remove('selected'); $('#layoutBtn' + mode).classList.add('selected'); document.body.classList.remove('layout-1'); document.body.classList.remove('layout-2'); document.body.classList.remove('layout-3'); + document.body.classList.remove('layout-4'); document.body.classList.add('layout-' + mode); resetSplitting(); + scope.setPreviewContent(); } function onExternalLibChange() { @@ -792,6 +798,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD layoutBtn1.addEventListener('click', getToggleLayoutButtonListener(1)); layoutBtn2.addEventListener('click', getToggleLayoutButtonListener(2)); layoutBtn3.addEventListener('click', getToggleLayoutButtonListener(3)); + layoutBtn4.addEventListener('click', getToggleLayoutButtonListener(4)); utils.onButtonClick(helpBtn, function () { helpModal.classList.toggle('is-modal-visible'); diff --git a/src/style.css b/src/style.css index 8f6490f..0c6de6f 100644 --- a/src/style.css +++ b/src/style.css @@ -106,6 +106,15 @@ select, input[type="text"], textarea { flex-direction: row; width: auto; } +.layout-4 .code-side { + display: none; +} +.layout-4 .code-side + .gutter { + display: none; +} +.layout-4 .demo-side { + width: 100% !important; +} .code-wrap { display: flex; flex-direction: column; From aadb2c1835c04ca8b970ac91bae67940249ad5de Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Fri, 20 Jan 2017 02:56:20 +0530 Subject: [PATCH 04/10] Avoid complete page refresh when just css changes. Lots faster now. fixes #22 --- src/script.js | 39 ++++++++++++++++++++++++++++----------- 1 file changed, 28 insertions(+), 11 deletions(-) diff --git a/src/script.js b/src/script.js index 64cd05e..f296b5e 100644 --- a/src/script.js +++ b/src/script.js @@ -62,6 +62,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD , codeSplitInstance // TODO: for legacy reasons when. Will be refactored as global preferences. , prefs = {} + , codeInPreview = { html: null, css: null, js: null } // DOM nodes , frame = $('#demo-frame') @@ -141,7 +142,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD minSize: 34, gutterSize: 6, onDragEnd: function () { - scope.setPreviewContent(); + scope.setPreviewContent(true); } }); } @@ -165,13 +166,13 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD document.body.classList.add('layout-' + mode); resetSplitting(); - scope.setPreviewContent(); + scope.setPreviewContent(true); } function onExternalLibChange() { utils.log('onExternalLibChange'); updateExternalLibUi(); - scope.setPreviewContent(); + scope.setPreviewContent(true); } function updateExternalLibUi() { @@ -615,7 +616,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD }, ''); var contents = '\n\n' + externalCss + '\n' - + '\n' + + '\n' + '\n' + '\n' + html + '\n' + externalJs + '\n\n'; @@ -663,13 +664,29 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD }, errorHandler); } - scope.setPreviewContent = function () { - var htmlPromise = computeHtml(); - var cssPromise = computeCss(); - var jsPromise = computeJs(); - Promise.all([htmlPromise, cssPromise, jsPromise]).then(function (result) { - createPreviewFile(result[0], result[1], result[2]); - }); + scope.setPreviewContent = function (isForced) { + var currentCode = { + html: scope.cm.html.getValue(), + css: scope.cm.css.getValue(), + js: scope.cm.js.getValue() + }; + // If just CSS was changed (and everything shudn't be empty), + // change the styles inside the iframe. + if (!isForced && currentCode.html === codeInPreview.html && currentCode.js === codeInPreview.js) { + computeCss().then(function (css) { + frame.contentDocument.querySelector('#webmakerstyle').textContent = css; + }); + } else { + var htmlPromise = computeHtml(); + var cssPromise = computeCss(); + var jsPromise = computeJs(); + Promise.all([htmlPromise, cssPromise, jsPromise]).then(function (result) { + createPreviewFile(result[0], result[1], result[2]); + }); + } + codeInPreview.html = scope.cm.html.getValue(); + codeInPreview.css = scope.cm.css.getValue(); + codeInPreview.js = scope.cm.js.getValue(); }; function saveFile() { From 3d74ce4cd72e6669d6a943fd364ed4cb3ea467b6 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Mon, 9 Jan 2017 11:59:52 +0530 Subject: [PATCH 05/10] load user script from external js file. fix #39 --- src/manifest.json | 2 +- src/script.js | 57 +++++++++++++++++++++++++++++++---------------- 2 files changed, 39 insertions(+), 20 deletions(-) diff --git a/src/manifest.json b/src/manifest.json index c323088..a138c84 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -8,7 +8,7 @@ "storage", "tabs" ], - "content_security_policy": "script-src 'self' https://www.google-analytics.com 'unsafe-eval'; object-src 'self'", + "content_security_policy": "script-src 'self' https://ajax.googleapis.com https://code.jquery.com https://cdnjs.cloudflare.com https://unpkg.com https://maxcdn.bootstrapcdn.com https://cdn.jsdelivr.net/ https://www.google-analytics.com 'unsafe-eval'; object-src 'self'", "options_ui": { "page": "options.html", "chrome_style": true diff --git a/src/script.js b/src/script.js index f296b5e..014b84d 100644 --- a/src/script.js +++ b/src/script.js @@ -619,35 +619,24 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD + '\n' + '\n' + '\n' + html + '\n' - + externalJs + '\n\n'; + + externalJs + '\n\n'; return contents; } - function createPreviewFile(html, css, js) { - var contents = getCompleteHtml(html, css, js); + + function writeFile(name, blob, cb) { var fileWritten = false; - var blob = new Blob([ contents ], { type: "text/plain;charset=UTF-8" }); - - // Track if people have written code. - if (!trackEvent.hasTrackedCode && (html || css || js)) { - trackEvent('fn', 'hasCode'); - trackEvent.hasTrackedCode = true; - } - // Track when people actually are working. - trackEvent.previewCount = (trackEvent.previewCount || 0) + 1; - if (trackEvent.previewCount === 4) { - trackEvent('fn', 'usingPreview'); - } - function errorHandler() { utils.log(arguments); } window.webkitRequestFileSystem(window.TEMPORARY, 1024 * 1024 * 5, function(fs){ - fs.root.getFile('preview.html', { create: true }, function(fileEntry) { + fs.root.getFile(name, { create: true }, function(fileEntry) { fileEntry.createWriter(function(fileWriter) { function onWriteComplete() { if (fileWritten) { - frame.src = 'filesystem:chrome-extension://' - + chrome.i18n.getMessage('@@extension_id') + '/temporary/' + 'preview.html'; + cb(); } else { fileWritten = true; @@ -662,6 +651,36 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD }, errorHandler); }, errorHandler); }, errorHandler); + + } + + function createPreviewFile(html, css, js) { + var contents = getCompleteHtml(html, css, js); + var fileWritten = false; + var blob = new Blob([ contents ], { type: "text/plain;charset=UTF-8" }); + var blobjs = new Blob([ js ], { type: "text/plain;charset=UTF-8" }); + + // Track if people have written code. + if (!trackEvent.hasTrackedCode && (html || css || js)) { + trackEvent('fn', 'hasCode'); + trackEvent.hasTrackedCode = true; + } + // Track when people actually are working. + trackEvent.previewCount = (trackEvent.previewCount || 0) + 1; + if (trackEvent.previewCount === 4) { + trackEvent('fn', 'usingPreview'); + } + + // we need to store user script in external JS file to prevent inline-script + // CSP from affecting it. + writeFile('script.js', blobjs, function () { + writeFile('preview.html', blob, function () { + frame.src = 'filesystem:chrome-extension://' + + chrome.i18n.getMessage('@@extension_id') + '/temporary/' + 'preview.html'; + }); + }); + + } scope.setPreviewContent = function (isForced) { From 4dd340425ff2ec05f061c6ac20380596517c1681 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Mon, 23 Jan 2017 01:41:53 +0530 Subject: [PATCH 06/10] fix modes and paths of codemirror modes. fixes #46 --- src/script.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/script.js b/src/script.js index 014b84d..8166b93 100644 --- a/src/script.js +++ b/src/script.js @@ -40,11 +40,11 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD modes[JsModes.JS] = { label: 'JS', cmMode: 'javascript', codepenVal: 'none' }; modes[JsModes.COFFEESCRIPT] = { label: 'CoffeeScript', cmMode: 'coffeescript', codepenVal: 'coffeescript' }; modes[JsModes.ES6] = { label: 'ES6 (Babel)', cmMode: 'jsx', codepenVal: 'babel' }; - modes[JsModes.TS] = { label: 'TypeScript', cmMode: 'javascript', codepenVal: 'typescript' }; - modes[CssModes.CSS] = { label: 'CSS', cmMode: 'css', codepenVal: 'none' }; - modes[CssModes.SCSS] = { label: 'SCSS', cmMode: 'sass', codepenVal: 'scss' }; + modes[JsModes.TS] = { label: 'TypeScript', cmPath: 'jsx', cmMode: 'text/typescript-jsx', codepenVal: 'typescript' }; + modes[CssModes.CSS] = { label: 'CSS', cmPath: 'css', cmMode: 'css', codepenVal: 'none' }; + modes[CssModes.SCSS] = { label: 'SCSS', cmPath: 'css', cmMode: 'text/x-scss', codepenVal: 'scss' }; modes[CssModes.SASS] = { label: 'SASS', cmMode: 'sass', codepenVal: 'sass' }; - modes[CssModes.LESS] = { label: 'LESS', cmMode: 'text/x-less', codepenVal: 'less' }; + modes[CssModes.LESS] = { label: 'LESS', cmPath: 'css', cmMode: 'text/x-less', codepenVal: 'less' }; modes[CssModes.STYLUS] = { label: 'Stylus', cmMode: 'stylus', codepenVal: 'stylus' }; var updateTimer @@ -418,7 +418,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD htmlModelLabel.textContent = modes[value].label; handleModeRequirements(value); scope.cm.html.setOption('mode', modes[value].cmMode); - CodeMirror.autoLoadMode(scope.cm.html, modes[value].cmMode); + CodeMirror.autoLoadMode(scope.cm.html, modes[value].cmPath || modes[value].cmMode); trackEvent('ui', 'updateCodeMode', 'html', value); } function updateCssMode(value) { @@ -426,7 +426,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD cssModelLabel.textContent = modes[value].label; handleModeRequirements(value); scope.cm.css.setOption('mode', modes[value].cmMode); - CodeMirror.autoLoadMode(scope.cm.css, modes[value].cmMode); + CodeMirror.autoLoadMode(scope.cm.css, modes[value].cmPath || modes[value].cmMode); trackEvent('ui', 'updateCodeMode', 'css', value); } function updateJsMode(value) { @@ -434,7 +434,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD jsModelLabel.textContent = modes[value].label; handleModeRequirements(value); scope.cm.js.setOption('mode', modes[value].cmMode); - CodeMirror.autoLoadMode(scope.cm.js, modes[value].cmMode); + CodeMirror.autoLoadMode(scope.cm.js, modes[value].cmPath || modes[value].cmMode); trackEvent('ui', 'updateCodeMode', 'js', value); // FIXME: Will be saved as part of scope settings /* From 0c055d4e5546dcb8ef967302e9dd17ec58b7e244 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Mon, 23 Jan 2017 03:17:22 +0530 Subject: [PATCH 07/10] add autocompletion for js,css,html. fixes #43 --- src/index.html | 6 ++++++ src/script.js | 4 ++++ src/style.css | 17 +++++++++++++++-- 3 files changed, 25 insertions(+), 2 deletions(-) diff --git a/src/index.html b/src/index.html index aa72feb..eb7f3c7 100644 --- a/src/index.html +++ b/src/index.html @@ -4,6 +4,7 @@ Web Maker + @@ -367,6 +368,11 @@ + + + + + diff --git a/src/script.js b/src/script.js index 8166b93..57be300 100644 --- a/src/script.js +++ b/src/script.js @@ -758,6 +758,10 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD scope.setPreviewContent(); }, updateDelay); }); + cm.on('inputRead', function onChange(cm, input) { + if (input.text[0] === ';') { return; } + CodeMirror.commands.autocomplete(cm, null, { completeSingle: false }) + }); return cm; } diff --git a/src/style.css b/src/style.css index 0c6de6f..4610729 100644 --- a/src/style.css +++ b/src/style.css @@ -8,6 +8,7 @@ :root { --color-bg: #252637; --color-sidebar: #3A2B63; + --code-font-size: 16px; } body { margin: 0; @@ -191,7 +192,7 @@ select, input[type="text"], textarea { .Codemirror { width: 100%; height: calc(100% - 25px); /* 25px for header */ - font-size: 16px; + font-size: var(--code-font-size); } .layout-2 .is-minimized .Codemirror { height: calc(100%); @@ -215,7 +216,19 @@ select, input[type="text"], textarea { .CodeMirror-gutter-wrapper:hover .CodeMirror-guttermarker-subtle { /*visibility: visible;*/ } - +.CodeMirror-hints { + font-size: var(--code-font-size); + border: 0; + background: #1e1e2c; +} +.CodeMirror-hint { + color: #bbb; + padding: 2px 4px; +} +li.CodeMirror-hint-active { + background: #5b429d; + /*color: white;*/ +} #demo-frame { border: 0; width: 100%; From 0e322d3e72156f267141bcc9a662b486d7f1112e Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Mon, 23 Jan 2017 03:31:49 +0530 Subject: [PATCH 08/10] eslint fixes. --- src/script.js | 20 +++++++++----------- 1 file changed, 9 insertions(+), 11 deletions(-) diff --git a/src/script.js b/src/script.js index 57be300..4ec931b 100644 --- a/src/script.js +++ b/src/script.js @@ -1,6 +1,6 @@ /* global trackEvent */ /* global layoutBtn1, layoutBtn2, layoutBtn3, helpModal, notificationsModal, addLibraryModal, -onboardModal, layoutBtn1, layoutBtn2, layoutBtn3, helpBtn, onboardModal, onboardModal, +onboardModal, layoutBtn1, layoutBtn2, layoutBtn3, layoutBtn4, helpBtn, onboardModal, onboardModal, addLibraryModal, addLibraryModal, notificationsBtn, notificationsModal, notificationsModal, notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, openBtn, saveBtn, newBtn, settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardDontShowInTabOptionBtn */ @@ -607,7 +607,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD }); } - function getCompleteHtml(html, css, js) { + function getCompleteHtml(html, css) { var externalJs = externalJsTextarea.value.split('\n').reduce(function (scripts, url) { return scripts + (url ? '\n' : ''); }, ''); @@ -636,14 +636,13 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD fileEntry.createWriter(function(fileWriter) { function onWriteComplete() { if (fileWritten) { - cb(); - } - else { - fileWritten = true; - // Set the write pointer to starting of file - fileWriter.seek(0); - fileWriter.write(blob); + return cb(); } + fileWritten = true; + // Set the write pointer to starting of file + fileWriter.seek(0); + fileWriter.write(blob); + return false; } fileWriter.onwriteend = onWriteComplete; // Empty the file contents @@ -656,7 +655,6 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD function createPreviewFile(html, css, js) { var contents = getCompleteHtml(html, css, js); - var fileWritten = false; var blob = new Blob([ contents ], { type: "text/plain;charset=UTF-8" }); var blobjs = new Blob([ js ], { type: "text/plain;charset=UTF-8" }); @@ -758,7 +756,7 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD scope.setPreviewContent(); }, updateDelay); }); - cm.on('inputRead', function onChange(cm, input) { + cm.on('inputRead', function onChange(editor, input) { if (input.text[0] === ';') { return; } CodeMirror.commands.autocomplete(cm, null, { completeSingle: false }) }); From 8d7c33d20ad4eedbb0e6a7805954d44d51b7cc67 Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Tue, 24 Jan 2017 01:27:47 +0530 Subject: [PATCH 09/10] refactor --- src/script.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/script.js b/src/script.js index 4ec931b..ea2a2cf 100644 --- a/src/script.js +++ b/src/script.js @@ -701,9 +701,9 @@ settingsBtn, onboardModal, notificationsBtn, onboardShowInTabOptionBtn, onboardD createPreviewFile(result[0], result[1], result[2]); }); } - codeInPreview.html = scope.cm.html.getValue(); - codeInPreview.css = scope.cm.css.getValue(); - codeInPreview.js = scope.cm.js.getValue(); + codeInPreview.html = currentCode.html; + codeInPreview.css = currentCode.css; + codeInPreview.js = currentCode.js; }; function saveFile() { From af71b43dcb74ee7d30f3fd6cdba7bba17ee477cf Mon Sep 17 00:00:00 2001 From: Kushagra Gour Date: Tue, 24 Jan 2017 01:45:06 +0530 Subject: [PATCH 10/10] add changelog --- src/index.html | 17 +++++++++++++++-- src/script.js | 2 +- 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/src/index.html b/src/index.html index eb7f3c7..17aa974 100644 --- a/src/index.html +++ b/src/index.html @@ -194,7 +194,7 @@