/* Globals to allow easy manipulation via javascript console */
var mpc;
var tcpclient;
+var refresh_id = NaN;
function TcpClientSender(tcpclient) {
this.tcpclient = tcpclient;
TcpClientSender.prototype.send = function(data, cb) {
this.tcpclient.sendMessage(data, cb);
}
+TcpClientSender.prototype.poll = function() {
+ this.tcpclient.poll();
+}
function tramp_mpc_recv(data) {
mpc.recv(data);
'sync',
];
var sync_keys = [
- 'host', 'port',
+ 'host', 'port', 'refresh',
];
var options = {
'host': '192.168.0.2',
'port': 6600,
'sync': true,
+ 'refresh': 5,
};
chrome.storage.local.get(local_keys, function(settings) {
});
};
+window.onkeypress = function(e) {
+ switch (e.keyCode) {
+ case 49: // 1
+ show_page('controls');
+ break;
+ case 50: // 1
+ show_page('metadata');
+ break;
+ case 51: // 1
+ show_page('playlist');
+ break;
+ case 52: // 1
+ show_page('options');
+ break;
+ }
+};
+
function mpc_refresh() {
mpc.status();
- mpc.currentsong();
}
function mpc_connect(host, port) {
tcpclient.addResponseListener(tramp_mpc_recv);
mpc = new Mpc(mpc_sender, update_ui);
console.log('connected to ' + host + ':' + port);
+ console.log('protip: use the "mpc" object to poke mpd directly.\n' +
+ 'you can also do mpc.set_debug(3) to see traffic');
mpc_refresh();
+ update_refresh_timer();
});
}
mpc.consume(val);
setToggleButton(this, val);
}
+function tramp_mpc_deleteid() { mpc.deleteid(this.title); }
function tramp_mpc_next() { mpc.next(); }
function tramp_mpc_pause() { mpc.pause(); }
function tramp_mpc_play() { mpc.play(); }
if (typeof(page) != 'string')
page = this.id.split('.')[1];
+ switch (page) {
+ case 'playlist':
+ mpc.playlistinfo();
+ // Fallthrough.
+ case 'metadata':
+ mpc.currentsong();
+ break;
+ }
+
var eles = document.getElementsByClassName('main');
for (var i = 0; i < eles.length; ++i) {
var ele = eles[i];
}
}
+function do_refresh() {
+ mpc_refresh();
+ refresh_id = window.setTimeout(do_refresh, window['opts_refresh'].value * 1000);
+}
+
+function update_refresh_timer() {
+ if (!isNaN(refresh_id))
+ window.clearTimeout(refresh_id);
+ var rate = window['opts_refresh'].value * 1000;
+ if (rate > 0)
+ refresh_id = window.setTimeout(do_refresh, rate);
+}
+
function update_local_settings() {
var setting = {};
setting[this.id] = this.checked;
setting[this.id] = this.value;
var storage = sync_storage(window['opts_sync'].checked);
storage.set(setting);
+
+ switch (this.id) {
+ case 'refresh':
+ update_refresh_timer();
+ break;
+ }
}
function init_ui(local_keys, sync_keys, options) {
+ var ele, i;
+
/* Setup footer */
+ i = 1;
[
- 'controls', 'metadata', 'options',
+ 'controls', 'metadata', 'playlist', 'options',
].forEach(function(id) {
- document.getElementById('tab.' + id).onclick = show_page;
+ var ele = document.getElementById('tab.' + id);
+ ele.onclick = show_page;
+ ele.title = id + ' [' + i + ']';
+ ++i;
});
/* Setup control tab */
ui_mpc_status = document.getElementById('status');
- ui_mpc_metadata = document.getElementById('metadata');
[
'consume', 'next', 'pause', 'play', 'previous', 'random', 'repeat',
'seekcur', 'setvol', 'single', 'stop',
].forEach(function(id) {
var ele = window['ui_mpc_' + id] = document.getElementById(id);
- ele.onclick = window['tramp_mpc_' + id];
+ ele.onchange = ele.onclick = window['tramp_mpc_' + id];
ele.title = id;
+ if (ele.accessKey)
+ ele.title += ' [' + ele.accessKey + ']'
});
+ window['ui_mpc_currtime'] = document.getElementById('currtime');
+
+ /* Setup metadata tab */
+ [
+ 'album', 'artist', 'date', 'file', 'title',
+ ].forEach(function(id) {
+ window['ui_mpc_metadata_' + id] = document.getElementById('metadata.' + id);
+ });
+
+ /* Setup playlist tab */
+ window['ui_mpc_playlist'] = document.getElementById('playlist');
/* Setup options tab */
document.getElementById('connect').onclick = mpc_connect;
});
}
+function pretty_time(time) {
+ var sec, min, hrs, ret = '';
+ time = parseInt(time);
+ sec = time % 60;
+ min = parseInt((time / 60) % 60);
+ hrs = parseInt((time / 3600) % 3600);
+ if (hrs)
+ ret = hrs + ':' + ("00" + min).substr(-2) + ':';
+ else
+ ret = min + ':';
+ return ret + ("00" + sec).substr(-2);
+}
+
+function playlist_del() {
+ mpc.deleteid(this.title);
+ this.parentNode.remove();
+}
+
function update_ui(state, cmd) {
if (typeof(state) == 'string') {
ui_mpc_status.innerText = ({
return;
}
- if ('file' in state) {
- // Hack: should be a real object.
- ui_mpc_metadata.innerText = state['file'];
- return;
- }
+ /* Update the metadata tab. */
+ var currentsong = {};
+ if ('Currentsong' in state)
+ currentsong = state.Currentsong;
+ ui_mpc_metadata_album.innerText = currentsong.Album;
+ ui_mpc_metadata_artist.innerText = currentsong.Artist;
+ ui_mpc_metadata_title.innerText = currentsong.Title;
+ ui_mpc_metadata_date.innerText = currentsong.Date;
+ ui_mpc_metadata_file.innerText = currentsong.file;
+
+ /* Update the playlist tab. */
+ var playlist = [];
+ if ('Playlist' in state)
+ playlist = state.Playlist;
+ ui_mpc_playlist.innerHTML = '';
+ playlist.forEach(function(song) {
+ var cell, row = ui_mpc_playlist.insertRow(-1);
+ if (song.Pos == currentsong.Pos)
+ row.style.fontWeight = 'bold';
+
+ cell = row.insertCell(-1);
+ cell.id = 'playlist_del';
+ cell.innerHTML = '¤';
+ cell.title = song.Id;
+ cell.onclick = playlist_del;
+
+ cell = row.insertCell(-1);
+ cell.innerText = song.Pos;
+ cell.style.textAlign = 'right';
+
+ if ('Artist' in song) {
+ row.insertCell(-1).innerText = song.Artist;
+ row.insertCell(-1).innerText = song.Album;
+ row.insertCell(-1).innerText = song.Title;
+ } else {
+ cell = row.insertCell(-1);
+ cell.innerText = song.file;
+ cell.colSpan = 3;
+ }
+ row.insertCell(-1).innerText = pretty_time(song.Time);
+ });
+
+ /* Update the status tab. */
+ var time;
+ if ('time' in state)
+ // When stopped, there is no time field at all.
+ time = state.time.split(':');
+ else
+ time = [0, 0];
+ ui_mpc_seekcur.max = time[1];
+ ui_mpc_seekcur.value = time[0];
+ percent = Math.floor((0.0 + time[0]) * 100 / (0.0 + time[1]));
+ ui_mpc_seekcur.title = 'seekcur (' + percent + '%)';
+ ui_mpc_currtime.innerText = [pretty_time(time[0]), pretty_time(time[1]), percent + '%'].join(' / ');
- var time = state.time.split(':');
- window['ui_mpc_seekcur'].max = time[1];
- window['ui_mpc_seekcur'].value = time[0];
+ ui_mpc_setvol.value = state.volume;
+ ui_mpc_setvol.title = 'setvol (' + state.volume + '%)';
- window['ui_mpc_setvol'].value = state.volume;
[
'consume', 'random', 'repeat', 'single',
].forEach(function(id) {