├── .eslintrc ├── .gitignore ├── LICENSE ├── README.md ├── build └── .gitkeep ├── package.json ├── renovate.json ├── src ├── .stylelintrc ├── background.js ├── change-favicon.js ├── manifest.json ├── options.css ├── options.html └── options.js └── yarn.lock /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "eslint-config-amo", 3 | "globals": { 4 | "browser": true, 5 | "document": true, 6 | "FileReader": true, 7 | "window": true, 8 | }, 9 | "rules": { 10 | "no-console": [ 11 | "error", { 12 | "allow": ["debug", "error"] 13 | } 14 | ] 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | 6 | # Compiled binary addons (http://nodejs.org/api/addons.html) 7 | build/Release 8 | 9 | # Dependency directory 10 | node_modules 11 | 12 | # Optional npm cache directory 13 | .npm 14 | 15 | # Optional REPL history 16 | .node_repl_history 17 | 18 | build/* 19 | node_modules 20 | .DS_Store 21 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Mozilla Public License Version 2.0 2 | ================================== 3 | 4 | 1. Definitions 5 | -------------- 6 | 7 | 1.1. "Contributor" 8 | means each individual or legal entity that creates, contributes to 9 | the creation of, or owns Covered Software. 10 | 11 | 1.2. "Contributor Version" 12 | means the combination of the Contributions of others (if any) used 13 | by a Contributor and that particular Contributor's Contribution. 14 | 15 | 1.3. "Contribution" 16 | means Covered Software of a particular Contributor. 17 | 18 | 1.4. "Covered Software" 19 | means Source Code Form to which the initial Contributor has attached 20 | the notice in Exhibit A, the Executable Form of such Source Code 21 | Form, and Modifications of such Source Code Form, in each case 22 | including portions thereof. 23 | 24 | 1.5. "Incompatible With Secondary Licenses" 25 | means 26 | 27 | (a) that the initial Contributor has attached the notice described 28 | in Exhibit B to the Covered Software; or 29 | 30 | (b) that the Covered Software was made available under the terms of 31 | version 1.1 or earlier of the License, but not also under the 32 | terms of a Secondary License. 33 | 34 | 1.6. "Executable Form" 35 | means any form of the work other than Source Code Form. 36 | 37 | 1.7. "Larger Work" 38 | means a work that combines Covered Software with other material, in 39 | a separate file or files, that is not Covered Software. 40 | 41 | 1.8. "License" 42 | means this document. 43 | 44 | 1.9. "Licensable" 45 | means having the right to grant, to the maximum extent possible, 46 | whether at the time of the initial grant or subsequently, any and 47 | all of the rights conveyed by this License. 48 | 49 | 1.10. "Modifications" 50 | means any of the following: 51 | 52 | (a) any file in Source Code Form that results from an addition to, 53 | deletion from, or modification of the contents of Covered 54 | Software; or 55 | 56 | (b) any new file in Source Code Form that contains any Covered 57 | Software. 58 | 59 | 1.11. "Patent Claims" of a Contributor 60 | means any patent claim(s), including without limitation, method, 61 | process, and apparatus claims, in any patent Licensable by such 62 | Contributor that would be infringed, but for the grant of the 63 | License, by the making, using, selling, offering for sale, having 64 | made, import, or transfer of either its Contributions or its 65 | Contributor Version. 66 | 67 | 1.12. "Secondary License" 68 | means either the GNU General Public License, Version 2.0, the GNU 69 | Lesser General Public License, Version 2.1, the GNU Affero General 70 | Public License, Version 3.0, or any later versions of those 71 | licenses. 72 | 73 | 1.13. "Source Code Form" 74 | means the form of the work preferred for making modifications. 75 | 76 | 1.14. "You" (or "Your") 77 | means an individual or a legal entity exercising rights under this 78 | License. For legal entities, "You" includes any entity that 79 | controls, is controlled by, or is under common control with You. For 80 | purposes of this definition, "control" means (a) the power, direct 81 | or indirect, to cause the direction or management of such entity, 82 | whether by contract or otherwise, or (b) ownership of more than 83 | fifty percent (50%) of the outstanding shares or beneficial 84 | ownership of such entity. 85 | 86 | 2. License Grants and Conditions 87 | -------------------------------- 88 | 89 | 2.1. Grants 90 | 91 | Each Contributor hereby grants You a world-wide, royalty-free, 92 | non-exclusive license: 93 | 94 | (a) under intellectual property rights (other than patent or trademark) 95 | Licensable by such Contributor to use, reproduce, make available, 96 | modify, display, perform, distribute, and otherwise exploit its 97 | Contributions, either on an unmodified basis, with Modifications, or 98 | as part of a Larger Work; and 99 | 100 | (b) under Patent Claims of such Contributor to make, use, sell, offer 101 | for sale, have made, import, and otherwise transfer either its 102 | Contributions or its Contributor Version. 103 | 104 | 2.2. Effective Date 105 | 106 | The licenses granted in Section 2.1 with respect to any Contribution 107 | become effective for each Contribution on the date the Contributor first 108 | distributes such Contribution. 109 | 110 | 2.3. Limitations on Grant Scope 111 | 112 | The licenses granted in this Section 2 are the only rights granted under 113 | this License. No additional rights or licenses will be implied from the 114 | distribution or licensing of Covered Software under this License. 115 | Notwithstanding Section 2.1(b) above, no patent license is granted by a 116 | Contributor: 117 | 118 | (a) for any code that a Contributor has removed from Covered Software; 119 | or 120 | 121 | (b) for infringements caused by: (i) Your and any other third party's 122 | modifications of Covered Software, or (ii) the combination of its 123 | Contributions with other software (except as part of its Contributor 124 | Version); or 125 | 126 | (c) under Patent Claims infringed by Covered Software in the absence of 127 | its Contributions. 128 | 129 | This License does not grant any rights in the trademarks, service marks, 130 | or logos of any Contributor (except as may be necessary to comply with 131 | the notice requirements in Section 3.4). 132 | 133 | 2.4. Subsequent Licenses 134 | 135 | No Contributor makes additional grants as a result of Your choice to 136 | distribute the Covered Software under a subsequent version of this 137 | License (see Section 10.2) or under the terms of a Secondary License (if 138 | permitted under the terms of Section 3.3). 139 | 140 | 2.5. Representation 141 | 142 | Each Contributor represents that the Contributor believes its 143 | Contributions are its original creation(s) or it has sufficient rights 144 | to grant the rights to its Contributions conveyed by this License. 145 | 146 | 2.6. Fair Use 147 | 148 | This License is not intended to limit any rights You have under 149 | applicable copyright doctrines of fair use, fair dealing, or other 150 | equivalents. 151 | 152 | 2.7. Conditions 153 | 154 | Sections 3.1, 3.2, 3.3, and 3.4 are conditions of the licenses granted 155 | in Section 2.1. 156 | 157 | 3. Responsibilities 158 | ------------------- 159 | 160 | 3.1. Distribution of Source Form 161 | 162 | All distribution of Covered Software in Source Code Form, including any 163 | Modifications that You create or to which You contribute, must be under 164 | the terms of this License. You must inform recipients that the Source 165 | Code Form of the Covered Software is governed by the terms of this 166 | License, and how they can obtain a copy of this License. You may not 167 | attempt to alter or restrict the recipients' rights in the Source Code 168 | Form. 169 | 170 | 3.2. Distribution of Executable Form 171 | 172 | If You distribute Covered Software in Executable Form then: 173 | 174 | (a) such Covered Software must also be made available in Source Code 175 | Form, as described in Section 3.1, and You must inform recipients of 176 | the Executable Form how they can obtain a copy of such Source Code 177 | Form by reasonable means in a timely manner, at a charge no more 178 | than the cost of distribution to the recipient; and 179 | 180 | (b) You may distribute such Executable Form under the terms of this 181 | License, or sublicense it under different terms, provided that the 182 | license for the Executable Form does not attempt to limit or alter 183 | the recipients' rights in the Source Code Form under this License. 184 | 185 | 3.3. Distribution of a Larger Work 186 | 187 | You may create and distribute a Larger Work under terms of Your choice, 188 | provided that You also comply with the requirements of this License for 189 | the Covered Software. If the Larger Work is a combination of Covered 190 | Software with a work governed by one or more Secondary Licenses, and the 191 | Covered Software is not Incompatible With Secondary Licenses, this 192 | License permits You to additionally distribute such Covered Software 193 | under the terms of such Secondary License(s), so that the recipient of 194 | the Larger Work may, at their option, further distribute the Covered 195 | Software under the terms of either this License or such Secondary 196 | License(s). 197 | 198 | 3.4. Notices 199 | 200 | You may not remove or alter the substance of any license notices 201 | (including copyright notices, patent notices, disclaimers of warranty, 202 | or limitations of liability) contained within the Source Code Form of 203 | the Covered Software, except that You may alter any license notices to 204 | the extent required to remedy known factual inaccuracies. 205 | 206 | 3.5. Application of Additional Terms 207 | 208 | You may choose to offer, and to charge a fee for, warranty, support, 209 | indemnity or liability obligations to one or more recipients of Covered 210 | Software. However, You may do so only on Your own behalf, and not on 211 | behalf of any Contributor. You must make it absolutely clear that any 212 | such warranty, support, indemnity, or liability obligation is offered by 213 | You alone, and You hereby agree to indemnify every Contributor for any 214 | liability incurred by such Contributor as a result of warranty, support, 215 | indemnity or liability terms You offer. You may include additional 216 | disclaimers of warranty and limitations of liability specific to any 217 | jurisdiction. 218 | 219 | 4. Inability to Comply Due to Statute or Regulation 220 | --------------------------------------------------- 221 | 222 | If it is impossible for You to comply with any of the terms of this 223 | License with respect to some or all of the Covered Software due to 224 | statute, judicial order, or regulation then You must: (a) comply with 225 | the terms of this License to the maximum extent possible; and (b) 226 | describe the limitations and the code they affect. Such description must 227 | be placed in a text file included with all distributions of the Covered 228 | Software under this License. Except to the extent prohibited by statute 229 | or regulation, such description must be sufficiently detailed for a 230 | recipient of ordinary skill to be able to understand it. 231 | 232 | 5. Termination 233 | -------------- 234 | 235 | 5.1. The rights granted under this License will terminate automatically 236 | if You fail to comply with any of its terms. However, if You become 237 | compliant, then the rights granted under this License from a particular 238 | Contributor are reinstated (a) provisionally, unless and until such 239 | Contributor explicitly and finally terminates Your grants, and (b) on an 240 | ongoing basis, if such Contributor fails to notify You of the 241 | non-compliance by some reasonable means prior to 60 days after You have 242 | come back into compliance. Moreover, Your grants from a particular 243 | Contributor are reinstated on an ongoing basis if such Contributor 244 | notifies You of the non-compliance by some reasonable means, this is the 245 | first time You have received notice of non-compliance with this License 246 | from such Contributor, and You become compliant prior to 30 days after 247 | Your receipt of the notice. 248 | 249 | 5.2. If You initiate litigation against any entity by asserting a patent 250 | infringement claim (excluding declaratory judgment actions, 251 | counter-claims, and cross-claims) alleging that a Contributor Version 252 | directly or indirectly infringes any patent, then the rights granted to 253 | You by any and all Contributors for the Covered Software under Section 254 | 2.1 of this License shall terminate. 255 | 256 | 5.3. In the event of termination under Sections 5.1 or 5.2 above, all 257 | end user license agreements (excluding distributors and resellers) which 258 | have been validly granted by You or Your distributors under this License 259 | prior to termination shall survive termination. 260 | 261 | ************************************************************************ 262 | * * 263 | * 6. Disclaimer of Warranty * 264 | * ------------------------- * 265 | * * 266 | * Covered Software is provided under this License on an "as is" * 267 | * basis, without warranty of any kind, either expressed, implied, or * 268 | * statutory, including, without limitation, warranties that the * 269 | * Covered Software is free of defects, merchantable, fit for a * 270 | * particular purpose or non-infringing. The entire risk as to the * 271 | * quality and performance of the Covered Software is with You. * 272 | * Should any Covered Software prove defective in any respect, You * 273 | * (not any Contributor) assume the cost of any necessary servicing, * 274 | * repair, or correction. This disclaimer of warranty constitutes an * 275 | * essential part of this License. No use of any Covered Software is * 276 | * authorized under this License except under this disclaimer. * 277 | * * 278 | ************************************************************************ 279 | 280 | ************************************************************************ 281 | * * 282 | * 7. Limitation of Liability * 283 | * -------------------------- * 284 | * * 285 | * Under no circumstances and under no legal theory, whether tort * 286 | * (including negligence), contract, or otherwise, shall any * 287 | * Contributor, or anyone who distributes Covered Software as * 288 | * permitted above, be liable to You for any direct, indirect, * 289 | * special, incidental, or consequential damages of any character * 290 | * including, without limitation, damages for lost profits, loss of * 291 | * goodwill, work stoppage, computer failure or malfunction, or any * 292 | * and all other commercial damages or losses, even if such party * 293 | * shall have been informed of the possibility of such damages. This * 294 | * limitation of liability shall not apply to liability for death or * 295 | * personal injury resulting from such party's negligence to the * 296 | * extent applicable law prohibits such limitation. Some * 297 | * jurisdictions do not allow the exclusion or limitation of * 298 | * incidental or consequential damages, so this exclusion and * 299 | * limitation may not apply to You. * 300 | * * 301 | ************************************************************************ 302 | 303 | 8. Litigation 304 | ------------- 305 | 306 | Any litigation relating to this License may be brought only in the 307 | courts of a jurisdiction where the defendant maintains its principal 308 | place of business and such litigation shall be governed by laws of that 309 | jurisdiction, without reference to its conflict-of-law provisions. 310 | Nothing in this Section shall prevent a party's ability to bring 311 | cross-claims or counter-claims. 312 | 313 | 9. Miscellaneous 314 | ---------------- 315 | 316 | This License represents the complete agreement concerning the subject 317 | matter hereof. If any provision of this License is held to be 318 | unenforceable, such provision shall be reformed only to the extent 319 | necessary to make it enforceable. Any law or regulation which provides 320 | that the language of a contract shall be construed against the drafter 321 | shall not be used to construe this License against a Contributor. 322 | 323 | 10. Versions of the License 324 | --------------------------- 325 | 326 | 10.1. New Versions 327 | 328 | Mozilla Foundation is the license steward. Except as provided in Section 329 | 10.3, no one other than the license steward has the right to modify or 330 | publish new versions of this License. Each version will be given a 331 | distinguishing version number. 332 | 333 | 10.2. Effect of New Versions 334 | 335 | You may distribute the Covered Software under the terms of the version 336 | of the License under which You originally received the Covered Software, 337 | or under the terms of any subsequent version published by the license 338 | steward. 339 | 340 | 10.3. Modified Versions 341 | 342 | If you create software not governed by this License, and you want to 343 | create a new license for such software, you may create and use a 344 | modified version of this License if you rename the license and remove 345 | any references to the name of the license steward (except to note that 346 | such modified license differs from this License). 347 | 348 | 10.4. Distributing Source Code Form that is Incompatible With Secondary 349 | Licenses 350 | 351 | If You choose to distribute Source Code Form that is Incompatible With 352 | Secondary Licenses under the terms of this version of the License, the 353 | notice described in Exhibit B of this License must be attached. 354 | 355 | Exhibit A - Source Code Form License Notice 356 | ------------------------------------------- 357 | 358 | This Source Code Form is subject to the terms of the Mozilla Public 359 | License, v. 2.0. If a copy of the MPL was not distributed with this 360 | file, You can obtain one at http://mozilla.org/MPL/2.0/. 361 | 362 | If it is not possible or desirable to put the notice in a particular 363 | file, then You may include the notice in a location (such as a LICENSE 364 | file in a relevant directory) where a recipient would be likely to look 365 | for such a notice. 366 | 367 | You may add additional accurate notices of copyright ownership. 368 | 369 | Exhibit B - "Incompatible With Secondary Licenses" Notice 370 | --------------------------------------------------------- 371 | 372 | This Source Code Form is "Incompatible With Secondary Licenses", as 373 | defined by the Mozilla Public License, v. 2.0. 374 | 375 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | No Maintenance Intended 3 | 4 | # favicon-customizer 5 | A web-extension for customizing website favicons. 6 | 7 | Current status: experimental 8 | -------------------------------------------------------------------------------- /build/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/muffinresearch/favicon-customizer/581f91456076d44029e71003859a93d5b323162d/build/.gitkeep -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "favicon-customizer", 3 | "version": "0.0.1", 4 | "description": "A web extension for customizing site favicons", 5 | "main": "index.js", 6 | "repository": "https://github.com/muffinresearch/favicon-customizer", 7 | "author": "Stuart Colville ", 8 | "license": "MPL-2.0", 9 | "private": true, 10 | "devDependencies": { 11 | "eslint": "7.32.0", 12 | "eslint-config-amo": "4.11.0", 13 | "stylelint": "13.13.1", 14 | "stylelint-config-standard": "22.0.0", 15 | "web-ext": "6.8.0" 16 | }, 17 | "scripts": { 18 | "build": "web-ext build -s src/ -a build/", 19 | "eslint": "eslint .", 20 | "lint": "yarn eslint && yarn webext:lint", 21 | "start": "web-ext run -s src/", 22 | "webext:lint": "web-ext lint -s src/" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "automerge": true, 3 | "major": { 4 | "automerge": false 5 | }, 6 | "timezone": "UTC", 7 | "extends": [ 8 | "config:base", 9 | ":maintainLockFilesWeekly" 10 | ], 11 | "lockFileMaintenance": { 12 | "enabled": true, 13 | "schedule": "before 8am on Tuesday" 14 | }, 15 | "packageRules": [ 16 | { 17 | "packagePatterns": [ 18 | "*" 19 | ], 20 | "rangeStrategy": "pin" 21 | }, 22 | { 23 | "depTypeList": ["engines"], 24 | "rangeStrategy": "auto" 25 | } 26 | ], 27 | "stabilityDays": 7, 28 | "node": { 29 | "supportPolicy": ["lts"] 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/.stylelintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "stylelint-config-standard", 4 | ], 5 | "rules": { 6 | "at-rule-empty-line-before": ["always", { 7 | "ignore": [ 8 | "after-comment", 9 | "blockless-after-same-name-blockless", 10 | "inside-block", 11 | ], 12 | }], 13 | "at-rule-no-unknown": [true, { 14 | "ignoreAtRules": [ 15 | "content", 16 | "else", 17 | "for", 18 | "function", 19 | "if", 20 | "include", 21 | "mixin", 22 | "return", 23 | "warn", 24 | ], 25 | }], 26 | "block-closing-brace-newline-after": ["always", { 27 | "ignoreAtRules": ["if", "else"], 28 | }], 29 | "declaration-colon-newline-after": null, 30 | "function-url-quotes": ["always"], 31 | "function-disallowed-list": ["random"], 32 | "indentation": null, 33 | "max-nesting-depth": [5, { 34 | "ignore": ["blockless-at-rules"], 35 | }], 36 | "no-descending-specificity": null, 37 | "rule-empty-line-before": ["always", { 38 | "except": [ 39 | "first-nested" 40 | ], 41 | "ignore": [ 42 | "after-comment" 43 | ] 44 | }], 45 | "string-quotes": null, 46 | "value-list-comma-newline-after": null, 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/background.js: -------------------------------------------------------------------------------- 1 | const SETTINGS_KEY = 'mrl-favicon-customizer'; 2 | let faviconData = []; 3 | 4 | function onError(error) { 5 | console.error(`Error: ${error}`); 6 | } 7 | 8 | function handleTabChange(tabId, changeInfo, tab) { 9 | // Inspect the tab when it's completely loaded and find out if we need 10 | // to make a favicon change. 11 | if (changeInfo && changeInfo.status && changeInfo.status === 'complete' && faviconData) { 12 | faviconData.forEach((item) => { 13 | let tabMatched = false; 14 | if (tab.url.startsWith(item.origin)) { 15 | tabMatched = true; 16 | if (item['title-pattern'] && tab.title.indexOf(item['title-pattern']) === -1) { 17 | tabMatched = false; 18 | } 19 | } 20 | 21 | if (tabMatched && item.base64) { 22 | browser.tabs.executeScript({ file: '/change-favicon.js' }) 23 | .then(() => { 24 | return browser.tabs.sendMessage(tab.id, { dataURI: item.base64 }); 25 | }) 26 | .catch(onError); 27 | } 28 | }); 29 | } 30 | } 31 | 32 | function handleStorageChange(changes) { 33 | if (changes[SETTINGS_KEY]) { 34 | faviconData = changes[SETTINGS_KEY].newValue; 35 | } 36 | } 37 | 38 | browser.tabs.onUpdated.addListener(handleTabChange); 39 | browser.tabs.onCreated.addListener(handleTabChange); 40 | browser.storage.onChanged.addListener(handleStorageChange); 41 | browser.storage.local.get(SETTINGS_KEY) 42 | .then((results) => { 43 | faviconData = results[SETTINGS_KEY]; 44 | }) 45 | .catch(onError); 46 | -------------------------------------------------------------------------------- /src/change-favicon.js: -------------------------------------------------------------------------------- 1 | const d = document; 2 | const h = document.getElementsByTagName('head')[0]; 3 | 4 | function createFavicon(dataURI) { 5 | const lnk = d.createElement('link'); 6 | lnk.rel = 'shortcut icon'; 7 | lnk.type = 'image/x-icon'; 8 | lnk.href = dataURI; 9 | h.appendChild(lnk); 10 | } 11 | 12 | // Remove any existing favicons 13 | function clearFavicons() { 14 | const links = h.getElementsByTagName('link'); 15 | const listOfRemovals = []; 16 | for (let i = 0, j = links.length; i < j; i++) { 17 | const curLink = links[i]; 18 | if (curLink && (curLink.rel === 'shortcut icon' || curLink.rel === 'icon')) { 19 | listOfRemovals.push(curLink); 20 | } 21 | } 22 | for (let i = 0, j = listOfRemovals.length; i < j; i++) { 23 | h.removeChild(listOfRemovals[i]); 24 | } 25 | } 26 | 27 | function handleMessage(request, sender) { 28 | if (sender.id === 'favicon-customizer@muffinresearch.co.uk') { 29 | if (request.dataURI && request.dataURI.startsWith('data:image/png')) { 30 | clearFavicons(); 31 | createFavicon(request.dataURI); 32 | } else { 33 | console.error(`Content wasn't a png so this is a no-op`); 34 | } 35 | } 36 | } 37 | 38 | browser.runtime.onMessage.addListener(handleMessage); 39 | -------------------------------------------------------------------------------- /src/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "favicon-customizer", 3 | "description": "This extension allows you to customize the favicon for a given url + optional page title match.", 4 | "version": "0.6", 5 | "manifest_version": 2, 6 | "applications": { 7 | "gecko": { 8 | "id": "favicon-customizer@muffinresearch.co.uk" 9 | } 10 | }, 11 | "permissions": [ 12 | "", 13 | "tabs", 14 | "storage" 15 | ], 16 | "background": { 17 | "scripts": ["background.js"], 18 | "persistent": false 19 | }, 20 | "options_ui": { 21 | "page": "options.html" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/options.css: -------------------------------------------------------------------------------- 1 | body { 2 | color: #666; 3 | } 4 | 5 | p.help { 6 | color: #999; 7 | } 8 | 9 | @media (prefers-color-scheme: dark) { 10 | body { 11 | background: #202023; 12 | color: rgb(249, 249, 250); 13 | } 14 | } 15 | 16 | body, 17 | html { 18 | padding: 0; 19 | margin: 0; 20 | } 21 | 22 | h2 { 23 | display: block; 24 | font-size: 18px; 25 | font-weight: 200; 26 | padding-bottom: 5px; 27 | border-bottom: 1px solid rgba(12, 12, 13, 0.3); 28 | } 29 | 30 | .placeholder { 31 | width: 64px; 32 | height: 64px; 33 | background: #eee; 34 | border: 1px solid rgba(12, 12, 13, 0.3); 35 | margin-left: 10px; 36 | position: relative; 37 | box-sizing: content-box; 38 | } 39 | 40 | .placeholder:not(:empty):hover::before { 41 | background: rgba(255, 255, 255, 0.7); 42 | content: ' '; 43 | display: block; 44 | line-height: 65px; 45 | text-align: center; 46 | position: absolute; 47 | top: 0; 48 | left: 0; 49 | right: 0; 50 | bottom: 0; 51 | } 52 | 53 | label { 54 | display: flex; 55 | margin-bottom: 5px; 56 | } 57 | 58 | label span { 59 | text-align: right; 60 | width: 150px; 61 | margin-right: 10px; 62 | } 63 | 64 | .help { 65 | color: #bbb; 66 | font-size: 12px; 67 | margin: 0 0 10px 160px; 68 | } 69 | 70 | input { 71 | flex-grow: 1; 72 | border: 1px solid #c1c1c1; 73 | min-height: 1.5em; 74 | padding: 0.2em; 75 | } 76 | 77 | input[type="url"] { 78 | font-family: inherit; 79 | font-size: inherit; 80 | } 81 | 82 | input:invalid { 83 | box-shadow: none; 84 | } 85 | 86 | hr { 87 | border: 1px solid #c1c1c1; 88 | border-width: 1px 0 0; 89 | } 90 | 91 | button { 92 | padding: 0.5em 1em; 93 | } 94 | 95 | 96 | .remove-button { 97 | display: block; 98 | margin-left: auto; 99 | } 100 | 101 | .favicon-form, 102 | #custom-favicons { 103 | overflow: hidden; 104 | } 105 | 106 | .favicon-form .wrapper { 107 | display: flex; 108 | flex-direction: row; 109 | margin-bottom: 10px; 110 | } 111 | 112 | .form-block { 113 | flex-grow: 1; 114 | } 115 | 116 | .buttons { 117 | padding-bottom: 40px; 118 | border-bottom: 1px solid #ccc; 119 | } 120 | -------------------------------------------------------------------------------- /src/options.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 |
9 |

Custom Favicon 1

10 |
11 |
12 | 13 |

A name for this replacement (optional)

14 | 15 |

The url to match for favicon replacement. The tab url should start with this string.

16 | 17 |

A string to look for anywhere in the page title (optional).

18 | 19 |

Select a valid image (*.png) file to use as your replacement favicon.

20 | 21 |
22 |
23 |
24 |
25 |
26 | 27 | 28 |
29 |
30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /src/options.js: -------------------------------------------------------------------------------- 1 | const SETTINGS_KEY = 'mrl-favicon-customizer'; 2 | const $form = document.getElementById('custom-favicons'); 3 | const $addButton = document.getElementById('add-favicon'); 4 | 5 | function onError(error) { 6 | console.error(`Error: ${error}`); 7 | } 8 | 9 | $form.onclick = (e) => { 10 | const $target = e.target; 11 | if ($target.className === 'placeholder') { 12 | const img = $target.querySelector('img'); 13 | if (img) { 14 | $target.removeChild(img); 15 | const $base64 = $target.parentNode.querySelector('[name="base64"]'); 16 | if ($base64) { 17 | $base64.value = ''; 18 | } 19 | } 20 | } 21 | }; 22 | 23 | $form.onchange = (e) => { 24 | const $target = e.target; 25 | 26 | // Deal with the file element. 27 | if ($target.nodeName === 'INPUT' && $target.type === 'file') { 28 | const $wrapper = $target.closest('.wrapper'); 29 | const file = $target.files[0]; 30 | const reader = new FileReader(); 31 | reader.readAsDataURL(file); 32 | reader.onload = () => { 33 | const placeholder = $wrapper.querySelector('.placeholder'); 34 | let img = placeholder.querySelector('img'); 35 | let newImage = false; 36 | 37 | // If the format is wrong show an alert and bail. 38 | if (!reader.result.startsWith('data:image/png')) { 39 | $target.value = ''; 40 | // eslint-disable-next-line no-alert 41 | window.alert('Invalid image format - only *.png accepted.'); 42 | return; 43 | } 44 | 45 | $wrapper.querySelector('.base64').value = reader.result; 46 | if (!img) { 47 | img = document.createElement('img'); 48 | newImage = true; 49 | } 50 | img.src = reader.result; 51 | if (newImage) { 52 | img.width = 64; 53 | img.height = 64; 54 | $wrapper.querySelector('.placeholder').appendChild(img); 55 | } 56 | }; 57 | reader.onerror = onError; 58 | } 59 | }; 60 | 61 | function getFormData() { 62 | const faviconForms = $form.querySelectorAll('.favicon-form'); 63 | const dataFromForm = []; 64 | 65 | faviconForms.forEach((form) => { 66 | const formData = {}; 67 | formData.title = form.querySelector('[name="title"]').value; 68 | formData.origin = form.querySelector('[name="origin"]').value; 69 | formData['title-pattern'] = form.querySelector('[name="title-pattern"]').value; 70 | formData.base64 = form.querySelector('[name="base64"]').value; 71 | dataFromForm.push(formData); 72 | }); 73 | return dataFromForm; 74 | } 75 | 76 | function saveOptions(event) { 77 | browser.storage.local.set({ [SETTINGS_KEY]: getFormData() }) 78 | .then(null, onError); 79 | if (event) { 80 | event.preventDefault(); 81 | } 82 | } 83 | 84 | function deleteForm(e) { 85 | e.preventDefault(); 86 | e.stopPropagation(); 87 | const $target = e.target; 88 | const $targetParent = $target.parentNode; 89 | $targetParent.parentNode.removeChild($targetParent); 90 | saveOptions(); 91 | } 92 | 93 | function addForm(event) { 94 | if (event) { 95 | event.preventDefault(); 96 | event.stopPropagation(); 97 | } 98 | const $faviconForms = document.querySelectorAll('#custom-favicons .favicon-form'); 99 | const $lastForm = Array.prototype.slice.call($faviconForms, -1)[0]; 100 | const $newForm = $lastForm.cloneNode(true); 101 | let $removeButton = $newForm.querySelector('.remove-button'); 102 | if ($removeButton === null) { 103 | $removeButton = document.createElement('button'); 104 | $removeButton.textContent = 'Remove'; 105 | $removeButton.className = 'remove-button'; 106 | $newForm.appendChild($removeButton); 107 | } 108 | $removeButton.onclick = deleteForm; 109 | $newForm.querySelector('h2').textContent = `Custom Favicon ${$faviconForms.length + 1}`; 110 | $newForm.querySelector('[name="title"]').value = ''; 111 | $newForm.querySelector('[name="origin"]').value = ''; 112 | $newForm.querySelector('[name="title-pattern"]').value = ''; 113 | $newForm.querySelector('[name="file"]').value = ''; 114 | $newForm.querySelector('[name="base64"]').value = ''; 115 | 116 | const $img = $newForm.querySelector('.placeholder img'); 117 | if ($img !== null) { 118 | $newForm.querySelector('.placeholder').removeChild($img); 119 | } 120 | $form.insertBefore($newForm, $lastForm.nextSibling); 121 | } 122 | 123 | function restoreOptions() { 124 | browser.storage.local.get(SETTINGS_KEY) 125 | .then((results) => { 126 | const resultData = results[SETTINGS_KEY]; 127 | let $faviconForms = $form.querySelectorAll('.favicon-form'); 128 | const missingCount = resultData.length - $faviconForms.length; 129 | for (let i = 0; i < missingCount; i++) { 130 | addForm(); 131 | } 132 | // Refresh forms lookup. 133 | $faviconForms = $form.querySelectorAll('.favicon-form'); 134 | resultData.forEach((item, idx) => { 135 | const currentForm = $faviconForms[idx]; 136 | currentForm.querySelector('[name="title"]').value = item.title; 137 | currentForm.querySelector('[name="origin"]').value = item.origin; 138 | currentForm.querySelector('[name="title-pattern"]').value = item['title-pattern']; 139 | currentForm.querySelector('[name="base64"]').value = item.base64; 140 | const $wrapper = currentForm.querySelector('.wrapper'); 141 | 142 | if (item.base64) { 143 | const img = document.createElement('img'); 144 | img.src = item.base64; 145 | img.width = 64; 146 | img.height = 64; 147 | $wrapper.querySelector('.placeholder').appendChild(img); 148 | } 149 | }); 150 | }) 151 | .catch(onError); 152 | } 153 | 154 | (function init() { 155 | restoreOptions(); 156 | document.querySelector('#custom-favicons') 157 | .addEventListener('submit', saveOptions); 158 | $addButton.onclick = addForm; 159 | }()); 160 | --------------------------------------------------------------------------------