mercury-rails 0.2.3 → 0.3.1

data/vendor/assets/javascripts/mercury/uploader.js.coffee

@@ -2,7 +2,7 @@
   Mercury.uploader.show(file, options) if Mercury.config.uploading.enabled
   return Mercury.uploader
 
-jQuery.extend Mercury.uploader, {
+jQuery.extend Mercury.uploader,
 
   show: (file, @options = {}) ->
     @file = new Mercury.uploader.File(file)
@@ -40,7 +40,9 @@ jQuery.extend Mercury.uploader, {
     @element = jQuery('<div>', {class: 'mercury-uploader', style: 'display:none'})
     @element.append('<div class="mercury-uploader-preview"><b><img/></b></div>')
     @element.append('<div class="mercury-uploader-details"></div>')
-    @element.append('<div class="mercury-uploader-progress"><span>Processing...</span><div class="mercury-uploader-indicator"><div><b>0%</b></div></div></div>')
+    @element.append('<div class="mercury-uploader-progress"><span></span><div class="mercury-uploader-indicator"><div><b>0%</b></div></div></div>')
+
+    @updateStatus('Processing...')
 
     @overlay = jQuery('<div>', {class: 'mercury-uploader-overlay', style: 'display:none'})
 
@@ -49,7 +51,7 @@ jQuery.extend Mercury.uploader, {
 
 
   bindEvents: ->
-    Mercury.bind 'resize', => @position()
+    Mercury.on 'resize', => @position()
 
 
   appear: ->
@@ -75,7 +77,11 @@ jQuery.extend Mercury.uploader, {
 
 
   fillDisplay: ->
-    details = ["Name: #{@file.name}", "Size: #{@file.readableSize}", "Type: #{@file.type}"]
+    details = [
+      Mercury.I18n('Name: %s', @file.name),
+      Mercury.I18n('Size: %s', @file.readableSize),
+      Mercury.I18n('Type: %s', @file.type)
+    ]
     @element.find('.mercury-uploader-details').html(details.join('<br/>'))
 
 
@@ -92,7 +98,7 @@ jQuery.extend Mercury.uploader, {
     xhr.onload = (event) =>
       if (event.currentTarget.status >= 400)
         @updateStatus('Error: Unable to upload the file')
-        alert("#{event.currentTarget.status}: Unable to process response")
+        Mercury.notify('Unable to process response: %s', event.currentTarget.status)
         @hide()
       else
         try
@@ -101,10 +107,13 @@ jQuery.extend Mercury.uploader, {
               Mercury.config.uploading.handler(event.target.responseText)
             else
               jQuery.parseJSON(event.target.responseText)
-          Mercury.trigger('action', {action: 'insertImage', value: {src: response.image.url}})
+          src = response.url || response.image.url
+          throw 'Malformed response from server.' unless src
+          Mercury.trigger('action', {action: 'insertImage', value: {src: src}})
+          @hide()
         catch error
           @updateStatus('Error: Unable to upload the file')
-          alert("Unable to process response: #{error}")
+          Mercury.notify('Unable to process response: %s', error)
           @hide()
 
     xhr.open('post', Mercury.config.uploading.url, true)
@@ -125,7 +134,7 @@ jQuery.extend Mercury.uploader, {
 
 
   updateStatus: (message, loaded) ->
-    @element.find('.mercury-uploader-progress span').html(message)
+    @element.find('.mercury-uploader-progress span').html(Mercury.I18n(message).toString())
     if loaded
       percent = Math.floor(loaded * 100 / @file.size) + '%'
       @element.find('.mercury-uploader-indicator div').css({width: percent})
@@ -133,7 +142,7 @@ jQuery.extend Mercury.uploader, {
 
 
   hide: (delay = 0) ->
-    setTimeout((=>
+    setTimeout delay * 1000, =>
       @element.animate {opacity: 0}, 200, 'easeInOutSine', =>
         @overlay.animate {opacity: 0}, 200, 'easeInOutSine', =>
           @overlay.hide()
@@ -141,14 +150,13 @@ jQuery.extend Mercury.uploader, {
           @reset()
           @visible = false
           Mercury.trigger('focus:frame')
-    ), delay * 1000)
 
 
   reset: ->
     @element.find('.mercury-uploader-preview b').html('')
     @element.find('.mercury-uploader-indicator div').css({width: 0})
     @element.find('.mercury-uploader-indicator b').html('0%').hide()
-    @updateStatus('Processing...',)
+    @updateStatus('Processing...')
 
 
   uploaderEvents:
@@ -161,13 +169,11 @@ jQuery.extend Mercury.uploader, {
       @hide(1)
 
     onload: ->
-      @updateStatus('Successfully uploaded', @file.size)
-      @hide(1)
+      @updateStatus('Successfully uploaded...', @file.size)
 
     onerror: ->
       @updateStatus('Error: Unable to upload the file')
       @hide(3)
-}
 
 
 
@@ -182,8 +188,8 @@ class Mercury.uploader.File
 
     # add any errors if we need to
     errors = []
-    errors.push('Too large') if @size >= Mercury.config.uploading.maxFileSize
-    errors.push('Unsupported format') unless Mercury.config.uploading.allowedMimeTypes.indexOf(@type) > -1
+    errors.push(Mercury.I18n('Too large')) if @size >= Mercury.config.uploading.maxFileSize
+    errors.push(Mercury.I18n('Unsupported format')) unless Mercury.config.uploading.allowedMimeTypes.indexOf(@type) > -1
     @errors = errors.join(' / ') if errors.length
 
 

data/vendor/assets/javascripts/mercury_loader.js

@@ -99,6 +99,7 @@ if (!window.mercuryPackages) window.mercuryPackages = {
         if (!match || !match[1]) continue;
 
         match[1].replace(/([^&=]*)=([^&=]*)/g, function (m, attr, value) {
+          if (['true', 'false'].indexOf(value) >= 0) value = JSON.parse(value);
           options[attr] = value;
         });
       }
@@ -130,6 +131,7 @@ if (!window.mercuryPackages) window.mercuryPackages = {
           var script = document.createElement('script');
           script.src = options.src + '/' + src;
           script.type = 'text/javascript';
+          script.charset = 'utf-8';
           head.appendChild(script);
           script.onload = function() {
             loaded += 1;

data/vendor/assets/javascripts/mercury_overrides.js

@@ -0,0 +1,6 @@
+/*!
+ * Mercury Editor is a Coffeescript and jQuery based WYSIWYG editor.  Documentation and other useful information can be
+ * found at https://github.com/jejacks0n/mercury
+ *
+ * This file is intended to provide a standard way to override or add JS that comes default with Mercury Editor.
+ */

data/vendor/assets/stylesheets/mercury/all_images.css.erb

@@ -0,0 +1,89 @@
+/*
+ * mercury.css
+ *----------------------------------------------------------------------------*/
+form fieldset.buttons .commit input {
+  background-image: url(<%= asset_path 'mercury/button.png' %>);
+}
+/*
+ * dialog.css
+ *----------------------------------------------------------------------------*/
+.mercury-dialog.loading,
+.mercury-select.loading,
+.mercury-palette.loading {
+  background-image: url(<%= asset_path 'mercury/loading-light.gif' %>);
+}
+.mercury-panel.loading {
+  background-image: url(<%= asset_path 'mercury/loading-dark.gif' %>);
+}
+.mercury-panel h1 a.mercury-panel-close {
+  background-image: url(<%= asset_path 'mercury/close.png' %>);
+}
+.mercury-snippet-panel input.filter {
+  background-image: url(<%= asset_path 'mercury/search-icon.png' %>);
+  background-position: 4px center;
+}
+/*
+ * lightview.css
+ *----------------------------------------------------------------------------*/
+.mercury-lightview.loading {
+  background-image: url(<%= asset_path 'mercury/loading-dark.gif' %>);
+}
+.mercury-lightview h1.mercury-lightview-title a.mercury-lightview-close {
+  background-image: url(<%= asset_path 'mercury/close.png' %>);
+}
+#mercury_about {
+  background-image: url(<%= asset_path 'mercury/temp-logo.png' %>);
+  background-position: 0 0;
+}
+/*
+ * modal.css
+ *----------------------------------------------------------------------------*/
+.mercury-modal.loading .mercury-modal-content-container {
+  background-image: url(<%= asset_path 'mercury/loading-light.gif' %>);
+}
+/*
+ * toolbar.css
+ *----------------------------------------------------------------------------*/
+.mercury-primary-toolbar .mercury-button.pressed {
+  background-image: url(<%= asset_path 'mercury/toolbar/primary/_pressed.png' %>);
+  background-position: top center;
+}
+.mercury-primary-toolbar .mercury-toolbar-expander {
+  background-image: url(<%= asset_path 'mercury/toolbar/primary/_expander.png' %>);
+  background-position: center 90%;
+}
+.mercury-primary-toolbar .mercury-save-button em,
+.mercury-expander-button[data-button=save] em             { background-image: url(<%= asset_path 'mercury/toolbar/primary/save.png' %>) }
+.mercury-primary-toolbar .mercury-preview-button em,
+.mercury-expander-button[data-button=preview] em          { background-image: url(<%= asset_path 'mercury/toolbar/primary/preview.png' %>) }
+.mercury-primary-toolbar .mercury-undo-button em,
+.mercury-expander-button[data-button=undo] em             { background-image: url(<%= asset_path 'mercury/toolbar/primary/undo.png' %>) }
+.mercury-primary-toolbar .mercury-redo-button em,
+.mercury-expander-button[data-button=redo] em             { background-image: url(<%= asset_path 'mercury/toolbar/primary/redo.png' %>) }
+.mercury-primary-toolbar .mercury-insertLink-button em,
+.mercury-expander-button[data-button=insertLink] em       { background-image: url(<%= asset_path 'mercury/toolbar/primary/insertlink.png' %>) }
+.mercury-primary-toolbar .mercury-insertMedia-button em,
+.mercury-expander-button[data-button=insertMedia] em      { background-image: url(<%= asset_path 'mercury/toolbar/primary/insertmedia.png' %>) }
+.mercury-primary-toolbar .mercury-insertTable-button em,
+.mercury-expander-button[data-button=insertTable] em      { background-image: url(<%= asset_path 'mercury/toolbar/primary/inserttable.png' %>) }
+.mercury-primary-toolbar .mercury-insertCharacter-button em,
+.mercury-expander-button[data-button=insertCharacter] em  { background-image: url(<%= asset_path 'mercury/toolbar/primary/insertcharacter.png' %>) }
+.mercury-primary-toolbar .mercury-snippetPanel-button em,
+.mercury-expander-button[data-button=snippetPanel] em     { background-image: url(<%= asset_path 'mercury/toolbar/primary/snippetpanel.png' %>) }
+.mercury-primary-toolbar .mercury-historyPanel-button em,
+.mercury-expander-button[data-button=historyPanel] em     { background-image: url(<%= asset_path 'mercury/toolbar/primary/historypanel.png' %>) }
+.mercury-primary-toolbar .mercury-notesPanel-button em,
+.mercury-expander-button[data-button=notesPanel] em       { background-image: url(<%= asset_path 'mercury/toolbar/primary/notespanel.png' %>) }
+.mercury-editable-toolbar .mercury-button {
+  background-image: url(<%= asset_path 'mercury/toolbar/editable/buttons.png' %>);
+}
+.mercury-editable-toolbar .mercury-button em {
+  background-image: url(<%= asset_path 'mercury/toolbar/editable/buttons.png' %>);
+}
+
+.mercury-snippet-toolbar .mercury-button {
+  background-image: url(<%= asset_path 'mercury/toolbar/snippetable/buttons.png' %>);
+}
+.mercury-snippet-toolbar .mercury-button em {
+  background-image: url(<%= asset_path 'mercury/toolbar/snippetable/buttons.png' %>);
+}

data/vendor/assets/stylesheets/mercury/dialog.css

@@ -24,7 +24,6 @@
 .mercury-dialog.loading,
 .mercury-select.loading,
 .mercury-palette.loading {
-  background-image: url(/assets/mercury/loading-light.gif);
   background-repeat: no-repeat;
   background-position: center;
 }
@@ -55,7 +54,6 @@
   max-width: 500px;
 }
 .mercury-panel.loading {
-  background-image: url(/assets/mercury/loading-dark.gif);
   background-repeat: no-repeat;
   background-position: center;
 }
@@ -80,6 +78,16 @@
   cursor: move;
   text-shadow: 1px 1px 2px rgba(0,0,0, .9);
 }
+.mercury-panel h1 a.mercury-panel-close {
+  position: absolute;
+  right: -5px;
+  top: -4px;
+  width: 42px;
+  height: 42px;
+  cursor: default;
+  background-repeat: no-repeat;
+  background-position: center;
+}
 .mercury-panel h4,
 .mercury-panel h5,
 .mercury-panel h6 {
@@ -169,7 +177,8 @@
   -webkit-box-sizing: border-box;
   width: 100%;
   padding-left: 20px;
-  background: #FFF url(/assets/mercury/search-icon.png) no-repeat 4px center;
+  background-color: #FFF;
+  background-repeat: no-repeat;
 }
 .mercury-snippet-panel ul {
   font-size: .9em;
@@ -196,4 +205,4 @@
 .mercury-history-panel,
 .mercury-notes-panel {
   width: 250px;
-}
+}

data/vendor/assets/stylesheets/mercury/lightview.css

@@ -31,10 +31,11 @@
   color: #CCC;
 }
 .mercury-lightview.loading {
-  background: #000 url(/assets/mercury/loading-dark.gif) no-repeat center;
+  background-repeat: no-repeat;
+  background-position: center;
 }
 .mercury-lightview .mercury-lightview-content {
-  margin: 10px 20px 20px;
+  padding: 10px 20px 20px;
 }
 .mercury-lightview h1.mercury-lightview-title {
   margin: 0;
@@ -53,9 +54,22 @@
   width: 32px;
   height: 42px;
   margin: -14px -20px;
-  background: url(/assets/mercury/close.png) no-repeat center;
+  background-repeat: no-repeat;
+  background-position: center;
+}
+.mercury-lightview .mercury-display-pane-container {
+  overflow: auto;
+  margin: -10px -20px 0;
+  padding: 20px 20px 10px;
+}
+.mercury-lightview .mercury-display-pane-container .mercury-display-pane {
+  float: left;
+}
+.mercury-lightview .mercury-display-controls {
+  padding: 15px 0 0;
+  border-top: 1px solid #333;
+  text-align: right;
 }
-
 /*
  * Forms
  *----------------------------------------------------------------------------*/
@@ -72,29 +86,66 @@
 .mercury-lightview form input[type="password"],
 .mercury-lightview form textarea,
 .mercury-lightview form input.text {
-  background: #000;
+  background: #444;
   color: #FFF;
   border: 2px solid #555;
+  -moz-box-shadow: inset 0 0 3px #000000;
+  -webkit-box-shadow: inset 0 0 3px #000000;
+  box-shadow: inset 0 0 3px #000000;
+}
+.mercury-lightview form input[type="button"] {
+  border: 2px solid #555;
+  border-radius: 4px;
+  background: #222;
+  color: #FFF;
+}
+.mercury-lightview hr {
+  border-color: #333;
 }
 /*
  * Specific Lightviews
  *----------------------------------------------------------------------------*/
 /* about mercury */
-.mercury-about-lightview {
-  width: 200px;
+#mercury_about {
+  width: 300px;
   min-height: 100px;
-  padding-left: 130px;
-  background: url(/assets/mercury/temp-logo.png) no-repeat left center;
-  font-size: .9em;
+  font-size: 1.1em;
+  background-repeat: no-repeat;
 }
-.mercury-about-lightview ul {
+#mercury_about ul {
+  float: left;
   list-style: none;
   padding: 0;
-  margin: 20px 0 0 0;
+  margin: 118px 0 0 0;
+  width: 120px;
+  text-align: center;
 }
-.mercury-about-lightview a {
+#mercury_about p {
+  margin: 0;
+  float: right;
+  width: 175px;
+}
+#mercury_about a {
   color: #09F;
 }
-.mercury-about-lightview a:hover {
+#mercury_about a:hover {
   color: #FFF;
-}
+}
+/* character */
+.mercury-lightview #mercury_character .character {
+  border: 1px solid #444;
+  background: #222;
+}
+.mercury-lightview #mercury_character .character:hover {
+  background: #555;
+  border: 1px solid #CCC;
+}
+/* table */
+.mercury-lightview #mercury_table #table_display {
+  background: #222;
+  border: 1px solid #444;
+  height: 301px;
+}
+.mercury-lightview #mercury_table #table_display td.selected {
+  background: #09F;
+}

data/vendor/assets/stylesheets/mercury/mercury.css

@@ -7,28 +7,29 @@
  *= require ./toolbar
  *= require ./tooltip
  *= require ./uploader
+ *= require ./all_images
  */
 
-
+/*
+ * General Layout
+ *---------------------------------------------------------------------------*/
 html, body {
+  -webkit-transition: -webkit-transform 3s;
   margin: 0;
   padding: 0;
   overflow: hidden;
 }
-
 .mercury-iframe {
   position: absolute;
   top: 0;
   width: 100%;
   visibility: hidden;
 }
-
 .mercury-focusable {
   position: absolute;
   opacity: 0;
 }
 
-
 /*
  * Forms
  *---------------------------------------------------------------------------*/
@@ -76,10 +77,13 @@ form label {
   text-align: right;
   line-height: 27px;
   font-size: 1.1em;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 form label input {
   width: auto !important;
-  margin: 0 5px 0 -20px !important;
+  margin: 0 5px 0 2px !important;
 }
 form select,
 form input[type=text],
@@ -126,7 +130,8 @@ form fieldset.buttons .commit input {
   padding: 8px 14px 9px !important;
   font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif;
   font-size: 1.3em;
-  background: #222 url(/assets/mercury/button.png) repeat-x;
+  background-color: #222;
+  background-repeat: repeat-x;
   display: inline-block;
   color: #FFF;
   text-decoration: none;
@@ -143,4 +148,4 @@ form fieldset.buttons .commit input {
 }
 form fieldset.buttons .commit input:hover {
   background-color: #000;
-}
+}