2 files changed, 152 insertions, 0 deletions
diff --git a/static/website/js/cloud.js b/static/website/js/cloud.js
new file mode 100644
index 0000000..1b64532
--- /dev/null
+++ b/static/website/js/cloud.js
@@ -0,0 +1,104 @@
+$(document).ready(function() {
+    /* Code Mirror Controls */
+    $fullscreen_code = $("#fullscreen-code");
+    $toggle_code = $("#toggle-code");
+
+    $fullscreen_code.click(function(e) {
+        editor.setOption("fullScreen", !editor.getOption("fullScreen"));
+        editor.focus();
+    });
+    $toggle_code.click(function() {
+        if(editor.getOption("theme") == "monokai") {
+            editor.setOption("theme", "default");
+        } else{
+            editor.setOption("theme", "monokai");
+        }
+    });
+
+    $fullscreen_result = $("#fullscreen-result");
+    $toggle_result = $("#toggle-result");
+
+    $fullscreen_result.click(function(e) {
+        result.setOption("fullScreen", !result.getOption("fullScreen"));
+        result.focus();
+    });
+    $toggle_result.click(function() {
+        if(result.getOption("theme") == "monokai") {
+            result.setOption("theme", "default");
+        } else{
+            result.setOption("theme", "monokai");
+        }
+    });
+
+    /* 
+     * Selectors function 
+     * Write the queries using live
+    */
+    $("#categories").change(function() {
+        $("#books-wrapper").html("");
+        $("#chapters-wrapper").html("");
+        $("#examples-wrapper").html("");
+
+        $.ajax({
+            url: "/ajax-books/",
+            type: "POST",
+            data: {
+                category_id: $(this).val()
+            },
+            dataType: "html",
+            success: function(data) {
+                $("#books-wrapper").html(data);
+            }
+        });
+    });
+
+    $(document).on("change", "#books", function(){
+        $("#chapters-wrapper").html("");
+        $("#examples-wrapper").html("");
+
+        $.ajax({
+            url: "/ajax-chapters/",
+            type: "POST",
+            data: {
+                book_id: $("#books").val()
+            },
+            dataType: "html",
+            success: function(data) {
+                $("#chapters-wrapper").html(data);
+            }
+        });
+    });
+
+    $(document).on("change", "#chapters", function(){
+        $("#examples-wrapper").html("");
+        $.ajax({
+            url: "/ajax-examples/",
+            type: "POST",
+            data: {
+                chapter_id: $("#chapters").val()
+            },
+            dataType: "html",
+            success: function(data) {
+                $("#examples-wrapper").html(data);
+            }
+        });
+    });
+
+    /* Execute the code */
+    $("#execute").click(function() {
+        var csrfmiddlewaretoken = $("[name='csrfmiddlewaretoken']").val();
+        var code = editor.getValue();
+        $.ajax({
+            url:"/ajax-execute/",
+            type: "POST",
+            data: {
+                csrfmiddlewaretoken: csrfmiddlewaretoken,
+                code: code
+            },
+            dataType: "text",
+            success: function(data) {
+                result.setValue(data);
+            }
+        });
+    });
+});
diff --git a/static/website/js/placeholder.js b/static/website/js/placeholder.js
new file mode 100644
index 0000000..748afe7
--- /dev/null
+++ b/static/website/js/placeholder.js
@@ -0,0 +1,48 @@
+(function() {
+  CodeMirror.defineOption("placeholder", "", function(cm, val, old) {
+    var prev = old && old != CodeMirror.Init;
+    if (val && !prev) {
+      cm.on("blur", onBlur);
+      cm.on("change", onChange);
+      onChange(cm);
+    } else if (!val && prev) {
+      cm.off("blur", onBlur);
+      cm.off("change", onChange);
+      clearPlaceholder(cm);
+      var wrapper = cm.getWrapperElement();
+      wrapper.className = wrapper.className.replace(" CodeMirror-empty", "");
+    }
+
+    if (val && !cm.hasFocus()) onBlur(cm);
+  });
+
+  function clearPlaceholder(cm) {
+    if (cm.state.placeholder) {
+      cm.state.placeholder.parentNode.removeChild(cm.state.placeholder);
+      cm.state.placeholder = null;
+    }
+  }
+  function setPlaceholder(cm) {
+    clearPlaceholder(cm);
+    var elt = cm.state.placeholder = document.createElement("pre");
+    elt.style.cssText = "height: 0; overflow: visible";
+    elt.className = "CodeMirror-placeholder";
+    elt.appendChild(document.createTextNode(cm.getOption("placeholder")));
+    cm.display.lineSpace.insertBefore(elt, cm.display.lineSpace.firstChild);
+  }
+
+  function onBlur(cm) {
+    if (isEmpty(cm)) setPlaceholder(cm);
+  }
+  function onChange(cm) {
+    var wrapper = cm.getWrapperElement(), empty = isEmpty(cm);
+    wrapper.className = wrapper.className.replace(" CodeMirror-empty", "") + (empty ? " CodeMirror-empty" : "");
+
+    if (empty) setPlaceholder(cm);
+    else clearPlaceholder(cm);
+  }
+
+  function isEmpty(cm) {
+    return (cm.lineCount() === 1) && (cm.getLine(0) === "");
+  }
+})();