scrivito_editors 1.4.3 → 1.5.0.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: d326d1095e36a2c595beb4e547843320c02307a5
-  data.tar.gz: 9164ff05f79fb885ad8d9815ccdb2df4656e61e5
+  metadata.gz: 835e8e50694e5e2d3e60299ffb7c980d99e54198
+  data.tar.gz: 6041191e9f760302ae1ee61de1769b3f7ba27a56
 SHA512:
-  metadata.gz: e533ddd257bc7db4d8c74bafa529352e5e4719a32b22773846e72a1077d056ebe69e41e1131aa32dd85c4e404849b0e2186ca0bebe2b80a30b0e5d5594068cc0
-  data.tar.gz: 0f89280703e65e116a947cc5b246863c36a8186aad6bdab20e622a04ab26e7c52a413b31081f8ae4da0311fc0ae840253dcddbc1f9040bbd04e833b3bf8f9f5d
+  metadata.gz: bdd533434af6e2f89f01fd11d2ad56ac145568c0cb14cf10a753e6d734f1f6e7822ab3b175078a5a3110ae72e8df6a8a5ea1168e526f8f1511fc961f2d7818ad
+  data.tar.gz: 86c98a67a239237dad35c5119627e710881f7a779e5f3f61d7644afe4775a48dab0907f024fa88cb2ef74f6cf66b09e3714445d29254c595b3e948b271ce9b2f

data/app/assets/javascripts/scrivito_editors.js

@@ -13,8 +13,11 @@
 //= require jquery.caret
 //= require jquery.tag-editor
 //= require medium-editor
-//= require_tree ./scrivito_editors/dependencies
+//= require jquery-ui/sortable
+//= require jquery-ui/datepicker
+//= require jquery-ui/slider
 //= require jquery-ui-timepicker-addon.min
+//= require jquery-ui/autocomplete
 //= require redactor
 //= require redactor_plugins/table
 //= require canvas-to-blob

data/app/assets/javascripts/scrivito_editors/link_editor.js

@@ -27,13 +27,16 @@
   activate = function(cmsField) {
     var link;
     link = cmsField.scrivito('content') || {};
-    cmsField.html(template(link));
+    cmsField.addClass('scrivito_editors_ui').html(template(link));
     if (link.obj_id) {
       fetchDescription(cmsField, link.obj_id);
     }
-    cmsField.on('blur', 'li input', function() {
+    scrivito.editors._linkTargetEditing.activate(cmsField, cmsField.find('li'), link);
+    cmsField.on('scrivito_editors_private:target_changed', function() {
       return save(cmsField);
-    }).on('click', 'a.scrivito_open_content_browser', function() {
+    }).on('blur', 'input', function() {
+      return save(cmsField);
+    }).on('click', '[data-scrivito-editors-browse]', function() {
       return openContentBrowser(cmsField);
     });
     return cmsField.find('[name=url]').on('focus', function() {
@@ -48,9 +51,10 @@
   };
 
   template = function(link) {
-    var obj_url;
+    var obj_url, url;
     obj_url = link.obj_id && scrivito.path_for_id(link.obj_id);
-    return $("<ul>\n  <li data-id=\"" + link.obj_id + "\" data-title=\"" + link.title + "\" data-url=\"" + link.url + "\">\n    <input type=\"text\" name=\"title\" value=\"" + (link.title || '') + "\" placeholder=\"Title\" />\n    <input type=\"text\" name=\"url\" value=\"" + (link.url || obj_url || '') + "\"\n        data-value=\"" + (link.url || obj_url || '') + "\" placeholder=\"Url\" class=\"editing-url\" />\n    <div class=\"actions\">\n      <a href=\"#\" class=\"scrivito_open_content_browser editing-button editing-green\">\n        <i class=\"editing-icon editing-icon-search\" />\n      </a>\n    </div>\n  </li>\n</ul>");
+    url = link.url || obj_url || '';
+    return $("<ul>\n  <li data-id=\"" + (link.obj_id || '') + "\" data-target=\"\">\n    <input type=\"text\" name=\"title\" value=\"" + (link.title || '') + "\" placeholder=\"Title\" />\n    <input type=\"text\" name=\"url\" value=\"" + url + "\" data-value=\"" + url + "\" placeholder=\"URL\"\n        class=\"editing-url\" />\n    <div class=\"actions\">\n      <div class=\"input_group_btn\">\n        <a href=\"#\" class=\"editing-button editing-grey editing-clear\"\n            data-scrivito-editors-toggle-target>\n          <span class=\"scrivito_editors_current_target\"></span>\n          <i class=\"scrivito_icon scrivito_icon_link_target\"></i>\n        </a>\n        <ul class=\"dropdown_menu\"></ul>\n      </div>\n      <a href=\"#\" class=\"editing-button content-browser-open editing-green\"\n          data-scrivito-editors-browse>\n        <i class=\"scrivito_icon scrivito_icon_content_browser\"></i>\n      </a>\n    </div>\n  </li>\n</ul>");
   };
 
   openContentBrowser = function(cmsField) {
@@ -64,7 +68,8 @@
       filter_context: cmsField.data('scrivitoEditorsFilterContext')
     }).done(function(selection) {
       var url, val;
-      if (id = selection[0]) {
+      id = selection[0];
+      if (id != null) {
         url = scrivito.path_for_id(id);
         val = "Content browser selection (" + url + ")";
         linkItem.attr('data-id', id).find('[name=url]').attr('data-value', url).val(val);
@@ -76,12 +81,14 @@
   };
 
   save = function(cmsField) {
-    var li, title, url, urlInput, value;
+    var li, target, title, url, urlInput, value;
     li = cmsField.find('li');
+    target = li.attr('data-target');
     title = li.find('[name=title]').val();
     urlInput = li.find('[name=url]');
     url = urlInput.attr('data-value') || urlInput.val();
     value = url ? {
+      target: target,
       title: title,
       url: url
     } : null;

data/app/assets/javascripts/scrivito_editors/link_target_editing.js

@@ -0,0 +1,49 @@
+(function() {
+  var DEFAULT_TARGETS, setTarget, targets, toggleTargetSelection;
+
+  DEFAULT_TARGETS = {
+    _blank: "new window",
+    _top: "top-level window",
+    "": "same container"
+  };
+
+  scrivito.editors._linkTargetEditing = {
+    activate: function(cmsField, listElement, link) {
+      var label, ref, target;
+      listElement.on('click', '[data-scrivito-editors-toggle-target]', function() {
+        return toggleTargetSelection(listElement);
+      }).on('click', '[data-target-option]', function() {
+        setTarget(cmsField, listElement, $(this).attr("data-target-option"));
+        toggleTargetSelection(listElement);
+        return cmsField.trigger('scrivito_editors_private:target_changed');
+      });
+      ref = targets(cmsField);
+      for (target in ref) {
+        label = ref[target];
+        $("<li data-scrivito-editors-set-target>" + label + "</li>").appendTo(listElement.find(".dropdown_menu")).attr("data-target-option", target);
+      }
+      return setTarget(cmsField, listElement, link.target);
+    }
+  };
+
+  setTarget = function(cmsField, listElement, target) {
+    var text;
+    listElement.attr("data-target", target);
+    text = targets(cmsField)[target] || target;
+    if (target === "") {
+      text = "";
+    }
+    listElement.find(".scrivito_editors_current_target").text(text);
+    return false;
+  };
+
+  toggleTargetSelection = function(listElement) {
+    listElement.find('.dropdown_menu').slideToggle();
+    return false;
+  };
+
+  targets = function(cmsField) {
+    return cmsField.data('scrivito_editors_link_targets') || DEFAULT_TARGETS;
+  };
+
+}).call(this);

data/app/assets/javascripts/scrivito_editors/linklist_editor.js

@@ -19,7 +19,7 @@
     linklist = cmsField.scrivito('content');
     render(cmsField, linklist);
     fetchDescriptions(cmsField, objIdsFor(linklist));
-    attachHandlers(cmsField);
+    attachHandlers(cmsField, linklist);
     return storeLastSaved(cmsField, linklist);
   };
 
@@ -30,8 +30,7 @@
       link = linklist[j];
       ul.append(linkTemplate(link));
     }
-    cmsField.html(ul);
-    return cmsField.append('<button class="editing-button editing-green add-link">\n  <i class="editing-icon editing-icon-plus"></i>\n</button>');
+    return cmsField.addClass('scrivito_editors_ui').html(ul).append('<button class="editing-button editing-green add-link">\n  <i class="editing-icon editing-icon-plus"></i>\n</button>');
   };
 
   fetchDescriptions = function(cmsField, objIds) {
@@ -65,31 +64,35 @@
     return results;
   };
 
-  attachHandlers = function(cmsField) {
-    var j, len, li, ref, results, ul;
+  attachHandlers = function(cmsField, linklist) {
+    var index, j, len, li, ref, results, ul;
     ul = cmsField.find('ul');
     scrivito.editors.Sortable.create(ul.get(0), {
       ghostClass: 'scrivito-sortable-placeholder',
+      handle: '.scrivito-editors-handle',
       onUpdate: function() {
         return save(cmsField);
       }
     });
-    cmsField.on('blur', 'li input', function() {
+    cmsField.on('scrivito_editors_private:target_changed', function() {
+      return save(cmsField);
+    }).on('blur', 'li input', function() {
       return save(cmsField);
     }).on('click', 'button.add-link', function() {
       return addLink(cmsField);
     });
     ref = ul.find('li');
     results = [];
-    for (j = 0, len = ref.length; j < len; j++) {
-      li = ref[j];
-      results.push(attachLinkHandlers(cmsField, $(li)));
+    for (index = j = 0, len = ref.length; j < len; index = ++j) {
+      li = ref[index];
+      results.push(attachLinkHandlers(cmsField, $(li), linklist[index]));
     }
     return results;
   };
 
-  attachLinkHandlers = function(cmsField, li) {
-    return li.on('click', 'a.scrivito_open_content_browser', function() {
+  attachLinkHandlers = function(cmsField, li, link) {
+    scrivito.editors._linkTargetEditing.activate(cmsField, li, link);
+    return li.on('click', '[data-scrivito-editors-browse]', function() {
       return openContentBrowser(cmsField, li);
     }).on('click', 'a.delete', function() {
       return removeLink(cmsField, li);
@@ -105,13 +108,14 @@
   };
 
   linkTemplate = function(link) {
-    var obj_url;
+    var obj_url, url;
     obj_url = link.obj_id && scrivito.path_for_id(link.obj_id);
-    return $("<li " + (link.obj_id ? "data-id='" + link.obj_id + "'" : void 0) + " data-title=\"" + link.title + "\" data-url=\"" + link.url + "\">\n  <input type=\"text\" name=\"title\" value=\"" + (link.title || '') + "\" placeholder=\"Title\" />\n  <input type=\"text\" name=\"url\" value=\"" + (link.url || obj_url || '') + "\"\n      data-value=\"" + (link.url || obj_url || '') + "\" placeholder=\"Url\" class=\"editing-url\" />\n  <div class=\"actions\">\n    <a href=\"#\" class=\"scrivito_open_content_browser editing-button editing-green\">\n      <i class=\"editing-icon editing-icon-search\" />\n    </a>\n    <a href=\"#\" class=\"editing-button editing-red delete\">\n      <i class=\"editing-icon editing-icon-trash\" />\n    </a>\n  </div>\n</li>");
+    url = link.url || obj_url || '';
+    return $("<li data-id=\"" + (link.obj_id || '') + "\" data-title=\"" + (link.title || '') + "\" data-url=\"" + url + "\"\n    data-target=\"\">\n  <span class=\"scrivito-editors-handle\"></span>\n  <input type=\"text\" name=\"title\" value=\"" + (link.title || '') + "\" placeholder=\"Title\" />\n  <input type=\"text\" name=\"url\" value=\"" + url + "\" data-value=\"" + url + "\" placeholder=\"URL\"\n      class=\"editing-url\" />\n  <div class=\"actions\">\n    <div class=\"input_group_btn\">\n      <a href=\"#\" class=\"editing-button editing-grey editing-clear\"\n          data-scrivito-editors-toggle-target>\n        <span class=\"scrivito_editors_current_target\"></span>\n        <i class=\"scrivito_icon scrivito_icon_link_target\"></i>\n      </a>\n      <ul class=\"dropdown_menu\"></ul>\n    </div>\n    <a href=\"#\" class=\"editing-button content-browser-open editing-green\"\n        data-scrivito-editors-browse>\n      <i class=\"scrivito_icon scrivito_icon_content_browser\"></i>\n    </a>\n    <a href=\"#\" class=\"editing-button editing-red delete\">\n      <i class=\"scrivito_icon scrivito_icon_trash\"></i>\n    </a>\n  </div>\n</li>");
   };
 
   save = function(cmsField) {
-    var input, lastSaved, li, title, url, value;
+    var input, lastSaved, li, target, title, url, value;
     value = (function() {
       var j, len, ref, results;
       ref = $(cmsField).find('li');
@@ -119,11 +123,13 @@
       for (j = 0, len = ref.length; j < len; j++) {
         li = ref[j];
         li = $(li);
+        target = li.attr('data-target');
         title = li.find('[name=title]').val();
         input = li.find('[name=url]');
         url = input.attr('data-value') || input.val();
         if (url) {
           results.push({
+            target: target,
             title: title,
             url: url
           });
@@ -147,9 +153,8 @@
 
   addLink = function(cmsField) {
     var li;
-    li = linkTemplate({});
-    li.appendTo(cmsField.find('ul'));
-    attachLinkHandlers(cmsField, li);
+    li = linkTemplate({}).appendTo(cmsField.children('ul'));
+    attachLinkHandlers(cmsField, li, {});
     return false;
   };
 

data/app/assets/stylesheets/scrivito_editors/buttons.css

@@ -129,6 +129,25 @@ a.editing-button:active {
   cursor: not-allowed;
 }
 
+
+.editing-button.editing-grey {
+  background: #f3f3f3;
+  color: #666;
+}
+
+.editing-button.editing-grey:hover {
+  background: #f6f6f6;
+  color: #666;
+}
+
+.editing-button.editing-grey:active {
+  background: #fafafa;
+  color: #666;
+}
+
+.editing-button span { font-size: 12px; padding: 0 2px 0 0;}
+
+
 .editing-button .editing-icon {
   color: #333;
   font-size: 9px;
@@ -146,6 +165,24 @@ a.editing-button:active {
   color: #fff;
 }
 
+
+.editing-button .scrivito_icon { color: #555; font-size: 18px; line-height: 14px; }
+.editing-button.editing-blue .scrivito_icon,
+.editing-button.editing-green .scrivito_icon,
+.editing-button.editing-red .scrivito_icon,
+.editing-button.editing-yellow .scrivito_icon {
+  color: #fff;
+}
+
+
+.editing-button.editing-clear {
+  color: #888;
+  -webkit-box-shadow: none;
+  -moz-box-shadow: none;
+  box-shadow: none;
+}
+.editing-button.editing-clear .editing-icon {color: #888;}
+
 /*
   Styling for buttons in the details view dialog.
 */
@@ -159,3 +196,39 @@ a.editing-button:active {
 .details-view [data-scrivito-field-type="date"] .editing-button {
   margin: 10px 10px 0 0;
 }
+
+
+.input_group_btn { display: inline-block; position: relative; float: left;}
+
+.dropdown_menu { background-color: #fff!important;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 4px;
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
+  display: none;
+  float: left;
+  font-size: 12px!important;
+  right: 0;
+  list-style: outside none none;
+  margin: 2px 0 0;
+  min-width: 140px;
+  padding: 5px 0;
+  position: absolute;
+  text-align: left;
+  top: 100%;
+  z-index: 1000;
+  }
+
+.dropdown_menu li {
+  background: #fff!important;
+  padding: 5px 10px!important;
+  margin: 0!important;
+  border: 0!important;
+  border-radius: 0!important;
+  color: #666;
+  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+  font-size: 12px!important;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.15)!important;
+  }
+.dropdown_menu li:hover { background: #f3f3f3!important; cursor: pointer!important; }
+
+.dropdown_menu li:before { display: none;}

data/app/assets/stylesheets/scrivito_editors/icons.css.erb

@@ -25,6 +25,7 @@
 }
 
 /* kept for backwards compatibility reasons */
+.editing-icon-code:after { content: "\F018"; }
 .editing-icon-edit:after { content: "\F026"; }
 .editing-icon-search:after { content: "\F043"; }
 .editing-icon-trash:after { content: "\F038"; }

data/app/assets/stylesheets/scrivito_editors/link_editor.css

@@ -2,44 +2,44 @@
   An editor to handle CMS link attributes.
 */
 
-[data-scrivito-field-type="link"] ul {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul {
   list-style: none;
   margin: 0;
   padding: 0;
 }
 
-[data-scrivito-field-type="link"] ul li{
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li{
   background-color: #f1f1f1;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   margin: 0;
-  overflow: hidden;
   padding: 5px 10px;
   position: relative;
   border: 1px solid #ddd;
 }
 
-[data-scrivito-field-type="link"] ul li .list-content a {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li .list-content a {
   display:block;
 }
 
-[data-scrivito-field-type="link"] ul li .actions {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li .actions {
   position: absolute;
   bottom: 0;
   right: 0;
 }
 
-[data-scrivito-field-type="link"] ul li .actions .editing-button {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li .actions .editing-button {
   border-radius: 0;
   margin: 0;
+  height: 30px;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="link"] ul li {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li {
   padding: 0;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="link"] ul li input {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li input {
   background: #fff;
   border: 0px solid #ddd;
   border-top-width: 1px;
@@ -47,7 +47,6 @@
   border-radius: 0 0 5px 5px;
   color: #555555;
   display: block;
-  float: left;
   font-size: 14px;
   height: 31px;
   margin: 0;
@@ -55,19 +54,29 @@
   width: 100%;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="link"] ul li input:first-child {
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li input:first-child {
   border-radius: 5px 5px 0 0;
   border-top-width: 0px;
 }
 
+/* micro clearfix */
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li:before,
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li:after {
+  content: " ";
+  display: table;
+}
+
+.scrivito_editors_ui[data-scrivito-field-type="link"] ul li:after {
+  clear: both;
+}
+
 @media (max-width: 550px) {
-  [data-scrivito-field-type="link"] ul li .actions {
-    float: left;
+  .scrivito_editors_ui[data-scrivito-field-type="link"] ul li .actions {
     position: static;
+    float: right;
   }
 
-  [data-scrivito-field-type="link"] ul li .actions .editing-button {
-    border-radius: 5px;
+  .scrivito_editors_ui[data-scrivito-field-type="link"] ul li .actions .editing-button {
     margin: 4px 0 0 0;
   }
 }

data/app/assets/stylesheets/scrivito_editors/linklist_editor.css

@@ -2,57 +2,56 @@
   An editor to handle CMS linklist attributes.
 */
 
-[data-scrivito-field-type="linklist"] ul {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul {
   list-style: none;
   margin: 0;
   padding: 0;
 }
 
-[data-scrivito-field-type="linklist"] ul li{
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li{
   background-color: #f3f3f3;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   margin: 4px 0;
-  overflow: hidden;
   padding: 5px 10px;
   position: relative;
   border: 1px solid #ddd;
 }
 
-[data-scrivito-field-type="linklist"] ul li.scrivito-sortable-placeholder:before {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li.scrivito-sortable-placeholder:before {
   display:none;
 }
 
-[data-scrivito-field-type="linklist"] ul li .list-content a {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .list-content a {
   display:block;
 }
 
-[data-scrivito-field-type="linklist"] ul li .actions {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .actions {
   position: absolute;
   bottom: 0;
   right: 0;
 }
 
-[data-scrivito-field-type="linklist"] ul li .actions .editing-button {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .actions .editing-button {
   border-radius: 0;
   margin: 0;
+  height: 30px;
 }
 
-[data-scrivito-field-type="linklist"] ul li .actions .editing-button.delete {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .actions .editing-button.delete {
   margin-left: 1px;
   float: right;
 }
 
-[data-scrivito-field-type="linklist"] ul li .actions .editing-button.content-browser-open {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .actions .editing-button.content-browser-open {
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="linklist"] ul li {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li {
   padding: 0 0 0 30px;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="linklist"] ul li:before {
-  content: "↕";
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .scrivito-editors-handle {
   color: #999;
   font-size: 19px;
   line-height: 0;
@@ -61,12 +60,16 @@
   top: 50%;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="linklist"] ul li:hover {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .scrivito-editors-handle:before {
+  content: "↕";
+}
+
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li:hover {
   background-color: #e6f3f7;
   cursor: move;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="linklist"] ul li.scrivito-sortable-placeholder {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li.scrivito-sortable-placeholder {
   background: #f3f3f3;
   border: 2px dashed #9bc2cf;
   opacity: .5;
@@ -74,7 +77,7 @@
   visibility: visible!important;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="linklist"] ul li input {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li input {
   background: #fff;
   border: 0px solid #ddd;
   border-top-width: 1px;
@@ -82,7 +85,6 @@
   border-radius: 0 0 5px 0;
   color: #555555;
   display: block;
-  float: left;
   font-size: 14px;
   height: 31px;
   margin: 0;
@@ -90,7 +92,30 @@
   width: 100%;
 }
 
-[data-scrivito-display-mode="editing"] [data-scrivito-field-type="linklist"] ul li input:first-child {
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li input:first-child {
   border-radius: 0 5px 0 0;
   border-top-width: 0px;
 }
+
+/* micro clearfix */
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li:before,
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li:after {
+  content: " ";
+  display: table;
+}
+
+.scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li:after {
+  clear: both;
+}
+
+
+@media (max-width: 550px) {
+  .scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .actions {
+    position: static;
+    float: right;
+  }
+
+  .scrivito_editors_ui[data-scrivito-field-type="linklist"] ul li .actions .editing-button {
+    margin: 4px 0 0 0;
+  }
+}

data/vendor/assets/javascripts/medium-editor.js

@@ -385,7 +385,8 @@ if (!("classList" in document.createElement("_"))) {
 
 (function (root, factory) {
     'use strict';
-    if (typeof module === 'object') {
+    var isElectron = typeof module === 'object' && process && process.versions && process.versions.electron;
+    if (!isElectron && typeof module === 'object') {
         module.exports = factory;
     } else if (typeof define === 'function' && define.amd) {
         define(function () {
@@ -1653,6 +1654,19 @@ MediumEditor.extensions = {};
          */
         setInactive: undefined,
 
+        /* getInteractionElements: [function ()]
+         *
+         * If the extension renders any elements that the user can interact with,
+         * this method should be implemented and return the root element or an array
+         * containing all of the root elements. MediumEditor will call this function
+         * during interaction to see if the user clicked on something outside of the editor.
+         * The elements are used to check if the target element of a click or
+         * other user event is a descendant of any extension elements.
+         * This way, the editor can also count user interaction within editor elements as
+         * interactions with the editor, and thus not trigger 'blur'
+         */
+        getInteractionElements: undefined,
+
         /************************ Helpers ************************
          * The following are helpers that are either set by MediumEditor
          * during initialization, or are helper methods which either
@@ -2416,6 +2430,26 @@ MediumEditor.extensions = {};
 (function () {
     'use strict';
 
+    function isElementDescendantOfExtension(extensions, element) {
+        return extensions.some(function (extension) {
+            if (typeof extension.getInteractionElements !== 'function') {
+                return false;
+            }
+
+            var extensionElements = extension.getInteractionElements();
+            if (!extensionElements) {
+                return false;
+            }
+
+            if (!Array.isArray(extensionElements)) {
+                extensionElements = [extensionElements];
+            }
+            return extensionElements.some(function (el) {
+                return MediumEditor.util.isDescendant(el, element, true);
+            });
+        });
+    }
+
     var Events = function (instance) {
         this.base = instance;
         this.options = this.base.options;
@@ -2755,6 +2789,8 @@ MediumEditor.extensions = {};
                     // Detecting drop on the contenteditables
                     this.attachToEachElement('drop', this.handleDrop);
                     break;
+                // TODO: We need to have a custom 'paste' event separate from 'editablePaste'
+                // Need to think about the way to introduce this without breaking folks
                 case 'editablePaste':
                     // Detecting paste on the contenteditables
                     this.attachToEachElement('paste', this.handlePaste);
@@ -2792,21 +2828,16 @@ MediumEditor.extensions = {};
         },
 
         updateFocus: function (target, eventObj) {
-            var toolbar = this.base.getExtensionByName('toolbar'),
-                toolbarEl = toolbar ? toolbar.getToolbarElement() : null,
-                anchorPreview = this.base.getExtensionByName('anchor-preview'),
-                previewEl = (anchorPreview && anchorPreview.getPreviewElement) ? anchorPreview.getPreviewElement() : null,
-                hadFocus = this.base.getFocusedElement(),
+            var hadFocus = this.base.getFocusedElement(),
                 toFocus;
 
-            // For clicks, we need to know if the mousedown that caused the click happened inside the existing focused element.
-            // If so, we don't want to focus another element
+            // For clicks, we need to know if the mousedown that caused the click happened inside the existing focused element
+            // or one of the extension elements.  If so, we don't want to focus another element
             if (hadFocus &&
                     eventObj.type === 'click' &&
                     this.lastMousedownTarget &&
                     (MediumEditor.util.isDescendant(hadFocus, this.lastMousedownTarget, true) ||
-                     MediumEditor.util.isDescendant(toolbarEl, this.lastMousedownTarget, true) ||
-                     MediumEditor.util.isDescendant(previewEl, this.lastMousedownTarget, true))) {
+                     isElementDescendantOfExtension(this.base.extensions, this.lastMousedownTarget))) {
                 toFocus = hadFocus;
             }
 
@@ -2822,10 +2853,9 @@ MediumEditor.extensions = {};
                 }, this);
             }
 
-            // Check if the target is external (not part of the editor, toolbar, or anchorpreview)
+            // Check if the target is external (not part of the editor, toolbar, or any other extension)
             var externalEvent = !MediumEditor.util.isDescendant(hadFocus, target, true) &&
-                                !MediumEditor.util.isDescendant(toolbarEl, target, true) &&
-                                !MediumEditor.util.isDescendant(previewEl, target, true);
+                                !isElementDescendantOfExtension(this.base.extensions, target);
 
             if (toFocus !== hadFocus) {
                 // If element has focus, and focus is going outside of editor
@@ -3948,6 +3978,11 @@ MediumEditor.extensions = {};
          */
         showWhenToolbarIsVisible: false,
 
+        /* showOnEmptyLinks: [boolean]
+        * determines whether the anchor tag preview shows up on links with href="" or href="#something"
+        */
+        showOnEmptyLinks: true,
+
         init: function () {
             this.anchorPreview = this.createPreview();
 
@@ -3956,6 +3991,11 @@ MediumEditor.extensions = {};
             this.attachToEditables();
         },
 
+        getInteractionElements: function () {
+            return this.getPreviewElement();
+        },
+
+        // TODO: Remove this function in 6.0.0
         getPreviewElement: function () {
             return this.anchorPreview;
         },
@@ -4077,7 +4117,7 @@ MediumEditor.extensions = {};
                 this.base.delay(function () {
                     if (activeAnchor) {
                         var opts = {
-                            url: activeAnchor.attributes.href.value,
+                            value: activeAnchor.attributes.href.value,
                             target: activeAnchor.getAttribute('target'),
                             buttonClass: activeAnchor.getAttribute('class')
                         };
@@ -4106,7 +4146,8 @@ MediumEditor.extensions = {};
             // Detect empty href attributes
             // The browser will make href="" or href="#top"
             // into absolute urls when accessed as event.target.href, so check the html
-            if (!/href=["']\S+["']/.test(target.outerHTML) || /href=["']#\S+["']/.test(target.outerHTML)) {
+            if (!this.showOnEmptyLinks &&
+                (!/href=["']\S+["']/.test(target.outerHTML) || /href=["']#\S+["']/.test(target.outerHTML))) {
                 return true;
             }
 
@@ -5133,11 +5174,20 @@ MediumEditor.extensions = {};
             MediumEditor.Extension.prototype.init.apply(this, arguments);
 
             if (this.forcePlainText || this.cleanPastedHTML) {
-                this.subscribe('editablePaste', this.handlePaste.bind(this));
                 this.subscribe('editableKeydown', this.handleKeydown.bind(this));
+                // We need access to the full event data in paste
+                // so we can't use the editablePaste event here
+                this.getEditorElements().forEach(function (element) {
+                    this.on(element, 'paste', this.handlePaste.bind(this));
+                }, this);
+                this.subscribe('addElement', this.handleAddElement.bind(this));
             }
         },
 
+        handleAddElement: function (event, editable) {
+            this.on(editable, 'paste', this.handlePaste.bind(this));
+        },
+
         destroy: function () {
             // Make sure pastebin is destroyed in case it's still around for some reason
             if (this.forcePlainText || this.cleanPastedHTML) {
@@ -5214,6 +5264,12 @@ MediumEditor.extensions = {};
                 event.preventDefault();
                 this.removePasteBin();
                 this.doPaste(pastedHTML, pastedPlain, editable);
+
+                // The event handling code listens for paste on the editable element
+                // in order to trigger the editablePaste event.  Since this paste event
+                // is happening on the pastebin, the event handling code never knows about it
+                // So, we have to trigger editablePaste manually
+                this.trigger('editablePaste', { currentTarget: editable, target: editable }, editable);
                 return;
             }
 
@@ -5231,6 +5287,12 @@ MediumEditor.extensions = {};
 
                 // Handle the paste with the html from the paste bin
                 this.doPaste(pastedHTML, pastedPlain, editable);
+
+                // The event handling code listens for paste on the editable element
+                // in order to trigger the editablePaste event.  Since this paste event
+                // is happening on the pastebin, the event handling code never knows about it
+                // So, we have to trigger editablePaste manually
+                this.trigger('editablePaste', { currentTarget: editable, target: editable }, editable);
             }.bind(this), 0);
         },
 
@@ -5523,37 +5585,61 @@ MediumEditor.extensions = {};
         },
 
         initPlaceholders: function () {
-            this.getEditorElements().forEach(function (el) {
-                if (!el.getAttribute('data-placeholder')) {
-                    el.setAttribute('data-placeholder', this.text);
-                }
-                this.updatePlaceholder(el);
-            }, this);
+            this.getEditorElements().forEach(this.initElement, this);
+        },
+
+        handleAddElement: function (event, editable) {
+            this.initElement(editable);
+        },
+
+        initElement: function (el) {
+            if (!el.getAttribute('data-placeholder')) {
+                el.setAttribute('data-placeholder', this.text);
+            }
+            this.updatePlaceholder(el);
         },
 
         destroy: function () {
-            this.getEditorElements().forEach(function (el) {
-                if (el.getAttribute('data-placeholder') === this.text) {
-                    el.removeAttribute('data-placeholder');
-                }
-            }, this);
+            this.getEditorElements().forEach(this.cleanupElement, this);
+        },
+
+        handleRemoveElement: function (event, editable) {
+            this.cleanupElement(editable);
+        },
+
+        cleanupElement: function (el) {
+            if (el.getAttribute('data-placeholder') === this.text) {
+                el.removeAttribute('data-placeholder');
+            }
         },
 
         showPlaceholder: function (el) {
             if (el) {
-                el.classList.add('medium-editor-placeholder');
+                // https://github.com/yabwe/medium-editor/issues/234
+                // In firefox, styling the placeholder with an absolutely positioned
+                // pseudo element causes the cursor to appear in a bad location
+                // when the element is completely empty, so apply a different class to
+                // style it with a relatively positioned pseudo element
+                if (MediumEditor.util.isFF && el.childNodes.length === 0) {
+                    el.classList.add('medium-editor-placeholder-relative');
+                    el.classList.remove('medium-editor-placeholder');
+                } else {
+                    el.classList.add('medium-editor-placeholder');
+                    el.classList.remove('medium-editor-placeholder-relative');
+                }
             }
         },
 
         hidePlaceholder: function (el) {
             if (el) {
                 el.classList.remove('medium-editor-placeholder');
+                el.classList.remove('medium-editor-placeholder-relative');
             }
         },
 
         updatePlaceholder: function (el, dontShow) {
             // If the element has content, hide the placeholder
-            if (el.querySelector('img, blockquote, ul, ol') || (el.textContent.replace(/^\s+|\s+$/g, '') !== '')) {
+            if (el.querySelector('img, blockquote, ul, ol, table') || (el.textContent.replace(/^\s+|\s+$/g, '') !== '')) {
                 return this.hidePlaceholder(el);
             }
 
@@ -5573,6 +5659,10 @@ MediumEditor.extensions = {};
 
             // When the editor loses focus, check if the placeholder should be visible
             this.subscribe('blur', this.handleBlur.bind(this));
+
+            // Need to know when elements are added/removed from the editor
+            this.subscribe('addElement', this.handleAddElement.bind(this));
+            this.subscribe('removeElement', this.handleRemoveElement.bind(this));
         },
 
         handleInput: function (event, element) {
@@ -5789,6 +5879,10 @@ MediumEditor.extensions = {};
 
         // Toolbar accessors
 
+        getInteractionElements: function () {
+            return this.getToolbarElement();
+        },
+
         getToolbarElement: function () {
             if (!this.toolbar) {
                 this.toolbar = this.createToolbar();
@@ -6642,17 +6736,17 @@ MediumEditor.extensions = {};
         return !this.options.extensions['imageDragging'];
     }
 
-    function createContentEditable(textarea, id, doc) {
-        var div = doc.createElement('div'),
+    function createContentEditable(textarea) {
+        var div = this.options.ownerDocument.createElement('div'),
             now = Date.now(),
-            uniqueId = 'medium-editor-' + now + '-' + id,
+            uniqueId = 'medium-editor-' + now,
             atts = textarea.attributes;
 
         // Some browsers can move pretty fast, since we're using a timestamp
         // to make a unique-id, ensure that the id is actually unique on the page
-        while (doc.getElementById(uniqueId)) {
+        while (this.options.ownerDocument.getElementById(uniqueId)) {
             now++;
-            uniqueId = 'medium-editor-' + now + '-' + id;
+            uniqueId = 'medium-editor-' + now;
         }
 
         div.className = textarea.className;
@@ -6669,6 +6763,16 @@ MediumEditor.extensions = {};
             }
         }
 
+        // If textarea has a form, listen for reset on the form to clear
+        // the content of the created div
+        if (textarea.form) {
+            this.on(textarea.form, 'reset', function (event) {
+                if (!event.defaultPrevented) {
+                    this.resetContent(this.options.ownerDocument.getElementById(uniqueId));
+                }
+            }.bind(this));
+        }
+
         textarea.classList.add('medium-editor-hidden');
         textarea.parentNode.insertBefore(
             div,
@@ -6678,10 +6782,10 @@ MediumEditor.extensions = {};
         return div;
     }
 
-    function initElement(element, id) {
+    function initElement(element, editorId) {
         if (!element.getAttribute('data-medium-editor-element')) {
             if (element.nodeName.toLowerCase() === 'textarea') {
-                element = createContentEditable(element, id, this.options.ownerDocument);
+                element = createContentEditable.call(this, element);
 
                 // Make sure we only attach to editableInput once for <textarea> elements
                 if (!this.instanceHandleEditableInput) {
@@ -6709,10 +6813,18 @@ MediumEditor.extensions = {};
                 this.on(element, 'keyup', handleKeyup.bind(this));
             }
 
+            var elementId = MediumEditor.util.guid();
+
             element.setAttribute('data-medium-editor-element', true);
+            element.classList.add('medium-editor-element');
             element.setAttribute('role', 'textbox');
             element.setAttribute('aria-multiline', true);
-            element.setAttribute('medium-editor-index', MediumEditor.util.guid());
+            element.setAttribute('data-medium-editor-editor-index', editorId);
+            // TODO: Merge data-medium-editor-element and medium-editor-index attributes for 6.0.0
+            // medium-editor-index is not named correctly anymore and can be re-purposed to signify
+            // whether the element has been initialized or not
+            element.setAttribute('medium-editor-index', elementId);
+            initialContent[elementId] = element.innerHTML;
 
             this.events.attachAllEventsToElement(element);
         }
@@ -6931,6 +7043,8 @@ MediumEditor.extensions = {};
         }
     }
 
+    var initialContent = {};
+
     MediumEditor.prototype = {
         // NOT DOCUMENTED - exposed for backwards compatability
         init: function (elements, options) {
@@ -6949,6 +7063,7 @@ MediumEditor.extensions = {};
                 return;
             }
 
+            addToEditors.call(this, this.options.contentWindow);
             this.events = new MediumEditor.Events(this);
             this.elements = [];
 
@@ -6959,7 +7074,6 @@ MediumEditor.extensions = {};
             }
 
             this.isActive = true;
-            addToEditors.call(this, this.options.contentWindow);
 
             // Call initialization helpers
             initExtensions.call(this);
@@ -6991,9 +7105,11 @@ MediumEditor.extensions = {};
                 element.removeAttribute('contentEditable');
                 element.removeAttribute('spellcheck');
                 element.removeAttribute('data-medium-editor-element');
+                element.classList.remove('medium-editor-element');
                 element.removeAttribute('role');
                 element.removeAttribute('aria-multiline');
                 element.removeAttribute('medium-editor-index');
+                element.removeAttribute('data-medium-editor-editor-index');
 
                 // Remove any elements created for textareas
                 if (element.getAttribute('medium-editor-textarea-id')) {
@@ -7452,11 +7568,38 @@ MediumEditor.extensions = {};
             }
         },
 
+        getContent: function (index) {
+            index = index || 0;
+
+            if (this.elements[index]) {
+                return this.elements[index].innerHTML.trim();
+            }
+            return null;
+        },
+
         checkContentChanged: function (editable) {
             editable = editable || MediumEditor.selection.getSelectionElement(this.options.contentWindow);
             this.events.updateInput(editable, { target: editable, currentTarget: editable });
         },
 
+        resetContent: function (element) {
+            // For all elements that exist in the this.elements array, we can assume:
+            // - Its initial content has been set in the initialContent object
+            // - It has a medium-editor-index attribute which is the key value in the initialContent object
+
+            if (element) {
+                var index = this.elements.indexOf(element);
+                if (index !== -1) {
+                    this.setContent(initialContent[element.getAttribute('medium-editor-index')], index);
+                }
+                return;
+            }
+
+            this.elements.forEach(function (el, idx) {
+                this.setContent(initialContent[el.getAttribute('medium-editor-index')], idx);
+            }, this);
+        },
+
         addElements: function (selector) {
             // Convert elements into an array
             var elements = createElementsArray(selector, this.options.ownerDocument, true);
@@ -7468,10 +7611,13 @@ MediumEditor.extensions = {};
 
             elements.forEach(function (element) {
                 // Initialize all new elements (we check that in those functions don't worry)
-                element = initElement.call(this, element);
+                element = initElement.call(this, element, this.id);
 
                 // Add new elements to our internal elements array
                 this.elements.push(element);
+
+                // Trigger event so extensions can know when an element has been added
+                this.trigger('addElement', { target: element, currentTarget: element }, element);
             }, this);
         },
 
@@ -7494,12 +7640,23 @@ MediumEditor.extensions = {};
                     if (element.getAttribute('medium-editor-textarea-id')) {
                         cleanupTextareaElement(element);
                     }
+                    // Trigger event so extensions can clean-up elements that are being removed
+                    this.trigger('removeElement', { target: element, currentTarget: element }, element);
                     return false;
                 }
                 return true;
             }, this);
         }
     };
+
+    MediumEditor.getEditorFromElement = function (element) {
+        var index = element.getAttribute('data-medium-editor-editor-index'),
+            win = element && element.ownerDocument && (element.ownerDocument.defaultView || element.ownerDocument.parentWindow);
+        if (win && win._mediumEditors && win._mediumEditors[index]) {
+            return win._mediumEditors[index];
+        }
+        return null;
+    };
 }());
 
 (function () {
@@ -7540,7 +7697,7 @@ MediumEditor.parseVersionString = function (release) {
 
 MediumEditor.version = MediumEditor.parseVersionString.call(this, ({
     // grunt-bump looks for this:
-    'version': '5.18.0'
+    'version': '5.21.0'
 }).version);
 
     return MediumEditor;

data/vendor/assets/stylesheets/medium-editor.css

@@ -86,13 +86,23 @@
   .medium-editor-placeholder:after {
     content: attr(data-placeholder) !important;
     font-style: italic;
-    left: 0;
     position: absolute;
+    left: 0;
     top: 0;
     white-space: pre;
     padding: inherit;
     margin: inherit; }
 
+.medium-editor-placeholder-relative {
+  position: relative; }
+  .medium-editor-placeholder-relative:after {
+    content: attr(data-placeholder) !important;
+    font-style: italic;
+    position: relative;
+    white-space: pre;
+    padding: inherit;
+    margin: inherit; }
+
 .medium-toolbar-arrow-under:after, .medium-toolbar-arrow-over:before {
   border-style: solid;
   content: '';
@@ -206,14 +216,14 @@
   content: "";
   display: table; }
 
-[data-medium-editor-element] {
+.medium-editor-element {
   word-wrap: break-word;
   min-height: 30px; }
-  [data-medium-editor-element] img {
+  .medium-editor-element img {
     max-width: 100%; }
-  [data-medium-editor-element] sub {
+  .medium-editor-element sub {
     vertical-align: sub; }
-  [data-medium-editor-element] sup {
+  .medium-editor-element sup {
     vertical-align: super; }
 
 .medium-editor-hidden {

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: scrivito_editors
 version: !ruby/object:Gem::Version
-  version: 1.4.3
+  version: 1.5.0.rc1
 platform: ruby
 authors:
 - Scrivito
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2016-12-14 00:00:00.000000000 Z
+date: 2016-07-11 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jquery-ui-rails
@@ -17,9 +17,6 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: 5.0.0
-    - - "<"
-      - !ruby/object:Gem::Version
-        version: 7.0.0
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
@@ -27,9 +24,6 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: 5.0.0
-    - - "<"
-      - !ruby/object:Gem::Version
-        version: 7.0.0
 - !ruby/object:Gem::Dependency
   name: railties
   requirement: !ruby/object:Gem::Requirement
@@ -50,28 +44,28 @@ dependencies:
     requirements:
     - - '='
       - !ruby/object:Gem::Version
-        version: 1.4.3
+        version: 1.5.0.rc1
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - '='
       - !ruby/object:Gem::Version
-        version: 1.4.3
+        version: 1.5.0.rc1
 - !ruby/object:Gem::Dependency
   name: scrivito_sdk
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - '='
       - !ruby/object:Gem::Version
-        version: 1.4.3
+        version: 1.5.0.rc1
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - '='
       - !ruby/object:Gem::Version
-        version: 1.4.3
+        version: 1.5.0.rc1
 - !ruby/object:Gem::Dependency
   name: coffee-rails
   requirement: !ruby/object:Gem::Requirement
@@ -172,7 +166,6 @@ files:
 - app/assets/javascripts/scrivito_editors/binary_editor.js
 - app/assets/javascripts/scrivito_editors/date_editor.js
 - app/assets/javascripts/scrivito_editors/default_editor.js
-- app/assets/javascripts/scrivito_editors/dependencies/jquery_ui.js.erb
 - app/assets/javascripts/scrivito_editors/deprecated_data_attrs.js
 - app/assets/javascripts/scrivito_editors/enum_editor.js
 - app/assets/javascripts/scrivito_editors/filter_context.js
@@ -183,6 +176,7 @@ files:
 - app/assets/javascripts/scrivito_editors/image_drop_editor.js
 - app/assets/javascripts/scrivito_editors/image_editor.js
 - app/assets/javascripts/scrivito_editors/link_editor.js
+- app/assets/javascripts/scrivito_editors/link_target_editing.js
 - app/assets/javascripts/scrivito_editors/linklist_editor.js
 - app/assets/javascripts/scrivito_editors/medium_editor.js
 - app/assets/javascripts/scrivito_editors/multienum_editor.js

data/app/assets/javascripts/scrivito_editors/dependencies/jquery_ui.js.erb

@@ -1,11 +0,0 @@
-<% if Jquery::Ui::Rails::VERSION < "6" %>
-  <% require_asset "jquery-ui/autocomplete" %>
-  <% require_asset "jquery-ui/datepicker" %>
-  <% require_asset "jquery-ui/slider" %>
-  <% require_asset "jquery-ui/sortable" %>
-<% else %>
-  <% require_asset "jquery-ui/widgets/autocomplete" %>
-  <% require_asset "jquery-ui/widgets/datepicker" %>
-  <% require_asset "jquery-ui/widgets/slider" %>
-  <% require_asset "jquery-ui/widgets/sortable" %>
-<% end %>