Skip to content

Commit 87d09be

Browse files
xmavxmav
authored
Merge pull request #307 from magento-trigger/AC-263
AC-263: Update Plugins
2 parents 28f7650 + 9d11617 commit 87d09be

File tree

6 files changed

+81
-60
lines changed

6 files changed

+81
-60
lines changed

‎lib/web/mage/adminhtml/browser.js

Lines changed: 13 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -299,25 +299,24 @@ define([
299299
filename: fileRow.attr('id'),
300300
node: this.activeNode.id,
301301
store: this.options.storeId,
302-
'as_is': targetEl.is('textarea') ? 1 : 0,
303-
'force_static_path': targetEl.data('force_static_path') ? 1 : 0,
302+
'as_is': typeof targetEl !== 'function' && targetEl.is('textarea') ? 1 : 0,
303+
'force_static_path': typeof targetEl !== 'function' && targetEl.data('force_static_path') ? 1 : 0,
304304
'form_key': FORM_KEY
305305
},
306306
context: this,
307307
showLoader: true
308308
}).done($.proxy(function (data) {
309-
if (targetEl.is('textarea')) {
309+
if (typeof targetEl === 'function') {
310+
targetEl(data);
311+
} else if (targetEl.is('textarea')) {
310312
this.insertAtCursor(targetEl.get(0), data);
311-
} else {
312-
targetEl
313-
.val(data)
314-
.data('size', fileRow.data('size'))
315-
.data('mime-type', fileRow.data('mime-type'))
316-
.trigger('change');
317313
}
318314
MediabrowserUtility.closeDialog();
319-
targetEl.focus();
320-
jQuery(targetEl).change();
315+
316+
if (typeof targetEl !== 'function') {
317+
targetEl.focus();
318+
jQuery(targetEl).change();
319+
}
321320
}, this));
322321
},
323322

@@ -332,15 +331,10 @@ define([
332331
* return {HTMLElement|null}
333332
*/
334333
getTargetElement: function () {
335-
var opener,
336-
targetElementId,
337-
mediaBrowser = window.MediabrowserUtility;
334+
var mediaBrowser = window.MediabrowserUtility;
338335

339336
if (!_.isUndefined(wysiwyg) && wysiwyg.get(mediaBrowser.targetElementId)) {
340-
opener = this.getMediaBrowserOpener() || window;
341-
targetElementId = tinyMceEditors.get(mediaBrowser.targetElementId).getMediaBrowserTargetElementId();
342-
343-
return $(opener.document.getElementById(targetElementId));
337+
return this.getMediaBrowserOpener() || window;
344338
}
345339

346340
return $('#' + mediaBrowser.targetElementId);
@@ -354,9 +348,7 @@ define([
354348
getMediaBrowserOpener: function () {
355349
var targetElementId = window.MediabrowserUtility.targetElementId;
356350

357-
if (!_.isUndefined(wysiwyg) && wysiwyg.get(targetElementId) && !_.isUndefined(tinyMceEditors) &&
358-
!tinyMceEditors.get(targetElementId).getMediaBrowserOpener().closed
359-
) {
351+
if (!_.isUndefined(wysiwyg) && wysiwyg.get(targetElementId) && !_.isUndefined(tinyMceEditors)) {
360352
return tinyMceEditors.get(targetElementId).getMediaBrowserOpener();
361353
}
362354

‎lib/web/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentovariable/editor_plugin.js

Lines changed: 24 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,8 @@ define([
1919
* Initialize editor plugin.
2020
*
2121
* @param {tinymce.editor} editor - Editor instance that the plugin is initialized in.
22-
* @param {String} url - Absolute URL to where the plugin is located.
2322
*/
24-
init: function (editor, url) {
23+
init: function (editor) {
2524
var self = this;
2625

2726
/**
@@ -46,28 +45,41 @@ define([
4645
/**
4746
* Add button to the editor toolbar.
4847
*/
49-
editor.addButton('magentovariable', {
50-
title: jQuery.mage.__('Insert Variable'),
48+
editor.ui.registry.addIcon('magentovariable',
49+
'<svg width="24" height="24" viewBox="0 0 32.000000 32.000000" ' +
50+
'preserveAspectRatio="xMidYMid meet"><g transform="translate(0.000000,32.000000) ' +
51+
'scale(0.100000,-0.100000)" fill="#000000" stroke="none"> <path d="M68 250 c-56 -44 -75 -136 ' +
52+
'-37 -184 27 -34 42 -33 23 2 -26 50 -9 129 38 179 26 28 10 30 -24 3z"/> <path d="M266 253 c5 -10' +
53+
'9 -41 9 -70 0 -42 -6 -60 -32 -97 -36 -51 -35 -56 7 -26 54 39 78 139 44 188 -18 26 -40 30 ' +
54+
'-28 5z"/> <path d="M128 223 c-15 -4 -15 -6 0 -33 16 -28 16 -30 -11 -58 -30 -31 -34 -42 -13 ' +
55+
'-42 8 0 17 11 20 25 4 14 11 25 16 25 5 0 12 -11 16 -25 6 -25 37 -35 49 -15 3 5 2 10 -3 10 -23 0 ' +
56+
'-20 44 5 76 25 34 25 34 4 34 -12 0 -20 -4 -17 -8 2 -4 0 -14 -5 -22 -7 -10 -12 -11 -15 -4 -10 25' +
57+
' -30 40 -46 37z"/> </g> </svg>');
58+
editor.ui.registry.addToggleButton('magentovariable', {
59+
icon: 'magentovariable',
5160
tooltip: jQuery.mage.__('Insert Variable'),
52-
cmd: 'openVariablesSlideout',
53-
image: url + '/img/icon.png',
5461

5562
/**
56-
* Highlight or dismiss Insert Variable button when variable is selected or deselected.
63+
* execute openVariablesSlideout for onAction callback
5764
*/
58-
onPostRender: function () {
59-
var _this = this,
65+
onAction: function () {
66+
editor.execCommand('openVariablesSlideout');
67+
},
6068

69+
/**
70+
* Highlight or dismiss Insert Variable button when variable is selected or deselected.
71+
*/
72+
onSetup: function (api) {
6173
/**
6274
* Toggle active state of Insert Variable button.
6375
*
6476
* @param {Object} e
6577
*/
66-
toggleVariableButton = function (e) {
67-
_this.active(false);
78+
var toggleVariableButton = function (e) {
79+
api.setActive(false);
6880

6981
if (jQuery(e.target).hasClass('magento-variable')) {
70-
_this.active(true);
82+
api.setActive(true);
7183
}
7284
};
7385

‎lib/web/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentovariable/img/icon.png

-1.05 KB
Binary file not shown.

‎lib/web/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentowidget/editor_plugin.js

Lines changed: 30 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,8 @@ define([
1515

1616
/**
1717
* @param {tinymce.Editor} editor - Editor instance that the plugin is initialized in.
18-
* @param {String} url - Absolute URL to where the plugin is located.
1918
*/
20-
init: function (editor, url) {
19+
init: function (editor) {
2120
var self = this;
2221

2322
this.activePlaceholder = null;
@@ -34,27 +33,45 @@ define([
3433
});
3534

3635
// Register Widget plugin button
37-
editor.addButton('magentowidget', {
38-
title: jQuery.mage.__('Insert Widget'),
39-
cmd: 'mceMagentowidget',
40-
image: url + '/img/icon.png',
36+
editor.ui.registry.addIcon('magentowidget',
37+
'<svg width="24" height="24" viewBox="0 0 32.000000 32.000000" ' +
38+
'preserveAspectRatio="xMidYMid meet"> <g transform="translate(0.000000,32.000000) ' +
39+
'scale(0.100000,-0.100000)" fill="#000000" stroke="none"> <path d="M130 290 c0 -5 13 -10 30 ' +
40+
'-10 22 0 28 -4 24 -15 -5 -11 2 -15 26 -15 21 0 30 -4 28 -12 -7 -20 -40 -22 -50 -4 -5 9 -14 16 ' +
41+
'-20 16 -6 0 -19 7 -28 15 -9 8 -25 12 -38 8 -33 -8 -27 -26 8 -21 34 5 40 -6 12 -21 -14 -7 -25 -6 ' +
42+
'-40 5 -12 8 -23 10 -27 5 -5 -8 88 -71 105 -71 3 0 29 14 58 31 l53 30 -23 18 c-13 10 -31 20 -40 ' +
43+
'24 -10 3 -18 11 -18 17 0 5 -13 10 -30 10 -16 0 -30 -4 -30 -10z m58 -82 c-3 -7 -15 -13 -28 -13 ' +
44+
'-13 0 -25 6 -27 13 -3 8 6 12 27 12 21 0 30 -4 28 -12z"/> <path d="M30 151 l0 -60 61 -36 c33 ' +
45+
'-19 64 -35 69 -35 5 0 36 16 69 35 l61 36 0 60 0 61 -65 -37 -65 -36 -65 36 -65 37 0 -61z"/> </g>' +
46+
'</svg>');
47+
editor.ui.registry.addToggleButton('magentowidget', {
48+
icon: 'magentowidget',
49+
tooltip: jQuery.mage.__('Insert Widget'),
4150

4251
/**
43-
* Fires after the rendering has completed. This ensures the editor will be instantiated
52+
* execute openVariablesSlideout for onAction callback
4453
*/
45-
onPostRender: function () {
46-
var ctrl = this;
54+
onAction: function () {
55+
editor.execCommand('mceMagentowidget');
56+
},
4757

48-
// Add a node change handler, selects the button in the UI when a image is selected
49-
editor.on('nodeChange', function (e) {
58+
/**
59+
* Add a node change handler, selects the button in the UI when a image is selected
60+
* @param {ToolbarToggleButtonInstanceApi} api
61+
*/
62+
onSetup: function (api) {
63+
/**
64+
* NodeChange handler
65+
*/
66+
editor.on('NodeChange', function (e) {
5067
var placeholder = e.element;
5168

5269
if (self.isWidgetPlaceholderSelected(placeholder)) {
5370
widgetTools.setEditMode(true);
54-
ctrl.active(true);
71+
api.setActive(true);
5572
} else {
5673
widgetTools.setEditMode(false);
57-
ctrl.active(false);
74+
api.setActive(false);
5875
}
5976
});
6077
}

‎lib/web/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentowidget/img/icon.png

-710 Bytes
Binary file not shown.

‎lib/web/mage/adminhtml/wysiwyg/tiny_mce/tinymce5Adapter.js

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -281,17 +281,18 @@ define([
281281
}
282282

283283
if (this.config['files_browser_window_url']) {
284+
settings['file_picker_callback_types'] = 'file image media';
285+
284286
/**
285-
* @param {*} fieldName
286-
* @param {*} url
287-
* @param {*} objectType
288-
* @param {*} w
287+
* @param {*} callback
288+
* @param {*} value
289+
* @param {*} meta
289290
*/
290-
settings['file_browser_callback'] = function (fieldName, url, objectType, w) {
291+
settings['file_picker_callback'] = function (callback, value, meta) {
291292
var payload = {
292-
win: w,
293-
type: objectType,
294-
field: fieldName
293+
callback: callback,
294+
value: value,
295+
meta: meta
295296
};
296297

297298
varienGlobalEvents.fireEvent('open_browser_callback', payload);
@@ -384,15 +385,14 @@ define([
384385
'target_element_id/' + this.getId() + '/' +
385386
'store/' + storeId + '/';
386387

387-
this.mediaBrowserOpener = o.win;
388-
this.mediaBrowserTargetElementId = o.field;
388+
this.mediaBrowserOpener = o.callback;
389389

390-
if (typeof o.type !== 'undefined' && o.type !== '') { //eslint-disable-line eqeqeq
391-
wUrl = wUrl + 'type/' + o.type + '/';
390+
if (typeof o.meta.filetype !== 'undefined' && o.meta.filetype !== '') { //eslint-disable-line eqeqeq
391+
wUrl = wUrl + 'type/' + o.meta.filetype + '/';
392392
}
393393

394394
frameDialog.hide();
395-
jQuery('#mce-modal-block').hide();
395+
jQuery('.tox-tinymce-aux').hide();
396396

397397
require(['mage/adminhtml/browser'], function () {
398398
MediabrowserUtility.openDialog(wUrl, false, false, typeTitle, {
@@ -401,7 +401,7 @@ define([
401401
*/
402402
closed: function () {
403403
frameDialog.show();
404-
jQuery('#mce-modal-block').show();
404+
jQuery('.tox-tinymce-aux').show();
405405
},
406406

407407
targetElementId: self.activeEditor() ? self.activeEditor().id : null

0 commit comments

Comments
 (0)