diff --git a/src/css/easymde.css b/src/css/easymde.css index 1a0881a..d2416ee 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -31,6 +31,11 @@ width: 50% !important; } +.CodeMirror-sided--no-fullscreen { + position: relative; + float: left; +} + .CodeMirror-placeholder { opacity: .5; } @@ -195,6 +200,10 @@ text-align: right; } +.editor-statusbar.sided--no-fullscreen { + clear: both; +} + .editor-statusbar span { display: inline-block; min-width: 4em; @@ -243,6 +252,14 @@ display: block } +.editor-preview-active-side--no-fullscreen { + height: auto; + position: static; + min-height: calc(300px + 22px); + width: calc(50% - 0px); + float: right; +} + .editor-preview-active { display: block } diff --git a/src/js/easymde.js b/src/js/easymde.js index b6c7a1e..dd8fb79 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -858,6 +858,18 @@ function toggleSideBySide(editor) { var toolbarButton = editor.toolbarElements && editor.toolbarElements['side-by-side']; var useSideBySideListener = false; if (/editor-preview-active-side/.test(preview.className)) { + if (cm.getOption('sideBySideFullscreen')) { + cm.setOption('sideBySideFullscreen', false); + wrapper.className = wrapper.className.replace( + /\s*CodeMirror-sided--no-fullscreen\s*/g, '' + ); + preview.className = preview.className.replace( + /\s*editor-preview-active-side--no-fullscreen\s*/g, '' + ); + editor.gui.statusbar.className = editor.gui.statusbar.className.replace( + /\s*sided--no-fullscreen\s*/g, '' + ); + } preview.className = preview.className.replace( /\s*editor-preview-active-side\s*/g, '' ); @@ -868,8 +880,16 @@ function toggleSideBySide(editor) { // 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); + if (!cm.getOption('fullScreen')) { + if (editor.options.sideBySideFullscreen === false) { + cm.setOption('sideBySideFullscreen', true); + wrapper.className += ' CodeMirror-sided--no-fullscreen'; + preview.className += ' editor-preview-active-side--no-fullscreen'; + editor.gui.statusbar.className += ' sided--no-fullscreen'; + } else { + toggleFullScreen(editor); + } + } preview.className += ' editor-preview-active-side'; }, 1); if (toolbarButton) toolbarButton.className += ' active';