Inline Editor js files

web dev asked on October 8, 2019 15:48

hello kentico dev every time i want add new files js in kentico mvc project i get error (element is not defined) i added new js \Content\InlineEditors\TextEditor\medium-editor\medium-button.js

but the same error HELP

Recent Answers


David te Kloese answered on October 9, 2019 12:46

Hi,

Where would you get that error? Could there be some conflicting Script or missing assets?

Scripts in ~/Content/* are automatically bundled. Perhaps you are referencing elements in you medium-button.js that are not (yet) present or expecting other scripts to have been executed already?

Could you share the medium-button.js code?

0 votesVote for this answer Mark as a Correct answer

web dev answered on October 9, 2019 17:37

hello david i was trying to make inline editor custom here is the code

hello david here is it

window.kentico.pageBuilder.registerInlineEditor("text-editor", {
    init: function (options) {
        var editor = options.editor;

        MediumButton = window['MediumButton'];

        var config = {
            toolbar: {
                buttons: ["bold", "italic", "underline", "orderedlist", "unorderedlist", "h1", "h2", "h3", "h4", "justifyLeft", "justifyCenter", "justifyRight", "smallButton"]
            },
            imageDragging: false,
            extensions: {
                imageDragging: {},
                smallButton: new MediumButton({
                    label: '<b>SM</b>',
                    start: '<small>',
                    end: '</small>'
                })
            }
        };

        if (editor.dataset.enableFormatting === "False") {
            config.toolbar = false;
            config.keyboardCommands = false;
        }

        var mediumEditor = new MediumEditor(editor, config);

        mediumEditor.subscribe("editableInput", function () {
            var event = new CustomEvent("updateProperty", {
                detail: {
                    name: options.propertyName,
                    value: mediumEditor.getContent(),
                    refreshMarkup: false
                }
            });

            editor.dispatchEvent(event);
        });
    },

    destroy: function (options) {
        var mediumEditor = MediumEditor.getEditorFromElement(options.editor);
        if (mediumEditor) {
            mediumEditor.destroy();
        }
    },

    dragStart: function (options) {
        var mediumEditor = MediumEditor.getEditorFromElement(options.editor);
        var focusedElement = mediumEditor && mediumEditor.getFocusedElement();

        var focusedMediumEditor = focusedElement && MediumEditor.getEditorFromElement(focusedElement);
        var toolbar = focusedMediumEditor && focusedMediumEditor.getExtensionByName("toolbar");

        if (focusedElement && toolbar) {
            toolbar.hideToolbar();
            focusedElement.removeAttribute("data-medium-focused");
        }
    }
});
0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.