var elements = {
firstvideo: document.getElementById("cgvideo1"),
length: 0,
};
function colourgrey_v_player(element1) {
this.element1 = element1;
this.makeplayer3s1();
this.playbar3s1();
}
colourgrey_v_player.prototype = {
makeplayer(videoelement) {
this.element1[videoelement].innerHTML = `<div><video src="${this.element1[
videoelement
].getAttribute(
"cvsrc"
)}" class="video"></video><button class="pause">play/pause</button><div class="progressbar"></div></div>`;
},
makeplayer3s1(videoelement) {
document.getElementById("cgvideo1").innerHTML = `<div><video src="${document
.getElementById("cgvideo1")
.getAttribute(
"cvsrc"
)}" class="video"></video><button class="pause">play/pause</button><div class="progressbar"></div></div>`;
console.log("progressbar");
},
play(videoelement) {
function progressfunction() {
if (true) {
window.setTimeout(newvideo.playbar3s1, 100);
window.setTimeout(progressfunction, 80);
}
}
progressfunction();
this.element1[videoelement].getElementsByClassName("video")[0].play();
this.playbar1("firstvideo");
},
pause(videoelement) {
this.element1[videoelement].getElementsByClassName("video")[0].pause();
},
playbar1(videoelement) {
this.element1[videoelement].getElementsByClassName(
"progressbar"
)[0].style.width =
this.element1[videoelement].getElementsByClassName("video")[0]
.currentTime + "px";
},
playbar3s1() {
document
.getElementById("cgvideo1")
.getElementsByClassName("progressbar")[0].style.width =
(document.getElementById("cgvideo1").getElementsByClassName("video")[0]
.currentTime /
document.getElementById("cgvideo1").getElementsByClassName("video")[0]
.duration) *
900 +
"px";
},
playbar2(videoelement) {
this.element1[videoelement].getElementsByClassName("video")[0].currentTime =
this.element1[videoelement].getElementsByClassName("progressbar")[0].style
.width / 5;
},
changeprogressbarcolour(videoelement, colour1) {
this.element1[videoelement].getElementsByClassName(
"progressbar"
)[0].style.background = colour1;
},
};
var newvideo = new colourgrey_v_player(elements);
var iop;
for (iop = 0; iop < newvideo.element1.length; iop++) {
newvideo.element1[iop]
.getElementsByClassName("pause")[0]
.addEventListener("click", function () {
if (newvideo.element1[iop].getElementsByClassName("video")[0].played) {
newvideo.pause("firstvideo");
} else if (
newvideo.element1[iop].getElementsByClassName("video")[0].paused
) {
newvideo.play("firstvideo");
}
});
}
/* ?????????? 구글 이메일 */
newvideo.makeplayer("firstvideo");
var dsdsdff =
newvideo.element1.firstvideo.getElementsByClassName("video")[0].paused;
newvideo.element1["firstvideo"]
.getElementsByClassName("pause")[0]
.addEventListener("click", function () {
if (dsdsdff == true) {
newvideo.play("firstvideo");
dsdsdff = false;
} else {
newvideo.pause("firstvideo");
dsdsdff = true;
}
});
window.onplaying = function () {
newvideo.playbar1("firstvideo");
newvideo.playbar3s1();
};
자작 비디오 플레이어 일부분