var editor; var widgets = []; editor = CodeMirror.fromTextArea(document.getElementById("codeEditor"), { lineNumbers: true, mode: "text", theme: 'monokai', runnable: true, matchBrackets: true, autoCloseBrackets: true, scrollbarStyle: 'null', lineWrapping: true, gutters: ["CodeMirror-lint-markers"], onKeyEvent: doLinting }); var myCodeMirror = editor; var codeStorage = { version: 0.01, keyVersion:"saveVersion", keyValue: null,//where the value of the editor is saved updateWait: 2000,// 2 seconds updateTimeoutId: null, eventArray: []//for firing saves }; codeStorage.hasSaved = function(){ return ( updateTimeoutId === null ); }; codeStorage.onSave = function(func){ codeStorage.eventArray.push(func); }; codeStorage.setSaveKey = function(key){ codeStorage.keyValue = key + 'Val'; }; codeStorage.getEditorValue = function(){ return ('' + localStorage.getItem(codeStorage.keyValue)); }; codeStorage.isAlive = function() { var val = this.getEditorValue(); return val !== 'null' && val !== 'undefined' && (val && val.length > 0); }; codeStorage.updateStorage = function(){ if(typeof(Storage) !== undefined) { var value = editor.getValue(); localStorage.setItem(codeStorage.keyValue, value); } else { var debugging = false; if( debugging ){ console.log('no web storage'); } } codeStorage.updateTimeoutId = null; codeStorage.eventArray.forEach(function(func){ func(); }); }; (function(){ var savedVersion = localStorage.getItem('saveVersion'); if( savedVersion === null ){ localStorage.setItem(codeStorage.keyVersion, codeStorage.version);//just write current version }else{ if( savedVersion !== codeStorage.version ){ //Update version } } })(); codeStorage.setSaveKey(challenge_Name); editor.on('keyup', function(){ window.clearTimeout(codeStorage.updateTimeoutId); codeStorage.updateTimeoutId = window.setTimeout(codeStorage.updateStorage, codeStorage.updateWait); }); var editorValue; var challengeSeed = challengeSeed || null; var tests = tests || []; var allSeeds = ''; (function() { challengeSeed.forEach(function(elem) { allSeeds += elem + '\n'; }); })(); function doLinting() { editor.operation(function() { for (var i = 0; i < widgets.length; ++i) editor.removeLineWidget(widgets[i]); widgets.length = 0; JSHINT(editor.getValue()); for (var i = 0; i < JSHINT.errors.length; ++i) { var err = JSHINT.errors[i]; if (!err) continue; var msg = document.createElement("div"); var icon = msg.appendChild(document.createElement("span")); icon.innerHTML = "!!"; icon.className = "lint-error-icon"; msg.appendChild(document.createTextNode(err.reason)); msg.className = "lint-error"; widgets.push(editor.addLineWidget(err.line - 1, msg, { coverGutter: false, noHScroll: true })); } }); } /*var defaultKeymap = { 'Cmd-E': 'emmet.expand_abbreviation', 'Tab': 'emmet.expand_abbreviation_with_tab', 'Enter': 'emmet.insert_formatted_line_break_only' }; emmetCodeMirror(editor, defaultKeymap);*/ // Hijack tab key to insert two spaces instead editor.setOption("extraKeys", { Tab: function(cm) { if (cm.somethingSelected()){ cm.indentSelection("add"); } else { var spaces = Array(cm.getOption("indentUnit") + 1).join(" "); cm.replaceSelection(spaces); } }, "Shift-Tab": function(cm) { if (cm.somethingSelected()){ cm.indentSelection("subtract"); } else { var spaces = Array(cm.getOption("indentUnit") + 1).join(" "); cm.replaceSelection(spaces); } }, "Ctrl-Enter": function() { bonfireExecute(); return false; } }); editor.setSize("100%", "auto"); var libraryIncludes = "" + "" + "" + "" + "" + "" + "" + "" + ""; var editorValueForIFrame; var iFrameScript = ""; var delay; // Initialize CodeMirror editor with a nice html5 canvas demo. editor.on("keyup", function () { clearTimeout(delay); delay = setTimeout(updatePreview, 300); }); if(typeof prodOrDev !== 'undefined') { var nodeEnv = prodOrDev === 'production' ? 'http://www.freecodecamp.com' : 'http://localhost:3001'; function updatePreview() { editorValueForIFrame = editor.getValue(); var failedCommentTest = false; if (editorValueForIFrame.match(/\<\!\-\-/gi) && editorValueForIFrame.match(/\-\-\>/gi) == null) { failedCommentTest = true; } else if (editorValueForIFrame.match(/\<\!\-\-/gi) && editorValueForIFrame.match(/\<\!\-\-/gi).length > editorValueForIFrame.match(/\-\-\>/gi).length) { failedCommentTest = true; } if (failedCommentTest) { editor.setValue(editor.getValue() + "-->"); editorValueForIFrame = editorValueForIFrame + "-->"; } var previewFrame = document.getElementById('preview'); var preview = previewFrame.contentDocument || previewFrame.contentWindow.document; //Here is the issue preview.open(); //preview.write(libraryIncludes + editor.getValue()); codeStorage.updateStorage(); preview.close(); } setTimeout(updatePreview, 300); } /** * "post" methods */ var testResults = []; var postSuccess = function(data) { var testDoc = document.createElement("div"); $(testDoc) .html("