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