File size: 2,152 Bytes
da2088a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
function customizeOptions(editor) {
const panelManager = editor.Panels;
const command = editor.Commands
// Command for opening the edit
command.add('custom-clear-canvas', {
run: function(editor, sender) {
// Clear components
editor.DomComponents.clear();
// Clear styles
editor.CssComposer.clear();
// Clear undo history
editor.UndoManager.clear();
// Make message
let msg = `
<div class="uk-text-left uk-text-truncate uk-animation-slide-top-small">
<div class="uk-flex uk-flex-middle">
<span class="uk-margin-remove uk-text-small">
<span uk-icon="icon: check; ratio: 0.95;"></span>
<span>You've cleared your canvas.</span>
</span>
</div>
</div>
`;
// Send notification
UIkit.notification({
message: msg,
status: 'primary',
pos: 'bottom-right',
group: 'message',
timeout: 3000
});
}
});
// Options button manager
panelManager.getButton('options', 'sw-visibility').set({
id: "sw-visibility",
className: 'gjs-pn-btn',
command: "sw-visibility",
active: true,
label: `<span uk-icon="thumbnails" uk-tooltip="title: Guide Lines; pos: bottom"></span>`
});
panelManager.getButton('options', 'preview').set({
id: "preview",
className: 'gjs-pn-btn',
command: "preview",
active: false,
label: `<span uk-icon="push" uk-tooltip="title: Preview; pos: bottom"></span>`
});
panelManager.getButton('options', 'fullscreen').set({
id: "fullscreen",
className: 'gjs-pn-btn',
command: "fullscreen",
active: false,
label: `<span uk-icon="expand" uk-tooltip="title: Set Fullscreen; pos: bottom"></span>`
});
panelManager.getButton('options', 'export-template').set({
id: "export-template",
className: 'gjs-pn-btn',
command: "export-template",
active: false,
label: `<span uk-icon="code" uk-tooltip="title: Show Code; pos: bottom"></span>`
});
// Adding new button
panelManager.addButton('options', [{
id: 'clear-canvas',
className: 'gjs-pn-btn',
command: 'custom-clear-canvas',
active: false,
label: `<span uk-icon="trash" uk-tooltip="title: Clear Canvas; pos: bottom"></span>`
}, ]);
} |