/** * Created by nathanleniz on 2/2/15. */ var widgets = []; var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("codeEditor"), { lineNumbers: true, mode: "text/html", theme: 'monokai', runnable: true, //lint: true, matchBrackets: true, autoCloseBrackets: true, scrollbarStyle: 'null', lineWrapping: true, gutters: ["CodeMirror-lint-markers"], onKeyEvent: doLinting }); var editor = myCodeMirror; // Hijack tab key to insert two spaces instead editor.setOption("extraKeys", { Tab: function(cm) { var spaces = Array(cm.getOption("indentUnit") + 1).join(" "); cm.replaceSelection(spaces); }, "Ctrl-Enter": function() { return false; } }); editor.setSize("100%", "auto"); var libraryIncludes = "" + "" + "" + "" + "" + "" + "" + "" + ""; var allTests = ''; (function() { tests.forEach(function(elem) { allTests += elem + ' '; }); })(); var otherTestsForNow = ""; var delay; // Initialize CodeMirror editor with a nice html5 canvas demo. editor.on("change", function () { clearTimeout(delay); delay = setTimeout(updatePreview, 300); }); var nodeEnv = prodOrDev === 'production' ? 'http://www.freecodecamp.com' : 'http://localhost:3001'; function updatePreview() { var previewFrame = document.getElementById('preview'); var preview = previewFrame.contentDocument || previewFrame.contentWindow.document; preview.open(); preview.write(libraryIncludes + editor.getValue() + otherTestsForNow); preview.close(); } setTimeout(updatePreview, 300); /** * Window postMessage receiving funtionality */ var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent"; var eventer = window[eventMethod]; var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message"; // Listen to message from child window eventer(messageEvent,function(e) { if (e.data === 'CompleteAwesomeSauce') { showCompletion(); } },false); var challengeSeed = challengeSeed || null; var tests = tests || []; var allSeeds = ''; (function() { challengeSeed.forEach(function(elem) { allSeeds += elem + '\n'; }); })(); myCodeMirror.setValue(allSeeds); 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 })); } }); }; function showCompletion() { var time = Math.floor(Date.now() / 1000) - started; ga('send', 'event', 'Challenge', 'solved', challengeName + ', Time: ' + time); $('#next-courseware-button').removeAttr('disabled'); $('#next-courseware-button').addClass('animated tada'); console.log(!userLoggedIn); if (!userLoggedIn) { $('#complete-courseware-dialog').modal('show'); } $('body').keydown(function(e) { if (e.ctrlKey && e.keyCode == 13) { $('#next-courseware-button').click(); } }); }