Marking player now works (the div mark remains on top of yt videos). Todo: clear mark when popup goes away.

This commit is contained in:
Tamius Han 2018-12-07 00:17:49 +01:00
parent 8bdd8a4dbf
commit 2c889b55a8
5 changed files with 6 additions and 7 deletions

View File

@ -87,8 +87,6 @@ class CommsClient {
} else if (message.cmd === 'set-zoom') { } else if (message.cmd === 'set-zoom') {
this.pageInfo.setZoom(message.zoom, true, message.playing); this.pageInfo.setZoom(message.zoom, true, message.playing);
} else if (message.cmd === 'mark-player') { } else if (message.cmd === 'mark-player') {
console.log("COMMS CLIENT MARKING PLAYER!")
this.pageInfo.markPlayer(message.name, message.color); this.pageInfo.markPlayer(message.name, message.color);
} }
} }
@ -348,7 +346,7 @@ class CommsServer {
} else if (message.cmd === 'noVideo') { } else if (message.cmd === 'noVideo') {
this.server.unregisterVideo(port.sender); this.server.unregisterVideo(port.sender);
} else if (message.cmd === 'mark-player') { } else if (message.cmd === 'mark-player') {
this.sendToFrame(message, this.tab, message.targetFrame); this.sendToFrame(message, message.targetTab, message.targetFrame);
} }
} }

View File

@ -70,10 +70,13 @@ class PlayerData {
} }
markPlayer(name, color) { markPlayer(name, color) {
console.log("PLAYERDATA — MARKING PLAYER!")
var overlay = document.createElement('div'); var overlay = document.createElement('div');
overlay.style.width = '100%'; overlay.style.width = '100%';
overlay.style.height = '100%'; overlay.style.height = '100%';
overlay.style.position = 'absolute';
overlay.style.top = '0';
overlay.style.left = '0';
overlay.style.zIndex = '1000000000';
overlay.innerHTML = `<div style="background-color: ${color}; color: #fff; position: absolute; top: 0; left: 0">${name}</div>`; overlay.innerHTML = `<div style="background-color: ${color}; color: #fff; position: absolute; top: 0; left: 0">${name}</div>`;
this.overlayNode = overlay; this.overlayNode = overlay;

View File

@ -190,7 +190,6 @@ class VideoData {
} }
markPlayer(name, color) { markPlayer(name, color) {
console.log("VIDEO DATA — MARKING PLAYER!")
if (this.player) { if (this.player) {
this.player.markPlayer(name, color) this.player.markPlayer(name, color)
} }

View File

@ -420,8 +420,6 @@ class PageInfo {
} }
markPlayer(name, color) { markPlayer(name, color) {
console.log("PAGEINFO — MARKING PLAYER!")
for (var vd of this.videos) { for (var vd of this.videos) {
vd.markPlayer(name,color); vd.markPlayer(name,color);
} }

View File

@ -105,6 +105,7 @@ function loadFrames(videoTab) {
port.postMessage({ port.postMessage({
cmd: 'mark-player', cmd: 'mark-player',
targetTab: videoTab.id,
targetFrame: videoTab.frames[frame].id, targetFrame: videoTab.frames[frame].id,
name: videoTab.frames[frame].id, name: videoTab.frames[frame].id,
color: '#fa6' color: '#fa6'