1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-13 18:16:19 +02:00

add chrome like dev console! fixes #56

This commit is contained in:
Kushagra Gour
2017-05-07 16:59:47 +05:30
parent 5827cbe6c8
commit 88a49cd4c5
4 changed files with 261 additions and 4 deletions

View File

@ -5,7 +5,7 @@ addLibraryModal, addLibraryModal, notificationsBtn, notificationsModal, notifica
notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, saveBtn, settingsBtn,
onboardModal, settingsModal, notificationsBtn, onboardShowInTabOptionBtn, editorThemeLinkTag,
onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl, indentationSizeValueEl,
runBtn, searchInput
runBtn, searchInput, consoleEl, consoleLogEl
*/
/* eslint-disable no-extra-semi */
;(function (alertsService) {
@ -91,6 +91,7 @@ runBtn, searchInput
;
scope.cm = {};
scope.consoleCm;
scope.demoFrameDocument = frame.contentDocument || frame.contentWindow.document;
// Check all the code wrap if they are minimized or not
@ -734,6 +735,9 @@ runBtn, searchInput
+ '<body>\n' + html + '\n'
+ externalJs + '\n';
contents += '<script src="'
+ chrome.extension.getURL('screenlog.js') + '"></script>';
if (js) {
contents += '<script>\n' + js + '\n//# sourceURL=userscript.js';
} else {
@ -969,6 +973,17 @@ runBtn, searchInput
});
Inlet(scope.cm.js);
// Initialize codemirror in console
scope.consoleCm = CodeMirror(consoleLogEl, {
mode: 'javascript',
lineWrapping: true,
theme: 'monokai',
foldGutter: true,
readOnly: true,
viewportMargin: Infinity,
gutters: [ 'CodeMirror-foldgutter' ]
});
function openSettings() {
settingsModal.classList.toggle('is-modal-visible');
@ -1252,6 +1267,7 @@ runBtn, searchInput
scope.cm[type].setOption('keyMap', $('[data-setting=keymap]:checked').value);
scope.cm[type].refresh();
});
scope.consoleCm.setOption('theme', $('[data-setting=editorTheme]').value);
};
scope.onNewBtnClick = function () {
@ -1287,6 +1303,22 @@ runBtn, searchInput
trackEvent('ui', 'searchInputType');
};
scope.toggleConsole = function () {
consoleEl.classList.toggle('is-open');
};
scope.clearConsole = function () {
scope.consoleCm.setValue('');
};
window.onMessageFromConsole = function() {
[...arguments].forEach(function(arg) {
if (arg.indexOf && arg.indexOf('filesystem:chrome-extension') !== -1) {
arg = arg.replace(/filesystem:chrome-extension.*\.js:(\d+):(\d+)/g, 'script $1:$2');
}
scope.consoleCm.replaceRange('\n' + arg + ((arg + '').match(/\[object \w+\]/) ? JSON.stringify(arg) : '') + ' ', {line: Infinity});
});
}
function compileNodes() {
function attachListenerForEvent(eventName) {
@ -1505,6 +1537,9 @@ runBtn, searchInput
});
window.addEventListener('dblclick', function(e) {
var target = e.target;
if (target.classList.contains('js-console__header')) {
scope.toggleConsole();
}
if (target.classList.contains('js-code-wrap__header')) {
var codeWrapParent = target.parentElement;
toggleCodeWrapCollapse(codeWrapParent);
@ -1687,4 +1722,4 @@ runBtn, searchInput
init();
})(window.alertsService);
})(window.alertsService);