mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-02-23 14:44:53 +01:00
Code Issues Releases Wiki Activity

Make console work with detached mode also. fixes #92

Browse Source
This commit is contained in:
Kushagra Gour 2017-09-17 01:36:54 +05:30
parent 748c8a0b00
commit 2879758ae0
3 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/index.html
View File

@ -155,7 +155,8 @@
</div>
</div>
</div>
<div class="footer">
<div class="global-console-container" id="globalConsoleContainerEl"></div>
<div id="footer" class="footer">
<div class="footer__right fr">
<a id="saveHtmlBtn" class="mode-btn hint--rounded hint--top-left" data-hint="Save as HTML file">
<svg viewBox="0 0 24 24">

6
src/script.js
View File

@ -6,7 +6,8 @@ notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, saveBtn, settings
onboardModal, settingsModal, notificationsBtn, onboardShowInTabOptionBtn, editorThemeLinkTag,
onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl, indentationSizeValueEl,
runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyleTemplate,
customEditorFontInput, cssSettingsModal, cssSettingsBtn, acssSettingsTextarea
customEditorFontInput, cssSettingsModal, cssSettingsBtn, acssSettingsTextarea,
globalConsoleContainerEl
*/
/* eslint-disable no-extra-semi */
(function(alertsService) {
@ -1864,6 +1865,7 @@ customEditorFontInput, cssSettingsModal, cssSettingsBtn, acssSettingsTextarea
const iframeWidth = iframeBounds.width;
const iframeHeight = iframeBounds.height;
document.body.classList.add('is-detached-mode');
globalConsoleContainerEl.insertBefore(consoleEl, null);
scope.detachedWindow = window.open(
'./preview.html',
@ -1877,6 +1879,8 @@ customEditorFontInput, cssSettingsModal, cssSettingsBtn, acssSettingsTextarea
if (scope.detachedWindow && scope.detachedWindow.closed) {
clearInterval(intervalID);
document.body.classList.remove('is-detached-mode');
$('#js-demo-side').insertBefore(consoleEl, null);
scope.detachedWindow = null;
}
}
var intervalID = window.setInterval(checkWindow, 500);

18
src/style.css
View File

@ -296,6 +296,10 @@ li.CodeMirror-hint-active {
z-index: 1;
background: white;
}
/* When demo frame is in detached window */
body > #demo-frame {
height: 100%; /* Because console is no more here */
}
.main-header,
.footer {
padding: 5px 10px;
@ -897,7 +901,19 @@ li.CodeMirror-hint-active {
.console:not(.is-minimized) .code-wrap__header {
cursor: ns-resize;
}
.global-console-container {
display: none;
position: relative;
height: 35px;
}
/* Detached mode */
.is-detached-mode .console,
.is-detached-mode .footer {
z-index: 4;
}
.is-detached-mode .global-console-container {
display: block;
}
/* Codemirror themes basic bg styles. This is here so that there is no big FOUC
while the theme CSS file is loading */