Merge pull request #93 from fossunited/exercises

Added Exercise and Exercise Submission doctypes

community/www/courses/about/index.html

@@ -6,6 +6,8 @@
 {% block head_include %}
 <meta name="description" content="Courses" />
 <meta name="keywords" content="" />
+
+<link rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
 {% endblock %}
 
 {% block content %}

community/www/courses/discuss/index.html

@@ -6,6 +6,8 @@
 {% block head_include %}
 <meta name="description" content="Courses" />
 <meta name="keywords" content="" />
+
+<link rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
 {% endblock %}
 
 {% block content %}

community/www/courses/learn/index.html

@@ -9,6 +9,7 @@
 	<style>
 	</style>
 
+<link rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
 <link rel="stylesheet" href="{{ livecode_url }}/static/codemirror/lib/codemirror.css">
 <link rel="stylesheet" href="/assets/css/lms.css">
 
@@ -26,14 +27,7 @@
 
 <div class="container">
   <div class="lesson-page">
-    <div class="lesson-pagination">
-      {% if prev_url %}
-        <a href="{{prev_url}}" class="btn">&larr; Prev</a>
-      {% endif %}
-      {% if next_url %}
-        <a href="{{next_url}}" class="btn pull-right">Next &rarr;</a>
-      {% endif %}
-    </div>
+    {{ pagination(prev_url, next_url) }}
 
     <h2>{{ lesson.title }}</h2>
 
@@ -43,10 +37,8 @@
     </div>
     {% endfor %}
 
-    <div class="lesson-pagination">
-      <a href="#" class="btn">&larr; Prev</a>
-      <a href="#" class="btn pull-right">Next &rarr;</a>
-    </div>
+    {{ pagination(prev_url, next_url) }}
+
   </div>
 </div>
 {% endblock %}
@@ -55,8 +47,14 @@
 {% 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") }}
+  {% elif s.type == "example" or s.type == "code" %}
+    {{ LiveCodeEditor(s.name,
+          code=s.get_latest_code_for_user(),
+          reset_code=s.contents,
+          is_exercise=False)
+    }}
+  {% elif s.type == "exercise" %}
+    {{ widgets.Exercise(exercise=s.get_exercise())}}
   {% else %}
     <div>Unknown section type: {{s.type}}</div>
   {% endif %}
@@ -70,6 +68,18 @@
   </div>
 {% endmacro %}
 
+{% macro pagination(prev_url, next_url) %}
+  <div class="lesson-pagination">
+    {% if prev_url %}
+      <a href="{{prev_url}}" class="btn">&larr; Prev</a>
+    {% endif %}
+    {% if next_url %}
+      <a href="{{next_url}}" class="btn pull-right">Next &rarr;</a>
+    {% endif %}
+    <div style="clear: both;"></div>
+  </div>
+{% endmacro %}
+
 {%- block script %}
   {{ super() }}
   {{ LiveCodeEditorJS() }}

community/www/courses/members/index.html

@@ -7,6 +7,7 @@
 {% block head_include %}
 <meta name="description" content="Courses" />
 <meta name="keywords" content="" />
+<link rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
 {% endblock %}
 
 {% block content %}

community/www/courses/schedule/index.html

@@ -4,6 +4,7 @@
 {% block head_include %}
 <meta name="description" content="Courses" />
 <meta name="keywords" content="" />
+<link rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
 {% endblock %}
 
 {% block content %}

community/www/macros/livecode.html

@@ -24,7 +24,7 @@
 </div>
 {% endmacro %}
 
-{% macro LiveCodeEditor(name, code, is_exercise, last_submitted) %}
+{% macro LiveCodeEditor(name, code, reset_code, is_exercise=False, last_submitted=None) %}
 <div class="livecode-editor livecode-editor-inline" id="editor-{{name}}">
   <div class="row">
     <div class="col-lg-8 col-md-6">
@@ -34,10 +34,13 @@
         {% if is_exercise %}
           <button class="submit pull-right btn-primary">Submit</button>
           {% if last_submitted %}
-          <span class="pull-right" style="padding-right: 10px;">Submitted <span class="human-time" data-timestamp="{{last_submitted}}">on {{last_submitted}}</span></span>
+          <span class="pull-right" style="padding-right: 10px;"><span class="human-time" data-timestamp="{{last_submitted}}"></span></span>
           {% endif %}
         {% endif %}
       </div>
+      <div style="display: none">
+        <pre class="reset-code">{{reset_code}}</pre>
+      </div>
     </div>
   </div>
   <div class="code-editor">
@@ -59,20 +62,67 @@
 
 
 {% macro LiveCodeEditorJS(name, code) %}
+
+<script type="text/javascript" src="/assets/frappe/node_modules/moment/min/moment-with-locales.min.js"></script>
+<script type="text/javascript" src="/assets/frappe/node_modules/moment-timezone/builds/moment-timezone-with-data.min.js"></script>
+<script type="text/javascript" src="/assets/frappe/js/frappe/utils/datetime.js"></script>
+
+<script type="text/javascript">
+// comment_when is failing because of this
+if (!frappe.sys_defaults) {
+  frappe.sys_defaults = {}
+}
+</script>
+
 <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 = [];
+  var livecodeEditorsMap = {};
 
   $(function() {
     $(".livecode-editor").each((i, e) => {
+      var name = e.id.replace("editor-", "");
       var editor = new LiveCodeEditor(e, {
         base_url: "{{ livecode_url }}",
         ...getLiveCodeOptions()
       })
       livecodeEditors.push(editor);
-    })
-  })
+      livecodeEditorsMap[e.id] = editor;
+
+      $(e).find(".reset").on('click', function() {
+        let code = $(e).find(".reset-code").html();
+        editor.codemirror.doc.setValue(code);
+      });
+
+      $(e).find(".submit").on('click', function() {
+        let code = editor.codemirror.doc.getValue();
+        console.log("submit", name, code);
+        frappe.call("community.lms.api.submit_solution", {
+          "exercise": name,
+          "code": code
+        }).then(r => {
+          if (r.message.name) {
+            frappe.msgprint("Submitted successfully!");
+
+            let d = r.message.creation;
+            $(e).find(".human-time").html(__("Submitted {0}", [comment_when(d)]));
+          }
+        });
+      });
+
+    });
+  });
+
+  function updateSubmitTimes() {
+    $(".human-time").each(function(i, e) {
+      var d = $(e).data().timestamp;
+      $(e).html(__("Submitted {0}", [comment_when(d)]));
+    });
+  }
+
+  updateSubmitTimes();
 </script>
+
 {% endmacro %}

community/www/macros/sidebar.html

@@ -1,12 +1,12 @@
 {% macro Sidebar(course, batch_code) %}
 <div class="sidebar-batch">
-    <a href=""><i class="fas fa-bars fa-lg"></i></a>
+    <a href=""><i class="fa fa-bars fa-lg"></i></a>
     <br>
-    <a href="/courses/{{course}}/{{batch_code}}/learn"><i class="fas fa-book fa-lg"></i></a>
-    <a href="/courses/{{course}}/{{batch_code}}/schedule"><i class="fas fa-calendar-alt fa-lg"></i></a>
-    <a href="/courses/{{course}}/{{batch_code}}/members"><i class="fas fa-users fa-lg"></i></a>
-    <a href="/courses/{{course}}/{{batch_code}}/discuss"><i class="fas fa-comments fa-lg"></i></a>
-    <a href="/courses/{{course}}/{{batch_code}}/about"><i class="fas fa-info-circle fa-lg"></i></a>
+    <a href="/courses/{{course}}/{{batch_code}}/learn"><i class="fa fa-book fa-lg"></i></a>
+    <a href="/courses/{{course}}/{{batch_code}}/schedule"><i class="fa fa-calendar fa-lg"></i></a>
+    <a href="/courses/{{course}}/{{batch_code}}/members"><i class="fa fa-users fa-lg"></i></a>
+    <a href="/courses/{{course}}/{{batch_code}}/discuss"><i class="fa fa-comments fa-lg"></i></a>
+    <a href="/courses/{{course}}/{{batch_code}}/about"><i class="fa fa-info-circle fa-lg"></i></a>
     <!-- <a href="#contact"><i class="fas fa-home fa-lg"></i></a> -->
 </div>
-{% endmacro %}
+{% endmacro %}