kiteditor 1.0.11 → 1.0.12

data/POST_INSTALL

@@ -0,0 +1,21 @@
++============================================================================+
+Congratulations, Mercury was successfully installed in your app. Documentation
+and other useful info can be found at: https://github.com/jejacks0n/mercury
+
+Here's a post install checklist:
+
+* Adjust your application.js & css files to not `require_tree .`
+
+* Learn about, and change configurations in app/assets/javascripts/mercury.js.
+
+* If installed, you can make changes to the provided layout and css files too.
+
+* If you want image processing and uploading (using paperclip by default):
+
+  rails g mercury:install:images (use --orm=mongoid for MongoDB)
+  bundle
+  rake db:migrate (if using ActiveRecord)
+
+* For a basic example of authentication for Mercury, install the example:
+
+  rails g mercury:install:authentication

data/{vendor → app}/assets/javascripts/mercury.js

@@ -2,40 +2,14 @@
  * Mercury Editor is a CoffeeScript and jQuery based WYSIWYG editor.  Documentation and other useful information can be
  * found at https://github.com/jejacks0n/mercury
  *
- * Supported browsers:
- *   - Firefox 4+
- *   - Chrome 10+
- *   - Safari 5+
- *
- * Copyright (c) 2011 Jeremy Jackson
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
- * documentation files (the "Software"), to deal in the Software without restriction, including without limitation the
- * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit
- * persons to whom the Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the
- * Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
- * WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
- * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- *= require_self
- *
  * Minimum jQuery requirements are 1.7
- *= require mercury/dependencies/jquery-1.7
+ *= require_self
  *
  * You can include the Rails jQuery ujs script here to get some nicer behaviors in modals, panels and lightviews when
  * using :remote => true within the contents rendered in them.
  * require jquery_ujs
  *
- * If you want to override Mercury functionality, you can do so in a custom file that binds to the mercury:loaded event,
- * or do so at the end of the current file (mercury.js).  There's an example that will help you get started.
- * require mercury_overrides
- *
- * Add all requires for the support libraries that integrate nicely with Mercury Editor.
+ * Add any requires for the support libraries that integrate nicely with Mercury Editor.
  * require mercury/support/history
  *
  * Require Mercury Editor itself.
@@ -43,10 +17,14 @@
  *
  * Require any localizations you wish to support
  * Example: es.locale, or fr.locale -- regional dialects are in each language file so never en_US for instance.
+ * Make sure you enable the localization feature in the configuration.
  * require mercury/locales/swedish_chef.locale
  *
  * Add all requires for plugins that extend or change the behavior of Mercury Editor.
  * require mercury/plugins/save_as_xml/plugin.js
+ *
+ * Require any files you want to use that either extend, or change the default Mercury behavior.
+ * require mercury_overrides
  */
 window.Mercury = {
 
@@ -58,16 +36,16 @@ window.Mercury = {
     // behaviors.  Any top level object put here will create a new toolbar.  Buttons are simply nested inside the
     // toolbars, along with button groups.
     //
-    // Some toolbars are custom (the snippetable toolbar for instance), and to denote that use _custom: true.  You can
-    // then build the toolbar yourself with it's own behavior.
+    // Some toolbars are custom (the snippets toolbar for instance), and to denote that use _custom: true.  You can then
+    // build the toolbar yourself with it's own behavior.
     //
     // Buttons can be grouped, and a button group is simply a way to wrap buttons for styling -- they can also handle
-    // enabling or disabling all the buttons within it by using a context.  The table button group is a good example
-    // of this.
+    // enabling or disabling all the buttons within it by using a context.  The table button group is a good example of
+    // this.
     //
-    // It's important to note that each of the button names (keys), in each toolbar object must be unique, regardless
-    // of if it's in a button group, or nested, etc.  This is because styling is applied to them by name, and because
-    // their name is used in the event that's fired when you click on them.
+    // It's important to note that each of the button names (keys), in each toolbar object must be unique, regardless of
+    // if it's in a button group, or nested, etc.  This is because styling is applied to them by name, and because their
+    // name is used in the event that's fired when you click on them.
     //
     // Button format: `[label, description, {type: action, type: action, etc}]`
     //
@@ -97,8 +75,8 @@ window.Mercury = {
     //   1. a string, denoting the name of the mode
     //   note: it's assumed that when a specific mode is turned on, all other modes will be turned off, which happens
     //         automatically, thus putting the editor into a specific "state"
-    // - regions:   allows buttons to be enabled/disabled based on what region type has focus, expects the action to be:
-    //   1. an array of region types (eg. ['editable', 'markupable'])
+    // - regions:   allows buttons to be enabled/disabled based on what region type has focus, expects:
+    //   1. an array of region types (eg. ['full', 'markdown'])
     // - preload:   allows some dialog views to be loaded when the button is created instead of on first open, expects:
     //   1. a boolean true / false
     //   note: this is only used by panels, selects, and palettes
@@ -122,10 +100,10 @@ window.Mercury = {
           redo:                ['Redo', 'Redo your last action'],
           sep:                 ' '
           },
-        insertLink:            ['Link', 'Insert Link', { modal: '/mercury/modals/link.html', regions: ['editable', 'markupable'] }],
-        insertMedia:           ['Media', 'Insert Media (images and videos)', { modal: '/mercury/modals/media.html', regions: ['editable', 'markupable'] }],
-        insertTable:           ['Table', 'Insert Table', { modal: '/mercury/modals/table.html', regions: ['editable', 'markupable'] }],
-        insertCharacter:       ['Character', 'Special Characters', { modal: '/mercury/modals/character.html', regions: ['editable', 'markupable'] }],
+        insertLink:            ['Link', 'Insert Link', { modal: '/mercury/modals/link.html', regions: ['full', 'markdown'] }],
+        insertMedia:           ['Media', 'Insert Media (images and videos)', { modal: '/mercury/modals/media.html', regions: ['full', 'markdown'] }],
+        insertTable:           ['Table', 'Insert Table', { modal: '/mercury/modals/table.html', regions: ['full', 'markdown'] }],
+        insertCharacter:       ['Character', 'Special Characters', { modal: '/mercury/modals/character.html', regions: ['full', 'markdown'] }],
         snippetPanel:          ['Snippet', 'Snippet Panel', { panel: '/mercury/panels/snippets.html' }],
         sep2:                  ' ',
         historyPanel:          ['History', 'Page Version History', { panel: '/mercury/panels/history.html' }],
@@ -134,7 +112,7 @@ window.Mercury = {
         },
 
       editable: {
-        _regions:              ['editable', 'markupable'],
+        _regions:              ['full', 'markdown'],
         predefined:            {
           style:               ['Style', null, { select: '/mercury/selects/style.html', preload: true }],
           sep1:                ' ',
@@ -142,17 +120,17 @@ window.Mercury = {
           sep2:                '-'
           },
         colors:                {
-          backColor:           ['Background Color', null, { palette: '/mercury/palettes/backcolor.html', context: true, preload: true, regions: ['editable'] }],
+          backColor:           ['Background Color', null, { palette: '/mercury/palettes/backcolor.html', context: true, preload: true, regions: ['full'] }],
           sep1:                ' ',
-          foreColor:           ['Text Color', null, { palette: '/mercury/palettes/forecolor.html', context: true, preload: true, regions: ['editable'] }],
+          foreColor:           ['Text Color', null, { palette: '/mercury/palettes/forecolor.html', context: true, preload: true, regions: ['full'] }],
           sep2:                '-'
           },
         decoration:            {
           bold:                ['Bold', null, { context: true }],
           italic:              ['Italicize', null, { context: true }],
-          overline:            ['Overline', null, { context: true, regions: ['editable'] }],
-          strikethrough:       ['Strikethrough', null, { context: true, regions: ['editable'] }],
-          underline:           ['Underline', null, { context: true, regions: ['editable'] }],
+          overline:            ['Overline', null, { context: true, regions: ['full'] }],
+          strikethrough:       ['Strikethrough', null, { context: true, regions: ['full'] }],
+          underline:           ['Underline', null, { context: true, regions: ['full'] }],
           sep:                 '-'
           },
         script:                {
@@ -161,10 +139,10 @@ window.Mercury = {
           sep: '-'
           },
         justify:               {
-          justifyLeft:         ['Align Left', null, { context: true, regions: ['editable'] }],
-          justifyCenter:       ['Center', null, { context: true, regions: ['editable'] }],
-          justifyRight:        ['Align Right', null, { context: true, regions: ['editable'] }],
-          justifyFull:         ['Justify Full', null, { context: true, regions: ['editable'] }],
+          justifyLeft:         ['Align Left', null, { context: true, regions: ['full'] }],
+          justifyCenter:       ['Center', null, { context: true, regions: ['full'] }],
+          justifyRight:        ['Align Right', null, { context: true, regions: ['full'] }],
+          justifyFull:         ['Justify Full', null, { context: true, regions: ['full'] }],
           sep:                 '-'
           },
         list:                  {
@@ -179,12 +157,12 @@ window.Mercury = {
           },
         table:                 {
           _context:            true,
-          insertRowBefore:     ['Insert Table Row', 'Insert a table row before the cursor', { regions: ['editable'] }],
-          insertRowAfter:      ['Insert Table Row', 'Insert a table row after the cursor', { regions: ['editable'] }],
-          deleteRow:           ['Delete Table Row', 'Delete this table row', { regions: ['editable'] }],
-          insertColumnBefore:  ['Insert Table Column', 'Insert a table column before the cursor', { regions: ['editable'] }],
-          insertColumnAfter:   ['Insert Table Column', 'Insert a table column after the cursor', { regions: ['editable'] }],
-          deleteColumn:        ['Delete Table Column', 'Delete this table column', { regions: ['editable'] }],
+          insertRowBefore:     ['Insert Table Row', 'Insert a table row before the cursor', { regions: ['full'] }],
+          insertRowAfter:      ['Insert Table Row', 'Insert a table row after the cursor', { regions: ['full'] }],
+          deleteRow:           ['Delete Table Row', 'Delete this table row', { regions: ['full'] }],
+          insertColumnBefore:  ['Insert Table Column', 'Insert a table column before the cursor', { regions: ['full'] }],
+          insertColumnAfter:   ['Insert Table Column', 'Insert a table column after the cursor', { regions: ['full'] }],
+          deleteColumn:        ['Delete Table Column', 'Delete this table column', { regions: ['full'] }],
           sep1:                ' ',
           increaseColspan:     ['Increase Cell Columns', 'Increase the cells colspan'],
           decreaseColspan:     ['Decrease Cell Columns', 'Decrease the cells colspan and add a new cell'],
@@ -197,15 +175,15 @@ window.Mercury = {
           sep1:                '-'
           },
         formatting:            {
-          removeFormatting:    ['Remove Formatting', 'Remove formatting for the selection', { regions: ['editable'] }],
+          removeFormatting:    ['Remove Formatting', 'Remove formatting for the selection', { regions: ['full'] }],
           sep2:                ' '
           },
         editors:               {
-          htmlEditor:          ['Edit HTML', 'Edit the HTML content', { regions: ['editable'] }]
+          htmlEditor:          ['Edit HTML', 'Edit the HTML content', { regions: ['full'] }]
           }
         },
 
-      snippetable: {
+      snippets: {
         _custom:               true,
         actions:               {
           editSnippet:         ['Edit Snippet Settings'],
@@ -220,28 +198,27 @@ window.Mercury = {
     //
     // You can customize some aspects of how regions are found, identified, and saved.
     //
-    // className: Mercury identifies editable regions by a className.  This classname has to be added in your HTML in
-    // advance, and is the only real code/naming exposed in the implementation of Mercury.  To allow this to be as
-    // configurable as possible, you can set the name of the class.  When switching to preview mode, this configuration
-    // is also used to generate a class to indicate that Mercury is in preview mode by appending it with '-preview' (so
-    // by default it would be mercury-region-preview)
+    // attribute: Mercury identifies editable regions by a data-mercury attribute.  This attribute has to be added in
+    // your HTML in advance, and is the only real code/naming exposed in the implementation of Mercury.  To allow this
+    // to be as configurable as possible, you can set the name of this attribute.  If you change this, you should adjust
+    // the injected styles as well.
     //
     // identifier: This is used as a unique identifier for any given region (and thus should be unique to the page).
     // By default this is the id attribute but can be changed to a data attribute should you want to use something
     // custom instead.
     //
-    // determineType: This function is called after checking the data-type attribute for the correct field type. Use
-    // it if you want to programatically set the type based on inspection of the region.
-    //
     // dataAttributes: The dataAttributes is an array of data attributes that will be serialized and returned to the
     // server upon saving.  These attributes, when applied to a Mercury region element, will be automatically serialized
     // and submitted with the AJAX request sent when a page is saved.  These are expected to be HTML5 data attributes,
     // and 'data-' will automatically be prepended to each item in this directive. (ex. ['scope', 'version'])
+    //
+    // determineType: This function is called after checking the data-type attribute for the correct field type. Use
+    // it if you want to dynamically set the type based on inspection of the region.
     regions: {
-      className: 'mercury-region',
+      attribute: 'data-mercury',
       identifier: 'id',
-      // determineType: function(region){},
       dataAttributes: []
+      // determineType: function(region){},
       },
 
 
@@ -329,7 +306,7 @@ window.Mercury = {
     // If you want to add behaviors to specific region types, you can mix them into the actions property of any region
     // type.
     //
-    //     Mercury.Regions.Editable.actions.htmlEditor = function() {}
+    //     Mercury.Regions.Full.actions.htmlEditor = function() {}
     //
     // You can see how the behavior matches up directly with the button names.  It's also important to note that the
     // callback functions are executed within the scope of the given region, so you have access to all it's methods.
@@ -370,12 +347,14 @@ window.Mercury = {
     csrfSelector: 'meta[name="csrf-token"]',
     csrfHeader: 'X-CSRF-Token',
 
+
     // ## Editor URLs
     //
     // When loading a given page, you may want to tweak this regex.  It's to allow the url to differ from the page
     // you're editing, and the url at which you access it.
     editorUrlRegEx: /([http|https]:\/\/.[^\/]*)\/editor\/?(.*)/i,
 
+
     // ## Hijacking Links & Forms
     //
     // Mercury will hijack links and forms that don't have a target set, or the target is set to _self and will set it
@@ -448,15 +427,16 @@ window.Mercury = {
     // Mercury tries to stay as much out of your code as possible, but because regions appear within your document we
     // need to include a few styles to indicate regions, as well as the different states of them (eg. focused).  These
     // styles are injected into your document, and as simple as they might be, you may want to change them.
-    //
-    // {{regionClass}} will be automatically replaced with whatever you have set in the regions.class config directive.
     injectedStyles: '' +
-      '.{{regionClass}} { min-height: 10px; outline: 1px dotted #09F } ' +
-      '.{{regionClass}}:focus, .{{regionClass}}.focus { outline: none; -webkit-box-shadow: 0 0 10px #09F, 0 0 1px #045; box-shadow: 0 0 10px #09F, 0 0 1px #045 }' +
-      '.{{regionClass}}:after { content: "."; display: block; visibility: hidden; clear: both; height: 0; overflow: hidden; }' +
-      '.{{regionClass}} table, .{{regionClass}} td, .{{regionClass}} th { border: 1px dotted red; min-width: 6px; }' +
-      '.mercury-textarea { border: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; resize: none; }' +
-      '.mercury-textarea:focus { outline: none; }'
+      '[data-mercury]       { min-height: 10px; outline: 1px dotted #09F } ' +
+      '[data-mercury]:focus { outline: none; -webkit-box-shadow: 0 0 10px #09F, 0 0 1px #045; box-shadow: 0 0 10px #09F, 0 0 1px #045 }' +
+      '[data-mercury].focus { outline: none; -webkit-box-shadow: 0 0 10px #09F, 0 0 1px #045; box-shadow: 0 0 10px #09F, 0 0 1px #045 }' +
+      '[data-mercury]:after { content: "."; display: block; visibility: hidden; clear: both; height: 0; overflow: hidden; }' +
+      '[data-mercury] table { border: 1px dotted red; min-width: 6px; }' +
+      '[data-mercury] th    { border: 1px dotted red; min-width: 6px; }' +
+      '[data-mercury] td    { border: 1px dotted red; min-width: 6px; }' +
+      '[data-mercury] .mercury-textarea       { border: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; resize: none; }' +
+      '[data-mercury] .mercury-textarea:focus { outline: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }'
   },
 
   // ## Silent Mode
@@ -467,13 +447,6 @@ window.Mercury = {
   // ## Debug Mode
   //
   // Turning debug mode on will log events and other various things (using console.debug if available).
-  debug: false,
-
-  // The onload method is provided as a callback in case you want to override default Mercury Editor behavior.  It will
-  // be called directly after the Mercury scripts have loaded, but before anything has been initialized.  It's a good
-  // place to add or change functionality.
-  onload: function() {
-    //Mercury.PageEditor.prototype.iframeSrc = function(url) { return '/testing'; }
-  },
+  debug: false
 
 };

data/{vendor → app}/assets/javascripts/mercury/dependencies/jquery.additions.js

@@ -1,23 +1,113 @@
 /*
- * jQuery serializeObject Plugin
+ * jQuery serializeObject Plugin: https://github.com/fojas/jQuery-serializeObject
  *
  */
-(function($) {
-  $.fn.serializeObject = function() {
-    var o = {};
-    var a = this.serializeArray();
-    jQuery.each(a, function() {
-      if (o[this.name] !== undefined) {
-        if (!o[this.name].push) o[this.name] = [o[this.name]];
-        o[this.name].push(this.value || '');
-      } else {
-        o[this.name] = this.value || '';
+!function($){
+  $.serializeObject = function(obj){
+    var o={},lookup=o,a = obj;
+    $.each(a,function(){
+      var named = this.name.replace(/\[([^\]]+)?\]/g,',$1').split(','),
+          cap = named.length - 1,
+          i = 0;
+      for(;i<cap;i++) {
+        // move down the tree - create objects or array if necessary
+        if(lookup.push){ // this is an array, add values instead of setting them
+          // push an object if this is an empty array or we are about to overwrite a value
+          if( !lookup[lookup.length -1] // this is an empty array
+              || lookup[lookup.length -1].constructor !== Object //current value is not a hash
+              || lookup[lookup.length -1][named[i+1]] !== undefined //current item is already set
+              ){
+            lookup.push({});
+          }
+          lookup = lookup[lookup.length -1];
+        } else {
+          lookup = lookup[named[i]] = lookup[named[i]] || (named[i+1]==""?[]:{});
+        }
       }
+      if(lookup.push){
+        lookup.push(this.value);
+      }else{
+        lookup[named[cap]]=this.value;
+      }
+      lookup = o;
     });
     return o;
   };
-})(jQuery);
 
+  $.deserializeObject = function deserializeObject(json,arr,prefix){
+    var i,j,thisPrefix,objType;
+    arr = arr || [];
+    if(Object.prototype.toString.call(json) ==='[object Object]'){
+      for(i in json){
+        thisPrefix = prefix ? [prefix,'[',i,']'].join('') : i;
+        if(json.hasOwnProperty(i)){
+          objType = Object.prototype.toString.call(json[i])
+          if(objType === '[object Array]'){
+            for(j = 0,jsonLen = json[i].length;j<jsonLen;j++){
+              deserializeObject(json[i][j],arr,thisPrefix+'[]');
+            }
+          }else if(objType === '[object Object]'){
+            deserializeObject(json[i],arr,thisPrefix);
+          }else {
+            arr.push({
+              name : thisPrefix,
+              value : json[i]
+            });
+          }
+        }
+      }
+    } else {
+      arr.push({
+        name : prefix,
+        value : json
+      });
+    }
+    return arr;
+  }
+
+  var check = function(){
+    // older versions of jQuery do not have prop
+    var propExists = !!$.fn.prop;
+    return function(obj,checked){
+      if(propExists) obj.prop('checked',checked);
+      else obj.attr('checked', (checked ? 'checked' : null ));
+    };
+  }();
+
+  $.applySerializedArray = function(form,obj){
+    var $form = $(form).find('input,select,textarea'), el;
+    check($form.filter(':checked'),false)
+    for(var i = obj.length;i--;){
+      el = $form.filter("[name='"+obj[i].name+"']");
+      if(el.filter(':checkbox').length){
+        if(el.val() == obj[i].value) check(el.filter(':checkbox'),true);
+      }else if(el.filter(':radio').length){
+        check(el.filter("[value='"+obj[i].value+"']"),true)
+      } else {
+        el.val(obj[i].value);
+      }
+    }
+  };
+
+  $.applySerializedObject = function(form, obj){
+    $.applySerializedArray(form,$.deserializeObject(obj));
+  };
+
+  $.fn.serializeObject = $.fn.serializeObject || function(){
+    return $.serializeObject(this.serializeArray());
+  };
+
+  $.fn.applySerializedObject = function(obj){
+    $.applySerializedObject(this,obj);
+    return this;
+  };
+
+  $.fn.applySerializedArray = function(obj){
+    $.applySerializedArray(this,obj);
+    return this;
+  };
+
+}(jQuery);
 /*
  * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
  *
@@ -203,4 +293,4 @@ jQuery.extend(jQuery.easing, {
       return this;
     });
   };
-})(jQuery);
+})(jQuery);