RubyGems - tinymce-rails-imageupload - Versions diffs - 3.5.6.4 → 3.5.8.0 - Mend

tinymce-rails-imageupload 3.5.6.4 → 3.5.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

data/CHANGELOG.markdown CHANGED Viewed

@@ -1,3 +1,10 @@
+## 3.5.8.0 (February 1, 2013)
+* Tested with tinymce-rails 3.5.8
+* Handle errors from the server, both in the JSON, and from the server (HTTP 5xx and so on)
+* Don't submit the form without a file selected (fixes #1)
+* Display a spinner when uploading (fixes #2)
 ## 3.5.6.4 (December 10, 2012)
 * Convert CoffeeScript to JavaScript to avoid depending on CoffeeScript (#19). Thanks to sobrinho (Gabriel Sobrinho)

data/README.markdown CHANGED Viewed

@@ -5,7 +5,7 @@
   This plugin borrows heavily from work done by [Peter Shoukry](http://77effects.com/).
-  The icon used for the button comes from the icon set [Silk by famfamfam](http://www.famfamfam.com/lab/icons/silk/)
+  The icon used for the button comes from the icon set [Silk by famfamfam](http://www.famfamfam.com/lab/icons/silk/) and the spinner image from [ajaxload.info](http://ajaxload.info/).
 ## Requirements
@@ -56,6 +56,15 @@
   If the JSON response contains a `width` and/or `height` key, those will be used in the inserted HTML (`<img src="..." width="..." height="...">`), but if those are not present, the inserted HTML is just `<img src="...">`.
+## Error handling
+To notify the uploader that an error occurred, return JSON containing a `error` key with a `message`.
+The message gets show in a paragraph with the ID `error_message`, and the input label gets the class `invalid`.
+Example response:
+    "{"error": {"message": "Invalid file type. Only .jpg, .png and .gif allowed"}}"
 ## Internationalization
 I18n is taken care of by `tinymce-rails`. This gem includes strings for english, norwegian, russian and portugese.
@@ -82,6 +91,10 @@ The available strings are listed below:
       title: 'Insert image',
       header: "Insert image",
       input:  "Choose an image",
+      uploading: "Uploading…",
+      blank_input: "Must choose a file",
+      bad_response: "Got a bad response from the server",
+      blank_response: "Didn't get a response from the server",
       insert: "Insert",
       cancel: "Cancel"
     });

data/lib/tinymce-rails-imageupload/version.rb CHANGED Viewed

@@ -1,7 +1,7 @@
 module Tinymce
   module Rails
     module Imageupload
-      VERSION = "3.5.6.4"
+      VERSION = "3.5.8.0"
     end
   end
 end

data/vendor/assets/javascripts/tinymce/plugins/uploadimage/dialog.html CHANGED Viewed

@@ -1,84 +1,131 @@
 <!DOCTYPE html>
 <html>
   <head>
+    <meta charset="utf-8">
     <title>{#uploadimage_dlg.title}</title>
+    <style type="text/css">
+      form { margin-top: 0.5em; }
+      label { margin-bottom: 0.5em; }
+      p#error_message { color: #E00; }
+      #upload_spinner { padding-top: 4px; padding-left: 3px; }
+      #upload_spinner.inactive { display: none; }
+    </style>
     <script type="text/javascript" src="../../tiny_mce_popup.js"></script>
     <script type="text/javascript">
       tinyMCEPopup.requireLangPack();
-      function getFrameByName(name)
-      {
-        for (var i = 0; i < frames.length; i++)
-          if (frames[i].name == name)
-            return frames[i];
+      var UploadImageDialog = {
-        return null;
-      }
+        init: function() {
+          this.f = document.forms[0];
+          this.f.action = tinyMCEPopup.getParam("uploadimage_form_url", "/tinymce_assets");
+          document.getElementById("hint").value = tinyMCEPopup.getParam("uploadimage_hint", "");
+          document.getElementById("authenticity_token").value = this.getMetaContents('csrf-token');
-      function getMetaContents(mn)
-      {
-        var m = (window.opener || window.parent).document.getElementsByTagName('meta');
+          this.iframe = document.getElementById("hidden_upload");
+          if(this.iframe.attachEvent)
+            this.iframe.attachEvent('onload', UploadImageDialog.uploadDone);
+          else
+            this.iframe.addEventListener('load', UploadImageDialog.uploadDone, false);
+        },
-        for(var i in m)
-          if(m[i].name == mn)
-            return m[i].content;
+        insert: function() {
+          var input = document.getElementById("file_upload");
-        return null;
-      }
+          if(input.value != "") {
+            document.getElementById("upload_spinner").className = '';
+            this.f.submit();
+          } else
+            this.handleError(tinyMCEPopup.getLang("uploadimage_dlg.blank_input", "Must choose a file"));
+        },
+        uploadDone: function() {
+          document.getElementById("upload_spinner").className = 'inactive';
-      function uploadDone(name)
-      {
-        var frame = getFrameByName(name);
-        if(frame) {
-          ret = frame.document.getElementsByTagName("body")[0].innerHTML;
+          if(this.document || this.contentDocument) {
+            var doc = this.document ? this.document : this.contentDocument;
+            UploadImageDialog.handleResponse(doc.getElementsByTagName("body")[0].innerHTML);
+          } else
+            UploadImageDialog.handleError(tinyMCEPopup.getLang("uploadimage_dlg.blank_response", "Didn't get a response from the server"));
+        },
-          if(ret.length) {
+        handleResponse: function(ret) {
+          try {
             var json = JSON.parse(ret);
-            var imgstr = "<br><img src='" + json["image"]["url"] + "'";
-            if(json["image"]["height"])
-              imgstr += " height='" + json["image"]["height"] + "'";
-            if(json["image"]["width"])
-              imgstr += " width='"  + json["image"]["width"]  + "'";
+            if(json["error"])
+              UploadImageDialog.handleError(json["error"]["message"]);
+            else {
+              tinyMCE.execCommand('mceInsertContent', false, UploadImageDialog.buildHTML(json));
+              tinyMCEPopup.close();
+            }
+          } catch(e) {
+            UploadImageDialog.handleError(tinyMCEPopup.getLang("uploadimage_dlg.bad_response", "Got a bad response from the server"));
+          }
+        },
-            imgstr += "/>";
+        buildHTML: function(json) {
+          var imgstr = "<br><img src='" + json["image"]["url"] + "'";
-            tinyMCE.execCommand('mceInsertContent', false, imgstr);
-            tinyMCEPopup.close();
-          }
-        }
-      }
+          if(json["image"]["height"])
+            imgstr += " height='" + json["image"]["height"] + "'";
+          if(json["image"]["width"])
+            imgstr += " width='"  + json["image"]["width"]  + "'";
-      var UploadImageDialog = {
+          imgstr += "/>";
-        init: function() {
-          this.f = document.forms[0];
-          this.f.action = tinyMCEPopup.getParam("uploadimage_form_url", "/tinymce_assets");
-          document.getElementById("hint").value = tinyMCEPopup.getParam("uploadimage_hint", "");
-          document.getElementById("authenticity_token").value = getMetaContents('csrf-token');
+          return imgstr;
         },
-        insert: function() {
-          this.f.submit();
-        }
+        handleError: function(error) {
+          var className = 'invalid';
+          var label   = document.getElementById("file_upload_label");
+          var message = document.getElementById("error_message");
+          if(message)
+            message.innerHTML = error;
+          // Add the 'invalid' class, avoiding duplicates
+          if(label) {
+            var cn = label.className;
+            if(cn.indexOf(className) == -1) {
+              if(cn != '')
+              	className = ' ' + className;
+              label.className = cn + className;
+            }
+          }
+        },
+        getMetaContents: function(mn) {
+          var m = (window.opener || window.parent).document.getElementsByTagName('meta');
+          for(var i in m)
+            if(m[i].name == mn)
+              return m[i].content;
+          return null;
+        },
       };
       tinyMCEPopup.onInit.add(UploadImageDialog.init, UploadImageDialog);
     </script>
   </head>
   <body>
+    <h1>{#uploadimage_dlg.header}</h1>
     <form method="post" enctype='multipart/form-data' accept-charset="UTF-8" target="hidden_upload" action='#replaceme' name="uploadimageForm">
       <input type="hidden" name="utf8" value="✓">
       <input type="hidden" name="authenticity_token" id="authenticity_token" value="#replaceme">
       <input type="hidden" name="hint" id="hint" value="#replaceme">
-      <iframe id="hidden_upload" name="hidden_upload" src='' onload='uploadDone("hidden_upload")' style='width:0;height:0;border:0px solid #fff'></iframe>
+      <iframe id="hidden_upload" name="hidden_upload" src="" style='width:0;height:0;border:0px solid #fff'></iframe>
-      <h1>{#uploadimage_dlg.header}</h1>
-      <p>{#uploadimage_dlg.input}: <input type="file" name='file' class="file_upload"></p>
+      <label id='file_upload_label' for='file_upload'>{#uploadimage_dlg.input}:</label>
+      <input type='file' name='file' id='file_upload'>
+      <p id="error_message"></p>
       <div class="mceActionPanel">
         <input type="button" id="insert" name="insert" value="{#uploadimage_dlg.insert}" onclick="UploadImageDialog.insert();"/>
+        <img src="img/spinner.gif" alt="#{uploadimage_dlg.uploading}" id="upload_spinner" height="16" width="16" class="inactive">
         <input type="button" id="cancel" name="cancel" value="{#uploadimage_dlg.cancel}" onclick="tinyMCEPopup.close();" />
       </div>
     </form>

data/vendor/assets/javascripts/tinymce/plugins/uploadimage/img/spinner.gif ADDED Viewed

Binary file

data/vendor/assets/javascripts/tinymce/plugins/uploadimage/langs/en_dlg.js CHANGED Viewed

@@ -2,6 +2,10 @@ tinyMCE.addI18n('en.uploadimage_dlg', {
   title: 'Insert image',
   header: "Insert image",
   input:  "Choose an image",
+  uploading: "Uploading…",
+  blank_input: "Must choose a file",
+  bad_response: "Got a bad response from the server",
+  blank_response: "Didn't get a response from the server",
   insert: "Insert",
   cancel: "Cancel"
 });

data/vendor/assets/javascripts/tinymce/plugins/uploadimage/langs/nb_dlg.js CHANGED Viewed

@@ -2,6 +2,10 @@ tinyMCE.addI18n('nb.uploadimage_dlg', {
   title: 'Sett inn bilde',
   header: "Sett inn bilde",
   input:  "Velg et bilde",
+  uploading: "Laster opp…",
+  blank_input: "M\u00e5 velge en fil",
+  bad_response: "Fikk et ugyldig svar fra serveren",
+  blank_response: "Fikk ikke svar fra serveren",
   insert: "Sett inn",
   cancel: "Avbryt"
 });

data/vendor/assets/javascripts/tinymce/plugins/uploadimage/langs/pt_dlg.js CHANGED Viewed

@@ -2,6 +2,10 @@ tinyMCE.addI18n('pt.uploadimage_dlg', {
   title: 'Inserir imagem',
   header: "Inserir imagem",
   input:  "Escolher uma imagem",
+  uploading: "A enviar…",
+  blank_input: "É necessário seleccionar um ficheiro",
+  bad_response: "Resposta inesperada do servidor",
+  blank_response: "Não foi obtida uma resposta do servidor",
   insert: "Inserir",
   cancel: "Cancelar"
 });

data/vendor/assets/javascripts/tinymce/plugins/uploadimage/langs/ru_dlg.js CHANGED Viewed

@@ -2,6 +2,10 @@ tinyMCE.addI18n('ru.uploadimage_dlg', {
   title: 'Вставить изображение',
   header: "Вставить изображение",
   input:  "Выберите изображение",
+  uploading: "Загрузка…",
+  blank_input: "Необходимо выбрать файл",
+  bad_response: "Получен некорректный ответ с сервера",
+  blank_response: "Не получен ответ с сервера",
   insert: "Вставить",
   cancel: "Отмена"
-});
+});

metadata CHANGED Viewed

@@ -1,80 +1,80 @@
 --- !ruby/object:Gem::Specification
 name: tinymce-rails-imageupload
 version: !ruby/object:Gem::Version
-  version: 3.5.6.4
   prerelease:
+  version: 3.5.8.0
 platform: ruby
 authors:
 - Per Christian B. Viken
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2012-12-10 00:00:00.000000000 Z
+date: 2013-02-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
-  prerelease: false
+  type: :runtime
   requirement: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: '3.1'
-    none: false
-  type: :runtime
+  prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: '3.1'
-    none: false
 - !ruby/object:Gem::Dependency
   name: tinymce-rails
-  prerelease: false
+  type: :runtime
   requirement: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: 3.4.9
-    none: false
-  type: :runtime
+  prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: 3.4.9
-    none: false
 - !ruby/object:Gem::Dependency
   name: bundler
-  prerelease: false
+  type: :development
   requirement: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ~>
       - !ruby/object:Gem::Version
         version: 1.0.0
-    none: false
-  type: :development
+  prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ~>
       - !ruby/object:Gem::Version
         version: 1.0.0
-    none: false
 - !ruby/object:Gem::Dependency
   name: rails
-  prerelease: false
+  type: :development
   requirement: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: '3.1'
-    none: false
-  type: :development
+  prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
         version: '3.1'
-    none: false
 description: TinyMCE plugin for taking image uploads in Rails >= 3.1
 email:
 - perchr@northblue.org
@@ -95,6 +95,7 @@ files:
 - tinymce-rails-imageupload.gemspec
 - vendor/assets/javascripts/tinymce/plugins/uploadimage/dialog.html
 - vendor/assets/javascripts/tinymce/plugins/uploadimage/editor_plugin.js
+- vendor/assets/javascripts/tinymce/plugins/uploadimage/img/spinner.gif
 - vendor/assets/javascripts/tinymce/plugins/uploadimage/img/uploadimage.png
 - vendor/assets/javascripts/tinymce/plugins/uploadimage/langs/en.js
 - vendor/assets/javascripts/tinymce/plugins/uploadimage/langs/en_dlg.js
@@ -111,17 +112,17 @@ rdoc_options: []
 require_paths:
 - lib
 required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
   requirements:
   - - ! '>='
     - !ruby/object:Gem::Version
       version: '0'
-  none: false
 required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
   requirements:
   - - ! '>='
     - !ruby/object:Gem::Version
       version: '0'
-  none: false
 requirements: []
 rubyforge_project:
 rubygems_version: 1.8.24