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                 console.log('protip: use the "mpc" object to poke mpd directly.\n' +
  83                             'you can also do mpc.set_debug(3) to see traffic');
  84                 mpc_refresh();
  85                 update_refresh_timer();
  86         });
  87 }
  88
  89 function tramp_mpc_consume() {
  90         var val = zo(!getToggleButton(this));
  91         mpc.consume(val);
  92         setToggleButton(this, val);
  93 }
  94 function tramp_mpc_next() { mpc.next(); }
  95 function tramp_mpc_pause() { mpc.pause(); }
  96 function tramp_mpc_play() { mpc.play(); }
  97 function tramp_mpc_previous() { mpc.previous(); }
  98 function tramp_mpc_random() {
  99         var val = zo(!getToggleButton(this));
 100         mpc.random(val);
 101         setToggleButton(this, val);
 102 }
 103 function tramp_mpc_repeat() {
 104         var val = zo(!getToggleButton(this));
 105         mpc.repeat(val);
 106         setToggleButton(this, val);
 107 }
 108 function tramp_mpc_seekcur() { mpc.seekcur(this.value); }
 109 function tramp_mpc_setvol() { mpc.setvol(this.value); }
 110 function tramp_mpc_single() {
 111         var val = zo(!getToggleButton(this));
 112         mpc.single(val);
 113         setToggleButton(this, val);
 114 }
 115 function tramp_mpc_stop() { mpc.stop(); }
 116
 117 function zo(val) {
 118         return val ? 1 : 0;
 119 }
 120 function szo(val) {
 121         return val == '0' ? 0 : 1;
 122 }
 123 function getToggleButton(btn) {
 124         return btn.style.borderStyle == 'inset';
 125 }
 126 function setToggleButton(btn, val) {
 127         if (val === undefined)
 128                 val = !getToggleButton(btn);
 129         btn.style.borderStyle = val ? 'inset' : '';
 130 }
 131
 132 function show_page(page) {
 133         if (typeof(page) != 'string')
 134                 page = this.id.split('.')[1];
 135
 136         var eles = document.getElementsByClassName('main');
 137         for (var i = 0; i < eles.length; ++i) {
 138                 var ele = eles[i];
 139                 var dis = 'none';
 140                 var cls = '';
 141                 if (ele.id == 'main.' + page) {
 142                         dis = '';
 143                         cls = 'selected';
 144                 }
 145                 ele.style.display = dis;
 146                 document.getElementById('tab.' + ele.id.split('.')[1]).className = cls;
 147         }
 148 }
 149
 150 function do_refresh() {
 151         mpc_refresh();
 152         refresh_id = window.setTimeout(do_refresh, window['opts_refresh'].value * 1000);
 153 }
 154
 155 function update_refresh_timer() {
 156         if (!isNaN(refresh_id))
 157                 window.clearTimeout(refresh_id);
 158         var rate = window['opts_refresh'].value * 1000;
 159         if (rate > 0)
 160                 refresh_id = window.setTimeout(do_refresh, rate);
 161 }
 162
 163 function update_local_settings() {
 164         var setting = {};
 165         setting[this.id] = this.checked;
 166         chrome.storage.local.set(setting);
 167 }
 168
 169 function update_sync_settings() {
 170         var setting = {};
 171         setting[this.id] = this.value;
 172         var storage = sync_storage(window['opts_sync'].checked);
 173         storage.set(setting);
 174
 175         switch (this.id) {
 176         case 'refresh':
 177                 update_refresh_timer();
 178                 break;
 179         }
 180 }
 181
 182 function init_ui(local_keys, sync_keys, options) {
 183         /* Setup footer */
 184         [
 185                 'controls', 'metadata', 'options',
 186         ].forEach(function(id) {
 187                 document.getElementById('tab.' + id).onclick = show_page;
 188         });
 189
 190         /* Setup control tab */
 191         ui_mpc_status = document.getElementById('status');
 192         ui_mpc_metadata = document.getElementById('metadata');
 193         [
 194                 'consume', 'next', 'pause', 'play', 'previous', 'random', 'repeat',
 195                 'seekcur', 'setvol', 'single', 'stop',
 196         ].forEach(function(id) {
 197                 var ele = window['ui_mpc_' + id] = document.getElementById(id);
 198                 ele.onchange = ele.onclick = window['tramp_mpc_' + id];
 199                 ele.title = id;
 200         });
 201
 202         /* Setup options tab */
 203         document.getElementById('connect').onclick = mpc_connect;
 204         local_keys.forEach(function(id) {
 205                 var ele = window['opts_' + id] = document.getElementById(id);
 206                 ele.checked = options[id];
 207                 ele.onchange = update_local_settings;
 208         });
 209         sync_keys.forEach(function(id) {
 210                 var ele = window['opts_' + id] = document.getElementById(id);
 211                 ele.value = options[id];
 212                 ele.oninput = update_sync_settings;
 213         });
 214 }
 215
 216 function update_ui(state, cmd) {
 217         if (typeof(state) == 'string') {
 218                 ui_mpc_status.innerText = ({
 219                         'disconnect': 'Disconnecting...',
 220                         'init': 'Connecting...',
 221                 })[state];
 222                 return;
 223         }
 224
 225         if (Array.isArray(state)) {
 226                 /*
 227                 switch (cmd[0]) {
 228                 case 'setvol':
 229                 case 'seekcur':
 230                         break;
 231                 default:
 232                         mpc_refresh();
 233                 }
 234                 */
 235                 return;
 236         }
 237
 238         if ('file' in state) {
 239                 // Hack: should be a real object.
 240                 ui_mpc_metadata.innerText = state['file'];
 241         }
 242
 243         var time;
 244         if ('time' in state)
 245                 // When stopped, there is no time field at all.
 246                 time = state.time.split(':');
 247         else
 248                 time = [0, 0];
 249         window['ui_mpc_seekcur'].max = time[1];
 250         window['ui_mpc_seekcur'].value = time[0];
 251
 252         window['ui_mpc_setvol'].value = state.volume;
 253         [
 254                 'consume', 'random', 'repeat', 'single',
 255         ].forEach(function(id) {
 256                 setToggleButton(window['ui_mpc_' + id], szo(state[id]));
 257         });
 258
 259         ui_mpc_status.innerText = ({
 260                 'play': 'Playing',
 261                 'pause': 'Paused',
 262                 'stop': 'Stopped',
 263         })[state.state];
 264 }