Skip to content

Commit cc38679

Browse files
trippotrippo
authored
Merge pull request trippo#553 from mklkj/tinymce5
Add support for TinyMCE 5
2 parents b372e5f + f2c4d45 commit cc38679

File tree

5 files changed

+143
-70
lines changed

5 files changed

+143
-70
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
"homepage": "http://www.responsivefilemanager.com/",
1111
"devDependencies": {
1212
"gulp": "^3.9.1",
13+
"tinymce": "^5.0.4",
1314
"laravel-elixir": "*"
1415
},
1516
"scripts": {

‎resources/assets/js/include.js

Lines changed: 8 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2105,27 +2105,17 @@ var encodeURL,show_animation,hide_animation,apply,apply_none,apply_img,apply_any
21052105
}
21062106
else
21072107
{
2108-
var editor = jQuery('#editor').val();
2109-
if (editor == 'ckeditor')
2110-
{
2108+
if (jQuery('#editor').val() === 'ckeditor') {
21112109
var funcNum = getUrlParam('CKEditorFuncNum');
21122110
window.opener.CKEDITOR.tools.callFunction(funcNum, url);
21132111
window.close();
2114-
}
2115-
else
2116-
{
2117-
// tinymce 3.X
2118-
if (parent.tinymce.majorVersion < 4)
2119-
{
2120-
parent.tinymce.activeEditor.windowManager.params.setUrl(url);
2121-
parent.tinymce.activeEditor.windowManager.close(parent.tinymce.activeEditor.windowManager.params.mce_window_id);
2122-
}
2123-
// tinymce 4.X
2124-
else
2125-
{
2126-
parent.tinymce.activeEditor.windowManager.getParams().setUrl(url);
2127-
parent.tinymce.activeEditor.windowManager.close();
2128-
}
2112+
} else {
2113+
window.parent.postMessage({
2114+
sender: 'responsivefilemanager',
2115+
url: url,
2116+
field_id: null
2117+
}, window.location.origin);
2118+
parent.tinymce.activeEditor.windowManager.close();
21292119
}
21302120
}
21312121
}

‎resources/assets/js/plugin.js

Lines changed: 37 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@
99

1010
tinymce.PluginManager.add('filemanager', function(editor) {
1111

12-
editor.settings.file_browser_callback = filemanager;
12+
editor.settings.file_picker_types = 'file image media';
13+
editor.settings.file_picker_callback = filemanager;
1314

1415
function filemanager_onMessage(event){
1516
if(editor.settings.external_filemanager_path.toLowerCase().indexOf(event.origin.toLowerCase()) === 0){
@@ -27,7 +28,7 @@ tinymce.PluginManager.add('filemanager', function(editor) {
2728
}
2829
}
2930

30-
function filemanager (id, value, type, win) {
31+
function filemanager(callback, value, meta) {
3132
var width = window.innerWidth-30;
3233
var height = window.innerHeight-60;
3334
if(width > 1800) width=1800;
@@ -39,8 +40,9 @@ tinymce.PluginManager.add('filemanager', function(editor) {
3940

4041
// DEFAULT AS FILE
4142
urltype=2;
42-
if (type=='image') { urltype=1; }
43-
if (type=='media') { urltype=3; }
43+
if (meta.mediaType === 'image') { urltype=1; }
44+
if (meta.mediaType === 'media') { urltype=3; }
45+
4446
var title="RESPONSIVE FileManager";
4547
if (typeof editor.settings.filemanager_title !== "undefined" && editor.settings.filemanager_title) {
4648
title=editor.settings.filemanager_title;
@@ -73,27 +75,37 @@ tinymce.PluginManager.add('filemanager', function(editor) {
7375
}
7476
}
7577

76-
tinymce.activeEditor.windowManager.open({
77-
title: title,
78-
file: editor.settings.external_filemanager_path+'dialog.php?type='+urltype+'&descending='+descending+sort_by+fldr+crossdomain+'&lang='+editor.settings.language+'&akey='+akey,
79-
width: width,
80-
height: height,
81-
resizable: true,
82-
maximizable: true,
83-
inline: 1
84-
}, {
85-
setUrl: function (url) {
86-
var fieldElm = win.document.getElementById(id);
87-
fieldElm.value = editor.convertURL(url);
88-
if ("createEvent" in document) {
89-
var evt = document.createEvent("HTMLEvents");
90-
evt.initEvent("change", false, true);
91-
fieldElm.dispatchEvent(evt)
92-
} else {
93-
fieldElm.fireEvent("onchange")
94-
}
78+
window.addEventListener('message', function receiveMessage(event) {
79+
window.removeEventListener('message', receiveMessage, false);
80+
if (event.data.sender === 'responsivefilemanager') {
81+
callback(event.data.url);
9582
}
96-
});
97-
};
83+
}, false);
84+
85+
var dialogUrl = editor.settings.external_filemanager_path+'dialog.php?type='+urltype+'&descending='+descending+sort_by+fldr+crossdomain+'&lang='+editor.settings.language+'&akey='+akey;
86+
87+
if (tinymce.majorVersion > 4) {
88+
tinymce.activeEditor.windowManager.openUrl({
89+
title: title,
90+
url: dialogUrl,
91+
width: width,
92+
height: height,
93+
resizable: true,
94+
maximizable: true,
95+
inline: 1,
96+
});
97+
} else {
98+
tinymce.activeEditor.windowManager.open({
99+
title: title,
100+
file: dialogUrl,
101+
width: width,
102+
height: height,
103+
resizable: true,
104+
maximizable: true,
105+
inline: 1,
106+
});
107+
}
108+
}
109+
98110
return false;
99111
});

‎resources/assets/js/plugin_responsivefilemanager_plugin.js

Lines changed: 59 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -68,32 +68,64 @@ tinymce.PluginManager.add('responsivefilemanager', function(editor) {
6868
}
6969
}
7070

71-
win = editor.windowManager.open({
72-
title: title,
73-
file: editor.settings.external_filemanager_path+'dialog.php?type=4&descending='+descending+sort_by+fldr+crossdomain+'&lang='+editor.settings.language+'&akey='+akey,
74-
width: width,
75-
height: height,
76-
inline: 1,
77-
resizable: true,
78-
maximizable: true
79-
});
71+
const fileUrl = editor.settings.external_filemanager_path+'dialog.php?type=4&descending='+descending+sort_by+fldr+crossdomain+'&lang='+editor.settings.language+'&akey='+akey;
72+
73+
if (tinymce.majorVersion < 5) {
74+
win = editor.windowManager.open({
75+
title: title,
76+
file: fileUrl,
77+
width: width,
78+
height: height,
79+
inline: 1,
80+
resizable: true,
81+
maximizable: true
82+
});
83+
} else {
84+
win = editor.windowManager.openUrl({
85+
title: title,
86+
url: fileUrl,
87+
width: width,
88+
height: height,
89+
inline: 1,
90+
resizable: true,
91+
maximizable: true
92+
});
93+
}
8094
}
81-
82-
editor.addButton('responsivefilemanager', {
83-
icon: 'browse',
84-
tooltip: 'Insert file',
85-
shortcut: 'Ctrl+E',
86-
onclick:openmanager
87-
});
88-
89-
editor.addShortcut('Ctrl+E', '', openmanager);
9095

91-
editor.addMenuItem('responsivefilemanager', {
92-
icon: 'browse',
93-
text: 'Insert file',
94-
shortcut: 'Ctrl+E',
95-
onclick: openmanager,
96-
context: 'insert'
97-
});
98-
99-
});
96+
if (tinymce.majorVersion < 5) {
97+
editor.addButton('responsivefilemanager', {
98+
icon: 'browse',
99+
tooltip: 'Insert file',
100+
shortcut: 'Ctrl+E',
101+
onClick: openmanager
102+
});
103+
104+
editor.addShortcut('Ctrl+E', '', openmanager);
105+
106+
editor.addMenuItem('responsivefilemanager', {
107+
icon: 'browse',
108+
text: 'Insert file',
109+
shortcut: 'Ctrl+E',
110+
onClick: openmanager,
111+
context: 'insert'
112+
});
113+
} else {
114+
editor.ui.registry.addButton('responsivefilemanager', {
115+
icon: 'browse',
116+
tooltip: 'Insert file',
117+
shortcut: 'Ctrl+E',
118+
onAction: openmanager
119+
});
120+
121+
editor.addShortcut('Ctrl+E', '', openmanager);
122+
123+
editor.ui.registry.addMenuItem('responsivefilemanager', {
124+
icon: 'browse',
125+
text: 'Insert file',
126+
shortcut: 'Ctrl+E',
127+
onAction: openmanager,
128+
context: 'insert'
129+
});
130+
}
131+
});

‎tinymce-demo.html

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Tinymce demo</title>
6+
</head>
7+
<body>
8+
<textarea rows="30"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
9+
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
10+
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
11+
fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
12+
anim id est laborum.</p></textarea>
13+
14+
<script src="./node_modules/tinymce/tinymce.min.js"></script>
15+
<script>
16+
tinymce.init({
17+
mode: "specific_textareas",
18+
theme: "silver", // tinymce4 - modern
19+
selector: "textarea",
20+
relative_urls: false,
21+
entity_encoding: "raw",
22+
plugins: [
23+
"advlist autolink link image media filemanager code responsivefilemanager"
24+
],
25+
toolbar1: "undo redo | bold italic underline",
26+
toolbar2: "| responsivefilemanager | link unlink | image media | code",
27+
image_advtab: true,
28+
29+
external_filemanager_path: "filemanager/",
30+
filemanager_title: "Responsive Filemanager",
31+
external_plugins: {
32+
"responsivefilemanager": "../../tinymce/plugins/responsivefilemanager/plugin.min.js",
33+
"filemanager": "../../filemanager/plugin.min.js"
34+
},
35+
});
36+
</script>
37+
</body>
38+
</html>

0 commit comments

Comments
 (0)