BIM-Monitor/script/js/video-list.js

$(document).ready(function() {
    initList(".");
});

function initList(dir) {
    $.ajax({
        url: "./script/php/video/getDir.php",
        type: "POST",
        data: {
            dir: dir,
        },
        dataType: "json"
    }).done(function(result) {

        $("#video-list").empty();

        dir_names = result["dir_names"];
        file_tables = result["file_tables"];
        if (result["parent"] != undefined)
            parent = result["parent"];

        //directory
        for (i = 0; i < dir_names.length; i++) {
            $("#video-list").append('<div class="col-md-3">' +
                '<section class="panel">' +
                "<a href='#' onclick='initList(\"" + dir_names[i]["dir_name"] + "\")'>" +
                '<img class="active" src="./assets/images/folder-icon.png">' +
                '</a>' +
                '<div class="panel-body" id="">' +
                "<p><i class='fa fa-folder'></i><a href='#' onclick='initList(\"" + dir_names[i]["dir_name"] + "\")'>" + dir_names[i]["dir_name"] + "</a></p>" +
                '</div>' +
                '</section>' +
                '</div>');
        }

        //video
        for (j = 0; j < file_tables.length; j++) {
            if (file_tables[j]["file_path"].includes(".m3u8")) {
                $("#video-list").append('<div class="col-md-3">' +
                    '<section class="panel">' +
                    "<a href='#' onclick='getVideo(" + file_tables[j]["title"].split("-")[0] + ")'>" +
                    '<img class="static" src="./assets/videos/教育訓練/108年Revit上課影音檔/' + file_tables[j]["title"] + '.jpg">' +
                    '<img class="active" src="./assets/videos/教育訓練/108年Revit上課影音檔/' + file_tables[j]["title"] + '.gif">' +
                    '</a>' +
                    '<div class="panel-body" id="">' +
                    "<p><i class='fa fa-video-camera'></i><a href='#' onclick='getVideo(" + file_tables[j]["title"].split("-")[0] + ")'>" + file_tables[j]["title"] + "</a></p>" +
                    '</div>' +
                    '</section>' +
                    '</div>');
            }
        }
    }).error(function(error) {
        console.log(error);
    });
}

function getVideo(id) {
    $.redirect('./video-play.php', {
        'id': id
    });
}