├── Firefox ├── icon.png ├── icon64.png ├── data │ ├── icons │ │ ├── 128.png │ │ ├── 16.png │ │ ├── 20.png │ │ ├── 24.png │ │ ├── 256.png │ │ ├── 32.png │ │ ├── 48.png │ │ ├── 512.png │ │ └── 64.png │ └── panel │ │ ├── fontello.woff │ │ ├── index.js │ │ ├── index.css │ │ ├── index.html │ │ └── fontello.css ├── package.json └── common.js ├── Chrome-App ├── data │ ├── icons │ │ ├── 16.png │ │ ├── 20.png │ │ ├── 24.png │ │ ├── 32.png │ │ ├── 48.png │ │ ├── 64.png │ │ ├── 128.png │ │ ├── 256.png │ │ └── 512.png │ └── window │ │ ├── fontello.woff │ │ ├── index.js │ │ ├── index.html │ │ ├── index.css │ │ └── fontello.css ├── manifest.json └── common.js └── drawings └── fontello-69d0e2df.zip /Firefox/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/icon.png -------------------------------------------------------------------------------- /Firefox/icon64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/icon64.png -------------------------------------------------------------------------------- /Firefox/data/icons/128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/128.png -------------------------------------------------------------------------------- /Firefox/data/icons/16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/16.png -------------------------------------------------------------------------------- /Firefox/data/icons/20.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/20.png -------------------------------------------------------------------------------- /Firefox/data/icons/24.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/24.png -------------------------------------------------------------------------------- /Firefox/data/icons/256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/256.png -------------------------------------------------------------------------------- /Firefox/data/icons/32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/32.png -------------------------------------------------------------------------------- /Firefox/data/icons/48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/48.png -------------------------------------------------------------------------------- /Firefox/data/icons/512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/512.png -------------------------------------------------------------------------------- /Firefox/data/icons/64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/icons/64.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/16.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/20.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/20.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/24.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/24.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/32.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/48.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/64.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/128.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/256.png -------------------------------------------------------------------------------- /Chrome-App/data/icons/512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/icons/512.png -------------------------------------------------------------------------------- /drawings/fontello-69d0e2df.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/drawings/fontello-69d0e2df.zip -------------------------------------------------------------------------------- /Firefox/data/panel/fontello.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Firefox/data/panel/fontello.woff -------------------------------------------------------------------------------- /Chrome-App/data/window/fontello.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluclead/spotify-web/HEAD/Chrome-App/data/window/fontello.woff -------------------------------------------------------------------------------- /Firefox/data/panel/index.js: -------------------------------------------------------------------------------- 1 | /* globals self */ 2 | 'use strict'; 3 | 4 | document.addEventListener('click', function (e) { 5 | let cmd = e.target.dataset.cmd; 6 | if (cmd === 'pin') { 7 | e.target.dataset.value = e.target.dataset.value === 'false' ? 'true' : 'false'; 8 | } 9 | if (cmd) { 10 | self.port.emit(cmd, e.target.dataset.value); 11 | } 12 | }); 13 | -------------------------------------------------------------------------------- /Chrome-App/data/window/index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var webview = document.querySelector('webview'); 4 | 5 | webview.setAttribute('src', 'https://play.spotify.com/'); 6 | 7 | document.addEventListener('click', function (e) { 8 | let cmd = e.target.dataset.cmd; 9 | if (cmd === 'refresh') { 10 | webview.setAttribute('src', 'about:blank'); 11 | webview.setAttribute('src', 'https://play.spotify.com/'); 12 | } 13 | else { 14 | chrome.runtime.sendMessage({ 15 | method: cmd, 16 | data: e.target.dataset.value 17 | }); 18 | } 19 | }); 20 | -------------------------------------------------------------------------------- /Chrome-App/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Spotify™ Web Player", 3 | "description": "Web player for Spotify", 4 | "author": "Morni Colhkher", 5 | "version": "0.1.0", 6 | "manifest_version": 2, 7 | "permissions": [ 8 | "storage", 9 | "webview", 10 | "browser", 11 | "notifications" 12 | ], 13 | "app": { 14 | "background": { 15 | "scripts": [ 16 | "common.js" 17 | ] 18 | } 19 | }, 20 | "icons": { 21 | "16": "data/icons/16.png", 22 | "48": "data/icons/48.png", 23 | "128": "data/icons/128.png" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /Chrome-App/common.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | chrome.app.runtime.onLaunched.addListener(function() { 4 | // Center window on screen. 5 | let screenWidth = screen.availWidth; 6 | let screenHeight = screen.availHeight; 7 | let width = 700; 8 | let height = 500; 9 | 10 | chrome.app.window.create('data/window/index.html', { 11 | id: 'iswplayer', 12 | outerBounds: { 13 | width: width, 14 | height: height, 15 | left: Math.round((screenWidth-width) / 2), 16 | top: Math.round((screenHeight-height) / 2) 17 | } 18 | }); 19 | }); 20 | 21 | chrome.runtime.onMessage.addListener(function (message) { 22 | if (message.method === 'open') { 23 | chrome.browser.openTab({ 24 | url: message.data 25 | }); 26 | } 27 | }); 28 | -------------------------------------------------------------------------------- /Chrome-App/data/window/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 |
13 |
14 | 15 |
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /Chrome-App/data/window/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | display: flex; 4 | flex-direction: row; 5 | background-color: #fbfbfb; 6 | padding: 5px 5px 5px 0; 7 | font-size: 14px; 8 | } 9 | #toolbar { 10 | display: flex; 11 | flex-direction: column; 12 | align-items: center; 13 | width: 40px; 14 | } 15 | #content { 16 | flex: 1; 17 | } 18 | span { 19 | border: solid 1px #b1afc0; 20 | color: #55545c; 21 | margin: 1px; 22 | width: 25px; 23 | height: 25px; 24 | background-color: #fff; 25 | text-align: center; 26 | cursor: pointer; 27 | } 28 | span:hover { 29 | border-color: #55545c; 30 | } 31 | span:active { 32 | border-color: blue; 33 | } 34 | [class^="icon-"]:before { 35 | line-height: 25px; 36 | } 37 | 38 | webview { 39 | border: none; 40 | width: 100%; 41 | height: 100%; 42 | } 43 | -------------------------------------------------------------------------------- /Firefox/data/panel/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | height: 100%; 4 | } 5 | body { 6 | margin: 0; 7 | display: flex; 8 | flex-direction: column; 9 | background-color: #fbfbfb; 10 | align-items: center; 11 | padding: 5px 0; 12 | font-size: 14px; 13 | box-sizing: border-box; 14 | } 15 | body>div { 16 | display: flex; 17 | flex-direction: column; 18 | } 19 | body>div:first-child { 20 | flex: 1; 21 | } 22 | 23 | span { 24 | border: solid 1px #b1afc0; 25 | color: #55545c; 26 | margin: 1px; 27 | width: 25px; 28 | height: 25px; 29 | background-color: #fff; 30 | text-align: center; 31 | cursor: pointer; 32 | } 33 | span:hover { 34 | border-color: #55545c; 35 | } 36 | span:active { 37 | border-color: blue; 38 | } 39 | [class^="icon-"]:before { 40 | line-height: 25px; 41 | } 42 | 43 | span[data-cmd="pin"][data-value="true"]:before { 44 | content: '\e803'; 45 | } 46 | -------------------------------------------------------------------------------- /Firefox/data/panel/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 |
15 |
16 | 17 |
18 | 19 | 20 | -------------------------------------------------------------------------------- /Firefox/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "title": "Spotify™ Web Player", 3 | "name": "ispweb", 4 | "version": "0.1.0", 5 | "description": "Access to Spotify's Web player from within a toolbar panel", 6 | "main": "common.js", 7 | "author": "Morni Colhkher", 8 | "id": "hjmrR5thYsewq1hnY@jetpack", 9 | "engines": { 10 | "firefox": ">=38.0a1" 11 | }, 12 | "license": "MPL 2.0", 13 | "keywords": [ 14 | "jetpack" 15 | ], 16 | "permissions": { 17 | "private-browsing": true, 18 | "multiprocess": true, 19 | "unsafe-content-script": true 20 | }, 21 | "preferences": [ 22 | { 23 | "description": "Width of panel in pixels", 24 | "type": "integer", 25 | "name": "width", 26 | "value": 1100, 27 | "title": "Panel width:" 28 | }, 29 | { 30 | "description": "Height of panel in pixels", 31 | "type": "integer", 32 | "name": "height", 33 | "value": 600, 34 | "title": "Panel height:" 35 | }, 36 | { 37 | "description": "It is recommended to keep this option on to get notified of the recent changes.", 38 | "type": "bool", 39 | "name": "faqs", 40 | "value": true, 41 | "title": "Open FAQs page on update" 42 | } 43 | ] 44 | } 45 | -------------------------------------------------------------------------------- /Chrome-App/data/window/fontello.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'fontello'; 3 | src: url('fontello.woff?12'); 4 | font-weight: normal; 5 | font-style: normal; 6 | } 7 | 8 | [class^="icon-"]:before, [class*=" icon-"]:before { 9 | font-family: "fontello"; 10 | font-style: normal; 11 | font-weight: normal; 12 | speak: none; 13 | 14 | display: inline-block; 15 | text-decoration: inherit; 16 | width: 1em; 17 | margin-right: .2em; 18 | text-align: center; 19 | /* opacity: .8; */ 20 | 21 | /* For safety - reset parent styles, that can break glyph codes*/ 22 | font-variant: normal; 23 | text-transform: none; 24 | 25 | /* fix buttons height, for twitter bootstrap */ 26 | line-height: 1em; 27 | 28 | /* Animation center compensation - margins should be symmetric */ 29 | /* remove if not needed */ 30 | margin-left: .2em; 31 | 32 | /* you can be more comfortable with increased icons size */ 33 | /* font-size: 120%; */ 34 | 35 | /* Font smoothing. That was taken from TWBS */ 36 | -webkit-font-smoothing: antialiased; 37 | -moz-osx-font-smoothing: grayscale; 38 | 39 | /* Uncomment for 3D effect */ 40 | /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ 41 | } 42 | 43 | .icon-home:before { content: '\e800'; } /* '' */ 44 | .icon-refresh:before { content: '\e801'; } /* '' */ 45 | .icon-pin-false:before { content: '\e802'; } /* '' */ 46 | .icon-pin-true:before { content: '\e803'; } /* '' */ 47 | .icon-settings:before { content: '\e804'; } /* '' */ 48 | .icon-bug:before { content: '\f188'; } /* '' */ 49 | .icon-spotify:before { content: '\f327'; } /* '' */ 50 | -------------------------------------------------------------------------------- /Firefox/data/panel/fontello.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'fontello'; 3 | src: url('fontello.woff?12'); 4 | font-weight: normal; 5 | font-style: normal; 6 | } 7 | 8 | [class^="icon-"]:before, [class*=" icon-"]:before { 9 | font-family: "fontello"; 10 | font-style: normal; 11 | font-weight: normal; 12 | speak: none; 13 | 14 | display: inline-block; 15 | text-decoration: inherit; 16 | width: 1em; 17 | margin-right: .2em; 18 | text-align: center; 19 | /* opacity: .8; */ 20 | 21 | /* For safety - reset parent styles, that can break glyph codes*/ 22 | font-variant: normal; 23 | text-transform: none; 24 | 25 | /* fix buttons height, for twitter bootstrap */ 26 | line-height: 1em; 27 | 28 | /* Animation center compensation - margins should be symmetric */ 29 | /* remove if not needed */ 30 | margin-left: .2em; 31 | 32 | /* you can be more comfortable with increased icons size */ 33 | /* font-size: 120%; */ 34 | 35 | /* Font smoothing. That was taken from TWBS */ 36 | -webkit-font-smoothing: antialiased; 37 | -moz-osx-font-smoothing: grayscale; 38 | 39 | /* Uncomment for 3D effect */ 40 | /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ 41 | } 42 | 43 | .icon-home:before { content: '\e800'; } /* '' */ 44 | .icon-refresh:before { content: '\e801'; } /* '' */ 45 | .icon-pin-false:before { content: '\e802'; } /* '' */ 46 | .icon-pin-true:before { content: '\e803'; } /* '' */ 47 | .icon-settings:before { content: '\e804'; } /* '' */ 48 | .icon-bug:before { content: '\f188'; } /* '' */ 49 | .icon-spotify:before { content: '\f327'; } /* '' */ 50 | -------------------------------------------------------------------------------- /Firefox/common.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var {ToggleButton} = require('sdk/ui/button/toggle'); 4 | var tabs = require('sdk/tabs'); 5 | var panels = require('sdk/panel'); 6 | var self = require('sdk/self'); 7 | var sp = require('sdk/simple-prefs'); 8 | var timers = require('sdk/timers'); 9 | var utils = require('sdk/window/utils'); 10 | var {getActiveView} = require('sdk/view/core'); 11 | var Worker = require('sdk/content/worker').Worker; // jshint ignore:line 12 | var unload = require('sdk/system/unload'); 13 | var {Cc, Ci} = require('chrome'); 14 | 15 | var panel, button, browser; 16 | 17 | button = new ToggleButton({ 18 | id: self.name, 19 | label: 'Spotify™ Web Player', 20 | icon: { 21 | '16': './icons/16.png', 22 | '32': './icons/32.png', 23 | '64': './icons/64.png' 24 | }, 25 | onChange: state => state.checked && panel.show({ 26 | position: button 27 | }) 28 | }); 29 | 30 | panel = panels.Panel({ 31 | contentURL: self.data.url('./panel/index.html'), 32 | contentScriptFile: self.data.url('./panel/index.js'), 33 | width: 40, 34 | height: sp.prefs.height, 35 | onHide: () => button.state('window', {checked: false}) 36 | }); 37 | panel.port.on('open', (url) => { 38 | panel.hide(); 39 | tabs.open(url); 40 | }); 41 | panel.port.on('refresh', () => { 42 | browser.src = 'https://play.spotify.com/'; 43 | browser.reload(); 44 | }); 45 | panel.port.on('settings', () => { 46 | panel.hide(); 47 | utils.getMostRecentBrowserWindow().BrowserOpenAddonsMgr('addons://detail/' + self.id); 48 | }); 49 | panel.port.on('pin', function (bol) { 50 | getActiveView(panel).setAttribute('noautohide', bol); 51 | }); 52 | 53 | browser = (function (panelView) { 54 | // display tooltips 55 | panelView.setAttribute('tooltip', 'aHTMLTooltip'); 56 | let b = panelView.ownerDocument.createElement('browser'); 57 | b.setAttribute('type', 'content'); 58 | b.setAttribute('style', `width: ${sp.prefs.width}px;`); 59 | panelView.appendChild(b); 60 | b.setAttribute('src', 'https://play.spotify.com/'); 61 | return b; 62 | })(getActiveView(panel)); 63 | 64 | sp.on('width', () => timers.setTimeout(() => { 65 | sp.prefs.width = Math.max(300, sp.prefs.width); 66 | browser.setAttribute('style', `width: ${sp.prefs.width}px;`); 67 | }, 2000)); 68 | sp.on('height', () => timers.setTimeout(() => { 69 | sp.prefs.height = Math.max(300, sp.prefs.height); 70 | panel.height = sp.prefs.height; 71 | }, 2000)); 72 | 73 | // FAQs page 74 | exports.main = function (options) { 75 | if (options.loadReason === 'install' || options.loadReason === 'startup') { 76 | let version = sp.prefs.version; 77 | if (self.version !== version) { 78 | if (sp.prefs.faqs) { 79 | timers.setTimeout(function () { 80 | tabs.open( 81 | 'http://add0n.com/spotify-web.html?v=' + self.version + 82 | (version ? '&p=' + version + '&type=upgrade' : '&type=install') 83 | ); 84 | }, 3000); 85 | } 86 | sp.prefs.version = self.version; 87 | } 88 | } 89 | }; 90 | --------------------------------------------------------------------------------