New media webplugin WIP

This commit is contained in:
Fabio Manganiello 2019-06-22 14:41:42 +02:00
parent 482f6f0765
commit 2da6d7d866
2 changed files with 25 additions and 3 deletions

View file

@ -129,9 +129,17 @@ Vue.component('media', {
this.selectedDevice = device; this.selectedDevice = device;
}, },
syncPosition: function(status) {
status._syncTime = {
timestamp: new Date(),
position: status.position,
};
},
onStatusUpdate: function(event) { onStatusUpdate: function(event) {
const dev = event.device; const dev = event.device;
const status = event.status; const status = event.status;
this.syncPosition(status);
if (!this.status[dev.type]) if (!this.status[dev.type])
Vue.set(this.status, dev.type, {}); Vue.set(this.status, dev.type, {});
@ -140,6 +148,7 @@ Vue.component('media', {
onMediaEvent: async function(event) { onMediaEvent: async function(event) {
let status = await request(event.plugin + '.status'); let status = await request(event.plugin + '.status');
this.syncPosition(status);
if (event.resource) { if (event.resource) {
event.url = event.resource; event.url = event.resource;
@ -150,9 +159,20 @@ Vue.component('media', {
event.plugin = event.plugin.substr(6); event.plugin = event.plugin.substr(6);
if (this.status[event.player] && this.status[event.player][event.plugin]) if (this.status[event.player] && this.status[event.player][event.plugin])
this.status[event.player][event.plugin] = status; Vue.set(this.status[event.player], event.plugin, status);
else if (this.status[event.plugin] && this.status[event.plugin][event.player]) else if (this.status[event.plugin] && this.status[event.plugin][event.player])
this.status[event.plugin][event.player] = status; Vue.set(this.status[event.plugin], event.player, status);
},
timerFunc: function() {
for (const [playerType, players] of Object.entries(this.status)) {
for (const [playerName, status] of Object.entries(players)) {
if (status.state === 'play' && !isNaN(status.position) && status._syncTime) {
status.position = status._syncTime.position +
((new Date()).getTime()/1000) - (status._syncTime.timestamp.getTime()/1000);
}
}
}
}, },
}, },
@ -181,6 +201,8 @@ Vue.component('media', {
this.bus.$on('results-loading', this.onResultsLoading); this.bus.$on('results-loading', this.onResultsLoading);
this.bus.$on('results-ready', this.onResultsReady); this.bus.$on('results-ready', this.onResultsReady);
this.bus.$on('status-update', this.onStatusUpdate); this.bus.$on('status-update', this.onStatusUpdate);
setInterval(this.timerFunc, 1000);
}, },
}); });

View file

@ -27,7 +27,7 @@
v-model="status.position" v-model="status.position"
@input="bus.$emit('seek', $event.target.value)" @input="bus.$emit('seek', $event.target.value)"
class="slider seek-slider" class="slider seek-slider"
:disabled="!status.seekable || !status.duration" :disabled="!status.seekable"
min="0" min="0"
:max="status.duration || 0"> :max="status.duration || 0">
<span class="total-time" v-text="status.duration ? convertTime(status.duration) : '-:--'"></span> <span class="total-time" v-text="status.duration ? convertTime(status.duration) : '-:--'"></span>