跳过tinymce图像上传模式

时间:2015-02-25 03:18:20

标签: ruby-on-rails tinymce tinymce-4

我在编辑器中使用tinymce-rails gem和tinymce-rails-imageupload gem进行图片上传。我环顾四周,无法找到更改默认上传过程的方法。我没有单击工具栏中的图像按钮并获取模式弹出窗口来上传图像并添加标题,而是希望工具栏中的图像按钮充当“选择文件”按钮并直接打开文件查找器。这可能与tinymce有关吗?

1 个答案:

答案 0 :(得分:1)

<强>更新 快速而肮脏的猴子补丁 here

按钮按下和系统文件选择对话框之间没有其他窗口,并且在选择文件后立即插入图像。在我的chrome 40.0.2214.111中,Ubuntu 14.04(64位)似乎按预期工作。

git clone https://github.com/PerfectlyNormal/tinymce-rails-imageupload.git
cd tinymce-rails-imageupload

# substitute app/assets/javascripts/tinymce/plugins/uploadimage/plugin.js with a patched version

gem build tinymce-rails-imageupload.gemspec
gem install ./tinymce-rails-imageupload-4.0.16.beta.gem

以下是modified和master分支github版本之间的差异 (Wed Feb 25 10:34:49 2015 +0100)

diff plugin-modified.js tinymce-rails-imageupload/app/assets/javascripts/tinymce/plugins/uploadimage/plugin.js 

12,17d11
<       function Dialog() {
<         if (document.getElementsByName("file")[0].value) {
<           insertImage();
<         } else ed.windowManager.close;
<       }
< 
19,20d12
<             if(win) {win.close()};
< 
26,27c18,19
<             {type: 'iframe',  url: 'javascript:void(0)', style: 'display: none'},
<             {type: 'textbox', name: 'file', label: ed.translate('Choose an image'), subtype: 'file', onchange: Dialog},
---
>             {type: 'iframe',  url: 'javascript:void(0)'},
>             {type: 'textbox', name: 'file', label: ed.translate('Choose an image'), subtype: 'file'},
103,112d94
<         win.hide();
<        
< 
<         var clickEvent = new MouseEvent("click", {
<                                         "view": window,
<                                         "bubbles": true,
<                                         "cancelable": false});
<         clickEvent.toElement=document.getElementsByName("file")[0];
<         document.getElementsByName("file")[0].dispatchEvent(clickEvent);
< 

在那里没有特殊的旋钮,只能通过重写this function ...

我认为您需要为后端在上传时期望的字段留下iframe,但是您可以将其设为不可见,只需在showDialog中打开文件选择对话框并在选择文件后调用insertImage。