diff --git a/cubx_injector_sidebar.html b/cubx_injector_sidebar.html index 79eb818..b965d47 100644 --- a/cubx_injector_sidebar.html +++ b/cubx_injector_sidebar.html @@ -15,6 +15,14 @@
Load/Save config
+
+ + +
diff --git a/lib/cubx_injector_devtools.js b/lib/cubx_injector_devtools.js index a8c0117..065bfdc 100644 --- a/lib/cubx_injector_devtools.js +++ b/lib/cubx_injector_devtools.js @@ -9,6 +9,7 @@ tabUpdated: 'tab-updated' } let injectionPending = false; + let currentUrl = ''; /** * Post a message to the background script @@ -65,17 +66,18 @@ /** * Create the cubbles web inspector tab, and the Cubbles sidebar within the elements tab */ - function createSabebarPage() { + function createSibebarPage() { chrome.devtools.panels.elements.createSidebarPane('Cubbles Injector', function(sidebar) { cubblesSidepanel = sidebar; sidebar.setPage('cubx_injector_sidebar.html'); - sidebar.onShown.addListener(function(window) { + sidebar.onShown.addListener(function(sideBarWindow) { if (firstTimeCubblesSidebar) { - cubblesSidepanel.window = window; - window.postMessageToBackgroundScript = function(name, content) { + cubblesSidepanel.window = sideBarWindow; + sideBarWindow.postMessageToBackgroundScript = function(name, content) { postMessageToBackgroundScript(name, content); }; + sideBarWindow.performAutoInjection(); firstTimeCubblesSidebar = false; } cubblesSidebarIsVisible = true; @@ -87,7 +89,14 @@ }); } - createSabebarPage(); + chrome.devtools.network.onNavigated.addListener(function(url){ + if (url !== currentUrl) { + cubblesSidepanel.window.performAutoInjection(); + currentUrl = url; + } + }); + + createSibebarPage(); initBackgroundConnection(); postExecuteContentScript(); })(); diff --git a/lib/cubx_injector_sidebar.js b/lib/cubx_injector_sidebar.js index f88df4b..57a9856 100644 --- a/lib/cubx_injector_sidebar.js +++ b/lib/cubx_injector_sidebar.js @@ -21,7 +21,8 @@ resetBtn: 'resetBtn', useInspectedElementBtn: 'useInspectedElementBtn', htmlSnippetName: 'htmlSnippetName', - positionGroupName: 'whereToInsertRB' + positionGroupName: 'whereToInsertRB', + loadAfterLoadCB: 'loadAfterLoadCB', }; const ELEMENTS_CLASSES = { urlInput: 'url-input', @@ -58,7 +59,10 @@ addSnippet: 'addSnippet', }; const RTE_START_EVENT = 'cubblesInjectionReady'; - const LOCAL_STORAGE_KEY = 'cubbles-injector-config'; + const LOCAL_STORAGE_KEYS = { + config: 'cubbles-injector-config', + autoInjectFlag: 'automatic-injection' + }; const TYPES = { script: 'script', snippet: 'snippet' @@ -87,6 +91,17 @@ }, 1000); }; + window.performAutoInjection = function () { + if (shouldAutoInject()) { + loadLocalStorageConfig(); + } + } + + function startInjection() { + window.postMessageToBackgroundScript(MESSAGES_IDS.injectionPending); + chrome.devtools.inspectedWindow.reload(); + } + function initEditor() { editor = CodeMirror.fromTextArea(document.getElementById(ELEMENTS_IDS.editorId), { lineNumbers: true, @@ -165,13 +180,13 @@ } function saveConfig() { - localStorage.setItem(LOCAL_STORAGE_KEY, JSON.stringify(extractCurrentConfig())); + localStorage.setItem(LOCAL_STORAGE_KEYS.config, JSON.stringify(extractCurrentConfig())); } function saveConfigToFile() { let content = JSON.stringify(extractCurrentConfig(), null, ' '); let blob = new Blob([content], { type: 'text/plain;charset=utf-8' }); - saveAs(blob, `${LOCAL_STORAGE_KEY}.json`); + saveAs(blob, `${LOCAL_STORAGE_KEYS.config}.json`); } function importConfig(file) { @@ -185,7 +200,7 @@ } function loadLocalStorageConfig() { - loadConfig(JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY))); + loadConfig(JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEYS.config))); } function loadConfig(config) { @@ -204,6 +219,9 @@ }); } }); + if (shouldAutoInject()) { + startInjection(); + } } function readSingleFile(file) { @@ -514,7 +532,19 @@ }); } - function addListeners() { + function saveAutoInjectionFlag (isAutomatic) { + localStorage.setItem(LOCAL_STORAGE_KEYS.autoInjectFlag, isAutomatic); + } + + function shouldAutoInject () { + return JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEYS.autoInjectFlag)); + } + + function loadAutoFlagValue () { + document.getElementById(ELEMENTS_IDS.loadAfterLoadCB).checked = shouldAutoInject(); + } + + function addListeners () { document.getElementById(ELEMENTS_IDS.addScriptBtn).addEventListener('click', addNewScript); document @@ -530,8 +560,7 @@ .addEventListener('click', closeCodeEditor); document.getElementById(ELEMENTS_IDS.finishBtn).addEventListener('click', function() { - window.postMessageToBackgroundScript(MESSAGES_IDS.injectionPending); - chrome.devtools.inspectedWindow.reload(); + startInjection(); }); document.getElementById(ELEMENTS_IDS.saveConfigBtn).addEventListener('click', saveConfig); @@ -557,9 +586,21 @@ document.getElementById(ELEMENTS_IDS.importConfigBtn).addEventListener('click', function(e) { document.getElementById(ELEMENTS_IDS.importConfigHiddenBtn).click(); }); + + document.getElementById(ELEMENTS_IDS.loadAfterLoadCB).addEventListener('change', function () { + saveAutoInjectionFlag(this.checked); + if (this.checked) { + saveConfig(); + } + }); + } + + function init () { + initEditor(); + addListeners(); + addDefaultScripts(); + loadAutoFlagValue(); } - initEditor(); - addListeners(); - addDefaultScripts(); + init(); })();