|
|
@ -27,6 +27,7 @@ class View {
|
|
|
|
for (let i = 0; i < comments.length; i++) {
|
|
|
|
for (let i = 0; i < comments.length; i++) {
|
|
|
|
let comment = document.createElement("div");
|
|
|
|
let comment = document.createElement("div");
|
|
|
|
comment.setAttribute("class", "comment");
|
|
|
|
comment.setAttribute("class", "comment");
|
|
|
|
|
|
|
|
comment.setAttribute("id", "c" + i);
|
|
|
|
|
|
|
|
|
|
|
|
let object = document.createElement("object");
|
|
|
|
let object = document.createElement("object");
|
|
|
|
object.setAttribute("class", "icon");
|
|
|
|
object.setAttribute("class", "icon");
|
|
|
@ -37,7 +38,14 @@ class View {
|
|
|
|
|
|
|
|
|
|
|
|
let time = document.createElement("div");
|
|
|
|
let time = document.createElement("div");
|
|
|
|
time.setAttribute("class", "time");
|
|
|
|
time.setAttribute("class", "time");
|
|
|
|
time.innerHTML = comments[i].start;
|
|
|
|
|
|
|
|
|
|
|
|
var minutes = Math.floor(comments[i].start / 60);
|
|
|
|
|
|
|
|
var seconds = comments[i].start % 60;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
time.innerHTML =
|
|
|
|
|
|
|
|
minutes.toString().padStart(2, "0") +
|
|
|
|
|
|
|
|
":" +
|
|
|
|
|
|
|
|
seconds.toString().padStart(2, "0");;
|
|
|
|
|
|
|
|
|
|
|
|
comment.appendChild(time);
|
|
|
|
comment.appendChild(time);
|
|
|
|
|
|
|
|
|
|
|
@ -51,16 +59,17 @@ class View {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
drawCommentsToVideo(comments, lenght) {
|
|
|
|
drawCommentsToVideo(comments) {
|
|
|
|
let videoProgress = document.getElementById("video-progress");
|
|
|
|
let videoProgress = document.getElementById("video-progress");
|
|
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i < comments.length; i++) {
|
|
|
|
for (let i = 0; i < comments.length; i++) {
|
|
|
|
let videoComment = document.createElement("div");
|
|
|
|
let videoComment = document.createElement("div");
|
|
|
|
videoComment.setAttribute("class", "videoComment");
|
|
|
|
videoComment.setAttribute("class", "videoComment");
|
|
|
|
let percentLeft = (comments[i].start / lenght) * 100;
|
|
|
|
let percentLeft = (comments[i].start / this.videoPlayer.videoDuration) * 100;
|
|
|
|
videoComment.style.left = percentLeft + "%";
|
|
|
|
videoComment.style.left = percentLeft + "%";
|
|
|
|
let percentWidth = ((comments[i].end - comments[i].start) / lenght) * 100;
|
|
|
|
let percentWidth = ((comments[i].end - comments[i].start) / this.videoPlayer.videoDuration) * 100;
|
|
|
|
videoComment.style.width = percentWidth + "%";
|
|
|
|
videoComment.style.width = percentWidth + "%";
|
|
|
|
|
|
|
|
videoComment.setAttribute("id", "v" + i);
|
|
|
|
|
|
|
|
|
|
|
|
let img = document.createElement("img");
|
|
|
|
let img = document.createElement("img");
|
|
|
|
img.setAttribute("src", "./img/note.svg");
|
|
|
|
img.setAttribute("src", "./img/note.svg");
|
|
|
|