]> git.wh0rd.org - chrome-ext/music-player-client.git/blob - main.js
add refresh option for updating the gui automatically
[chrome-ext/music-player-client.git] / main.js
1 // Written by Mike Frysinger <vapier@gmail.com>. Released into the public domain. Suck it.
2
3 /* Globals to allow easy manipulation via javascript console */
4 var mpc;
5 var tcpclient;
6 var refresh_id = NaN;
7
8 function TcpClientSender(tcpclient) {
9 this.tcpclient = tcpclient;
10 }
11 TcpClientSender.prototype.send = function(data, cb) {
12 this.tcpclient.sendMessage(data, cb);
13 }
14
15 function tramp_mpc_recv(data) {
16 mpc.recv(data);
17 }
18
19 function sync_storage(sync) {
20 return sync ? chrome.storage.sync : chrome.storage.local;
21 }
22
23 window.onload = function() {
24 var local_keys = [
25 'sync',
26 ];
27 var sync_keys = [
28 'host', 'port', 'refresh',
29 ];
30 var options = {
31 'host': '192.168.0.2',
32 'port': 6600,
33 'sync': true,
34 'refresh': 5,
35 };
36
37 chrome.storage.local.get(local_keys, function(settings) {
38 local_keys.forEach(function(key) {
39 if (key in settings)
40 options[key] = settings[key]
41 });
42
43 var storage = sync_storage(options['sync']);
44 storage.get(sync_keys, function(settings) {
45 sync_keys.forEach(function(key) {
46 if (key in settings)
47 options[key] = settings[key];
48 });
49
50 init_ui(local_keys, sync_keys, options);
51 mpc_connect();
52 });
53 });
54 };
55
56 function mpc_refresh() {
57 mpc.status();
58 mpc.currentsong();
59 }
60
61 function mpc_connect(host, port) {
62 if (typeof(host) != 'string') {
63 host = window['opts_host'].value;
64 port = parseInt(window['opts_port'].value);
65 }
66
67 if (mpc != undefined) {
68 console.log('disconnecting');
69 update_ui('disconnect');
70 delete mpc;
71 tcpclient.disconnect();
72 delete tcpclient;
73 }
74
75 update_ui('init');
76 tcpclient = new TcpClient(host, port);
77 tcpclient.connect(function() {
78 var mpc_sender = new TcpClientSender(tcpclient);
79 tcpclient.addResponseListener(tramp_mpc_recv);
80 mpc = new Mpc(mpc_sender, update_ui);
81 console.log('connected to ' + host + ':' + port);
82 mpc_refresh();
83 update_refresh_timer();
84 });
85 }
86
87 function tramp_mpc_consume() {
88 var val = zo(!getToggleButton(this));
89 mpc.consume(val);
90 setToggleButton(this, val);
91 }
92 function tramp_mpc_next() { mpc.next(); }
93 function tramp_mpc_pause() { mpc.pause(); }
94 function tramp_mpc_play() { mpc.play(); }
95 function tramp_mpc_previous() { mpc.previous(); }
96 function tramp_mpc_random() {
97 var val = zo(!getToggleButton(this));
98 mpc.random(val);
99 setToggleButton(this, val);
100 }
101 function tramp_mpc_repeat() {
102 var val = zo(!getToggleButton(this));
103 mpc.repeat(val);
104 setToggleButton(this, val);
105 }
106 function tramp_mpc_seekcur() { mpc.seekcur(this.value); }
107 function tramp_mpc_setvol() { mpc.setvol(this.value); }
108 function tramp_mpc_single() {
109 var val = zo(!getToggleButton(this));
110 mpc.single(val);
111 setToggleButton(this, val);
112 }
113 function tramp_mpc_stop() { mpc.stop(); }
114
115 function zo(val) {
116 return val ? 1 : 0;
117 }
118 function szo(val) {
119 return val == '0' ? 0 : 1;
120 }
121 function getToggleButton(btn) {
122 return btn.style.borderStyle == 'inset';
123 }
124 function setToggleButton(btn, val) {
125 if (val === undefined)
126 val = !getToggleButton(btn);
127 btn.style.borderStyle = val ? 'inset' : '';
128 }
129
130 function show_page(page) {
131 if (typeof(page) != 'string')
132 page = this.id.split('.')[1];
133
134 var eles = document.getElementsByClassName('main');
135 for (var i = 0; i < eles.length; ++i) {
136 var ele = eles[i];
137 var dis = 'none';
138 var cls = '';
139 if (ele.id == 'main.' + page) {
140 dis = '';
141 cls = 'selected';
142 }
143 ele.style.display = dis;
144 document.getElementById('tab.' + ele.id.split('.')[1]).className = cls;
145 }
146 }
147
148 function do_refresh() {
149 mpc_refresh();
150 refresh_id = window.setTimeout(do_refresh, window['opts_refresh'].value * 1000);
151 }
152
153 function update_refresh_timer() {
154 if (refresh_id != NaN)
155 window.clearTimeout(refresh_id);
156 var rate = window['opts_refresh'].value * 1000;
157 if (rate > 0)
158 refresh_id = window.setTimeout(do_refresh, rate);
159 }
160
161 function update_local_settings() {
162 var setting = {};
163 setting[this.id] = this.checked;
164 chrome.storage.local.set(setting);
165 }
166
167 function update_sync_settings() {
168 var setting = {};
169 setting[this.id] = this.value;
170 var storage = sync_storage(window['opts_sync'].checked);
171 storage.set(setting);
172
173 switch (this.id) {
174 case 'refresh':
175 update_refresh_timer();
176 break;
177 }
178 }
179
180 function init_ui(local_keys, sync_keys, options) {
181 /* Setup footer */
182 [
183 'controls', 'metadata', 'options',
184 ].forEach(function(id) {
185 document.getElementById('tab.' + id).onclick = show_page;
186 });
187
188 /* Setup control tab */
189 ui_mpc_status = document.getElementById('status');
190 ui_mpc_metadata = document.getElementById('metadata');
191 [
192 'consume', 'next', 'pause', 'play', 'previous', 'random', 'repeat',
193 'seekcur', 'setvol', 'single', 'stop',
194 ].forEach(function(id) {
195 var ele = window['ui_mpc_' + id] = document.getElementById(id);
196 ele.onclick = window['tramp_mpc_' + id];
197 ele.title = id;
198 });
199
200 /* Setup options tab */
201 document.getElementById('connect').onclick = mpc_connect;
202 local_keys.forEach(function(id) {
203 var ele = window['opts_' + id] = document.getElementById(id);
204 ele.checked = options[id];
205 ele.onchange = update_local_settings;
206 });
207 sync_keys.forEach(function(id) {
208 var ele = window['opts_' + id] = document.getElementById(id);
209 ele.value = options[id];
210 ele.oninput = update_sync_settings;
211 });
212 }
213
214 function update_ui(state, cmd) {
215 if (typeof(state) == 'string') {
216 ui_mpc_status.innerText = ({
217 'disconnect': 'Disconnecting...',
218 'init': 'Connecting...',
219 })[state];
220 return;
221 }
222
223 if (Array.isArray(state)) {
224 /*
225 switch (cmd[0]) {
226 case 'setvol':
227 case 'seekcur':
228 break;
229 default:
230 mpc_refresh();
231 }
232 */
233 return;
234 }
235
236 if ('file' in state) {
237 // Hack: should be a real object.
238 ui_mpc_metadata.innerText = state['file'];
239 return;
240 }
241
242 var time = state.time.split(':');
243 window['ui_mpc_seekcur'].max = time[1];
244 window['ui_mpc_seekcur'].value = time[0];
245
246 window['ui_mpc_setvol'].value = state.volume;
247 [
248 'consume', 'random', 'repeat', 'single',
249 ].forEach(function(id) {
250 setToggleButton(window['ui_mpc_' + id], szo(state[id]));
251 });
252
253 ui_mpc_status.innerText = ({
254 'play': 'Playing',
255 'pause': 'Paused',
256 'stop': 'Stopped',
257 })[state.state];
258 }