diff options
Diffstat (limited to 'templates')
| -rw-r--r-- | templates/includes/book/exercise.html | 37 | ||||
| -rw-r--r-- | templates/layout.html | 3 | ||||
| -rw-r--r-- | templates/page.html | 4 |
3 files changed, 42 insertions, 2 deletions
diff --git a/templates/includes/book/exercise.html b/templates/includes/book/exercise.html new file mode 100644 index 0000000..b94e39e --- /dev/null +++ b/templates/includes/book/exercise.html @@ -0,0 +1,37 @@ +<div class="header"> + <h2>Exercise #{{ section.id }}</h2> +</div> +<div class="message"> + {% autoescape false %}{{ section.content }}{% endautoescape %} +</div> +<div class="editor" style="height: {{ section.content.split("\n").length*20 }};">{{ section.codes.base }}</div> + +<pre class="hidden code-solution">{{ section.codes.solution }}</pre> +<pre class="hidden code-validation">{{ section.codes.validation }}</pre> + +<div class="btn-group btn-group-justified"> + <a href="#" class="btn btn-default action-submit">Submit</a> + <a href="#" class="btn btn-default action-solution">Solution</a> + <a href="https://github.com/{{ githubId }}/issues/new" target="_blank" class="btn btn-default">Have a Question?</a> +</div> + +<script> +$(document).ready(function() { + var $exercise = $("#section-{{ section.id }}"); + + var editor = ace.edit($exercise.find(".editor").get(0)); + editor.setTheme("ace/theme/tomorrow"); + editor.getSession().setMode("ace/mode/javascript"); + + $exercise.find(".action-submit").click(function(e) { + e.preventDefault(); + + alert("submit"); + }); + $exercise.find(".action-solution").click(function(e) { + e.preventDefault(); + + editor.setValue($exercise.find(".code-solution").html()); + }); +}); +</script>
\ No newline at end of file diff --git a/templates/layout.html b/templates/layout.html index ea1e504..991200a 100644 --- a/templates/layout.html +++ b/templates/layout.html @@ -13,7 +13,10 @@ <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> + <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/ace.js"></script> + <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/mode-javascript.js"></script> {% endblock %} </head> <body> diff --git a/templates/page.html b/templates/page.html index cd17fbc..3c2eb89 100644 --- a/templates/page.html +++ b/templates/page.html @@ -11,11 +11,11 @@ <div class="book-body"> <div class="page-inner"> {% for section in content %} - <section class="{{ section.type }}"> + <section class="{{ section.type }}" id="section-{{ section.id }}"> {% if section.type == "normal" %} {% autoescape false %}{{ section.content }}{% endautoescape %} {% elif section.type == "exercise" %} - + {% include "./includes/book/exercise.html" with {section: section} %} {% endif %} </section> {% endfor %} |