diff --git a/app/assets/javascripts/tinymce/plugins/uploadimage/plugin.js b/app/assets/javascripts/tinymce/plugins/uploadimage/plugin.js index 860c63d..d816d5a 100644 --- a/app/assets/javascripts/tinymce/plugins/uploadimage/plugin.js +++ b/app/assets/javascripts/tinymce/plugins/uploadimage/plugin.js @@ -4,22 +4,22 @@ tinymce.create('tinymce.plugins.UploadImage', { UploadImage: function(ed, url) { var form, - iframe, - win, - throbber, - selected_class = '', - editor = ed; + iframe, + win, + throbber, + selectedClass = '', + editor = ed; function showDialog() { var classList = getClassList(); var body = [ - {type: 'iframe', url: 'javascript:void(0)'}, - {type: 'textbox', name: 'file', label: ed.translate('Choose an image'), subtype: 'file'}, - {type: 'textbox', name: 'alt', label: ed.translate('Image description')} + { type: 'iframe', url: 'javascript:void(0)' }, + { type: 'textbox', name: 'file', label: ed.translate('Choose an image'), subtype: 'file' }, + { type: 'textbox', name: 'alt', label: ed.translate('Image description') } ]; if (classList.length > 0) { - selected_class = classList[0].value; + selectedClass = classList[0].value; body = body.concat([ { type: 'listbox', @@ -27,47 +27,50 @@ label: ed.translate('Class'), values: classList, onSelect: function(e) { - selected_class = this.value(); + selectedClass = this.value(); } } ]); } body = body.concat([ - {type: 'container', classes: 'error', html: "

 

"}, + { type: 'container', classes: 'error', html: "

 

" }, // Trick TinyMCE to add a empty div that "preloads" the throbber image - {type: 'container', classes: 'throbber'} + { type: 'container', classes: 'throbber' } ]); - win = editor.windowManager.open({ - title: ed.translate('Insert an image from your computer'), - width: 520 + parseInt(editor.getLang('uploadimage.delta_width', 0), 10), - height: 180 + parseInt(editor.getLang('uploadimage.delta_height', 0), 10), - body: body, - buttons: [ - { - text: ed.translate('Insert'), - onclick: insertImage, - subtype: 'primary' - }, - { - text: ed.translate('Cancel'), - onclick: ed.windowManager.close - } - ], - }, { - plugin_url: url - }); + win = editor.windowManager.open( + { + title: ed.translate('Insert an image from your computer'), + width: 520 + parseInt(editor.getLang('uploadimage.delta_width', 0), 10), + height: 180 + parseInt(editor.getLang('uploadimage.delta_height', 0), 10), + body: body, + buttons: [ + { + text: ed.translate('Insert'), + onclick: insertImage, + subtype: 'primary' + }, + { + text: ed.translate('Cancel'), + onclick: ed.windowManager.close + } + ] + }, + { + plugin_url: url + } + ); /* WHY DO YOU HATE
, TINYMCE!? */ - iframe = win.find("iframe")[0]; + iframe = win.find('iframe')[0]; form = createElement('form', { - action: ed.getParam("uploadimage_form_url", "/tinymce_assets"), + action: ed.getParam('uploadimage_form_url', '/tinymce_assets'), target: iframe._id, - method: "POST", + method: 'POST', enctype: 'multipart/form-data', - accept_charset: "UTF-8", + accept_charset: 'UTF-8' }); // Might have several instances on the same page, @@ -75,33 +78,35 @@ iframe.getEl().name = iframe._id; // Create some needed hidden inputs - form.appendChild(createElement('input', {type: "hidden", name: "utf8", value: "✓"})); - form.appendChild(createElement('input', {type: 'hidden', name: 'authenticity_token', value: getMetaContents('csrf-token')})); - form.appendChild(createElement('input', {type: 'hidden', name: hintName(), value: hintValue()})); + form.appendChild(createElement('input', { type: 'hidden', name: 'utf8', value: '✓' })); + form.appendChild( + createElement('input', { type: 'hidden', name: 'authenticity_token', value: getMetaContents('csrf-token') }) + ); + form.appendChild(createElement('input', { type: 'hidden', name: hintName(), value: hintValue() })); var el = win.getEl(); - var body = document.getElementById(el.id + "-body"); + var body = document.getElementById(el.id + '-body'); // Copy everything TinyMCE made into our form var containers = body.getElementsByClassName('mce-container'); - for(var i = 0; i < containers.length; i++) { + for (var i = 0; i < containers.length; i++) { form.appendChild(containers[i]); } // Fix inputs, since TinyMCE hates HTML and forms var inputs = form.getElementsByTagName('input'); - for(var i = 0; i < inputs.length; i++) { + for (var i = 0; i < inputs.length; i++) { var ctrl = inputs[i]; - if(ctrl.tagName.toLowerCase() == 'input' && ctrl.type != "hidden") { - if(ctrl.type == "file") { + if (ctrl.tagName.toLowerCase() === 'input' && ctrl.type !== 'hidden') { + if (ctrl.type === 'file') { ctrl.name = inputName('file'); // Hack styles tinymce.DOM.setStyles(ctrl, { - 'border': 0, - 'boxShadow': 'none', - 'webkitBoxShadow': 'none', + border: 0, + boxShadow: 'none', + webkitBoxShadow: 'none' }); } else { ctrl.name = inputName('alt'); @@ -129,7 +134,7 @@ } function insertImage() { - if(getInputValue(inputName('file')) == "") { + if (getInputValue(inputName('file')) === '') { return handleError('You must choose a file'); } @@ -143,7 +148,7 @@ * of errors and re-submitting afterwards. */ var target = iframe.getEl(); - if(target.attachEvent) { + if (target.attachEvent) { target.detachEvent('onload', uploadDone); target.attachEvent('onload', uploadDone); } else { @@ -155,20 +160,20 @@ } function uploadDone() { - if(throbber) { + if (throbber) { throbber.hide(); } try { var target = iframe.getEl(); - if(target.document || target.contentDocument) { + if (target.document || target.contentDocument) { var doc = target.contentDocument || target.contentWindow.document; - if(String(doc.contentType).indexOf("html") > -1) { - handleResponse(doc.getElementsByTagName("body")[0].innerHTML); + if (String(doc.contentType).indexOf('html') > -1) { + handleResponse(doc.getElementsByTagName('body')[0].innerHTML); } else { - handleResponse(doc.getElementsByTagName("pre")[0].innerHTML); + handleResponse(doc.getElementsByTagName('pre')[0].innerHTML); } } - } catch(e) { + } catch (e) { handleError("Didn't get a response from the server"); } } @@ -177,34 +182,36 @@ try { var json = tinymce.util.JSON.parse(ret); - if(json["error"]) { - handleError(json["error"]["message"]); + if (json['error']) { + handleError(json['error']['message']); } else { ed.execCommand('mceInsertContent', false, buildHTML(json)); ed.windowManager.close(); } - } catch(e) { + } catch (e) { handleError('Got a bad response from the server'); } } function clearErrors() { - var message = win.find(".error")[0].getEl(); + var message = win.find('.error')[0].getEl(); - if(message) - message.getElementsByTagName("p")[0].innerHTML = " "; + if (message) { + message.getElementsByTagName('p')[0].innerHTML = ' '; + } } function handleError(error) { - var message = win.find(".error")[0].getEl(); + var message = win.find('.error')[0].getEl(); - if(message) - message.getElementsByTagName("p")[0].innerHTML = ed.translate(error); + if (message) { + message.getElementsByTagName('p')[0].innerHTML = ed.translate(error); + } } function createElement(element, attributes) { var el = document.createElement(element); - for(var property in attributes) { + for (var property in attributes) { if (!(attributes[property] instanceof Function)) { el[property] = attributes[property]; } @@ -215,36 +222,41 @@ function buildHTML(json) { var image = json[ed.getParam('uploadimage_model', 'image')]; - var default_class = ed.getParam("uploadimage_default_img_class", ""); - var figure = ed.getParam("uploadimage_figure", false); - var alt_text = getInputValue(inputName('alt')); + var defaultClass = ed.getParam('uploadimage_default_img_class', ''); + var figure = ed.getParam('uploadimage_figure', false); + var altText = getInputValue(inputName('alt')); - var imgstr = ""; + imgstr += " alt='" + altText + "'/>"; - if(figure) { - var figureClass = ed.getParam("uploadimage_figure_class", "figure"); - var figcaptionClass = ed.getParam("uploadimage_figcaption_class", "figcaption"); + if (figure) { + var figureClass = ed.getParam('uploadimage_figure_class', 'figure'); + var figcaptionClass = ed.getParam('uploadimage_figcaption_class', 'figcaption'); - var figstr = ""; - figstr += ""; + } + figstr += '>' + altText + ''; + figstr += ''; return figstr; } else { @@ -253,27 +265,31 @@ } function getInputValue(name) { - var inputs = form.getElementsByTagName("input"); + var inputs = form.getElementsByTagName('input'); - for(var i in inputs) - if(inputs[i].name == name) + for (var i in inputs) { + if (inputs[i].name === name) { return inputs[i].value; + } + } - return ""; + return ''; } function getMetaContents(mn) { var m = document.getElementsByTagName('meta'); - for(var i in m) - if(m[i].name == mn) + for (var i in m) { + if (m[i].name === mn) { return m[i].content; + } + } return null; } function getClassList() { - var config = ed.getParam('image_class_list', []); + var config = ed.getParam('image_class_list', []); var values = []; for (var i = 0; i < config.length; i++) { values[i] = { @@ -282,20 +298,20 @@ }; } return values; - }; + } if (editor.getParam('uploadimage', true)) { // Add a button that opens a window editor.addButton('uploadimage', { tooltip: ed.translate('Insert an image from your computer'), - icon : 'image', + icon: 'image', onclick: showDialog }); // Adds a menu item to the tools menu editor.addMenuItem('uploadimage', { text: ed.translate('Insert an image from your computer'), - icon : 'image', + icon: 'image', context: 'insert', onclick: showDialog });