function getVideo(el) {
    return $(el).parent().prev('.video')[0];
}

function updateMuteBtn(video) {
    const muteBtn = $(video).next('.video-controls').find('.video-mute i.fa');
    muteBtn.removeClass('fa-volume-up fa-volume-down fa-volume-mute');
    if (video.muted) {
        muteBtn.addClass('fa-volume-mute');
    } else {
        if (video.volume > .5) {
            muteBtn.addClass('fa-volume-up');
        } else {
            muteBtn.addClass('fa-volume-down');
        }
    }
}

function formatTime(time) {
    const minutes = Math.floor(time / 60);
    let seconds = Math.round(time) % 60;
    if(seconds < 10)
        seconds  = "0" + seconds;
    return `${minutes}:${seconds}`
}

function addVideoListeners() {
    $('.video-controls .video-toggle-play').click(function () {
        getVideo(this).toggle();
    });

    $('.video-controls .video-mute').click(function () {
        const video = getVideo(this);
        video.toggleMuted();

        updateMuteBtn(video);
    });

    $('.video-controls .video-volume').change(function () {
        const video = getVideo(this);
        video.volume = $(this).val();

        if (video.volume > 0)
            video.muted = false;

        updateMuteBtn(video);
    });

    $('.video-seek-bar')
        .on('mousedown', function () {
            getVideo(this).pause();
        })
        .on('mouseup', function () {
            getVideo(this).play();
        })
        .on('change', function () {
            const video = getVideo(this);
            video.currentTime = video.duration * (this.value / 100);
        });

    $('.video-fullscreen').on('click', function () {
        const video = getVideo(this);

        if(video.requestFullscreen) {
            video.requestFullscreen();
        } else if(video.mozRequestFullScreen) {
            video.mozRequestFullScreen();
        } else if(video.webkitRequestFullScreen) {
            video.webkitRequestFullScreen();
        }
    });

    $('.video')
        .on('loadeddata', function () {
            const duration = formatTime(this.duration);
            $(this).next('.video-controls').find('.video-length').text(duration);
        })
        .on('play pause', function () {
            const togglePlay = $(this).next('.video-controls').find('.video-toggle-play').find('i.fa');
            if (this.paused) {
                togglePlay.removeClass('fa-pause').addClass('fa-play');
            } else {
                togglePlay.removeClass('fa-play').addClass('fa-pause');
            }
        })
        .on('timeupdate', function () {
            const value = (100 / this.duration) * this.currentTime;
            $(this).next('.video-controls').find('.video-seek-bar').val(value)
                .prev('.video-time').text(formatTime(this.currentTime));
        })
        .on('click', function () {
            if(!this.startedManually) {
                this.play();
                this.muted = false;
                updateMuteBtn(this);

                this.startedManually = true;
            } else {
                this.toggle();
            }
        });
}

Node.prototype.toggle = function () {
    if (this.paused)
        this.play();
    else
        this.pause();
};

Node.prototype.toggleMuted = function () {
    this.muted = !this.muted;
};