$(document).ready(function () {
    $('body').on('click', '.preview_img', openVideo)

    function openVideo() {
        let type = 'image'
        let path = this.getAttribute('data-path_file');
        parts = path.split('.')
        if (['avi', 'mp4', 'webm', 'mkv', 'flv', 'wmv'].includes(parts[parts.length - 1])) {
            type = 'video'
        }
        if (type == 'video') {
            $('#video_play').modal('toggle')
            var my_video_id = videojs('video_play_file');
            my_video_id.fluid(true);
            path = path.replace('avi', 'mp4');
            my_video_id.src('/video/' + path);
            $('#rotate_video').click(function(){
                rotation = $('#rotate_video').data('rotation');
                if(rotation == undefined)
                    rotation = 0
                rotation = rotation + 90;
                if(rotation == 360)
                    rotation = 0;
                console.log(rotation);
                my_video_id.zoomrotate({
                  rotate: rotation,
                });
                $('#rotate_video').data('rotation', rotation);
            });
        }
        else {
            $("#image_open").modal('toggle')
            $('#image_file').empty()
            let image_file = document.getElementById('image_file');
            let image = document.createElement('img')
            image.setAttribute('src', '/img/' + path)
            image.setAttribute('width', '100%')
            image.setAttribute('height', '100%')
            image_file.appendChild(image)
        }

    }

});