Skip to content

Commit 885a440

Browse files
empiricompanyfballiano
empiricompany
and
fballiano
authored
fix tinymce openmage variable and widget plugins and toolbar buttuns (OpenMage#12)
* fix insert variable * temporary disable openmage widgets * fix insert widget * rebrand openmage variables * fix media browser callback * clean * removed empty lines * removed empty line * here we need the empty newline char ehhehe * we need newline at the end of the file * set toolbar buttons * reorder and fix * add skin default dark / draft the language support * stylish openmage widget * phpcs --------- Co-authored-by: Fabrizio Balliano <[email protected]>
1 parent 4cbdd82 commit 885a440

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

76 files changed

+237
-122
lines changed

‎app/code/core/Mage/Adminhtml/Block/Catalog/Helper/Form/Wysiwyg/Content.php

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,6 @@ protected function _prepareForm()
4141

4242
$form->addField($this->getData('editor_element_id'), 'editor', [
4343
'name' => 'content',
44-
'style' => 'width:725px;height:460px',
4544
'required' => true,
4645
'force_load' => true,
4746
'config' => Mage::getSingleton('cms/wysiwyg_config')->getConfig($config)

‎app/code/core/Mage/Cms/Model/Wysiwyg/Config.php

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -80,14 +80,14 @@ public function getConfig($data = [])
8080
'encode_directives' => true,
8181
'directives_url' => Mage::getSingleton('adminhtml/url')->getUrl('*/cms_wysiwyg/directive'),
8282
'popup_css' =>
83-
Mage::getBaseUrl('js') . 'mage/adminhtml/wysiwyg/tiny_mce/themes/advanced/skins/default/dialog.css',
83+
Mage::getBaseUrl('js') . 'mage/adminhtml/wysiwyg/tinymce/themes/advanced/skins/default/dialog.css',
8484
'content_css' =>
85-
Mage::getBaseUrl('js') . 'mage/adminhtml/wysiwyg/tiny_mce/themes/advanced/skins/default/content.css',
85+
Mage::getBaseUrl('js') . 'mage/adminhtml/wysiwyg/tinymce/themes/advanced/skins/default/content.css',
8686
'width' => '100%',
8787
'plugins' => [],
88-
'media_disable_flash' => true
88+
// TODO resolve different language names in official js files, like Francais is fr_FR.js and Italian is it.js
89+
'lang' => substr(Mage::app()->getLocale()->getLocaleCode(), 0, 2)
8990
]);
90-
9191
$config->setData('directives_url_quoted', preg_quote($config->getData('directives_url')));
9292

9393
if (Mage::getSingleton('admin/session')->isAllowed('cms/media_gallery')) {

‎app/code/core/Mage/Core/Model/Variable/Config.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ public function getWysiwygPluginSettings($config)
3232
$variableConfig = [];
3333
$onclickParts = [
3434
'search' => ['html_id'],
35-
'subject' => 'MagentovariablePlugin.loadChooser(\'' . $this->getVariablesWysiwygActionUrl() . '\', \'{{html_id}}\');'
35+
'subject' => 'OpenmagevariablePlugin.loadChooser(\'' . $this->getVariablesWysiwygActionUrl() . '\', \'{{html_id}}\');'
3636
];
3737
$variableWysiwygPlugin = [['name' => 'openmagevariable',
3838
'src' => $this->getWysiwygJsPluginSrc(),

‎js/mage/adminhtml/browser.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -226,7 +226,7 @@ Mediabrowser.prototype = {
226226
*/
227227
getMediaBrowserCallback: function() {
228228
if (typeof(tinyMCE) != 'undefined' && tinyMCE.get(this.targetElementId) && typeof(tinyMceEditors) != 'undefined') {
229-
return tinyMceEditors[this.targetElementId].getMediaBrowserCallback();
229+
return tinyMceEditors.get(this.targetElementId).getMediaBrowserCallback();
230230
}
231231
return null;
232232
},

‎js/mage/adminhtml/events.js

Lines changed: 1 addition & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -119,50 +119,7 @@ varienEvents.prototype = {
119119
}
120120
}
121121
return results;
122-
},
123-
124-
/**
125-
* Collect and modify value of arg synchronously in succession and return its new value.
126-
* In order to use, call attachEventHandler and add function handlers with eventName.
127-
* Then call fireEventReducer with eventName and any argument to have its value accumulatively modified.
128-
* Event handlers will be applied to argument in order of first attached to last attached.
129-
* @param {String} eventName
130-
* @param {*} arg
131-
*/
132-
fireEventReducer: function (eventName, arg) {
133-
var evtName = eventName + this.eventPrefix,
134-
result = arg,
135-
len,
136-
i;
137-
138-
if (!this.arrEvents[evtName]) {
139-
return result;
140-
}
141-
142-
len = this.arrEvents[evtName].length; //optimization
143-
144-
for (i = 0; i < len; i++) {
145-
/* eslint-disable max-depth */
146-
try {
147-
result = this.arrEvents[evtName][i].method(result);
148-
} catch (e) {
149-
if (this.id) {
150-
alert({
151-
content: 'error: error in ' + this.id + '.fireEventReducer():\n\nevent name: ' +
152-
eventName + '\n\nerror message: ' + e.message
153-
});
154-
} else {
155-
alert({
156-
content: 'error: error in [unknown object].fireEventReducer():\n\nevent name: ' +
157-
eventName + '\n\nerror message: ' + e.message
158-
});
159-
}
160-
}
161-
/* eslint-disable max-depth */
162-
}
163-
164-
return result;
165-
},
122+
}
166123
};
167124

168125
varienGlobalEvents = new varienEvents();

‎js/mage/adminhtml/variables.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@ var Variables = {
111111
}
112112
};
113113

114-
MagentovariablePlugin = {
114+
OpenmagevariablePlugin = {
115115
editor: null,
116116
variables: null,
117117
textareaId: null,
@@ -125,7 +125,7 @@ MagentovariablePlugin = {
125125
parameters: {},
126126
onComplete: function (transport) {
127127
if (transport.responseText.isJSON()) {
128-
Variables.init(null, 'MagentovariablePlugin.insertVariable');
128+
Variables.init(null, 'OpenmagevariablePlugin.insertVariable');
129129
this.variables = transport.responseText.evalJSON();
130130
this.openChooser(this.variables);
131131
}

‎js/mage/adminhtml/wysiwyg/tinymce/plugins/openmagevariable.js

Lines changed: 38 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -13,19 +13,43 @@
1313
*/
1414

1515
tinymce.PluginManager.add('openmagevariable', (ed, url) => {
16-
//TODO: the button doesn't show on the toolbar
17-
ed.ui.registry.addButton('openmagevariable', {
18-
text: 'Insert Variable',
19-
onAction: () => {
20-
//TODO: the code of this method needs to be converted to tinymce6
21-
var pluginSettings = ed.settings.magentoPluginsOptions.get('openmagevariable');
22-
openmagevariable.setEditor(ed);
23-
openmagevariable.loadChooser(pluginSettings.url, null);
16+
return {
17+
init: function (editor) {
18+
editor.addCommand('openVariablesPopup', function (commandConfig) {
19+
var config = tinyMceEditors.get(tinymce.activeEditor.id).openmagePluginsOptions.get('openmagevariable');
20+
OpenmagevariablePlugin.setEditor(editor);
21+
OpenmagevariablePlugin.loadChooser(
22+
config.url,
23+
null,
24+
tinymce.activeEditor.selection.getNode()
25+
);
26+
});
27+
28+
editor.ui.registry.addIcon(
29+
'openmagevariable',
30+
'<svg width="24" height="24" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">' +
31+
'<path d="M5.5 3C4.11929 3 3 4.11929 3 5.5V8.38197C3 8.87472 2.72331 9.32545 2.28459 9.54865C2.11627 9.62913 2 9.80099 2 10C2 10.199 2.11627 10.3709 2.28459 10.4513C2.72331 10.6745 3 11.1253 3 11.618V14.5C3 15.8807 4.11929 17 5.5 17C5.77614 17 6 16.7761 6 16.5C6 16.2239 5.77614 16 5.5 16C4.67157 16 4 15.3284 4 14.5V11.618C4 11.0029 3.75555 10.4249 3.33834 10C3.75556 9.57511 4 8.9971 4 8.38197V5.5C4 4.67157 4.67157 4 5.5 4C5.77614 4 6 3.77614 6 3.5C6 3.22386 5.77614 3 5.5 3ZM14.5 3C15.8807 3 17 4.11929 17 5.5V8.38197C17 8.87472 17.2767 9.32545 17.7154 9.54865C17.8837 9.62913 18 9.80099 18 10C18 10.199 17.8837 10.3709 17.7154 10.4513C17.2767 10.6745 17 11.1253 17 11.618V14.5C17 15.8807 15.8807 17 14.5 17C14.2239 17 14 16.7761 14 16.5C14 16.2239 14.2239 16 14.5 16C15.3284 16 16 15.3284 16 14.5V11.618C16 11.0029 16.2444 10.4249 16.6617 10C16.2444 9.57511 16 8.9971 16 8.38197V5.5C16 4.67157 15.3284 4 14.5 4C14.2239 4 14 3.77614 14 3.5C14 3.22386 14.2239 3 14.5 3ZM7.90691 6.20942C7.7464 5.98471 7.43413 5.93267 7.20942 6.09317C6.98471 6.25368 6.93267 6.56595 7.09317 6.79066L9.38559 10L7.09317 13.2094C6.93267 13.4341 6.98471 13.7464 7.20942 13.9069C7.43413 14.0674 7.7464 14.0154 7.90691 13.7907L10 10.8603L12.0932 13.7907C12.2537 14.0154 12.566 14.0674 12.7907 13.9069C13.0154 13.7464 13.0674 13.4341 12.9069 13.2094L10.6145 10L12.9069 6.79066C13.0674 6.56595 13.0154 6.25368 12.7907 6.09317C12.566 5.93267 12.2537 5.98471 12.0932 6.20942L10 9.13981L7.90691 6.20942Z" fill="#FB0E70"/>' +
32+
'</svg>'
33+
);
34+
35+
editor.ui.registry.addToggleButton('openmagevariable', {
36+
icon: 'openmagevariable',
37+
tooltip: 'Insert Variable',
38+
onAction: function () {
39+
editor.execCommand('openVariablesPopup');
40+
}
41+
});
42+
},
43+
44+
getMetadata: function () {
45+
return {
46+
longname: 'OpenMage Variable Manager Plugin',
47+
author: 'OpenMage Core Team',
48+
authorurl: 'https://www.openmage.org',
49+
infourl: 'https://www.openmage.org',
50+
version: '1.0'
51+
};
2452
}
25-
});
53+
}
2654

27-
return {
28-
name: 'OpenMage Variable Manager Plugin for TinyMCE',
29-
url: 'https://www.openmage.org'
30-
};
31-
});
55+
});

‎js/mage/adminhtml/wysiwyg/tinymce/plugins/openmagewidget.js

Lines changed: 72 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -13,42 +13,78 @@
1313
*/
1414

1515
tinymce.PluginManager.add('openmagewidget', (ed, url) => {
16-
// Register Widget plugin button
17-
//TODO: the button doesn't show on the toolbar
18-
ed.ui.registry.addButton('magentowidget', {
19-
text : 'Insert Widget',
20-
onAction: () => {
21-
//TODO: the code of this method needs to be converted to tinymce6
22-
widgetTools.openDialog(ed.settings.magentowidget_url + 'widget_target_id/' + ed.getElement().id + '/');
23-
}
24-
});
2516

26-
// Add a node change handler, selects the button in the UI when a image is selected
27-
// TODO: is this needed? in case, needs to be converted
28-
ed.onNodeChange.add(function(ed, cm, n) {
29-
cm.setActive('magentowidget', false);
30-
if (n.id && n.nodeName == 'IMG') {
31-
var widgetCode = Base64.idDecode(n.id);
32-
if (widgetCode.indexOf('{{widget') != -1) {
33-
cm.setActive('magentowidget', true);
34-
}
35-
}
36-
});
17+
return {
18+
init: function (editor) {
19+
var self = this;
3720

38-
// Add a widget placeholder image double click callback
39-
// TODO: all this method needs to be converted
40-
ed.onDblClick.add(function(ed, e) {
41-
var n = e.target;
42-
if (n.id && n.nodeName == 'IMG') {
43-
var widgetCode = Base64.idDecode(n.id);
44-
if (widgetCode.indexOf('{{widget') != -1) {
45-
ed.execCommand('mceMagentowidget');
46-
}
47-
}
48-
});
21+
this.activePlaceholder = null;
22+
editor.addCommand('mceOpenmagewidget', function (img) {
23+
if (self.activePlaceholder) {
24+
img = self.activePlaceholder;
25+
}
26+
var config = tinyMceEditors.get(tinymce.activeEditor.id).openmagePluginsOptions.get('openmagewidget');
27+
widgetTools.openDialog(
28+
config.widget_window_url + 'widget_target_id/' + editor.getElement().id + '/'
29+
);
30+
});
4931

50-
return {
51-
name: 'OpenMage Widget Manager Plugin for TinyMCE',
52-
url: 'https://www.openmage.org'
53-
};
54-
});
32+
// Register Widget plugin button
33+
editor.ui.registry.addIcon(
34+
'openmagewidget',
35+
'<svg width="18" height="18" viewBox="0 0 122.88 121.92" fill="none" xmlns="http://www.w3.org/2000/svg">' +
36+
'<path d="M6.6,121.92H47.51a6.56,6.56,0,0,0,2.83-.64,6.68,6.68,0,0,0,2.27-1.79,6.63,6.63,0,0,0,1.5-4.17V74.58A6.56,6.56,0,0,0,53.58,72,6.62,6.62,0,0,0,50,68.47,6.56,6.56,0,0,0,47.51,68H6.6a6.5,6.5,0,0,0-2.43.48,6.44,6.44,0,0,0-2.11,1.34A6.6,6.6,0,0,0,.55,72,6.3,6.3,0,0,0,0,74.58v40.74a6.54,6.54,0,0,0,.43,2.32,6.72,6.72,0,0,0,1.2,2l.26.27a6.88,6.88,0,0,0,2,1.39,6.71,6.71,0,0,0,2.73.6ZM59.3,28.44,86,1.77A6.19,6.19,0,0,1,88.22.34,6.24,6.24,0,0,1,90.87,0a6,6,0,0,1,3.69,1.74l26.55,26.55a6,6,0,0,1,1.33,2,6.13,6.13,0,0,1-1.33,6.58L94.45,63.58a6,6,0,0,1-1.9,1.27,5.92,5.92,0,0,1-2.24.5,6.11,6.11,0,0,1-2.41-.43,5.74,5.74,0,0,1-2.05-1.34L59.3,37a6.09,6.09,0,0,1-1.76-3.88V32.8a6.14,6.14,0,0,1,1.77-4.36ZM6.6,59.64H47.51a6.56,6.56,0,0,0,5.1-2.43,6.46,6.46,0,0,0,1.11-2,6.59,6.59,0,0,0,.39-2.21V12.31a6.61,6.61,0,0,0-.53-2.58A6.62,6.62,0,0,0,50,6.19a6.56,6.56,0,0,0-2.45-.48H6.6a6.5,6.5,0,0,0-2.43.48A6.44,6.44,0,0,0,2.06,7.53,6.6,6.6,0,0,0,.55,9.71,6.31,6.31,0,0,0,0,12.31V53.05a6.48,6.48,0,0,0,.43,2.31,6.6,6.6,0,0,0,1.2,2l.26.27a6.88,6.88,0,0,0,2,1.39,6.71,6.71,0,0,0,2.73.6Zm40.92-6.57H6.6l0,0V12.28c3.51,0,40.93,0,41,0,0,3.44,0,40.75,0,40.77Zm22.23,68.85h40.91a6.56,6.56,0,0,0,2.83-.64,6.68,6.68,0,0,0,2.27-1.79,6.63,6.63,0,0,0,1.5-4.17V74.58a6.56,6.56,0,0,0-.53-2.57,6.62,6.62,0,0,0-3.62-3.54,6.56,6.56,0,0,0-2.45-.48H69.75a6.75,6.75,0,0,0-4.54,1.82A6.6,6.6,0,0,0,63.7,72a6.3,6.3,0,0,0-.55,2.59v40.74a6.54,6.54,0,0,0,.43,2.32,6.72,6.72,0,0,0,1.2,2l.26.27a6.88,6.88,0,0,0,2,1.39,6.71,6.71,0,0,0,2.73.6Zm40.92-6.57H69.75l0,0,0-40.77c3.51,0,40.93,0,41,0,0,3.44,0,40.75,0,40.77Zm-63.15,0H6.6l0,0V74.56c3.51,0,40.93,0,41,0,0,3.44,0,40.75,0,40.77Z" fill="#FB0E70"/>' +
37+
'</svg>'
38+
);
39+
editor.ui.registry.addToggleButton('openmagewidget', {
40+
icon: 'openmagewidget',
41+
tooltip: 'Insert Widget',
42+
43+
/**
44+
* execute openVariablesSlideout for onAction callback
45+
*/
46+
onAction: function () {
47+
editor.execCommand('mceOpenmagewidget');
48+
},
49+
onSetup: function (api) {
50+
// Add a node change handler, selects the button in the UI when a image is selected
51+
editor.on('NodeChange', function (e) {
52+
api.setActive(false);
53+
var n = e.target;
54+
if (n.id && n.nodeName == 'IMG') {
55+
var widgetCode = Base64.idDecode(n.id);
56+
if (widgetCode.indexOf('{{widget') != -1) {
57+
api.setActive(true);
58+
}
59+
}
60+
});
61+
}
62+
});
63+
64+
// Add a widget placeholder image double click callback
65+
editor.on('dblClick', function (e) {
66+
var n = e.target;
67+
if (n.id && n.nodeName == 'IMG') {
68+
var widgetCode = Base64.idDecode(n.id);
69+
if (widgetCode.indexOf('{{widget') != -1) {
70+
this.execCommand('mceOpenmagewidget', null);
71+
}
72+
}
73+
});
74+
},
75+
76+
/**
77+
* @return {Object}
78+
*/
79+
getMetadata: function () {
80+
return {
81+
longname: 'OpenMage Widget Manager Plugin',
82+
author: 'OpenMage Core Team',
83+
authorurl: 'https://www.openmage.org',
84+
infourl: 'https://www.openmage.org',
85+
version: '1.0'
86+
};
87+
}
88+
}
89+
90+
});

0 commit comments

Comments
 (0)