markdown-xblock 2.4.0__py3-none-any.whl

markdown_xblock/static/css/html.css

@@ -0,0 +1,15 @@
+.markdown_xblock table {
+    width: 100%;
+    margin: 20px 0;
+    border-collapse: collapse;
+    font-size: 16px;
+}
+.markdown_xblock th, td {
+    padding: 10px;
+    border: 1px solid #c8c8c8;
+    font-size: 14px;
+}
+.markdown_xblock th {
+    background: #eee;
+    font-weight: bold;
+}

markdown_xblock/static/css/pygments.css

@@ -0,0 +1,61 @@
+.markdown_xblock .codehilite .hll { background-color: #ffffcc }
+.markdown_xblock .codehilite .c { color: #999988; font-style: italic } /* Comment */
+.markdown_xblock .codehilite .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+.markdown_xblock .codehilite .k { color: #000000; font-weight: bold } /* Keyword */
+.markdown_xblock .codehilite .o { color: #000000; font-weight: bold } /* Operator */
+.markdown_xblock .codehilite .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+.markdown_xblock .codehilite .cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
+.markdown_xblock .codehilite .c1 { color: #999988; font-style: italic } /* Comment.Single */
+.markdown_xblock .codehilite .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+.markdown_xblock .codehilite .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+.markdown_xblock .codehilite .ge { color: #000000; font-style: italic } /* Generic.Emph */
+.markdown_xblock .codehilite .gr { color: #aa0000 } /* Generic.Error */
+.markdown_xblock .codehilite .gh { color: #999999 } /* Generic.Heading */
+.markdown_xblock .codehilite .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+.markdown_xblock .codehilite .go { color: #888888 } /* Generic.Output */
+.markdown_xblock .codehilite .gp { color: #555555 } /* Generic.Prompt */
+.markdown_xblock .codehilite .gs { font-weight: bold } /* Generic.Strong */
+.markdown_xblock .codehilite .gu { color: #aaaaaa } /* Generic.Subheading */
+.markdown_xblock .codehilite .gt { color: #aa0000 } /* Generic.Traceback */
+.markdown_xblock .codehilite .kc { color: #000000; font-weight: bold } /* Keyword.Constant */
+.markdown_xblock .codehilite .kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
+.markdown_xblock .codehilite .kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
+.markdown_xblock .codehilite .kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
+.markdown_xblock .codehilite .kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
+.markdown_xblock .codehilite .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+.markdown_xblock .codehilite .m { color: #009999 } /* Literal.Number */
+.markdown_xblock .codehilite .s { color: #d01040 } /* Literal.String */
+.markdown_xblock .codehilite .na { color: #008080 } /* Name.Attribute */
+.markdown_xblock .codehilite .nb { color: #0086B3 } /* Name.Builtin */
+.markdown_xblock .codehilite .nc { color: #445588; font-weight: bold } /* Name.Class */
+.markdown_xblock .codehilite .no { color: #008080 } /* Name.Constant */
+.markdown_xblock .codehilite .nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
+.markdown_xblock .codehilite .ni { color: #800080 } /* Name.Entity */
+.markdown_xblock .codehilite .ne { color: #990000; font-weight: bold } /* Name.Exception */
+.markdown_xblock .codehilite .nf { color: #990000; font-weight: bold } /* Name.Function */
+.markdown_xblock .codehilite .nl { color: #990000; font-weight: bold } /* Name.Label */
+.markdown_xblock .codehilite .nn { color: #555555 } /* Name.Namespace */
+.markdown_xblock .codehilite .nt { color: #000080 } /* Name.Tag */
+.markdown_xblock .codehilite .nv { color: #008080 } /* Name.Variable */
+.markdown_xblock .codehilite .ow { color: #000000; font-weight: bold } /* Operator.Word */
+.markdown_xblock .codehilite .w { color: #bbbbbb } /* Text.Whitespace */
+.markdown_xblock .codehilite .mf { color: #009999 } /* Literal.Number.Float */
+.markdown_xblock .codehilite .mh { color: #009999 } /* Literal.Number.Hex */
+.markdown_xblock .codehilite .mi { color: #009999 } /* Literal.Number.Integer */
+.markdown_xblock .codehilite .mo { color: #009999 } /* Literal.Number.Oct */
+.markdown_xblock .codehilite .sb { color: #d01040 } /* Literal.String.Backtick */
+.markdown_xblock .codehilite .sc { color: #d01040 } /* Literal.String.Char */
+.markdown_xblock .codehilite .sd { color: #d01040 } /* Literal.String.Doc */
+.markdown_xblock .codehilite .s2 { color: #d01040 } /* Literal.String.Double */
+.markdown_xblock .codehilite .se { color: #d01040 } /* Literal.String.Escape */
+.markdown_xblock .codehilite .sh { color: #d01040 } /* Literal.String.Heredoc */
+.markdown_xblock .codehilite .si { color: #d01040 } /* Literal.String.Interpol */
+.markdown_xblock .codehilite .sx { color: #d01040 } /* Literal.String.Other */
+.markdown_xblock .codehilite .sr { color: #009926 } /* Literal.String.Regex */
+.markdown_xblock .codehilite .s1 { color: #d01040 } /* Literal.String.Single */
+.markdown_xblock .codehilite .ss { color: #990073 } /* Literal.String.Symbol */
+.markdown_xblock .codehilite .bp { color: #999999 } /* Name.Builtin.Pseudo */
+.markdown_xblock .codehilite .vc { color: #008080 } /* Name.Variable.Class */
+.markdown_xblock .codehilite .vg { color: #008080 } /* Name.Variable.Global */
+.markdown_xblock .codehilite .vi { color: #008080 } /* Name.Variable.Instance */
+.markdown_xblock .codehilite .il { color: #009999 } /* Literal.Number.Integer.Long */

markdown_xblock/static/html/lms.html

@@ -0,0 +1 @@
+<div class="markdown_xblock{% if self.classes %} {{ self.classes | join:' ' }}{% endif %}">{{ self.html | safe }}</div>

markdown_xblock/static/html/studio.html

@@ -0,0 +1,29 @@
+<div class="wrapper-comp-editor editor-with-buttons" id="editor-tab" data-editor="{self.editor}">
+  <div class="tab">
+    <button class="tablinks" aria-selected="true" onclick="openTab(event, 'editor')" id="default-tab" >Editor</button>
+    <button class="tablinks" aria-selected="false" onclick="openTab(event, 'settings')">Settings</button>
+  </div>
+
+  <div id="editor" class="tabcontent">
+    <div class="markdown-editor editor">
+      <div class="row">
+        <textarea id="markdown-textarea">{{ self.data }}</textarea>
+      </div>
+    </div>
+    <div class="xblock-actions">
+      <span class="xblock-editor-error-message"></span>
+      <ul>
+        <li class="action-item">
+          <a href="#" class="button action-primary save-button">Save</a>
+        </li>
+        <li class="action-item">
+          <a href="#" class="button cancel-button">Cancel</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+
+  <div id="settings" class="tabcontent">
+    {{ settings_page | safe }}
+  </div>
+</div>

markdown_xblock/static/js/html.js

@@ -0,0 +1,233 @@
+/* Javascript for HTMLXBlock. */
+
+const CUSTOM_FONTS = "Default='Open Sans', Verdana, Arial, Helvetica, sans-serif;";
+const STANDARD_FONTS = "Andale Mono=andale mono,times;" + "Arial=arial,helvetica,sans-serif;" + "Arial Black=arial black,avant garde;" + "Book Antiqua=book antiqua,palatino;" + "Comic Sans MS=comic sans ms,sans-serif;" + "Courier New=courier new,courier;" + "Georgia=georgia,palatino;" + "Helvetica=helvetica;" + "Impact=impact,chicago;" + "Symbol=symbol;" + "Tahoma=tahoma,arial,helvetica,sans-serif;" + "Terminal=terminal,monaco;" + "Times New Roman=times new roman,times;" + "Trebuchet MS=trebuchet ms,geneva;" + "Verdana=verdana,geneva;" + "Webdings=webdings;" + "Wingdings=wingdings,zapf dingbats";
+const FONTS = CUSTOM_FONTS + STANDARD_FONTS;
+
+function openTab(evt, tabName) {
+  /**
+   * This method has been adopted as found in https://www.w3schools.com/howto/howto_js_tabs.asp
+   */
+  var i, tabcontent, tablinks;
+  tabcontent = document.getElementsByClassName("tabcontent");
+  for (i = 0; i < tabcontent.length; i++) {
+    tabcontent[i].style.display = "none";
+  }
+  tablinks = document.getElementsByClassName("tablinks");
+  for (i = 0; i < tablinks.length; i++) {
+    tablinks[i].className = tablinks[i].className.replace(" active", "");
+    tablinks[i].setAttribute("aria-selected", false);
+  }
+  document.getElementById(tabName).style.display = "block";
+  evt.currentTarget.className += " active";
+  evt.currentTarget.setAttribute("aria-selected", true);
+}
+
+function configureTheEditor(data) {
+  const contentSelector = "textarea#markdown-textarea";
+  const languageWrapper = document.querySelectorAll(".wrapper-view, .window-wrap");
+  const directionality = (languageWrapper.length > 0) ? languageWrapper.dir : "ltr";
+  var editor;
+
+  editor = CodeMirror.fromTextArea(document.querySelectorAll(contentSelector)[0], {
+    mode: "markdown",
+    lineNumbers: true,
+    matchBrackets: true,
+    lineWrapping: true,
+    theme: "default"
+  });
+
+  return editor;
+}
+
+function getSettingsValues(fields) {
+  var values = {};
+  var notSet = []; // List of field names that should be set to default values
+  for (var i in fields) {
+    var field = fields[i];
+    if (field.isSet()) {
+      values[field.name] = field.val();
+    } else {
+      notSet.push(field.name);
+    }
+  }
+
+  return {
+    values: values,
+    defaults: notSet
+  }
+}
+
+function extractXBlockFields() {
+  /**
+   * The content of this function is as found in xblockutils#studio_edit.js
+   */
+  var elements;
+  var fields = [];
+
+  elements = document.querySelectorAll(".field-data-control");
+  Array.prototype.forEach.call(elements, function (item) {
+    var $field = $(item);
+    var $wrapper = $field.closest('li');
+    var $resetButton = $wrapper.find('button.setting-clear');
+    var type = $wrapper.data('cast');
+
+    fields.push({
+      name: $wrapper.data('field-name'),
+      isSet: function () {
+        return $wrapper.hasClass('is-set');
+      },
+      val: function () {
+        var val = $field.val();
+        // Cast values to the appropriate type so that we send nice clean JSON over the wire:
+        if (type == 'boolean')
+          return (val == 'true' || val == '1');
+        if (type == "integer")
+          return parseInt(val, 10);
+        if (type == "float")
+          return parseFloat(val);
+        if (type == "generic" || type == "list" || type == "set") {
+          val = val.trim();
+          if (val === "")
+            val = null;
+          else
+            val = JSON.parse(val);
+        }
+        return val;
+      }
+    });
+    var fieldChanged = function () {
+      // Field value has been modified:
+      $wrapper.addClass('is-set');
+      $resetButton.removeClass('inactive').addClass('active');
+    };
+    $field.bind("change input paste", fieldChanged);
+    $resetButton.click(function () {
+      $field.val($wrapper.attr('data-default')); // Use attr instead of data to force treating the default value as a string
+      $wrapper.removeClass('is-set');
+      $resetButton.removeClass('active').addClass('inactive');
+    });
+
+    var datepickerAvailable = (typeof $.fn.datepicker !== 'undefined'); // Studio includes datepicker jQuery plugin
+    if (type == 'datepicker' && datepickerAvailable) {
+      $field.datepicker('destroy');
+      $field.datepicker({dateFormat: "m/d/yy"});
+    }
+  });
+
+  elements = document.querySelectorAll(".wrapper-list-settings .list-set");
+  Array.prototype.forEach.call(elements, function (item) {
+    var $optionList = $(item);
+    var $checkboxes = $(item).find('input');
+    var $wrapper = $optionList.closest('li');
+    var $resetButton = $wrapper.find('button.setting-clear');
+
+    fields.push({
+      name: $wrapper.data('field-name'),
+      isSet: function () {
+        return $wrapper.hasClass('is-set');
+      },
+      val: function () {
+        var val = [];
+        $checkboxes.each(function () {
+          if ($(item).is(':checked')) {
+            val.push(JSON.parse($(item).val()));
+          }
+        });
+        return val;
+      }
+    });
+
+    var fieldChanged = function () {
+      // Field value has been modified:
+      $wrapper.addClass('is-set');
+      $resetButton.removeClass('inactive').addClass('active');
+    };
+    $checkboxes.bind("change input", fieldChanged);
+
+    $resetButton.click(function () {
+      var defaults = JSON.parse($wrapper.attr('data-default'));
+      $checkboxes.each(function () {
+        var val = JSON.parse($(item).val());
+        $(item).prop('checked', defaults.indexOf(val) > -1);
+      });
+      $wrapper.removeClass('is-set');
+      $resetButton.removeClass('active').addClass('inactive');
+    });
+  });
+
+  return fields;
+}
+
+function MarkdownXBlock(runtime, element, data) {
+  document.getElementById("default-tab").click();  // Will open the XBlock by showing the default tab
+
+  const editor = configureTheEditor(data);
+  var fields = extractXBlockFields();
+  var elements;
+
+  function studioSubmit() {
+    const ContentHandlerUrl = runtime.handlerUrl(element, "update_content");
+    const SettingsHandlerUrl = runtime.handlerUrl(element, "submit_studio_edits");
+    const content = editor.getValue();
+    const fields_data = getSettingsValues(fields);
+    var errorMessage = "This may be happening because of an error with our server or your internet connection. Try refreshing the page or making sure you are online.";
+
+    runtime.notify('save', {state: 'start', message: "Saving"});
+    $.ajax({
+      type: "POST",
+      url: SettingsHandlerUrl,
+      data: JSON.stringify(fields_data),
+      dataType: "json",
+      global: false,  // Disable Studio's error handling that conflicts with studio's notify('save') and notify('cancel') :-/
+      success: function (response) {
+        $.ajax({
+          type: "POST",
+          url: ContentHandlerUrl,
+          data: JSON.stringify({"content": content}),
+          dataType: "json",
+          global: false,  // Disable Studio's error handling that conflicts with studio's notify('save') and notify('cancel') :-/
+          success: function (response) {
+            runtime.notify('save', {state: 'end'});
+          }
+        }).fail(function (jqXHR) {
+          runtime.notify('error', {title: "Unable to update content", message: errorMessage});
+        })
+      }
+    }).fail(function (jqXHR) {
+      if (jqXHR.responseText) { // Is there a more specific error message we can show?
+        try {
+          errorMessage = JSON.parse(jqXHR.responseText).error;
+          if (typeof errorMessage === "object" && errorMessage.messages) {
+            // e.g. {"error": {"messages": [{"text": "Unknown user 'bob'!", "type": "error"}, ...]}} etc.
+            errorMessage = $.map(errorMessage.messages, function (msg) {
+              return msg.text;
+            }).join(", ");
+          }
+        } catch (error) {
+          errorMessage = jqXHR.responseText.substr(0, 300);
+        }
+      }
+      runtime.notify('error', {title: "Unable to update settings", message: errorMessage});
+    })
+  }
+
+  element = typeof element[0] === 'undefined' ? element : element[0];  // Fix: sometimes edX passes a jQuery
+  // element, other times a DOM element
+
+  const addClickFn = function (el, fn) {
+    el.addEventListener("click", function (event) {
+      event.preventDefault();
+      fn(event);
+    });
+  };
+
+  element.querySelectorAll('.save-button').forEach(button => {
+    addClickFn(button, studioSubmit);
+  });
+  element.querySelectorAll('.cancel-button').forEach(button => {
+    addClickFn(button, function () {
+      runtime.notify('cancel', {});
+    });
+  });
+}