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
107 lines
3.2 KiB
HTML
107 lines
3.2 KiB
HTML
{% extends "templates/base.html" %}
|
|
{% from "www/macros/sidebar.html" import Sidebar %}
|
|
{% from "www/macros/livecode.html" import LiveCodeEditorJS, LiveCodeEditor with context %}
|
|
{% block title %}{{ lesson.title }}{% endblock %}
|
|
|
|
{% block head_include %}
|
|
<meta name="description" content="{{lesson.title}} - {{course.title}}" />
|
|
<meta name="keywords" content="{{lesson.title}} - {{course.title}}" />
|
|
<style>
|
|
</style>
|
|
|
|
<link rel="stylesheet" href="{{ livecode_url }}/static/codemirror/lib/codemirror.css">
|
|
<link rel="stylesheet" href="/assets/css/lms.css">
|
|
|
|
<script src="{{ livecode_url }}/static/codemirror/lib/codemirror.js"></script>
|
|
<script src="{{ livecode_url }}/static/codemirror/mode/python/python.js"></script>
|
|
<script src="{{ livecode_url }}/static/codemirror/keymap/sublime.js"></script>
|
|
|
|
<script src="{{ livecode_url }}/static/codemirror/addon/edit/matchbrackets.js"></script>
|
|
<script src="{{ livecode_url }}/static/codemirror/addon/comment/comment.js"></script>
|
|
{% endblock %}
|
|
|
|
|
|
{% block content %}
|
|
{{ Sidebar(course.name, batch.name) }}
|
|
<div class="container lesson">
|
|
|
|
<h1>{{ lesson.title }} - {{ lesson.name }}</h1>
|
|
|
|
{% for s in lesson.get_sections() %}
|
|
<div class="section section-{{ s.type }}">
|
|
{{ render_section(s) }}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endblock %}
|
|
|
|
|
|
{% macro render_section(s) %}
|
|
{% if s.type == "text" %}
|
|
{{ render_section_text(s) }}
|
|
{% elif s.type == "example" or s.type == "code" or s.type == "exercise" %}
|
|
{{ LiveCodeEditor(s.name, s.get_latest_code_for_user(), s.type=="exercise", "2 hours ago") }}
|
|
{% else %}
|
|
<div>Unknown section type: {{s.type}}</div>
|
|
{% endif %}
|
|
{% endmacro %}
|
|
|
|
{% macro render_section_text(s) %}
|
|
<div class="row">
|
|
<div class="col-md-9">
|
|
{{ frappe.utils.md_to_html(s.contents) }}
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{%- block script %}
|
|
{{ super() }}
|
|
{{ LiveCodeEditorJS() }}
|
|
|
|
|
|
<!-- <script type="text/javascript">
|
|
$(function() {
|
|
var editorLookup = {};
|
|
|
|
$(".canvas-editor").each((i, e) => {
|
|
var data = $(e).data();
|
|
var editor = new LiveCodeEditor(e, {
|
|
runtime: "python-canvas",
|
|
base_url: "{{ livecode_url }}",
|
|
codemirror: true,
|
|
userdata: data,
|
|
autosave: function(editor, code) {
|
|
// can't autosave when user is Guest
|
|
if (frappe.session.user == "Guest") {
|
|
return;
|
|
}
|
|
var data = editor.options.userdata;
|
|
var code = editor.codemirror.doc.getValue();
|
|
// console.log("autosaving...")
|
|
frappe.call("community.lms.api.autosave_section", {
|
|
section: data.section,
|
|
code: code
|
|
}).then((r) => {
|
|
// TODO: verify
|
|
})
|
|
}
|
|
})
|
|
editorLookup[data.section] = editor;
|
|
})
|
|
|
|
$(".canvas-editor .reset").each((i, e) => {
|
|
$(e).on("click", function(event) {
|
|
var data = $(this).parents(".canvas-editor").data();
|
|
var section = data.section;
|
|
frappe.call("community.lms.api.get_section", {
|
|
name: section
|
|
}).then(r => {
|
|
var editor = editorLookup[data.section];
|
|
editor.codemirror.doc.setValue(r.message.contents);
|
|
})
|
|
})
|
|
})
|
|
})
|
|
</script> -->
|
|
{%- endblock %}
|