Skip to content

Commit

Permalink
New layout for menus and menubars
Browse files Browse the repository at this point in the history
  • Loading branch information
fballiano committed Aug 22, 2023
1 parent 5dd9689 commit 0bc43f4
Show file tree
Hide file tree
Showing 4 changed files with 52 additions and 32 deletions.
2 changes: 1 addition & 1 deletion app/code/core/Mage/Cms/etc/config.xml
Original file line number Diff line number Diff line change
Expand Up @@ -200,7 +200,7 @@
<cms>
<wysiwyg>
<enabled>enabled</enabled>
<skin>tinymce-5</skin>
<skin>oxide</skin>
</wysiwyg>
</cms>
<system>
Expand Down
18 changes: 13 additions & 5 deletions js/mage/adminhtml/wysiwyg/tinymce/plugins/openmagevariable.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,13 +31,21 @@ tinymce.PluginManager.add('openmagevariable', (ed, url) => {
'<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"/>' +
'</svg>'
);


let onAction = function () {
editor.execCommand('openVariablesPopup');
}

editor.ui.registry.addToggleButton('openmagevariable', {
icon: 'openmagevariable',
tooltip: Translator.translate('Insert Variable'),
onAction: function () {
editor.execCommand('openVariablesPopup');
}
tooltip: Translator.translate('OpenMage Variable'),
onAction: onAction
});

editor.ui.registry.addMenuItem('openmagevariable', {
icon: 'openmagevariable',
text: Translator.translate('OpenMage Variable'),
onAction: onAction
});
},

Expand Down
45 changes: 28 additions & 17 deletions js/mage/adminhtml/wysiwyg/tinymce/plugins/openmagewidget.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,25 +35,36 @@ tinymce.PluginManager.add('openmagewidget', (ed, url) => {
'</svg>'
);

let onAction = function () {
editor.execCommand('mceOpenmagewidget');
}

let onSetup = function (api) {
// Add a node change handler, selects the button in the UI when a image is selected
editor.on('NodeChange', function (e) {
api.setActive(false);
var n = e.target;
if (n.id && n.nodeName == 'IMG') {
var widgetCode = Base64.idDecode(n.id);
if (widgetCode.indexOf('{{widget') != -1) {
api.setActive(true);
}
}
});
}

editor.ui.registry.addToggleButton('openmagewidget', {
icon: 'openmagewidget',
tooltip: Translator.translate('Insert Widget'),
onAction: function () {
editor.execCommand('mceOpenmagewidget');
},
onSetup: function (api) {
// Add a node change handler, selects the button in the UI when a image is selected
editor.on('NodeChange', function (e) {
api.setActive(false);
var n = e.target;
if (n.id && n.nodeName == 'IMG') {
var widgetCode = Base64.idDecode(n.id);
if (widgetCode.indexOf('{{widget') != -1) {
api.setActive(true);
}
}
});
}
tooltip: Translator.translate('OpenMage Widget'),
onAction: onAction,
onSetup: onSetup
});

editor.ui.registry.addMenuItem('openmagewidget', {
icon: 'openmagewidget',
text: Translator.translate('OpenMage Variable'),
onAction: onAction,
onSetup: onSetup
});

// Add a widget placeholder image double click callback
Expand Down
19 changes: 10 additions & 9 deletions js/mage/adminhtml/wysiwyg/tinymce/setup.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,12 +55,8 @@ tinyMceWysiwygSetup.prototype =


getSettings: function (mode) {
var plugins = 'autoresize accordion searchreplace visualblocks visualchars anchor code lists advlist fullscreen pagebreak table wordcount directionality image charmap link media nonbreaking';
var toolbar = [
'bold italic underline strikethrough | alignleft aligncenter alignright alignjustify alignnone | styles fontfamily fontsize',
'cut paste pastetext copy | searchreplace | bullist numlist advlist accordion | indent outdent blockquote | undo redo | link unlink anchor | image charmap media code | forecolor backcolor',
'table | h1 h2 h3 h4 h5 h6 | hr removeformat | subscript superscript | visualblocks visualchars nonbreaking pagebreak | ltr rtl | wordcount fullscreen'
];
var plugins = 'autoresize accordion searchreplace visualblocks visualchars anchor code lists advlist fullscreen pagebreak table wordcount directionality image charmap link media nonbreaking help';
var toolbar = 'undo redo | bold italic underline strikethrough | insertfile image media template link anchor codesample | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | forecolor backcolor removeformat | fontfamily fontsize blocks | pagebreak | charmap | fullscreen preview save print | ltr rtl'

// load and add to toolbar openmagePlugins
if (this.openmagePluginsOptions) {
Expand All @@ -69,16 +65,21 @@ tinyMceWysiwygSetup.prototype =
plugins = plugin.key + ' ' + plugins;
openmageToolbarButtons = plugin.key + ' ' + openmageToolbarButtons;
});
toolbar[0] = openmageToolbarButtons + ' | ' + toolbar[0];
toolbar = openmageToolbarButtons + ' | ' + toolbar;
}

var settings = {
selector: this.selector,
config: this.config,
menubar: false,
menu: {
insert: {
title: 'Insert',
items: 'image link media addcomment pageembed template codesample inserttable | openmagevariable openmagewidget | charmap emoticons hr | pagebreak nonbreaking anchor tableofcontents | insertdatetime'
}
},
menubar: 'file edit view insert format tools table help',
plugins: plugins,
toolbar: toolbar,
toolbar_mode: 'scrolling',
language: this.config.lang,
paste_as_text: true,
file_picker_types: 'file image media',
Expand Down

0 comments on commit 0bc43f4

Please sign in to comment.