2015-01-10 20:21:03 +00:00
|
|
|
extends ../layout
|
|
|
|
|
block content
|
|
|
|
|
script(src='/js/lib/codemirror/lib/codemirror.js')
|
|
|
|
|
link(rel='stylesheet', href='/js/lib/codemirror/lib/codemirror.css')
|
|
|
|
|
link(rel='stylesheet', href='/js/lib/codemirror/theme/monokai.css')
|
|
|
|
|
script(src='/js/lib/codemirror/mode/javascript/javascript.js')
|
|
|
|
|
|
2015-01-11 06:59:24 +00:00
|
|
|
.row
|
|
|
|
|
.col-sm-12.col-md-8.col-xs-12
|
|
|
|
|
.panel.panel-primary
|
|
|
|
|
.panel-heading Title
|
|
|
|
|
.panel.panel-body
|
|
|
|
|
form.code
|
|
|
|
|
.form-group.codeMirrorView
|
|
|
|
|
textarea#codeEditor
|
|
|
|
|
form.code
|
|
|
|
|
.form-group.codeMirrorView
|
|
|
|
|
textarea#codeOutput(enabled=false)
|
|
|
|
|
#submitButton.btn.btn-primary.btn-big.btn-block Run my code
|
|
|
|
|
#hintButton.btn.btn-info.btn-big.btn-block Show me hints
|
|
|
|
|
script.
|
|
|
|
|
var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("codeEditor"), {
|
|
|
|
|
lineNumbers: true,
|
|
|
|
|
mode: "javascript",
|
|
|
|
|
theme: 'monokai',
|
|
|
|
|
runnable: true
|
|
|
|
|
});
|
|
|
|
|
myCodeMirror.setValue('2*2');
|
|
|
|
|
myCodeMirror.setSize("100%", 500);
|
|
|
|
|
$('#submitButton').on('click', function () {
|
|
|
|
|
$('#codeOutput').empty();
|
|
|
|
|
var js = myCodeMirror.getValue();
|
|
|
|
|
var s = document.createElement('script');
|
|
|
|
|
s.textContent = js;
|
|
|
|
|
try {
|
|
|
|
|
$('#codeOutput').append(eval(s.textContent));
|
|
|
|
|
} catch (e) {
|
|
|
|
|
$('#codeOutput').append(e);
|
|
|
|
|
}
|
|
|
|
|
});
|
2015-01-10 20:21:03 +00:00
|
|
|
|
2015-01-11 06:59:24 +00:00
|
|
|
var codeOutput = CodeMirror.fromTextArea(document.getElementById("codeOutput"), {
|
|
|
|
|
lineNumbers: false,
|
|
|
|
|
mode: "javascript",
|
|
|
|
|
theme: 'monokai',
|
|
|
|
|
readOnly: 'nocursor'
|
|
|
|
|
});
|
|
|
|
|
codeOutput.setSize("100%", 30);
|
|
|
|
|
.col-sm-12.col-md-4.col-xs-12
|
|
|
|
|
include ../partials/challenges
|
