src/js/inscrybmde.js
function toggleSideBySide(editor) {
    var cm = editor.codemirror;
    var wrapper = cm.getWrapperElement();
    var preview = wrapper.nextSibling;
    var toolbarButton = editor.toolbarElements['side-by-side'];
    var useSideBySideListener = false;
    if (/editor-preview-active-side/.test(preview.className)) {
        preview.className = preview.className.replace(
            /\s*editor-preview-active-side\s*/g, ''
        );
        toolbarButton.className = toolbarButton.className.replace(/\s*active\s*/g, '');
        wrapper.className = wrapper.className.replace(/\s*CodeMirror-sided\s*/g, ' ');
    } else {
        // When the preview button is clicked for the first time,
        // give some time for the transition from editor.css to fire and the view to slide from right to left,
        // instead of just appearing.
        setTimeout(function () {
            if (!cm.getOption('fullScreen'))
                toggleFullScreen(editor);
            preview.className += ' editor-preview-active-side';
        }, 1);
        toolbarButton.className += ' active';
        wrapper.className += ' CodeMirror-sided';
        useSideBySideListener = true;
    }

    // Hide normal preview if active
    var previewNormal = wrapper.lastChild;
    if (/editor-preview-active/.test(previewNormal.className)) {
        previewNormal.className = previewNormal.className.replace(
            /\s*editor-preview-active\s*/g, ''
        );
        var toolbar = editor.toolbarElements.preview;
        var toolbar_div = wrapper.previousSibling;
        toolbar.className = toolbar.className.replace(/\s*active\s*/g, '');
        toolbar_div.className = toolbar_div.className.replace(/\s*disabled-for-preview*/g, '');
    }

    var sideBySideRenderingFunction = function () {
        preview.innerHTML = editor.options.previewRender(editor.value(), preview);
    };

    if (!cm.sideBySideRenderingFunction) {
        cm.sideBySideRenderingFunction = sideBySideRenderingFunction;
    }

    if (useSideBySideListener) {
        preview.innerHTML = editor.options.previewRender(editor.value(), preview);
        cm.on('update', cm.sideBySideRenderingFunction);
    } else {
        cm.off('update', cm.sideBySideRenderingFunction);
    }

    // Refresh to fix selection being off (#309)
    cm.refresh();
}
function toggleSideBySide(editor) {
    var cm = editor.codemirror;
    var wrapper = cm.getWrapperElement();
    var preview = wrapper.nextSibling;
    var toolbarButton = editor.toolbarElements['side-by-side'];
    var useSideBySideListener = false;
    if (/editor-preview-active-side/.test(preview.className)) {
        preview.className = preview.className.replace(
            /\s*editor-preview-active-side\s*/g, ''
        );
        toolbarButton.className = toolbarButton.className.replace(/\s*active\s*/g, '');
        wrapper.className = wrapper.className.replace(/\s*CodeMirror-sided\s*/g, ' ');
    } else {
        // When the preview button is clicked for the first time,
        // give some time for the transition from editor.css to fire and the view to slide from right to left,
        // instead of just appearing.
        setTimeout(function () {
            if (!cm.getOption('fullScreen'))
                toggleFullScreen(editor);
            preview.className += ' editor-preview-active-side';
        }, 1);
        toolbarButton.className += ' active';
        wrapper.className += ' CodeMirror-sided';
        useSideBySideListener = true;
    }

    // Hide normal preview if active
    var previewNormal = wrapper.lastChild;
    if (/editor-preview-active/.test(previewNormal.className)) {
        previewNormal.className = previewNormal.className.replace(
            /\s*editor-preview-active\s*/g, ''
        );
        var toolbar = editor.toolbarElements.preview;
        var toolbar_div = wrapper.previousSibling;
        toolbar.className = toolbar.className.replace(/\s*active\s*/g, '');
        toolbar_div.className = toolbar_div.className.replace(/\s*disabled-for-preview*/g, '');
    }

    var sideBySideRenderingFunction = function () {
        preview.innerHTML = editor.options.previewRender(editor.value(), preview);
    };

    if (!cm.sideBySideRenderingFunction) {
        cm.sideBySideRenderingFunction = sideBySideRenderingFunction;
    }

    if (useSideBySideListener) {
        preview.innerHTML = editor.options.previewRender(editor.value(), preview);
        cm.on('update', cm.sideBySideRenderingFunction);
    } else {
        cm.off('update', cm.sideBySideRenderingFunction);
    }

    // Refresh to fix selection being off (#309)
    cm.refresh();
}
function toggleSideBySide ( editor ) { var cm = editor . codemirror ; var wrapper = cm . getWrapperElement ( ) ; var preview = wrapper . nextSibling ; var toolbarButton = editor . toolbarElements [ 'side-by-side' ] ; var useSideBySideListener = false ; if ( / editor-preview-active-side / . test ( preview . className ) ) { preview . className = preview . className . replace ( / \s*editor-preview-active-side\s* / g , '' ) ; toolbarButton . className = toolbarButton . className . replace ( / \s*active\s* / g , '' ) ; wrapper . className = wrapper . className . replace ( / \s*CodeMirror-sided\s* / g , ' ' ) ; } else { // When the preview button is clicked for the first time, // give some time for the transition from editor.css to fire and the view to slide from right to left, // instead of just appearing. setTimeout ( function ( ) { if ( ! cm . getOption ( 'fullScreen' ) ) toggleFullScreen ( editor ) ; preview . className += ' editor-preview-active-side' ; } , 1 ) ; toolbarButton . className += ' active' ; wrapper . className += ' CodeMirror-sided' ; useSideBySideListener = true ; } // Hide normal preview if active var previewNormal = wrapper . lastChild ; if ( / editor-preview-active / . test ( previewNormal . className ) ) { previewNormal . className = previewNormal . className . replace ( / \s*editor-preview-active\s* / g , '' ) ; var toolbar = editor . toolbarElements . preview ; var toolbar_div = wrapper . previousSibling ; toolbar . className = toolbar . className . replace ( / \s*active\s* / g , '' ) ; toolbar_div . className = toolbar_div . className . replace ( / \s*disabled-for-preview* / g , '' ) ; } var sideBySideRenderingFunction = function ( ) { preview . innerHTML = editor . options . previewRender ( editor . value ( ) , preview ) ; } ; if ( ! cm . sideBySideRenderingFunction ) { cm . sideBySideRenderingFunction = sideBySideRenderingFunction ; } if ( useSideBySideListener ) { preview . innerHTML = editor . options . previewRender ( editor . value ( ) , preview ) ; cm . on ( 'update' , cm . sideBySideRenderingFunction ) ; } else { cm . off ( 'update' , cm . sideBySideRenderingFunction ) ; } // Refresh to fix selection being off (#309) cm . refresh ( ) ; }
Toggle side by side preview
Toggle side by side preview