首页 发现 帮助
注册 登录
maa3444
/
BIM-Monitor
1
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

video to vue

nate 3 年之前
父节点
d030526170
当前提交
6349144b74
共有 6 个文件被更改，包括 269 次插入 和 686 次删除
合并视图 显示文件统计
  1. 41 61
      bim-support-header.html
  2. 27 0
      script/css/bim-support.css
  3. 61 0
      script/js/video-list.js
  4. 109 0
      script/js/video-play.js
  5. 12 295
      video-list.php
  6. 19 330
      video-play.php

+ 41 - 61
bim-support-header.html
查看文件 

@@ -1,71 +1,51 @@
 
 <!DOCTYPE html>
 
 <!DOCTYPE html>
 
 <html>
 
 <html>
 
+
 
 <head>
 
 <head>
 
-  <meta charset="UTF-8">
 
-  <title>BIM支援網</title>
 
-  <meta content="HTML5 Admin Template"
 
-        name="keywords">
 
-  <meta content="JSOFT Admin - Responsive HTML5 Template"
 
-        name="description">
 
-  <meta content="JSOFT.net"
 
-        name="author">
 
-  <meta content="text/html; charset=utf-8"
 
-        http-equiv="Content-Type"><!-- Mobile Metas -->
 
-  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
 
-        name="viewport"><!-- Unity CSS -->
 
-  <link href="C3Dev/TemplateData/style.css"
 
-        rel="stylesheet"><!-- Web Fonts  -->
 
-  <link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light"
 
-        rel="stylesheet"
 
-        type="text/css"><!-- Vendor CSS -->
 
-  <link href="assets/vendor/bootstrap/css/bootstrap.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/font-awesome/css/font-awesome.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/magnific-popup/magnific-popup.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/bootstrap-datepicker/css/datepicker3.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/pnotify/pnotify.custom.css"
 
-        rel="stylesheet"><!-- Specific Page Vendor CSS -->
 
-  <link href="assets/vendor/jquery-ui/css/ui-lightness/jquery-ui-1.10.4.custom.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/bootstrap-multiselect/bootstrap-multiselect.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/morris/morris.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.css"
 
-        rel="stylesheet">
 
-  <link href="assets/vendor/isotope/jquery.isotope.css"
 
-        rel="stylesheet"><!-- Theme CSS -->
 
-  <link href="assets/stylesheets/theme.css"
 
-        rel="stylesheet"><!-- Skin CSS -->
 
-  <link href="assets/stylesheets/skins/default.css"
 
-        rel="stylesheet"><!-- Theme Custom CSS -->
 
-  <link href="assets/stylesheets/theme-custom.css"
 
-        rel="stylesheet">
 
-  <link href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css"
 
-        rel="stylesheet"
 
-        type="text/css"><!-- Icon -->
 
-  <link href="assets/images/favicon.ico"
 
-        rel="shortcut icon"><!-- BIM支援網CSS -->
 
-  <link href="./script/css/bim-support.css"
 
-        rel="stylesheet"
 
-        type="text/css"><!-- Head Libs -->
 
+      <meta charset="UTF-8">
 
+      <title>BIM支援網</title>
 
+      <meta content="HTML5 Admin Template" name="keywords">
 
+      <meta content="JSOFT Admin - Responsive HTML5 Template" name="description">
 
+      <meta content="JSOFT.net" name="author">
 
+      <meta content="text/html; charset=utf-8" http-equiv="Content-Type"><!-- Mobile Metas -->
 
+      <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
 
+      <!-- Unity CSS -->
 
+      <link href="C3Dev/TemplateData/style.css" rel="stylesheet"><!-- Web Fonts  -->
 
+      <link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light"
 
+            rel="stylesheet" type="text/css"><!-- Vendor CSS -->
 
+      <link href="assets/vendor/bootstrap/css/bootstrap.css" rel="stylesheet">
 
+      <link href="assets/vendor/font-awesome/css/font-awesome.css" rel="stylesheet">
 
+      <link href="assets/vendor/magnific-popup/magnific-popup.css" rel="stylesheet">
 
+      <link href="assets/vendor/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet">
 
+      <link href="assets/vendor/pnotify/pnotify.custom.css" rel="stylesheet"><!-- Specific Page Vendor CSS -->
 
+      <link href="assets/vendor/jquery-ui/css/ui-lightness/jquery-ui-1.10.4.custom.css" rel="stylesheet">
 
+      <link href="assets/vendor/bootstrap-multiselect/bootstrap-multiselect.css" rel="stylesheet">
 
+      <link href="assets/vendor/morris/morris.css" rel="stylesheet">
 
+      <link href="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.css" rel="stylesheet">
 
+      <link href="assets/vendor/isotope/jquery.isotope.css" rel="stylesheet"><!-- Theme CSS -->
 
+      <link href="assets/stylesheets/theme.css" rel="stylesheet"><!-- Skin CSS -->
 
+      <link href="assets/stylesheets/skins/default.css" rel="stylesheet"><!-- Theme Custom CSS -->
 
+      <link href="assets/stylesheets/theme-custom.css" rel="stylesheet">
 
+      <link href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css" rel="stylesheet" type="text/css">
 
+      <!-- Icon -->
 
+      <link href="assets/images/favicon.ico" rel="shortcut icon"><!-- BIM支援網CSS -->
 
+      <link href="./script/css/bim-support.css" rel="stylesheet" type="text/css"><!-- Head Libs -->
 
 
 
-  <script src="assets/vendor/modernizr/modernizr.js"></script><!-- chart.js -->
 
+      <script src="assets/vendor/modernizr/modernizr.js"></script><!-- chart.js -->
 
 
 
-  <script src="https://cdn.jsdelivr.net/npm/chart.js@3.1.1"></script><!-- DataTable -->
 
+      <script src="https://cdn.jsdelivr.net/npm/chart.js@3.1.1"></script><!-- DataTable -->
 
 
 
-  <script src="assets/vendor/jquery/jquery.js"></script><!--<script src="assets/vendor/vue/vue.js"></script>-->
 
+      <script src="assets/vendor/jquery/jquery.js"></script>
 
+      <!--<script src="assets/vendor/vue/vue.js"></script>-->
 
 
 
-  <script src="https://unpkg.com/vue@next"></script>
 
-  <script charset="utf8"
 
-        src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"
 
-        type="text/javascript"></script>
 
-  <script src="assets/vendor/pnotify/pnotify.custom.js"></script>
 
-  <script src="script/js/getEquipmentJson.js"></script>
 
+      <script src="https://unpkg.com/vue@next"></script>
 
+      <script charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js" type="text/javascript">
 
+      </script>
 
+      <script src="assets/vendor/pnotify/pnotify.custom.js"></script>
 
+      <script src="script/js/getEquipmentJson.js"></script>
 
 </head>
 
 </head>
 
+
 
 <body>
 
 <body>
 
 </body>
 
 </body>
 
-</html>
 
+
 
+</html>

+ 27 - 0
script/css/bim-support.css
查看文件 

@@ -63,4 +63,31 @@ th {
 
 
 
     font-weight: bold;
 
     font-weight: bold;
 
     color: black;
 
     color: black;
 
+}
 
+
 
+.panel {
 
+    position: relative;
 
+}
 
+
 
+.thumbnails {
 
+    width: 100%;
 
+
 
+}
 
+
 
+.static {
 
+    width: 100%;
 
+    position: absolute;
 
+    background: white;
 
+}
 
+
 
+.static:hover {
 
+    opacity: 0;
 
+}
 
+
 
+.active {
 
+    width: 100%;
 
+}
 
+
 
+.video {
 
+    color: #0088CC;
 
 }
 
 }

+ 61 - 0
script/js/video-list.js
查看文件 

@@ -0,0 +1,61 @@
 
+$(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
 
+    });
 
+}

+ 109 - 0
script/js/video-play.js
查看文件 

@@ -0,0 +1,109 @@
 
+const fileType = {
 
+    "pptx": "fa-file-powerpoint-o",
 
+    "ppt": "fa-file-powerpoint-o",
 
+    "docx": "fa-file-word-o",
 
+    "doc": "fa-file-word-o",
 
+    "xls": "fa-file-excel-o",
 
+    "xlsx": "fa-file-excel-o",
 
+    "pdf": "fa-file-pdf-o",
 
+    "zip": "fa-file-archive-o",
 
+    "rar": "fa-file-archive-o",
 
+}
 
+
 
+$(document).ready(function () {
 
+
 
+    getVideoInfo();
 
+    getVideoFile();
 
+    $('#video').bind('contextmenu', function () {
 
+        return false;
 
+    });
 
+    setListHeight();
 
+});
 
+$(window).resize(function () {
 
+    setListHeight();
 
+});
 
+$(".sidebar-toggle").click(function () {
 
+    setTimeout(function () {
 
+        setListHeight();
 
+    }, 10);
 
+});
 
+
 
+function getVideoInfo() {
 
+    $.ajax({
 
+        url: "./script/php/video/getInfo.php",
 
+        type: "POST",
 
+        data: {
 
+            id: id,
 
+        },
 
+        dataType: "json"
 
+    }).done(function (result) {
 
+        $("#header").append(result[0].title);
 
+        getVideoList(result[0].dir_name);
 
+    }).error(function (error) {
 
+        console.log(error);
 
+    });
 
+}
 
+
 
+function getVideoList(dir) {
 
+    $.ajax({
 
+        url: "./script/php/video/getList.php",
 
+        type: "POST",
 
+        data: {
 
+            dir: dir,
 
+        },
 
+        dataType: "json"
 
+    }).done(function (result) {
 
+        let videos = result["Video_Table"];
 
+        let files = result["File_Table"];
 
+        $("#video-list").empty();
 
+        for (j = 0; j < videos.length; j++) {
 
+            if (videos[j].id == id)
 
+                $("#video-list").append("<li><a style='color:#0088CC;background-color:#21262d' href = '#' onclick='getVideo(" + videos[j].id + ")'><i class = 'fa fa-video-camera'></i><span>" + videos[j].title + '</span></a></li>');
 
+            else
 
+                $("#video-list").append("<li><a style='color:#0088CC;' href = '#' onclick='getVideo(" + videos[j].id + ")'><i class = 'fa fa-video-camera'></i><span>" + videos[j].title + '</span></a></li>');
 
+        }
 
+        for (j = 0; j < files.length; j++) {
 
+            $("#file-list").append("<li><a style='color:#0088CC;' class='video' href = '#' onclick='getFile(" + files[j].id + ")'><i class = 'fa " + fileType[files[j].type] + "'></i><span>" + files[j].title + "." + files[j].type + '</span></a></li>');
 
+        }
 
+
 
+
 
+    }).error(function (error) {
 
+        console.log(error);
 
+    });
 
+}
 
+
 
+function setListHeight() {
 
+    $("#video-list-panel").height($("#video-body").height() * 0.7);
 
+    $("#file-list-panel").height($("#video-body").height() * 0.3);
 
+}
 
+
 
+function getVideoFile() {
 
+    $.ajax({
 
+        url: "./script/php/video/access2.php",
 
+        type: "POST",
 
+        data: {
 
+            id: id,
 
+        },
 
+    }).done(function (result) {
 
+        var video = videojs("video");
 
+        video.src({
 
+            src: result,
 
+        });
 
+        video.on("canplay", function () {
 
+            video.poster(result.replace("m3u8", "jpg"));
 
+        });
 
+
 
+    }).error(function (error) {
 
+        console.log("e:" + error);
 
+    });
 
+}
 
+
 
+function getFile(id) {
 
+    window.location.href = "./script/php/video/getFile.php?id=" + id;
 
+}
 
+
 
+function getVideo(id) {
 
+    $.redirect('./video-play.php', {
 
+        'id': id
 
+    });
 
+}

+ 12 - 295
video-list.php
查看文件 

@@ -10,205 +10,24 @@ if (!isset($_SESSION['loggedin'])) {
 
 <html class="fixed">
 
 <html class="fixed">
 
 
 
 <head>
 
 <head>
 
-	<!-- Basic -->
 
-	<meta charset="UTF-8">
 
-	<title>BIM支援網</title>
 
-	<meta name="keywords" content="HTML5 Admin Template" />
 
-	<meta name="description" content="JSOFT Admin - Responsive HTML5 Template">
 
-	<meta name="author" content="JSOFT.net">
 
-	<script src="./script/php/clearData.php"></script>
 
-	<!-- Mobile Metas -->
 
-	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
 
-
 
-	<!-- Web Fonts  -->
 
-	<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light" rel="stylesheet" type="text/css">
 
-	<!-- Vendor CSS -->
 
-	<link rel="stylesheet" href="assets/vendor/bootstrap/css/bootstrap.css" />
 
-	<link rel="stylesheet" href="assets/vendor/font-awesome/css/font-awesome.css" />
 
-	<link rel="stylesheet" href="assets/vendor/magnific-popup/magnific-popup.css" />
 
-	<link rel="stylesheet" href="assets/vendor/bootstrap-datepicker/css/datepicker3.css" />
 
-	<link rel="stylesheet" href="assets/vendor/pnotify/pnotify.custom.css" />
 
-	<!-- Specific Page Vendor CSS -->
 
-	<link rel="stylesheet" href="assets/vendor/jquery-ui/css/ui-lightness/jquery-ui-1.10.4.custom.css" />
 
-	<link rel="stylesheet" href="assets/vendor/bootstrap-multiselect/bootstrap-multiselect.css" />
 
-	<link rel="stylesheet" href="assets/vendor/morris/morris.css" />
 
-	<link rel="stylesheet" href="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.css" />
 
-	<!-- Theme CSS -->
 
-	<link rel="stylesheet" href="assets/stylesheets/theme.css" />
 
-	<!-- Skin CSS -->
 
-	<link rel="stylesheet" href="assets/stylesheets/skins/default.css" />
 
-	<!-- Theme Custom CSS -->
 
-	<link rel="stylesheet" href="assets/stylesheets/theme-custom.css">
 
-	<!-- Head Libs -->
 
-	<script src="assets/vendor/modernizr/modernizr.js"></script>
 
-	<!-- chart.js -->
 
-	<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
 
-	<!-- DataTable -->
 
-	<script src="assets/vendor/jquery/jquery.js"></script>
 
-	<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css">
 
-	<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"></script>
 
+	<?php include("bim-support-header.html"); ?>
 
 	<script src="./script/js/jquery.redirect.js"></script>
 
 	<script src="./script/js/jquery.redirect.js"></script>
 
-	<!-- Icon -->
 
-	<link rel="shortcut icon" href="assets/images/favicon.ico" />
 
-	<style>
 
-		.panel {
 
-			position: relative;
 
-		}
 
-
 
-		.thumbnails {
 
-			width: 100%;
 
-
 
-		}
 
-
 
-		.static {
 
-			width: 100%;
 
-			position: absolute;
 
-			background: white;
 
-		}
 
-
 
-		.static:hover {
 
-			opacity: 0;
 
-		}
 
+	<script src="./script/js/global.js"></script>
 
+	<script>
 
+		var userName = '<?php echo $_SESSION['name']; ?>';
 
 
 
-		.active {
 
-			width: 100%;
 
-		}
 
-	</style>
 
+		pageHeader = "BIM影音庫";
 
+	</script>
 
 </head>
 
 </head>
 
 
 
 <body>
 
 <body>
 
-	<section class="body">
 
+<section class="body">
 
 		<!-- start: header -->
 
 		<!-- start: header -->
 
-		<header class="header">
 
-			<div class="logo-container">
 
-				<div class="banner-txt">BIM支援網</div>
 
-				<div class="visible-xs toggle-sidebar-left" data-toggle-class="sidebar-left-opened" data-target="html" data-fire-event="sidebar-left-opened">
 
-					<i class="fa fa-bars" aria-label="Toggle sidebar"></i>
 
-				</div>
 
-			</div>
 
-			<!-- start: search & user box -->
 
-			<div class="header-right">
 
-				<span class="separator"></span>
 
-				<ul class="notifications">
 
-					<li>
 
-						<a href="#" class="dropdown-toggle notification-icon" data-toggle="dropdown">
 
-							<i class="fa fa-bell"></i>
 
-							<span id="warning-count" class="badge">0</span>
 
-						</a>
 
-						<div class="dropdown-menu notification-menu">
 
-							<div class="notification-title">
 
-								<span id="warning-count2" class="pull-right label label-default">0</span>
 
-								警告
 
-							</div>
 
-							<div class="content">
 
-								<ul>
 
-									<li id="warning-style" style="display: none;">
 
-										<a href="warning.php" class="clearfix">
 
-											<div class="image">
 
-												<i class="fa fa-warning bg-danger"></i>
 
-											</div>
 
-											<span class="title">人員進入危險區域</span>
 
-											<span class="message">現在</span>
 
-										</a>
 
-									</li>
 
-									<div id="warning-none">No warning</div>
 
-								</ul>
 
-							</div>
 
-						</div>
 
-					</li>
 
-				</ul>
 
-				<span class="separator"></span>
 
-				<div id="userbox" class="userbox">
 
-					<a href="#" data-toggle="dropdown">
 
-						<figure class="profile-picture"> <img src="assets/images/!logged-user.jpg" alt="Joseph Doe" class="img-circle" data-lock-picture="assets/images/!logged-user.jpg" /> </figure>
 
-						<div class="profile-info" data-lock-name="John Doe" data-lock-email="johndoe@JSOFT.com"> <span class="name"><?php echo $_SESSION['name'] ?></span> <span class="role">administrator</span> </div> <i class="fa custom-caret"></i>
 
-					</a>
 
-					<div class="dropdown-menu">
 
-						<ul class="list-unstyled">
 
-							<li class="divider"></li>
 
-							<li> <a role="menuitem" tabindex="-1" href="./script/php/Logout.php"><i class="fa fa-power-off"></i> Logout</a> </li>
 
-						</ul>
 
-					</div>
 
-				</div>
 
-			</div>
 
-			<!-- end: search & user box -->
 
-		</header>
 
+		<header-menu></header-menu>
 
 		<!-- end: header -->
 
 		<!-- end: header -->
 
 		<div class="inner-wrapper">
 
 		<div class="inner-wrapper">
 
 			<!-- start: sidebar -->
 
 			<!-- start: sidebar -->
 
-			<aside id="sidebar-left" class="sidebar-left">
 
-				<div class="sidebar-header">
 
-					<div class="sidebar-title"> 導覽 </div>
 
-					<div class="sidebar-toggle hidden-xs" data-toggle-class="sidebar-left-collapsed" data-target="html" data-fire-event="sidebar-left-toggle"> <i class="fa fa-bars" aria-label="Toggle sidebar"></i> </div>
 
-				</div>
 
-				<div class="nano">
 
-					<div class="nano-content">
 
-						<nav id="menu" class="nav-main" role="navigation">
 
-							<ul class="nav nav-main">
 
-								<li class="nav-active">
 
-									<a href="home.php"> <i class="fa fa-home" aria-hidden="true"></i> <span>首頁</span> </a>
 
-								</li>
 
-								<li class="nav-parent">
 
-									<a>
 
-										<i class="fa fa-desktop" aria-hidden="true"></i>
 
-										<span>BIM監測查詢網</span>
 
-									</a>
 
-									<ul class="nav nav-children">
 
-										<li>
 
-											<a href="#modalForm" class="modal-with-form"> <i class="fa fa-upload" aria-hidden="true"></i> <span>上傳CSV</span> </a>
 
-											<!-- Modal Form -->
 
-											<div id="modalForm" class="modal-block modal-block-primary mfp-hide">
 
-												<section class="panel">
 
-													<header class="panel-heading">
 
-														<h2 class="panel-title">上傳表單</h2>
 
-													</header>
 
-													<div class="panel-body">
 
-														<form id="CSVform" class="form-horizontal mb-lg" action="./script/php/upload.php" method="post" enctype="multipart/form-data">
 
-															<div class="form-group">
 
-																<label class="col-md-3 control-label">檔案上傳</label>
 
-																<div class="col-md-6">
 
-																	<div class="fileupload fileupload-new" data-provides="fileupload">
 
-																		<div class="input-append">
 
-																			<div class="uneditable-input"> <i class="fa fa-file fileupload-exists"></i> <span class="fileupload-preview"></span> </div> <span class="btn btn-default btn-file">
 
-																				<span class="fileupload-exists">變更檔案</span> <span class="fileupload-new">選擇檔案</span>
 
-																				<input type="file" name="fileToUpload" id="fileToUpload" /> </span> <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">移除檔案</a>
 
-																		</div>
 
-																	</div>
 
-																</div>
 
-															</div>
 
-														</form>
 
-													</div>
 
-													<footer class="panel-footer">
 
-														<div class="row">
 
-															<div class="col-md-12 text-right">
 
-																<button class="btn btn-primary modal-confirm" onclick="uploadCSV()">Submit</button>
 
-																<button class="btn btn-default modal-dismiss">Cancel</button>
 
-															</div>
 
-														</div>
 
-													</footer>
 
-												</section>
 
-											</div>
 
-										</li>
 
-										<li class="nav-parent">
 
-											<a href="C3Index.php">C3工地監測儀器</a>
 
-											<ul class="nav nav-children">
 
-											</ul>
 
-										</li>
 
-									</ul>
 
-								</li>
 
-								<li class="nav-parent">
 
-									<a> <i class="fa fa-cloud" aria-hidden="true"></i> <span>BIM支援網</span> </a>
 
-									<ul class="nav nav-children">
 
-										<li class=""><a href="component-list.php"><i class="fa fa-briefcase" aria-hidden="true"></i><span>BIM元件庫</span></a></li>
 
-										<li class=""><a href="api-list.php"><i class="fa fa-gear" aria-hidden="true"></i><span>BIM程式庫</span></a></li>
 
-										<li class=""><a href="video-list.php"><i class="fa fa-video-camera" aria-hidden="true"></i><span>BIM影音庫</span></a></li>
 
-									</ul>
 
-								</li>
 
-							</ul>
 
-						</nav>
 
-					</div>
 
-				</div>
 
-			</aside>
 
+			<side-bar></side-bar>
 
 			<!-- end: sidebar -->
 
 			<!-- end: sidebar -->
 
 			<section role="main" class="content-body">
 
 			<section role="main" class="content-body">
 
 				<header class="page-header">
 
 				<header class="page-header">
 
@@ -218,116 +37,14 @@ if (!isset($_SESSION['loggedin'])) {
 
 				<div class="row" id="video-list">
 
 				<div class="row" id="video-list">
 
 				</div>
 
 				</div>
 
 			</section>
 
 			</section>
 
-
 
-
 
 		</div>
 
 		</div>
 
 	</section>
 
 	</section>
 
 	</div>
 
 	</div>
 
 	<script>
 
 	<script>
 
-		$(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
 
-			});
 
-		}
 
+		vm.mount('.body');
 
 	</script>
 
 	</script>
 
-	<!-- Vendor -->
 
-	<script src="assets/vendor/jquery-browser-mobile/jquery.browser.mobile.js"></script>
 
-	<script src="assets/vendor/bootstrap/js/bootstrap.js"></script>
 
-	<script src="assets/vendor/nanoscroller/nanoscroller.js"></script>
 
-	<script src="assets/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
 
-	<script src="assets/vendor/magnific-popup/magnific-popup.js"></script>
 
-	<script src="assets/vendor/jquery-placeholder/jquery.placeholder.js"></script>
 
-	<!-- Specific Page Vendor -->
 
-	<script src="assets/vendor/jquery-ui/js/jquery-ui-1.10.4.custom.js"></script>
 
-	<script src="assets/vendor/jquery-ui-touch-punch/jquery.ui.touch-punch.js"></script>
 
-	<script src="assets/vendor/jquery-appear/jquery.appear.js"></script>
 
-	<script src="assets/vendor/bootstrap-multiselect/bootstrap-multiselect.js"></script>
 
-	<script src="assets/vendor/jquery-easypiechart/jquery.easypiechart.js"></script>
 
-	<script src="assets/vendor/flot/jquery.flot.js"></script>
 
-	<script src="assets/vendor/flot-tooltip/jquery.flot.tooltip.js"></script>
 
-	<script src="assets/vendor/flot/jquery.flot.pie.js"></script>
 
-	<script src="assets/vendor/flot/jquery.flot.categories.js"></script>
 
-	<script src="assets/vendor/flot/jquery.flot.resize.js"></script>
 
-	<script src="assets/vendor/jquery-sparkline/jquery.sparkline.js"></script>
 
-	<script src="assets/vendor/raphael/raphael.js"></script>
 
-	<script src="assets/vendor/morris/morris.js"></script>
 
-	<script src="assets/vendor/gauge/gauge.js"></script>
 
-	<script src="assets/vendor/snap-svg/snap.svg.js"></script>
 
-	<script src="assets/vendor/liquid-meter/liquid.meter.js"></script>
 
-	<script src="assets/vendor/jqvmap/jquery.vmap.js"></script>
 
-	<script src="assets/vendor/jqvmap/data/jquery.vmap.sampledata.js"></script>
 
-	<script src="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.js"></script>
 
-	<script src="assets/vendor/jquery-autosize/jquery.autosize.js"></script>
 
-	<script src="assets/vendor/pnotify/pnotify.custom.js"></script>
 
-	<!-- Theme Base, Components and Settings -->
 
-	<script src="assets/javascripts/theme.js"></script>
 
-	<!-- Theme Custom -->
 
-	<script src="assets/javascripts/theme.custom.js"></script>
 
-	<!-- Theme Initialization Files -->
 
-	<script src="assets/javascripts/theme.init.js"></script>
 
-	<!-- Examples -->
 
-	<script src="assets/javascripts/ui-elements/examples.modals.js"></script>
 
-	<script src="script/js/notifications.js"></script>
 
-	<!-- Main-->
 
-	<script src="script/js/main.js"></script>
 
-
 
-
 
+	<script src="./script/js/video-list.js"></script>
 
+	<?php include("bim-support-body.html"); ?>
 
 	</section>
 
 	</section>
 
 </body>
 
 </body>

+ 19 - 330
video-play.php
查看文件 

@@ -11,188 +11,27 @@ if (isset($_POST["id"])) {
 
 <html class="fixed">
 
 <html class="fixed">
 
 
 
 <head>
 
 <head>
 
-    <!-- Basic -->
 
-    <meta charset="UTF-8">
 
-    <title>BIM支援網</title>
 
-    <meta name="keywords" content="HTML5 Admin Template" />
 
-    <meta name="description" content="JSOFT Admin - Responsive HTML5 Template">
 
-    <meta name="author" content="JSOFT.net">
 
-    <script src="./script/php/clearData.php"></script>
 
-    <!-- Mobile Metas -->
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
 
-
 
-    <!-- Web Fonts  -->
 
-    <link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light" rel="stylesheet" type="text/css">
 
+    <?php include("bim-support-header.html"); ?>
 
     <link href="https://vjs.zencdn.net/7.17.0/video-js.css" rel="stylesheet">
 
     <link href="https://vjs.zencdn.net/7.17.0/video-js.css" rel="stylesheet">
 
-    <!-- Vendor CSS -->
 
-    <link rel="stylesheet" href="assets/vendor/bootstrap/css/bootstrap.css" />
 
-    <link rel="stylesheet" href="assets/vendor/font-awesome/css/font-awesome.css" />
 
-    <link rel="stylesheet" href="assets/vendor/magnific-popup/magnific-popup.css" />
 
-    <link rel="stylesheet" href="assets/vendor/bootstrap-datepicker/css/datepicker3.css" />
 
-    <link rel="stylesheet" href="assets/vendor/pnotify/pnotify.custom.css" />
 
-    <!-- Specific Page Vendor CSS -->
 
-    <link rel="stylesheet" href="assets/vendor/jquery-ui/css/ui-lightness/jquery-ui-1.10.4.custom.css" />
 
-    <link rel="stylesheet" href="assets/vendor/bootstrap-multiselect/bootstrap-multiselect.css" />
 
-    <link rel="stylesheet" href="assets/vendor/morris/morris.css" />
 
-    <link rel="stylesheet" href="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.css" />
 
-    <!-- Theme CSS -->
 
-    <link rel="stylesheet" href="assets/stylesheets/theme.css" />
 
-    <!-- Skin CSS -->
 
-    <link rel="stylesheet" href="assets/stylesheets/skins/default.css" />
 
-    <!-- Theme Custom CSS -->
 
-    <link rel="stylesheet" href="assets/stylesheets/theme-custom.css">
 
-    <!-- Head Libs -->
 
-    <script src="assets/vendor/modernizr/modernizr.js"></script>
 
-    <!-- chart.js -->
 
-    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
 
-    <!-- DataTable -->
 
-    <script src="assets/vendor/jquery/jquery.js"></script>
 
-    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css">
 
-    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"></script>
 
+    <script src="./script/js/global.js"></script>  
     <script src="./script/js/jquery.redirect.js"></script>
 
     <script src="./script/js/jquery.redirect.js"></script>
 
-    <!-- Icon -->
 
-    <link rel="shortcut icon" href="assets/images/favicon.ico" />
 
-    <style>
 
-        .video {
 
-            color: #0088CC;
 
-        }
 
-    </style>
 
+
 
+    <script>
 
+        var userName = '<?php echo $_SESSION['name']; ?>';
 
+
 
+        pageHeader = "BIM影音庫";
 
+    </script>
 
 </head>
 
 </head>
 
 
 
 <body>
 
 <body>
 
-    <section class="body">
 
-        <!-- start: header -->
 
-        <header class="header">
 
-            <div class="logo-container">
 
-                <div class="banner-txt">BIM支援網</div>
 
-                <div class="visible-xs toggle-sidebar-left" data-toggle-class="sidebar-left-opened" data-target="html" data-fire-event="sidebar-left-opened">
 
-                    <i class="fa fa-bars" aria-label="Toggle sidebar"></i>
 
-                </div>
 
-            </div>
 
-            <!-- start: search & user box -->
 
-            <div class="header-right">
 
-                <span class="separator"></span>
 
-                <ul class="notifications">
 
-                    <li>
 
-                        <a href="#" class="dropdown-toggle notification-icon" data-toggle="dropdown">
 
-                            <i class="fa fa-bell"></i>
 
-                            <span id="warning-count" class="badge">0</span>
 
-                        </a>
 
-                        <div class="dropdown-menu notification-menu">
 
-                            <div class="notification-title">
 
-                                <span id="warning-count2" class="pull-right label label-default">0</span>
 
-                                警告
 
-                            </div>
 
-                            <div class="content">
 
-                                <ul>
 
-                                    <li id="warning-style" style="display: none;">
 
-                                        <a href="warning.php" class="clearfix">
 
-                                            <div class="image">
 
-                                                <i class="fa fa-warning bg-danger"></i>
 
-                                            </div>
 
-                                            <span class="title">人員進入危險區域</span>
 
-                                            <span class="message">現在</span>
 
-                                        </a>
 
-                                    </li>
 
-                                    <div id="warning-none">No warning</div>
 
-                                </ul>
 
-                            </div>
 
-                        </div>
 
-                    </li>
 
-                </ul>
 
-                <span class="separator"></span>
 
-                <div id="userbox" class="userbox">
 
-                    <a href="#" data-toggle="dropdown">
 
-                        <figure class="profile-picture"> <img src="assets/images/!logged-user.jpg" alt="Joseph Doe" class="img-circle" data-lock-picture="assets/images/!logged-user.jpg" /> </figure>
 
-                        <div class="profile-info" data-lock-name="John Doe" data-lock-email="johndoe@JSOFT.com"> <span class="name"><?php echo $_SESSION['name'] ?></span> <span class="role">administrator</span> </div> <i class="fa custom-caret"></i>
 
-                    </a>
 
-                    <div class="dropdown-menu">
 
-                        <ul class="list-unstyled">
 
-                            <li class="divider"></li>
 
-                            <li> <a role="menuitem" tabindex="-1" href="./script/php/Logout.php"><i class="fa fa-power-off"></i> Logout</a> </li>
 
-                        </ul>
 
-                    </div>
 
-                </div>
 
-            </div>
 
-            <!-- end: search & user box -->
 
-        </header>
 
-        <!-- end: header -->
 
-        <div class="inner-wrapper">
 
-            <!-- start: sidebar -->
 
-            <aside id="sidebar-left" class="sidebar-left">
 
-                <div class="sidebar-header">
 
-                    <div class="sidebar-title"> 導覽 </div>
 
-                    <div class="sidebar-toggle hidden-xs" data-toggle-class="sidebar-left-collapsed" data-target="html" data-fire-event="sidebar-left-toggle"> <i class="fa fa-bars" aria-label="Toggle sidebar"></i> </div>
 
-                </div>
 
-                <div class="nano">
 
-                    <div class="nano-content">
 
-                        <nav id="menu" class="nav-main" role="navigation">
 
-                            <ul class="nav nav-main">
 
-                                <li class="nav-active">
 
-                                    <a href="home.php"> <i class="fa fa-home" aria-hidden="true"></i> <span>首頁</span> </a>
 
-                                </li>
 
-                                <li class="nav-parent">
 
-                                    <a>
 
-                                        <i class="fa fa-desktop" aria-hidden="true"></i>
 
-                                        <span>BIM監測查詢網</span>
 
-                                    </a>
 
-                                    <ul class="nav nav-children">
 
-                                        <li>
 
-                                            <a href="#modalForm" class="modal-with-form"> <i class="fa fa-upload" aria-hidden="true"></i> <span>上傳CSV</span> </a>
 
-                                            <!-- Modal Form -->
 
-                                            <div id="modalForm" class="modal-block modal-block-primary mfp-hide">
 
-                                                <section class="panel">
 
-                                                    <header class="panel-heading">
 
-                                                        <h2 class="panel-title">上傳表單</h2>
 
-                                                    </header>
 
-                                                    <div class="panel-body">
 
-                                                        <form id="CSVform" class="form-horizontal mb-lg" action="./script/php/upload.php" method="post" enctype="multipart/form-data">
 
-                                                            <div class="form-group">
 
-                                                                <label class="col-md-3 control-label">檔案上傳</label>
 
-                                                                <div class="col-md-6">
 
-                                                                    <div class="fileupload fileupload-new" data-provides="fileupload">
 
-                                                                        <div class="input-append">
 
-                                                                            <div class="uneditable-input"> <i class="fa fa-file fileupload-exists"></i> <span class="fileupload-preview"></span> </div> <span class="btn btn-default btn-file">
 
-                                                                                <span class="fileupload-exists">變更檔案</span> <span class="fileupload-new">選擇檔案</span>
 
-                                                                                <input type="file" name="fileToUpload" id="fileToUpload" /> </span> <a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">移除檔案</a>
 
-                                                                        </div>
 
-                                                                    </div>
 
-                                                                </div>
 
-                                                            </div>
 
-                                                        </form>
 
-                                                    </div>
 
-                                                    <footer class="panel-footer">
 
-                                                        <div class="row">
 
-                                                            <div class="col-md-12 text-right">
 
-                                                                <button class="btn btn-primary modal-confirm" onclick="uploadCSV()">Submit</button>
 
-                                                                <button class="btn btn-default modal-dismiss">Cancel</button>
 
-                                                            </div>
 
-                                                        </div>
 
-                                                    </footer>
 
-                                                </section>
 
-                                            </div>
 
-                                        </li>
 
-                                        <li class="nav-parent">
 
-                                            <a href="C3Index.php">C3工地監測儀器</a>
 
-                                            <ul class="nav nav-children">
 
-                                            </ul>
 
-                                        </li>
 
-                                    </ul>
 
-                                </li>
 
-                                <li class="nav-parent">
 
-                                    <a> <i class="fa fa-cloud" aria-hidden="true"></i> <span>BIM支援網</span> </a>
 
-                                    <ul class="nav nav-children">
 
-                                        <li class=""><a href="component-list.php"><i class="fa fa-briefcase" aria-hidden="true"></i><span>BIM元件庫</span></a></li>
 
-                                        <li class=""><a href="api-list.php"><i class="fa fa-gear" aria-hidden="true"></i><span>BIM程式庫</span></a></li>
 
-                                        <li class=""><a href="video-list.php"><i class="fa fa-video-camera" aria-hidden="true"></i><span>BIM影音庫</span></a></li>
 
-                                    </ul>
 
-                                </li>
 
-                            </ul>
 
-                        </nav>
 
-                    </div>
 
-                </div>
 
-            </aside>
 
-            <!-- end: sidebar -->
 
+<section class="body">
 
+		<!-- start: header -->
 
+		<header-menu></header-menu>
 
+		<!-- end: header -->
 
+		<div class="inner-wrapper">
 
+			<!-- start: sidebar -->
 
+			<side-bar></side-bar>
 
+			<!-- end: sidebar -->
 
             <section role="main" class="content-body">
 
             <section role="main" class="content-body">
 
                 <header class="page-header">
 
                 <header class="page-header">
 
                     <h2 id="header">BIM影音網 - </h2>
 
                     <h2 id="header">BIM影音網 - </h2>
 
@@ -223,167 +62,17 @@ if (isset($_POST["id"])) {
 
                         </section>
 
                         </section>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
-
 
-
 
-
 
-
 
         </div>
 
         </div>
 
     </section>
 
     </section>
 
     </div>
 
     </div>
 
     <script src="https://vjs.zencdn.net/7.17.0/video.min.js"></script>
 
     <script src="https://vjs.zencdn.net/7.17.0/video.min.js"></script>
 
     <script>
 
     <script>
 
-        const fileType = {
 
-            "pptx": "fa-file-powerpoint-o",
 
-            "ppt": "fa-file-powerpoint-o",
 
-            "docx": "fa-file-word-o",
 
-            "doc": "fa-file-word-o",
 
-            "xls": "fa-file-excel-o",
 
-            "xlsx": "fa-file-excel-o",
 
-            "pdf": "fa-file-pdf-o",
 
-            "zip": "fa-file-archive-o",
 
-            "rar": "fa-file-archive-o",
 
-        }
 
+        vm.mount('.body');
 
 
 
         var id = '<?php echo ($id); ?>';
 
         var id = '<?php echo ($id); ?>';
 
-        $(document).ready(function() {
 
-
 
-            getVideoInfo();
 
-            getVideoFile();
 
-            $('#video').bind('contextmenu', function() {
 
-                return false;
 
-            });
 
-            setListHeight();
 
-        });
 
-        $(window).resize(function() {
 
-            setListHeight();
 
-        });
 
-        $(".sidebar-toggle").click(function() {
 
-            setTimeout(function() {
 
-                setListHeight();
 
-            }, 10);
 
-        });
 
-
 
-        function getVideoInfo() {
 
-            $.ajax({
 
-                url: "./script/php/video/getInfo.php",
 
-                type: "POST",
 
-                data: {
 
-                    id: id,
 
-                },
 
-                dataType: "json"
 
-            }).done(function(result) {
 
-                $("#header").append(result[0].title);
 
-                getVideoList(result[0].dir_name);
 
-            }).error(function(error) {
 
-                console.log(error);
 
-            });
 
-        }
 
-
 
-        function getVideoList(dir) {
 
-            $.ajax({
 
-                url: "./script/php/video/getList.php",
 
-                type: "POST",
 
-                data: {
 
-                    dir: dir,
 
-                },
 
-                dataType: "json"
 
-            }).done(function(result) {
 
-                let videos = result["Video_Table"];
 
-                let files = result["File_Table"];
 
-                $("#video-list").empty();
 
-                for (j = 0; j < videos.length; j++) {
 
-                    if (videos[j].id == id)
 
-                        $("#video-list").append("<li><a style='color:#0088CC;background-color:#21262d' href = '#' onclick='getVideo(" + videos[j].id + ")'><i class = 'fa fa-video-camera'></i><span>" + videos[j].title + '</span></a></li>');
 
-                    else
 
-                        $("#video-list").append("<li><a style='color:#0088CC;' href = '#' onclick='getVideo(" + videos[j].id + ")'><i class = 'fa fa-video-camera'></i><span>" + videos[j].title + '</span></a></li>');
 
-                }
 
-                for (j = 0; j < files.length; j++) {
 
-                    $("#file-list").append("<li><a style='color:#0088CC;' class='video' href = '#' onclick='getFile(" + files[j].id + ")'><i class = 'fa " + fileType[files[j].type] + "'></i><span>" + files[j].title + "." + files[j].type + '</span></a></li>');
 
-                }
 
-
 
-
 
-            }).error(function(error) {
 
-                console.log(error);
 
-            });
 
-        }
 
-
 
-        function setListHeight() {
 
-            $("#video-list-panel").height($("#video-body").height() * 0.7);
 
-            $("#file-list-panel").height($("#video-body").height() * 0.3);
 
-        }
 
-
 
-        function getVideoFile() {
 
-            $.ajax({
 
-                url: "./script/php/video/access2.php",
 
-                type: "POST",
 
-                data: {
 
-                    id: id,
 
-                },
 
-            }).done(function(result) {
 
-                var video = videojs("video");
 
-                video.src({
 
-                    src: result,
 
-                });
 
-                video.on("canplay", function() {
 
-                    video.poster(result.replace("m3u8", "jpg"));
 
-                });
 
-
 
-            }).error(function(error) {
 
-                console.log("e:" + error);
 
-            });
 
-        }
 
-
 
-        function getFile(id) {
 
-            window.location.href = "./script/php/video/getFile.php?id=" + id;
 
-        }
 
-
 
-        function getVideo(id) {
 
-            $.redirect('./video-play.php', {
 
-                'id': id
 
-            });
 
-        }
 
     </script>
 
     </script>
 
-    <!-- Vendor -->
 
-    <script src="assets/vendor/jquery-browser-mobile/jquery.browser.mobile.js"></script>
 
-    <script src="assets/vendor/bootstrap/js/bootstrap.js"></script>
 
-    <script src="assets/vendor/nanoscroller/nanoscroller.js"></script>
 
-    <script src="assets/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
 
-    <script src="assets/vendor/magnific-popup/magnific-popup.js"></script>
 
-    <script src="assets/vendor/jquery-placeholder/jquery.placeholder.js"></script>
 
-    <!-- Specific Page Vendor -->
 
-    <script src="assets/vendor/jquery-ui/js/jquery-ui-1.10.4.custom.js"></script>
 
-    <script src="assets/vendor/jquery-ui-touch-punch/jquery.ui.touch-punch.js"></script>
 
-    <script src="assets/vendor/jquery-appear/jquery.appear.js"></script>
 
-    <script src="assets/vendor/bootstrap-multiselect/bootstrap-multiselect.js"></script>
 
-    <script src="assets/vendor/jquery-easypiechart/jquery.easypiechart.js"></script>
 
-    <script src="assets/vendor/flot/jquery.flot.js"></script>
 
-    <script src="assets/vendor/flot-tooltip/jquery.flot.tooltip.js"></script>
 
-    <script src="assets/vendor/flot/jquery.flot.pie.js"></script>
 
-    <script src="assets/vendor/flot/jquery.flot.categories.js"></script>
 
-    <script src="assets/vendor/flot/jquery.flot.resize.js"></script>
 
-    <script src="assets/vendor/jquery-sparkline/jquery.sparkline.js"></script>
 
-    <script src="assets/vendor/raphael/raphael.js"></script>
 
-    <script src="assets/vendor/morris/morris.js"></script>
 
-    <script src="assets/vendor/gauge/gauge.js"></script>
 
-    <script src="assets/vendor/snap-svg/snap.svg.js"></script>
 
-    <script src="assets/vendor/liquid-meter/liquid.meter.js"></script>
 
-    <script src="assets/vendor/jqvmap/jquery.vmap.js"></script>
 
-    <script src="assets/vendor/jqvmap/data/jquery.vmap.sampledata.js"></script>
 
-    <script src="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.js"></script>
 
-    <script src="assets/vendor/jquery-autosize/jquery.autosize.js"></script>
 
-    <script src="assets/vendor/pnotify/pnotify.custom.js"></script>
 
-    <!-- Theme Base, Components and Settings -->
 
-    <script src="assets/javascripts/theme.js"></script>
 
-    <!-- Theme Custom -->
 
-    <script src="assets/javascripts/theme.custom.js"></script>
 
-    <!-- Theme Initialization Files -->
 
-    <script src="assets/javascripts/theme.init.js"></script>
 
-    <!-- Examples -->
 
-    <script src="assets/javascripts/ui-elements/examples.modals.js"></script>
 
-    <script src="script/js/notifications.js"></script>
 
-    <!-- Main-->
 
-    <script src="script/js/main.js"></script>
 
-
 
+    <script src="./script/js/video-play.js"></script>
 
+    <?php include("bim-support-body.html"); ?>
 
     </section>
 
     </section>
 
 </body>
 
 </body>