Giter Site home page Giter Site logo

Comments (1)

lorrandavid avatar lorrandavid commented on June 27, 2024 1

Maybe it's cleaner to create a plugin but I got it done like this:

var commands = editor.Commands;
commands.add('edit-template', {
    run(editor, sender) {
        var codeViewer = editor && editor.CodeManager.getViewer('CodeMirror').clone();
        var btnImp = document.createElement("button");
        var container = document.createElement("div");
        var currentTemplate = editor.runCommand('gjs-get-inlined-html');

        // Setup save button
        btnImp.innerHTML = 'Save';
        btnImp.className = 'gjs-btn-prim gjs-btn-import';
        btnImp.addEventListener('click', function() {
            var code = codeViewer.editor.getValue();
            editor.DomComponents.getWrapper().set('content', '');
            editor.setComponents(code);
            editor.Modal.close();
        });

        codeViewer.set({
            codeName: 'htmlmixed',
            theme: 'hopscotch',
            readOnly: 0
        });

        var md = editor.Modal;
        var modalContent = md.getContentEl();
        var viewer = codeViewer.editor;
        md.setTitle('HTML Editor ');

        if(!viewer) {
            var txtarea = document.createElement('textarea');
            var labelEl = document.createElement('div');
            labelEl.className = 'import-label';
            labelEl.innerHTML = 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem vero praesentium odit eum, dicta molestiae cupiditate vitae eaque asperiores nisi fugiat earum amet, officia ut, quisquam eligendi dignissimos ipsam. Aliquid.';
            container.appendChild(labelEl);
            container.appendChild(txtarea);
            container.appendChild(btnImp);
            codeViewer.init(txtarea);
            viewer = codeViewer.editor;
        }

        md.setContent('');
        md.setContent(container);
        codeViewer.setContent(currentTemplate);
        md.open();
        viewer.refresh();
    }
});

from preset-newsletter.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.