Změny designu

closes #2 @1h
pull/9/head
David Zálešák 4 years ago
parent b75b9c3ae6
commit b9c668841d

@ -50,6 +50,15 @@ article {
article img {
max-width: 100%;
max-height: 25vh;
margin: 1em;
}
article img:nth-child(odd) {
float: right;
}
article img:nth-child(even) {
float: left;
}
article h1:first-child {
@ -92,6 +101,7 @@ article p:last-child {
"icon time"
"icon comment";
border-bottom: 0.1vh solid #707070;
cursor: pointer;
}
.comment:last-child {
border: none;
@ -174,7 +184,7 @@ progress::-webkit-progress-bar {
min-height: 5px;
margin: 0;
cursor: pointer;
z-index: 5;
z-index: 15;
}
.seek:focus {
@ -209,7 +219,7 @@ progress::-webkit-progress-bar {
left: 35%;
height: 0.5vh;
min-height: 5px;
z-index: 6;
z-index: 10;
cursor: pointer;
}

@ -27,6 +27,7 @@ class Controller {
this.loadXml(videoToLoad).then(
function (v) {
this.view.drawCommentsText(v);
this.addEventListeners();
this.view.drawCommentsToVideo(v);
}.bind(this)
);
@ -79,6 +80,26 @@ class Controller {
);
}
addEventListeners() {
let comments = document.getElementsByClassName("comment");
for (let i = 0; i < comments.length; i++) {
comments[i].addEventListener(
"mouseover",
function () {
this.view.commentHover(comments[i].firstChild);
}.bind(this)
);
comments[i].addEventListener(
"mouseout",
function () {
if (!comments[i].classList.contains("activeComment"))
this.view.commentHover(comments[i].firstChild, false);
}.bind(this)
);
}
}
async loadVideo(v) {
let video = document.getElementById("video");

@ -123,6 +123,15 @@ class View {
textArea.innerHTML = text;
}
commentHover(c, active = true) {
let svgDoc = c.contentDocument;
if (active) {
svgDoc.getElementById("path4").style.fill = "#ffa800";
} else {
svgDoc.getElementById("path4").style.fill = "#c1c1c1";
}
}
/* colorTogglePlaySVG() {
var playSVG = document.getElementById("togglePlayIcon");
var svgDoc;