__MSG_options_introduction__
10 |__MSG_options_theme_description__
12 |__MSG_options_font_description__
14 |__MSG_options_shortcut_description__
16 | 17 | 18 | -------------------------------------------------------------------------------- /BUILDING.md: -------------------------------------------------------------------------------- 1 | # Building 2 | 1. Fetch and checkout submodules: 3 | 4 | git submodule update --init --depth 1 src/external/chromium/src 5 | git submodule update --init src/external/dom-distiller 6 | 7 | 2. Change working directory to the DOM distiller repository: 8 | 9 | cd src/external/dom-distiller 10 | 11 | 3. Install Vagrant and do: 12 | 13 | vagrant up && vagrant ssh 14 | 15 | 4. Build the DOM Distiller JavaScript: 16 | 17 | cd /vagrant && 18 | ant extractjs && 19 | exit 20 | 21 | If the build fails due to lack of memory, run the commands again. 22 | 23 | 5. Change working directory to the project root: 24 | 25 | cd ../../.. 26 | 27 | 5. Install NPM dependencies: 28 | 29 | npm install 30 | 31 | 6. Run Gulp: 32 | 33 | ./node_modules/.bin/gulp 34 | -------------------------------------------------------------------------------- /src/options/preOptions.js: -------------------------------------------------------------------------------- 1 | const msgExpressionStart = "__MSG_"; 2 | const msgExpressionEnd = "__"; 3 | const msgXPathResult = document.evaluate( 4 | `//text()[ 5 | starts-with(., "${msgExpressionStart}") and 6 | (substring(., string-length(.) - string-length("${msgExpressionEnd}") + 1) = "${msgExpressionEnd}") 7 | ]`, 8 | document, 9 | null, 10 | XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE 11 | ); 12 | 13 | for (let i = 0; i < msgXPathResult.snapshotLength; i++) { 14 | const textNode = msgXPathResult.snapshotItem(i); 15 | const messageName = Array.from(textNode.nodeValue).slice( 16 | msgExpressionStart.length, 17 | -msgExpressionEnd.length 18 | ) 19 | .join(""); 20 | textNode.nodeValue = chrome.i18n.getMessage(messageName); 21 | } 22 | 23 | // After distillation 24 | setTimeout(() => { 25 | const contentScript = document.createElement("script"); 26 | contentScript.src = "../content-scripts/add.js"; 27 | document.head.appendChild(contentScript); 28 | }, 0) 29 | -------------------------------------------------------------------------------- /src/options/options.css: -------------------------------------------------------------------------------- 1 | .select-button { 2 | display: block; 3 | /* For pseudo-element */ 4 | position: relative; 5 | width: 2em; 6 | height: 2em; 7 | margin: 0 0.2em; 8 | 9 | background: inherit; 10 | border: none; 11 | box-shadow: inset 0 0 2px; 12 | border-radius: 50%; 13 | 14 | font: inherit; 15 | font-size: 1em; 16 | white-space: nowrap; 17 | color: inherit; 18 | } 19 | 20 | .select-button-group { 21 | display: flex; 22 | align-items: center; 23 | justify-content: center; 24 | } 25 | 26 | .select-button:focus { 27 | outline: none; 28 | } 29 | 30 | .select-button::before { 31 | content: "*"; 32 | display: block; 33 | position: absolute; 34 | top: calc(50%); 35 | left: 0; 36 | right: 0; 37 | margin: auto; 38 | transition: color 0.3s; 39 | color: transparent; 40 | } 41 | 42 | .select-button:focus::before, .select-button:hover::before { 43 | color: inherit; 44 | } 45 | 46 | #emergency-css { 47 | display: flex; 48 | align-items: center; 49 | } 50 | 51 | #emergency-css > * { 52 | margin: 1em; 53 | } 54 | -------------------------------------------------------------------------------- /src/icons/browserAction/inactive.svg: -------------------------------------------------------------------------------- 1 | 2 | 18 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /src/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "manifest_version": 2, 3 | "name": "__MSG_name__", 4 | "short_name": "__MSG_short_name__", 5 | "description": "__MSG_description__", 6 | "version": "1.9", 7 | "minimum_chrome_version": "60", 8 | "icons": { 9 | "128": "icons/extension.svg-128.png", 10 | "48": "icons/extension.svg-48.png", 11 | "32": "icons/extension.svg-32.png", 12 | "16": "icons/extension.svg-16.png" 13 | }, 14 | "default_locale": "en", 15 | "background": { 16 | "scripts": ["background.js"], 17 | "persistent": false 18 | }, 19 | "permissions": [ 20 | "storage", 21 | "activeTab" 22 | ], 23 | "browser_action": { 24 | "default_icon": { 25 | "16": "icons/browserAction/inactive.svg-16.png", 26 | "19": "icons/browserAction/inactive.svg-19.png", 27 | "24": "icons/browserAction/inactive.svg-24.png", 28 | "32": "icons/browserAction/inactive.svg-32.png" 29 | }, 30 | "default_title": "__MSG_browser_action_tooltip_inactive__" 31 | }, 32 | "options_ui": { 33 | "page": "options/options.html", 34 | "chrome_style": true 35 | }, 36 | "web_accessible_resources": [ 37 | "$$(CHROME_DD_CORE)/html/dom_distiller_viewer.html" 38 | ] 39 | } 40 | -------------------------------------------------------------------------------- /src/content-scripts/add.js: -------------------------------------------------------------------------------- 1 | sessionStorage.oldTitle = document.title; 2 | sessionStorage.oldBodyStyle = document.body.getAttribute("style"); 3 | 4 | document.body.setAttribute("style", "overflow: hidden !important"); 5 | 6 | addEventListener("message", ({data, origin}) => { 7 | if(origin !== `chrome-extension://${chrome.runtime.id}`) { 8 | return; 9 | } 10 | if(data.action === "setTitle") { 11 | document.title = data.title; 12 | } 13 | }); 14 | 15 | { 16 | const iframe = document.createElement("iframe"); 17 | iframe.addEventListener("load", () => { 18 | iframe.contentWindow.focus(); 19 | }); 20 | iframe.id = sessionStorage.iframeID; 21 | iframe.src = chrome.runtime.getURL("$$(CHROME_DD_CORE)/html/dom_distiller_viewer.html"); 22 | 23 | const style = { 24 | zIndex: 2147483647, 25 | position: "fixed", 26 | left: 0, 27 | right: 0, 28 | top: 0, 29 | bottom: 0, 30 | margin: "auto", 31 | width: "100vw", 32 | height: "100vh", 33 | background: "white", 34 | border: "none" 35 | }; 36 | Object.keys(style).forEach(property => { 37 | iframe.style[property] = style[property]; 38 | }); 39 | 40 | document.documentElement.appendChild(iframe); 41 | } 42 | -------------------------------------------------------------------------------- /src/options/options.js: -------------------------------------------------------------------------------- 1 | { 2 | const link = document.createElement("link"); 3 | link.rel = "stylesheet"; 4 | link.href = "../../../../../../../options/options.css"; 5 | document.head.insertBefore(link, document.head.querySelector("link")); 6 | } 7 | 8 | const options = { 9 | theme: [ 10 | "light", 11 | "dark", 12 | "sepia" 13 | ], 14 | font: [ 15 | "sans-serif", 16 | "serif", 17 | "monospace" 18 | ] 19 | }; 20 | 21 | const headings = document.querySelectorAll("h2"); 22 | Object.keys(options).forEach((option, index) => { 23 | const p = document.createElement("p"); 24 | p.className = "select-button-group"; 25 | options[option].forEach(value => { 26 | const button = document.createElement("button"); 27 | button.className = `select-button ${value}`; 28 | button.title = chrome.i18n.getMessage( 29 | `options_${option}_name_${value.replace(/-/g, "_")}` 30 | ); 31 | if(option === "font") { 32 | button.textContent = chrome.i18n.getMessage( 33 | `options_font_abbreviation_${value.replace(/-/g, "_")}` 34 | ); 35 | } 36 | button.addEventListener("click", () => { 37 | chrome.storage.sync.set({[option]: value}); 38 | }); 39 | p.appendChild(button); 40 | }); 41 | 42 | headings[index].parentElement.insertBefore( 43 | p, 44 | headings[index].nextElementSibling 45 | ); 46 | }); 47 | 48 | { 49 | const p = document.createElement("p"); 50 | const textarea = document.createElement("textarea"); 51 | const button = document.createElement("button"); 52 | 53 | p.appendChild(textarea); 54 | p.appendChild(button); 55 | 56 | p.id = "emergency-css"; 57 | textarea.placeholder = "CSS"; 58 | button.textContent = "✔"; 59 | button.addEventListener("click", event => { 60 | chrome.storage.sync.set({"emergency-css": textarea.value}); 61 | }); 62 | document.querySelector("#content").appendChild(p); 63 | } 64 | -------------------------------------------------------------------------------- /webstore/description.txt: -------------------------------------------------------------------------------- 1 | Have you ever visited a website where the text is so ugly you get a headache trying to read or where the content is hard to find because of unimportant sidebars and share buttons? This extension will fix that for you. 2 | 3 | This extension figures out what is important on a page and shows only that in the same consistent way every time. 4 | 5 | Uses the code that powers the mobile-friendly view on phones. 6 | 7 | Planned features: 8 | 9 | * Font scaling support 10 | 11 | * Multi-page article concatenation 12 | 13 | Update notes: 14 | 15 | 1.9: 16 | * Added option for custom CSS 17 | 18 | 1.8: 19 | * Worked around issue with text direction not being retained properly 20 | * Added instructions for how to change keyboard shortcut to options 21 | 22 | 1.7: 23 | * Fixed options not loading 24 | * Fixed transition to theme colors when viewer loads 25 | * Updated DOM Distiller resources to the latest versions 26 | 27 | 1.6: 28 | * Added feedback form when uninstalling 29 | 30 | 1.5: 31 | * Fixed some sites appearing on top of viewer 32 | * Updated to the latest DOM Distiller version 33 | 34 | 1.4: 35 | * Fixed page scrollbar overlaying the scrollbar of the viewer 36 | 37 | 1.3: 38 | * Fixed distilled content never getting shown 39 | 40 | 1.2: 41 | * Fixed original page jumping to top when hiding distilled version 42 | * Fixed loading indicator not being shown 43 | * Added swedish translation 44 | 45 | 1.1: 46 | * Performance enhancements and bug fixes 47 | 48 | Extension icons were derived from the following icons: 49 | * github.com/google/material-design-icons/blob/c6fc87c71001975022f979a2f6b031620e9c7ff1/action/svg/production/ic_chrome_reader_mode_48px.svg 50 | * github.com/google/material-design-icons/blob/c6fc87c71001975022f979a2f6b031620e9c7ff1/editor/svg/production/ic_bubble_chart_48px.svg 51 | 52 | Both of the icons derived from are licensed under CC BY 4.0 (creativecommons.org/licenses/by/4.0) 53 | -------------------------------------------------------------------------------- /webstore/description-sv.txt: -------------------------------------------------------------------------------- 1 | Har du någonsin besökt en sida där texten är så ful att du får huvudvärk när du försöker läsa den eller där innehållet är svårt att hitta på grund av oviktiga sidopaneler och delningsknappar? Det här tillägget kommer att fixa det åt dig. 2 | 3 | Det här tillägget räknar ut vad som är viktigt på sidan och visar bara det på samma konsekventa sätt varje gång. 4 | 5 | Använder koden som ligger bakom det mobilvänliga läget på mobiler. 6 | 7 | Planerade funktioner: 8 | 9 | * Typsnittsskalningsstöd 10 | 11 | * Sammansättning av flersidiga artiklar 12 | 13 | Uppdateringsnoteringar: 14 | 15 | 1.9: 16 | * La till alternativ för egen CSS 17 | 18 | 1.8: 19 | * Kringgick problem där textriktning inte behölls ordentligt 20 | * La till instruktioner för hur kortkommandon ändras i alternativ 21 | 22 | 1.7: 23 | * Fixade att alternativ inte laddades 24 | * Fixade övergången till temafärger när visaren laddas 25 | * Uppdaterade DOM-destillerarresurser till de senaste versionerna 26 | 27 | 1.6: 28 | * La till ett feedbacksformulär vid avinstallation 29 | 30 | 1.5: 31 | * Fixade att vissa sidor visades ovanför visaren 32 | * Uppdaterade till den senaste DOM-destillerarversionen 33 | 34 | 1.4: 35 | * Fixade att sidans rullningslist överlappade rullningslisten för visaren 36 | 37 | 1.3: 38 | * Fixade att det destillerade innehållet aldrig visades 39 | 40 | 1.2: 41 | * Fixade att orginalsidan hoppar till toppen när den destillerade versionen döljs 42 | * Fixade att laddningsindikatorn inte visades 43 | * La till svensk översättning 44 | 45 | 1.1: 46 | * Prestandaförbättringar och buggfixar 47 | 48 | Tilläggsikoner härleddes från följande ikoner: 49 | * github.com/google/material-design-icons/blob/c6fc87c71001975022f979a2f6b031620e9c7ff1/action/svg/production/ic_chrome_reader_mode_48px.svg 50 | * github.com/google/material-design-icons/blob/c6fc87c71001975022f979a2f6b031620e9c7ff1/editor/svg/production/ic_bubble_chart_48px.svg 51 | 52 | Båda av ikonerna härledda från är licenserade under CC BY 4.0 (creativecommons.org/licenses/by/4.0) 53 | -------------------------------------------------------------------------------- /src/icons/extension.svg: -------------------------------------------------------------------------------- 1 | 2 | 31 | -------------------------------------------------------------------------------- /src/_locales/sv/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": { 3 | "message": "DOM-destillerare läsningläge" 4 | }, 5 | "short_name": { 6 | "message": "DOM-destillerare" 7 | }, 8 | "description": { 9 | "message": "Destillera och visa bara det viktiga innehållet för att njuta av en mer fokuserad läsningsupplevelse" 10 | }, 11 | "browser_action_tooltip_inactive": { 12 | "message": "Destillera" 13 | }, 14 | "browser_action_tooltip_active": { 15 | "message": "Sluta visa destillerad version" 16 | }, 17 | "options_introduction": { 18 | "message": "Här kan du hitta två inställningar som ändrar utseendet av destillerade sidor." 19 | }, 20 | "options_theme_title": { 21 | "message": "Teman" 22 | }, 23 | "options_theme_description": { 24 | "message": "Teman ändrar färgen på bakgrunden och texten. Det finns tre olika färger att välja emellan: ljus, mörk and sepia" 25 | }, 26 | "options_theme_name_light": { 27 | "message": "Ljus" 28 | }, 29 | "options_theme_name_dark": { 30 | "message": "Mörk" 31 | }, 32 | "options_theme_name_sepia": { 33 | "message": "Sepia" 34 | }, 35 | "options_font_title": { 36 | "message": "Typsnitt" 37 | }, 38 | "options_font_description": { 39 | "message": "Du har också alternativet att ändra typsnitt. Tre olika typsnitt finns tillgängliga för dig att välja: utan seriff, seriff och fast bredd" 40 | }, 41 | "options_font_name_sans_serif": { 42 | "message": "Utan seriff" 43 | }, 44 | "options_font_name_serif": { 45 | "message": "Seriff" 46 | }, 47 | "options_font_name_monospace": { 48 | "message": "Fast bredd" 49 | }, 50 | "options_font_abbreviation_sans_serif": { 51 | "message": "Ut" 52 | }, 53 | "options_font_abbreviation_serif": { 54 | "message": "Se" 55 | }, 56 | "options_font_abbreviation_monospace": { 57 | "message": "Fa" 58 | }, 59 | "options_shortcut_title": { 60 | "message": "Kortkommando" 61 | }, 62 | "options_shortcut_description": { 63 | "message": "Om föredrar att aktivera tillägget med ditt tangentbord är du kanske intresserad av att sätta ett kortkommando. För att komma åt kortkommandon för alla tillägg, klicka på \"Kortkommandon\" längst ner i listan av tillägg." 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /src/_locales/en/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": { 3 | "message": "DOM Distiller Reading Mode" 4 | }, 5 | "short_name": { 6 | "message": "DOM Distiller" 7 | }, 8 | "description": { 9 | "message": "Distill and display only the important content to enjoy a more focused reading experience" 10 | }, 11 | "browser_action_tooltip_inactive": { 12 | "message": "Distill" 13 | }, 14 | "browser_action_tooltip_active": { 15 | "message": "Stop showing distilled version" 16 | }, 17 | "options_introduction": { 18 | "message": "Here you'll find two options that change the appearance of distilled pages.", 19 | "description": "Acts as filler text so the options page works as a preview" 20 | }, 21 | "options_theme_title": { 22 | "message": "Themes" 23 | }, 24 | "options_theme_description": { 25 | "message": "Themes change the color of the background and the text. There are three different colors to choose from: light, dark and sepia" 26 | }, 27 | "options_theme_name_light": { 28 | "message": "Light" 29 | }, 30 | "options_theme_name_dark": { 31 | "message": "Dark" 32 | }, 33 | "options_theme_name_sepia": { 34 | "message": "Sepia" 35 | }, 36 | "options_font_title": { 37 | "message": "Fonts" 38 | }, 39 | "options_font_description": { 40 | "message": "You also have the option to change fonts. Three different fonts are available for your choosing: sans serif, serif and monospace" 41 | }, 42 | "options_font_name_sans_serif": { 43 | "message": "Sans serif" 44 | }, 45 | "options_font_name_serif": { 46 | "message": "Serif" 47 | }, 48 | "options_font_name_monospace": { 49 | "message": "Monospace" 50 | }, 51 | "options_font_abbreviation_sans_serif": { 52 | "message": "Sa" 53 | }, 54 | "options_font_abbreviation_serif": { 55 | "message": "Se" 56 | }, 57 | "options_font_abbreviation_monospace": { 58 | "message": "Mo" 59 | }, 60 | "options_shortcut_title": { 61 | "message": "Keyboard shortcut" 62 | }, 63 | "options_shortcut_description": { 64 | "message": "If you prefer to activate the extension using your keyboard you may be interested in setting a keyboard shortcut. To access shortcuts for all extensions, click \"Keyboard shortcuts\" at the bottom of the list of extensions." 65 | } 66 | } 67 | -------------------------------------------------------------------------------- /src/viewer.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-native-reassign, no-global-assign */ 2 | /* global addToPage, setTitle, showLoadingIndicator, useTheme, useFontFamily */ 3 | 4 | // Makes regular text have the regular text size 5 | document.body.style.fontSize = "1.33333333em"; 6 | 7 | // Workaround for https://bugs.chromium.org/p/chromium/issues/detail?id=677913 8 | document.body.setAttribute("dir", "auto"); 9 | 10 | document.body.style.transitionDuration = "0s"; 11 | // Has to be synchronous to prevent white flash 12 | document.body.className = `${localStorage["storage-sync-theme"]} ${localStorage["storage-sync-font"]}`; 13 | requestAnimationFrame(() => { 14 | document.body.style.transitionDuration = ""; 15 | }); 16 | 17 | // Emergency CSS 18 | let emergencyCSSStyle; 19 | { 20 | const style = document.createElement("style"); 21 | style.id = "emergency-css-style"; 22 | style.textContent = localStorage["storage-sync-emergency-css"]; 23 | document.head.appendChild(style); 24 | emergencyCSSStyle = style; 25 | } 26 | 27 | const baseElement = document.createElement("base"); 28 | baseElement.target = "_top"; 29 | document.head.appendChild(baseElement); 30 | 31 | const oldSetTitle = setTitle; 32 | setTitle = (...args) => { 33 | window.top.postMessage({action: "setTitle", title: args[0]}, "*"); 34 | oldSetTitle.apply(window, args); 35 | }; 36 | 37 | function isOptionsPage() { 38 | try { 39 | return top.location.href === chrome.runtime.getURL("options/options.html"); 40 | } catch(error) { 41 | return false; 42 | } 43 | } 44 | 45 | function handleResult(result) { 46 | const {"1": resultTitle, "2": {"1": resultHTML}} = result; 47 | addToPage(resultHTML); 48 | setTitle(resultTitle); 49 | // true stands for isLastPage, hides indicator 50 | showLoadingIndicator(true); 51 | if(isOptionsPage()) { 52 | const script = document.createElement("script"); 53 | script.src = chrome.runtime.getURL("options/options.js"); 54 | document.head.appendChild(script); 55 | } 56 | } 57 | 58 | chrome.runtime.sendMessage("distill-tab", result => { 59 | handleResult(result); 60 | }); 61 | 62 | const storageActions = { 63 | theme: useTheme, 64 | font: useFontFamily, 65 | "emergency-css": value => { 66 | emergencyCSSStyle.textContent = value; 67 | } 68 | }; 69 | 70 | chrome.storage.onChanged.addListener((changes, area) => { 71 | if(area === "sync") { 72 | Object.keys(changes) 73 | .forEach(key => storageActions[key](changes[key].newValue)); 74 | } 75 | }); 76 | -------------------------------------------------------------------------------- /src/background.js: -------------------------------------------------------------------------------- 1 | chrome.runtime.onInstalled.addListener(({reason}) => { 2 | chrome.runtime.setUninstallURL("https://goo.gl/forms/r0WChsdUmHuEQ9PS2"); 3 | if(reason === "install") { 4 | chrome.storage.sync.get({ 5 | theme: "light", 6 | font: "sans-serif" 7 | }, items => { 8 | chrome.storage.sync.set(items); 9 | }); 10 | } 11 | 12 | // Remove localStorage keys that should not exist 13 | const badKeys = []; 14 | for (let i = 0; true; i++) { 15 | const key = localStorage.key(i); 16 | if(key === null) { 17 | break; 18 | } else if(key.startsWith("result-")) { 19 | badKeys.push(key); 20 | } 21 | } 22 | badKeys.forEach(key => localStorage.removeItem(key)); 23 | 24 | localStorage.removeItem("result-options"); 25 | 26 | // Save browser action icon paths to localStorage for faster access 27 | const manifest = chrome.runtime.getManifest(); 28 | const prefix = "browserActionIcon"; 29 | const inactiveIcon = manifest.browser_action.default_icon; 30 | localStorage[`${prefix}Inactive`] = JSON.stringify(inactiveIcon); 31 | const activeIcon = {}; 32 | Object.keys(inactiveIcon).forEach(size => { 33 | activeIcon[size] = inactiveIcon[size].replace("inactive", "active"); 34 | }); 35 | localStorage[`${prefix}Active`] = JSON.stringify(activeIcon); 36 | }); 37 | 38 | chrome.browserAction.onClicked.addListener(({id: tabID}) => { 39 | chrome.tabs.executeScript(tabID, { 40 | file: "content-scripts/isActive.js" 41 | }, ([active]) => { 42 | chrome.tabs.executeScript(tabID, { 43 | file: `content-scripts/${active ? "remove" : "add"}.js` 44 | }); 45 | chrome.browserAction.setIcon({ 46 | path: JSON.parse(localStorage[ 47 | active ? "browserActionIconInactive" : "browserActionIconActive" 48 | ]), 49 | tabId: tabID 50 | }); 51 | chrome.browserAction.setTitle({ 52 | title: chrome.i18n.getMessage( 53 | `browser_action_tooltip_${active ? "inactive" : "active"}` 54 | ), 55 | tabId: tabID 56 | }); 57 | }); 58 | }); 59 | 60 | chrome.storage.onChanged.addListener((changes, area) => { 61 | Object.keys(changes).forEach(key => { 62 | localStorage[`storage-${area}-${key}`] = changes[key].newValue; 63 | }); 64 | }); 65 | 66 | function isOptions(sender) { 67 | return !sender.tab; 68 | } 69 | 70 | const respondToOptions = new Set(); 71 | function tryOptionsResponse() { 72 | if("result-options" in localStorage) { 73 | const parsed = JSON.parse(localStorage["result-options"]); 74 | for(const respond of respondToOptions) { 75 | respond(parsed); 76 | } 77 | respondToOptions.clear(); 78 | } 79 | } 80 | chrome.runtime.onMessage.addListener((message, sender, respond) => { 81 | if(message === "distill-tab") { 82 | if(isOptions(sender)) { 83 | respondToOptions.add(respond); 84 | tryOptionsResponse(); 85 | return true; 86 | } 87 | chrome.tabs.executeScript(sender.tab.id, { 88 | file: "$$(CHROME_DD_CORE)/javascript/domdistiller.js" 89 | }, ([result]) => { 90 | respond(result); 91 | }); 92 | return true; 93 | } else if(message && message.type === "distill-result") { 94 | if(isOptions(sender)) { 95 | localStorage["result-options"] = JSON.stringify(message.result); 96 | tryOptionsResponse(); 97 | } 98 | } 99 | }); 100 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | /* eslint-env node */ 2 | const del = require("del"); 3 | const Gulp = require("gulp" ); 4 | const changedInPlace = require("gulp-changed-in-place"); 5 | const rename = require("gulp-rename" ); 6 | const replace = require("gulp-replace" ); 7 | const zip = require("gulp-zip" ); 8 | const pStream = require("stream-to-promise" ); 9 | const streamToBuffer = require("vinyl-buffer" ); 10 | 11 | const optional = require ("optional" ); 12 | const svg2PNG = optional("gulp-svg2png"); 13 | 14 | const paths = { 15 | chromeDDCore: "src/external/chromium/src/components/dom_distiller/core" 16 | }; 17 | 18 | const internalSubstitutionRegex = /\$\$\((.+?)\)/g; 19 | const internalSubstitutions = { 20 | CHROME_DD_CORE: paths.chromeDDCore.replace(/^src\//, "") 21 | }; 22 | 23 | // `Gulp.src(...).pipe(changedInPlace({firstPass: true}))` 24 | // but doesn't buffer before change check 25 | function srcChanged(...args) { 26 | if(typeof args[args.length - 1] !== "object") { 27 | args.push({}); 28 | } 29 | args[args.length - 1].buffer = false; 30 | return Gulp.src(...args) 31 | .pipe(changedInPlace({ 32 | firstPass: true, 33 | howToDetermineDifference: "modification-time" 34 | })) 35 | .pipe(streamToBuffer()); 36 | } 37 | 38 | Gulp.task("simple internal resources", () => 39 | srcChanged("src/{!(external),!(external)/**/*}", {ignore: "src/icons/**/*.svg"}) 40 | .pipe(replace(internalSubstitutionRegex, (_, name) => { 41 | if(name in internalSubstitutions) { 42 | return internalSubstitutions[name]; 43 | } else { 44 | throw new Error("Unknown substitution: \"" + name + "\""); 45 | } 46 | })) 47 | .pipe(Gulp.dest("out")) 48 | ); 49 | 50 | Gulp.task("simple external resources", () => 51 | Gulp.src( 52 | "src/external/chromium/src/" + 53 | "{" + 54 | "LICENSE," + 55 | 56 | "components/dom_distiller/core/" + 57 | "{" + 58 | "css/distilledpage.css," + 59 | 60 | "javascript/dom_distiller_viewer.js" + 61 | "}" + 62 | "}", 63 | {base: "src"} 64 | ) 65 | .pipe(Gulp.dest("out")) 66 | ); 67 | 68 | Gulp.task("viewer HTML substitution", async () => { 69 | /* 70 | Placeholders (used, $n, description) 71 | | $1 |