Explorar o código

[notebook] Initial support for Markdown editing

Enrico Berti %!s(int64=10) %!d(string=hai) anos
pai
achega
003bf80

+ 5 - 2
desktop/core/src/desktop/static/desktop/js/ko.hue-bindings.js

@@ -1772,6 +1772,9 @@ ko.bindingHandlers.aceEditor = {
         placeHolderElement.remove();
         placeHolderVisible = false;
       }
+      if (options.updateOnInput){
+        options.value(editor.getValue());
+      }
     });
 
     editor.on("focus", function () {
@@ -1969,7 +1972,7 @@ ko.bindingHandlers.aceEditor = {
 
     var refreshAutoComplete = function (callback) {
       editor.completers = originalCompleters.slice();
-      if (options.extraCompleters().length > 0) {
+      if (options.extraCompleters && options.extraCompleters().length > 0) {
         options.extraCompleters().forEach(function (complete) {
           editor.completers.push(complete);
         });
@@ -2114,7 +2117,7 @@ ko.bindingHandlers.aceEditor = {
     if (options.aceInstance()) {
       var editor = options.aceInstance();
       editor.completers = element.originalCompleters.slice();
-      if (options.extraCompleters().length > 0) {
+      if (options.extraCompleters && options.extraCompleters().length > 0) {
         options.extraCompleters().forEach(function (complete) {
           editor.completers.push(complete);
         });

+ 2 - 1
desktop/libs/notebook/src/notebook/static/notebook/js/notebook.ko.js

@@ -147,7 +147,8 @@ var Snippet = function (vm, notebook, snippet) {
 
   self.id = ko.observable(typeof snippet.id != "undefined" && snippet.id != null ? snippet.id : UUID());
   self.name = ko.observable(typeof snippet.name != "undefined" && snippet.name != null ? snippet.name : '');
-  self.type = ko.observable(typeof snippet.type != "undefined" && snippet.type != null ? snippet.type : "hive");
+  self.type = ko.observable(typeof snippet.type != "undefined" && snippet.type != null ? snippet.type : 'hive');
+  self.subtype = ko.observable(typeof snippet.subtype != "undefined" && snippet.subtype != null ? snippet.subtype : '');
 
   //Ace stuff
   self.aceEditorMode = ko.observable(TYPE_ACE_EDITOR_MAP[self.type()]);

+ 25 - 0
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -346,6 +346,8 @@ from desktop.views import _ko
           </ul>
         </div>
 
+        <label data-bind="visible: type() == 'text' && $root.isEditing()" class="checkbox inline" style="margin-top: -6px"><input type="checkbox" data-bind="checked: $data.subtype" /> Markdown</label>
+
         <span data-bind="visible: type() == 'text'">&nbsp;</span>
 
         <span data-bind="editable: name, editableOptions: {enabled: $root.isEditing(), placement: 'right'}"></span>
@@ -356,6 +358,7 @@ from desktop.views import _ko
           <a href="javascript:void(0)" data-bind="click: function(){ settingsVisible(! settingsVisible()) }, visible: hasProperties, css: { 'blue' : settingsVisible }"><i class="fa fa-cog"></i></a>
           <a href="javascript:void(0)" data-bind="click: function(){ $root.removeSnippet($parent, $data); }"><i class="fa fa-times"></i></a>
         </div>
+
       </h2>
 
       <div>
@@ -636,7 +639,29 @@ from desktop.views import _ko
 </script>
 
 <script type="text/html" id="text-snippet-body">
+  <!-- ko ifnot: subtype() -->
   <div data-bind="attr:{'id': 'editor_' + id()}, html: statement_raw, value: statement_raw, medium: {}" data-placeHolder="${ _('Type your text here, select some text to format it') }" class="text-snippet"></div>
+  <!-- /ko -->
+  <!-- ko if: subtype() -->
+    <!-- ko if: $root.isEditing() -->
+      <div class="row-fluid">
+        <div class="span6">
+          <div class="ace-editor" data-bind="attr: { id: id() }, aceEditor: {
+            value: statement_raw,
+            aceInstance: ace,
+            updateOnInput: true,
+            mode: ko.observable('markdown'),
+            placeholder: '${ _('Type your markdown here') }' }"></div>
+        </div>
+        <div class="span6">
+          <div data-bind="html: markdown.toHTML(statement_raw())"></div>
+        </div>
+      </div>
+    <!-- /ko -->
+    <!-- ko ifnot: $root.isEditing() -->
+      <div data-bind="html: markdown.toHTML(statement_raw())"></div>
+    <!-- /ko -->
+  <!-- /ko -->
 </script>
 
 <script type="text/html" id="executable-snippet-body">