fixes

[redakcja.git] / src / redakcja / static / js / wiki / view_properties.js

diff --git a/src/redakcja/static/js/wiki/view_properties.js b/src/redakcja/static/js/wiki/view_properties.js
index 1fff64f..e38a7d0 100644 (file)
--- a/src/redakcja/static/js/wiki/view_properties.js
+++ b/src/redakcja/static/js/wiki/view_properties.js
@@ -8,6 +8,7 @@
             "attributes": [
                 {
                     "name": "src",
+                    "type": "media",
                 },
                 {
                     "name": "alt",
@@ -151,6 +152,27 @@
             });
 
 
+            $('#media-chooser').on('show.bs.modal', function (event) {
+                var input = $("input", $(event.relatedTarget).parent());
+                var modal = $(this);
+                modal.data('target-input', input);
+                var imglist = modal.find('.modal-body');
+                imglist.html('');
+                $.each(self.doc.galleryImages, (i, imgItem) => {
+                    img = $("<img>").attr("src", imgItem.thumb).attr('title', imgItem.url).data('url', imgItem.url).on('click', function() {
+                        imglist.find('img').removeClass('active');
+                        $(this).addClass('active');
+                    });
+                    imglist.append(img);
+                });
+            })
+            $('#media-chooser .ctrl-ok').on('click', function (event) {
+                $('#media-chooser').data('target-input')
+                    .val(
+                        (new URL($('#media-chooser .active').data('url'), document.baseURI)).href
+                    ).trigger('change');
+                $('#media-chooser').modal('hide');
+            });
             
             self.$pane.on('click', '.current-convert', function() {
                 self.convert($(this).attr('data-to'));
@@ -171,10 +193,18 @@
     PropertiesPerspective.prototype.edit = function(element) {
         let self = this;
 
-        let $node = $(element);
         $("#parents", self.$pane).empty();
         $("#bubbles").empty();
 
+        $f = $("#properties-form", self.$pane);
+        $f.empty();
+
+        if (element === null) {
+            self.$edited = null;
+            return;
+        }
+
+        let $node = $(element);
         let b = $("<div class='badge badge-primary'></div>").text($node.attr('x-node'));
         b.data('node', element);
         $("#bubbles").append(b);
@@ -193,8 +223,6 @@
         node = $(element).attr('x-node');
         $("h1", self.$pane).text(node);
 
-        $f = $("#properties-form", self.$pane);
-        $f.empty();
         self.$edited = $(element);
 
         let nodeDef = elementDefs[node];
@@ -267,7 +295,15 @@
         } else {
             $aninput = $("<input class='form-control'>");
             if (field.value_type.autocomplete) {
-                $aninput.autocomplete(field.value_type.autocomplete);
+                let autoOptions = field.value_type.autocomplete;
+                $aninput.autocomplete(autoOptions).autocomplete('instance')._renderItem = function(ul, item) {
+                    let t = item.label;
+                    if (item.name) t += '<br><small><strong>' + item.name + '</strong></small>';
+                    if (item.description) t += '<br><small><em>' + item.description + '</em></small>';
+                    return $( "<li>" )
+                        .append( "<div>" + t + "</div>" )
+                        .appendTo( ul );
+                };
             }
         }
         $aninput.data('edited', $(element))
@@ -320,22 +356,28 @@
 
         let $fg = $("<div class='form-group'>");
         $("<label/>").attr("for", "property-" + defn.name).text(defn.name).appendTo($fg);
-        let $input;
+        let $input, $inputCnt;
         switch (defn.type) {
         case 'text':
-            $input = $("<textarea>");
+            $inputCnt =$input = $("<textarea>");
             break;
         case 'select':
-            $input = $("<select>");
+            $inputCnt = $input = $("<select>");
             $.each(defn.options, function(i, e) {
                 $("<option>").text(e).appendTo($input);
             });
             break;
         case 'bool':
-            $input = $("<input type='checkbox'>");
+            $inputCnt = $input = $("<input type='checkbox'>");
+            break;
+        case 'media':
+            $inputCnt = $("<div class='media-input input-group'>");
+            $input = $("<input type='text'>");
+            $inputCnt.append($input);
+            $inputCnt.append($("<button type='button' class='ctrl-media-choose btn btn-primary' data-toggle='modal' data-target='#media-chooser'>…</button>"));
             break;
         default:
-            $input = $("<input>");
+            $inputCnt = $input = $("<input>");
         }
 
         $input.addClass("form-control").attr("id", "property-" + defn.name).data("property", defn.name);
@@ -348,7 +390,7 @@
         if (elem) {
             $input.data("edited", elem);
         }
-        $input.appendTo($fg);
+        $inputCnt.appendTo($fg);
 
         $fg.appendTo($form);
     }
@@ -364,6 +406,18 @@
         this.edit(p);
     }
 
+    PropertiesPerspective.prototype.onEnter = function(success, failure){
+        var self = this;
+        $.wiki.SidebarPerspective.prototype.onEnter.call(this);
+
+        if ($.wiki.activePerspective() != 'VisualPerspective')
+            $.wiki.switchToTab('#VisualPerspective');
+
+        if (self.$edited === null) {
+            self.edit($('[x-node="utwor"]')[0]);
+        }
+    };
+
     $.wiki.PropertiesPerspective = PropertiesPerspective;
 
 })(jQuery);