芝麻web文件管理V1.00
编辑当前文件:/home2/sdektunc/.trash/media/plg_editors_tinymce/js/tinymce-builder.js
/** * @copyright (C) 2019 Open Source Matters, Inc.
* @license GNU General Public License version 2 or later; see LICENSE.txt */ if (!Joomla) { throw new Error('Joomla API is not properly initialised'); } /** * Fake TinyMCE object to allow to use TinyMCE translation for the button labels * * @since 3.7.0 */ const tinymce = { langCode: 'en', langStrings: {}, icons: { 'accessibility-check': '
', 'align-center': '
', 'align-justify': '
', 'align-left': '
', 'align-none': '
', 'align-right': '
', 'arrow-left': '
', 'arrow-right': '
', backcolor: '
', bold: '
', bookmark: '
', 'border-width': '
', brightness: '
', browse: '
', cancel: '
', 'change-case': '
', 'character-count': '
', checklist: '
', checkmark: '
', 'chevron-down': '
', 'chevron-left': '
', 'chevron-right': '
', 'chevron-up': '
', close: '
', 'code-sample': '
', 'color-levels': '
', 'color-picker': '
', 'color-swatch-remove-color': '
', 'color-swatch': '
', comment: '
', contrast: '
', copy: '
', crop: '
', cut: '
', 'document-properties': '
', drag: '
', duplicate: '
', 'edit-image': '
', 'embed-page': '
', embed: '
', emoji: '
', fill: '
', 'flip-horizontally': '
', 'flip-vertically': '
', forecolor: '
', 'format-painter': '
', fullscreen: '
', gamma: '
', help: '
', home: '
', 'horizontal-rule': '
', 'image-options': '
', image: '
', indent: '
', indeterminate: '
', info: '
', 'insert-character': '
', 'insert-time': '
', invert: '
', italic: '
', line: '
', lineheight: '
', link: '
', 'list-bull-circle': '
', 'list-bull-default': '
', 'list-bull-square': '
', 'list-num-default': '
', 'list-num-lower-alpha': '
', 'list-num-lower-greek': '
', 'list-num-lower-roman': '
', 'list-num-upper-alpha': '
', 'list-num-upper-roman': '
', lock: '
', ltr: '
', 'more-drawer': '
', 'new-document': '
', 'new-tab': '
', 'non-breaking': '
', notice: '
', 'ordered-list': '
', orientation: '
', outdent: '
', 'page-break': '
', paragraph: '
', 'paste-text': '
', paste: '
', 'permanent-pen': '
', plus: '
', preferences: '
', preview: '
', print: '
', quote: '
', redo: '
', reload: '
', 'remove-formatting': '
', remove: '
', 'resize-handle': '
', resize: '
', 'restore-draft': '
', 'rotate-left': '
', 'rotate-right': '
', rtl: '
', save: '
', search: '
', 'select-all': '
', selected: '
', settings: '
', sharpen: '
', sourcecode: '
', 'spell-check': '
', 'strike-through': '
', subscript: '
', superscript: '
', 'table-cell-properties': '
', 'table-cell-select-all': '
', 'table-cell-select-inner': '
', 'table-delete-column': '
', 'table-delete-row': '
', 'table-delete-table': '
', 'table-insert-column-after': '
', 'table-insert-column-before': '
', 'table-insert-row-above': '
', 'table-insert-row-after': '
', 'table-left-header': '
', 'table-merge-cells': '
', 'table-row-properties': '
', 'table-split-cells': '
', 'table-top-header': '
', table: '
', template: '
', 'temporary-placeholder': '
', toc: '
', translate: '
', underline: '
', undo: '
', unlink: '
', unlock: '
', 'unordered-list': '
', unselected: '
', upload: '
', user: '
', visualblocks: '
', visualchars: '
', warning: '
', 'zoom-in': '
', 'zoom-out': '
' }, iconsmap: { aligncenter: 'align-center', alignjustify: 'align-justify', alignleft: 'align-left', alignright: 'align-right', anchor: 'bookmark', blockquote: 'quote', bullist: 'unordered-list', charmap: 'insert-character', code: 'sourcecode', codesample: 'code-sample', emoticons: 'emoji', hr: 'horizontal-rule', insertdatetime: 'insert-time', media: 'embed', nonbreaking: 'non-breaking', numlist: 'ordered-list', pagebreak: 'page-break', pastetext: 'paste-text', removeformat: 'remove-formatting', searchreplace: 'search', strikethrough: 'strike-through' }, addI18n: (code, strings) => { tinymce.langCode = code; tinymce.langStrings = strings || {}; }, translate: string => tinymce.langStrings[string] || string, showIcon: name => { const iconname = tinymce.iconsmap[name] || name; return tinymce.icons[iconname] || tinymce.icons[name] || name; } }; window.tinymce = tinymce; const TinyMCEBuilder = (container, options) => { const $sourceMenu = container.querySelector('.tinymce-builder-menu.source'); const $sourceToolbar = container.querySelector('.tinymce-builder-toolbar.source'); const $targetMenu = container.querySelectorAll('.tinymce-builder-menu.target'); const $targetToolbar = container.querySelectorAll('.tinymce-builder-toolbar.target'); /** * Append input to the button item * @param {HTMLElement} element * @param {String} group * @param {String} set * * @since 3.7.0 */ const appendInput = (element, group, set) => { const name = `${options.formControl}[${set}][${group}][]`; const value = element.getAttribute('data-name'); element.innerHTML += Joomla.sanitizeHtml(`
`); }; /** * Create the element needed for renderBar() * @param {String} name * @param {Object} info * @param {String} type * * @return {jQuery} * * @since 3.7.0 */ const createButton = (name, info, type) => { const title = tinymce.translate(info.label); let content = ''; let bclass = 'tox-mbtn'; if (type === 'menu') { content = title; } else if (info.text) { const text = tinymce.translate(info.text); bclass += ' tox-tbtn--bespoke'; const chevron = tinymce.showIcon('chevron-down'); content = info.text !== '|' ? `
${text}
${chevron}
` : text; } else { content = tinymce.showIcon(name); } return `
${content}
`; }; /** * Render the toolbar/menubar * * @param {HTMLElement} box The toolbar container * @param {String} type The type toolbar or menu * @param {Array|null} value The value * @param {Boolean} withInput Whether append input * * @since 3.7.0 */ const renderBar = (box, type, val, withInput) => { const group = box.getAttribute('data-group'); const set = box.getAttribute('data-set'); const items = type === 'menu' ? options.menus : options.buttons; const value = val || JSON.parse(box.getAttribute('data-value')) || []; let item; let name; for (let i = 0, l = value.length; i < l; i += 1) { name = value[i]; item = items[name]; if (item) { // Buttons are predefined in this file, so safe box.innerHTML += createButton(name, item, type); const newbutton = box.querySelector('.tox-mbtn:last-child'); // Enable tooltip if (newbutton && newbutton.tooltip) { newbutton.tooltip({ trigger: 'hover' }); } // Add input if (withInput) { appendInput(newbutton, group, set); } } } }; /** * Clear the pane for specific set * @param {Object} sets Options {set: 1} */ const clearPane = sets => { const { set: item } = sets; $targetMenu.forEach(elem => { if (elem.getAttribute('data-set') === item) { elem.innerHTML = ''; } }); $targetToolbar.forEach(elem => { if (elem.getAttribute('data-set') === item) { elem.innerHTML = ''; } }); }; /** * Set Selected preset to specific set * @param {Object} attrib Options {set: 1, preset: 'presetName'} */ const setPreset = attrib => { const { set: item } = attrib; const preset = options.toolbarPreset[attrib.preset] || null; if (!preset) { throw new Error(`Unknown Preset "${attrib.preset}"`); } clearPane(attrib); Object.keys(preset).forEach(group => { const type = group === 'menu' ? 'menu' : 'toolbar'; // Find correct container for current set if (group === 'menu') { $targetMenu.forEach(target => { if (target.getAttribute('data-group') === group && target.getAttribute('data-set') === item) { renderBar(target, type, preset[group], true); } }); } else { $targetToolbar.forEach(target => { if (target.getAttribute('data-group') === group && target.getAttribute('data-set') === item) { renderBar(target, type, preset[group], true); } }); } }); }; // Build menu + toolbar renderBar($sourceMenu, 'menu'); renderBar($sourceToolbar, 'toolbar'); // Initialize drag & drop /* global dragula */ const drakeMenu = dragula([$sourceMenu], { copy: (el, source) => source === $sourceMenu, accepts: (el, target) => target !== $sourceMenu, removeOnSpill: true }).on('drag', () => { $targetMenu.forEach(target => { target.classList.add('drop-area-highlight'); }); }).on('dragend', () => { $targetMenu.forEach(target => { target.classList.remove('drop-area-highlight'); }); }).on('drop', (el, target) => { if (target !== $sourceMenu) { appendInput(el, target.getAttribute('data-group'), target.getAttribute('data-set')); } }); $targetMenu.forEach(target => { renderBar(target, 'menu', null, true); drakeMenu.containers.push(target); }); const drakeToolbar = dragula([$sourceToolbar], { copy: (el, source) => source === $sourceToolbar, accepts: (el, target) => target !== $sourceToolbar, removeOnSpill: true }).on('drag', () => { $targetToolbar.forEach(target => { target.classList.add('drop-area-highlight'); }); }).on('dragend', () => { $targetToolbar.forEach(target => { target.classList.remove('drop-area-highlight'); }); }).on('drop', (el, target) => { if (target !== $sourceToolbar) { appendInput(el, target.getAttribute('data-group'), target.getAttribute('data-set')); } }); $targetToolbar.forEach(target => { renderBar(target, 'toolbar', null, true); drakeToolbar.containers.push(target); }); // Bind actions buttons const actionButtons = container.querySelectorAll('.button-action'); actionButtons.forEach(elem => { elem.addEventListener('click', ({ target }) => { const action = target.getAttribute('data-action'); const actionoptions = {}; [].forEach.call(target.attributes, attrib => { if (/^data-/.test(attrib.name)) { const key = attrib.name.substr(5); actionoptions[key] = attrib.value; } }); // Don't allow wild function calling switch (action) { case 'clearPane': clearPane(actionoptions); break; case 'setPreset': setPreset(actionoptions); break; default: throw new Error(`Unsupported action: ${action}`); } }); }); }; const options = Joomla.getOptions ? Joomla.getOptions('plg_editors_tinymce_builder', {}) : Joomla.optionsStorage.plg_editors_tinymce_builder || {}; const builder = document.getElementById('joomla-tinymce-builder'); TinyMCEBuilder(builder, options); const selects = builder.querySelectorAll('.access-select'); // Allow to select the group only once per the set const toggleAvailableOption = () => { selects.forEach(select => { select.enableAllOptions(); }); // Disable already selected options in the other selects selects.forEach(select => { const values = select.value; selects.forEach(select1 => { if (select === select1) { return; } values.forEach(value => { select1.disableByValue(value); }); }); }); }; window.addEventListener('load', () => toggleAvailableOption()); // Allow to select the group only once per the set selects.forEach(select => { select.addEventListener('change', () => { toggleAvailableOption(); }); });