49b41749e8
- added sections to the lesson to handle multiple sesions like examples and exercises - added livecode integration to lesson pages - autosave and submiting the answers is not done yet
79 lines
2.2 KiB
HTML
79 lines
2.2 KiB
HTML
|
|
{% macro LiveCodeEditorLarge(name, code) %}
|
|
<div class="livecode-editor livecode-editor-large" id="editor-{{name}}">
|
|
<div class="row">
|
|
<div class="col-lg-8 col-md-6">
|
|
<div class="controls">
|
|
<button class="run">Run</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="code-editor">
|
|
<div class="row">
|
|
<div class="col-lg-8 col-md-6">
|
|
<div class="code-wrapper">
|
|
<textarea class="code">{{code}}</textarea>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4 col-md-6 canvas-wrapper">
|
|
<canvas width="300" height="300"></canvas>
|
|
<pre class="output"></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% macro LiveCodeEditor(name, code, is_exercise, last_submitted) %}
|
|
<div class="livecode-editor livecode-editor-inline" id="editor-{{name}}">
|
|
<div class="row">
|
|
<div class="col-lg-8 col-md-6">
|
|
<div class="controls">
|
|
<button class="run">Run</button>
|
|
<button class="reset">Reset</button>
|
|
{% if is_exercise %}
|
|
<button class="submit pull-right btn-primary">Submit</button>
|
|
{% if last_submitted %}
|
|
<span class="pull-right" style="padding-right: 10px;">Last submitted {{last_submitted}}</span>
|
|
{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="code-editor">
|
|
<div class="row">
|
|
<div class="col-lg-8 col-md-6">
|
|
<div class="code-wrapper">
|
|
<textarea class="code">{{code}}</textarea>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4 col-md-6 canvas-wrapper">
|
|
<canvas width="300" height="300"></canvas>
|
|
<pre class="output"></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
|
|
|
|
{% macro LiveCodeEditorJS(name, code) %}
|
|
<script type="text/javascript" src="{{ livecode_url }}/static/livecode.js"></script>
|
|
<script type="text/javascript" src="/assets/community/js/livecode-canvas.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
var livecodeEditors = [];
|
|
|
|
$(function() {
|
|
$(".livecode-editor").each((i, e) => {
|
|
var editor = new LiveCodeEditor(e, {
|
|
base_url: "{{ livecode_url }}",
|
|
...getLiveCodeOptions()
|
|
})
|
|
livecodeEditors.push(editor);
|
|
})
|
|
})
|
|
</script>
|
|
{% endmacro %}
|