common/assets/src/tinymce/tinymce.js - dev - v.bolshakov/AIEcosystem-Testing

common/assets/src/tinymce/tinymce.js
257 строк8 KB
Developer
Initial commit
03 авг 2026, 17:43
03 авг 2026, 17:437433917
/**
 * Работы с TinyMce
 *
 * @author Dmitry E. Semenov <sde.tomsk@gmail.com>
 * @copyright Self (c) 2021
 */
var TinyMce = function () {

    var tinymce_templates = [];

    var external_plugins = {};

    var content_css = [];

    var proxy = '';

    return {
        /**
         * @param proxy
         */
        registerPath: function (path) {
            proxy = path;

            for (var i = 0; i < tinymce_templates.length; i++) {
                tinymce_templates[i]['url'] = App.absoluteUrl() + proxy + tinymce_templates[i]['name'];
            }
        },

        /**
         * @param template
         */
        registerTemplate: function (template) {
            tinymce_templates.push({name: template.name, title: template.title});
        },

        /**
         * @param template
         */
        registerPlugin: function (plugin) {
            external_plugins = $.extend(external_plugins, plugin);
        },

        /**
         * @param template
         */
        registerCss: function (css) {
            content_css.push(css);
        },

        getTemplate: function () {
            return tinymce_templates;
        },

        getPlugins: function () {
            return external_plugins;
        },

        getCss: function () {
            return content_css;
        },
    }
}();


jQuery(document).ready(function ($) {

    var plugins = [
        'advlist autolink lists link image hr anchor',
        'searchreplace wordcount visualblocks visualchars code fullscreen',
        'media nonbreaking save table contextmenu directionality',
        'emoticons template paste textcolor colorpicker textpattern noneditable'
    ];

    var simple_plugins = [
        'searchreplace wordcount visualblocks visualchars code fullscreen',
        'nonbreaking table',
        'template paste noneditable'
    ];

    var toolbar = 'code | insertfile undo redo | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image media | forecolor backcolor fontsizeselect iconmoon openstreet | template';
    var simple_toolbar = 'undo redo | bold italic underline | alignleft aligncenter alignright alignjustify | outdent indent';

    var linkClassList = [
        {title: 'Без классов', value: ''},
        {title: 'Черная ссылка', value: 'link-text'},
    ];

    var tableClassList = [
        {title: 'Без классов', value: ''},
        {title: 'Таблица (адаптивная, обычная)', value: 'table table_responsive'},
    ];

    var textColorMap = [
        "000000", "Black",
        "993300", "Burnt orange",
        "003300", "Dark green",
        "003366", "Dark azure",
        "000080", "Navy Blue",
        "333399", "Indigo",
        "333333", "Very dark gray",
        "800000", "Maroon",
        "FF6600", "Orange",
        "808000", "Olive",
        "008000", "Green",
        "008080", "Teal",
        "0000FF", "Blue",
        "666699", "Grayish blue",
        "808080", "Gray",
        "FF0000", "Red",
        "FF9900", "Amber",
        "99CC00", "Yellow green",
        "339966", "Sea green",
        "33CCCC", "Turquoise",
        "3366FF", "Royal blue",
        "800080", "Purple",
        "999999", "Medium gray",
        "FF00FF", "Magenta",
        "FFCC00", "Gold",
        "FFFF00", "Yellow",
        "00FF00", "Lime",
        "00FFFF", "Aqua",
        "00CCFF", "Sky blue",
        "993366", "Red violet",
        "FFFFFF", "White",
        "FF99CC", "Pink",
        "FFCC99", "Peach",
        "FFFF99", "Light yellow"
    ];

    /**
     * Открывает окно выбора изображения в системе.
     * @param callback - callback функция tinymce от метода file_picker_callback.
     */
    function openFileDialog(callback, meta) {

        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', 'image/*');
        input.onchange = function () {
            var file = this.files[0];

            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function (event) {
                uploadImageOnServer(event.target.result, file, callback, meta)
            };
        };
        input.click();
    }

    /**
     * Загружает выбранное изображение на сервер.
     * @param fileDataUrl - файл изображения в DataURL.
     * @param file - Объект файл
     * @param callback - callback функция tinymce от метода file_picker_callback.
     * @param meta - дополнительные данные
     */
    function uploadImageOnServer(fileDataUrl, file, callback, meta) {

        var url = App.absoluteUrl() + "/data/file/upload-encoded.html";

        $.ajax({
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            url: url,
            method: "POST",
            data: {encodedImage: fileDataUrl, filename: file.name, filetype: meta.filetype},
            dataType: "json",
            success: function (data) {
                if (data.message) {
                    alert(data.message);
                }

                if (data.error) {
                    return false;
                }

                callback(data.link);
                return true;
            }
        });
    }

    // Initialize
    function init($dom) {

        var $el = $('.js-tinymce', $dom);
        if ($el.length == 0) return;

        menubar = true;

        if ($el.hasClass('simple')) {
            plugins = simple_plugins;
            toolbar = simple_toolbar;
            menubar = 'file edit insert view table tools';
        }

        tinymce.init({
//            target: $el,
            selector: '.js-tinymce',
            menubar: menubar,
            object_resizing: 'img',
            content_css: TinyMce.getCss(),
            templates: TinyMce.getTemplate(),
            external_plugins: TinyMce.getPlugins(),
            file_picker_callback: function (callback, value, meta) {
                openFileDialog(callback, meta);
            },
            fontsize_formats: "16px 18px 20px 25px 27px 30px 34px 50px",
            plugins: plugins,
            toolbar: toolbar,
            extended_valid_elements: 'p[*],span[*],div[*],td[*]',
            // @TODO не работает если прописывать классы через запятую.
            noneditable_noneditable_class: "widget-lock, fa",
            template_popup_width: 1024,
            template_popup_height: 768,
            link_class_list: linkClassList,
            table_class_list: tableClassList,
            convert_urls: false,
            textcolor_map: textColorMap,
            setup: function (editor) {
                editor.addMenuItem('lead', {
                    text: 'Lead',
                    context: 'format',
                    onclick: function () {
                        tinymce.activeEditor.dom.toggleClass(tinymce.activeEditor.selection.getNode(), 'lead');
                    }
                });
            },
            style_formats: [
                {
                    title: 'Icon TextIndent',
                    block: 'p',
                    styles: {
                        marginLeft: '22px',
                        textIndent: '-22px'
                    }
                }
            ],
            style_formats_merge: true,
            color_picker_callback: function (callback, value) {
                callback('#6fa53b');
            }
        });

        $el
            .parents('form')
            .on('beforeValidate', function () {
                tinymce.triggerSave();
            });
    }

    init($(document));

    $(document).on('ajax-loaded', function (event, form) {
        init(form);
    });
});