├── .gitignore ├── icons ├── panda-computer-128.png ├── panda-computer-16.png ├── panda-computer-19.png ├── panda-computer-256.png ├── panda-computer-32.png ├── panda-computer-38.png ├── panda-computer-48.png └── panda-computer-64.png ├── background.js ├── README.md └── manifest.json /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | -------------------------------------------------------------------------------- /icons/panda-computer-128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-128.png -------------------------------------------------------------------------------- /icons/panda-computer-16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-16.png -------------------------------------------------------------------------------- /icons/panda-computer-19.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-19.png -------------------------------------------------------------------------------- /icons/panda-computer-256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-256.png -------------------------------------------------------------------------------- /icons/panda-computer-32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-32.png -------------------------------------------------------------------------------- /icons/panda-computer-38.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-38.png -------------------------------------------------------------------------------- /icons/panda-computer-48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-48.png -------------------------------------------------------------------------------- /icons/panda-computer-64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tinify/analyzer-browser-extension/master/icons/panda-computer-64.png -------------------------------------------------------------------------------- /background.js: -------------------------------------------------------------------------------- 1 | function openAnalyzerPage(url) { 2 | if (validSiteURL(url)) { 3 | chrome.tabs.create({ 4 | url: 'https://tinypng.com/analyzer#' + url 5 | }); 6 | } 7 | } 8 | 9 | function validSiteURL(url) { 10 | if (url.substring(0, 28) == 'https://tinypng.com/analyzer' ) { 11 | return false 12 | } else if (url.substring(0, 8) == 'https://' ) { 13 | return true 14 | } else if (url.substring(0, 7) == 'http://' ) { 15 | return true 16 | } else { 17 | return false 18 | } 19 | } 20 | 21 | chrome.browserAction.onClicked.addListener((tab) => { 22 | openAnalyzerPage(tab.url) 23 | }); 24 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Web Page Analyzer Browser Extension for Firefox and Chrome 2 | 3 | This webextension will add a button to your browser which allows to directly 4 | analyze how much image optimization can be achieved. 5 | 6 | ## Chrome installation instructions 7 | 8 | Go to the Chrome Extensions settings page 9 | 10 | ``` 11 | chrome://extensions 12 | ``` 13 | 14 | then click on _Developer mode_ and _Load unpacked extension..._ button. 15 | 16 | ## Firefox installation instructions 17 | 18 | Go to the Add-ons panel 19 | 20 | ``` 21 | about:debugging 22 | ``` 23 | 24 | and load the extension by clicking on the _Load Temporary Add-on_ button. 25 | -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | 3 | "manifest_version": 2, 4 | "name": "Web Page Image Analyzer", 5 | "version": "0.1", 6 | 7 | "description": "Test how much you can save by compressing your images with TinyPNG. The extension adds a button to easily analyze compression of images on a web page.", 8 | 9 | "permissions": [ 10 | "activeTab" 11 | ], 12 | 13 | "icons": { 14 | "16": "icons/panda-computer-16.png", 15 | "32": "icons/panda-computer-32.png", 16 | "48": "icons/panda-computer-48.png", 17 | "64": "icons/panda-computer-64.png", 18 | "128": "icons/panda-computer-128.png", 19 | "256": "icons/panda-computer-256.png" 20 | }, 21 | 22 | "background": { 23 | "scripts": ["background.js"] 24 | }, 25 | 26 | "browser_action": { 27 | "default_icon": { 28 | "16": "icons/panda-computer-16.png", 29 | "19": "icons/panda-computer-19.png", 30 | "32": "icons/panda-computer-32.png", 31 | "38": "icons/panda-computer-38.png", 32 | "48": "icons/panda-computer-48.png", 33 | "64": "icons/panda-computer-64.png" 34 | } 35 | } 36 | } 37 | --------------------------------------------------------------------------------