index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, Chrome=1">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1,viewport-fit=cover">
    <title>CTList - /</title>
    <link href="//s.pstatp.com/cdn/expire-3-M/mdui/0.4.2/css/mdui.min.css" rel="stylesheet">
    <link href="//s.pstatp.com/cdn/expire-3-M/??video.js/7.3.0/video-js.min.css,baguettebox.js/1.11.0/baguetteBox.min.css" rel="stylesheet">
    <style>
    body{background-color:#f2f5fa}.nexmoe-item{margin:15px 0 !important;padding:15px !important;border-radius:5px;background-color:#fff;-webkit-box-shadow:0 .5em 3em rgba(161,177,204,.4);box-shadow:0 .5em 3em rgba(161,177,204,.4);background-color:#fff}.mdui-img-fluid,.mdui-video-fluid{border-radius:5px;border:1px solid #eee}.mdui-list{padding:0}.mdui-list-item{margin:0 !important;border-bottom:1px solid #eee;line-height:2}.mdui-list-item:last-child{margin-bottom:0 !important,}.mdui-toolbar{width:auto}.mdui-appbar .mdui-toolbar{height:56px;font-size:16px}.mdui-toolbar>*{padding:0 6px;margin:0 2px}.mdui-toolbar>.mdui-typo-headline{padding:0 16px 0 0}.mdui-toolbar>i{padding:0}.mdui-toolbar h3.title{padding:0 16px;line-height:30px;border-radius:30px;border:1px solid #eee;opacity:1;background-color:#1e89f2;color:#ffff}.mdui-toolbar>a:hover,a.mdui-typo-headline,a.active{opacity:1}.mdui-list>.th{background-color:initial}.mdui-list-item>a{width:100%;line-height:48px}.mdui-toolbar>a{padding:0 16px;line-height:30px;border-radius:30px;border:1px solid #eee}.mdui-toolbar>a:-child{opacity:1;background-color:#1e89f2;color:#ffff}@media screen and (max-width:980px){.mdui-list-item .mdui-text-right{display:none}.mdui-container{width:100% !important;margin:0}.mdui-toolbar>a:last-child,.mdui-toolbar>.mdui-typo-headline,.mdui-toolbar>i:first-child{display:block}}#main-page{cursor:pointer}.nav-a{text-decoration:none;color:#333}.nav-a:hover{text-decoration:underline}.file{width:100%;display:flex;align-items:center}.file a{color:unset;width:100%}#text-input,#close{display:none}#text-input{width:40%}#playerContainer{position:relative;background-color:#000;display:none;padding:10px}.close-icon{color:#fff}span.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.8);z-index:999}.mask{display:block;-webkit-user-select:none;-ms-user-select:none;-webkit-transition:opacity .5s ease;transition:opacity .5s ease;background-color:rgba(0,0,0,.8);position:fixed;overflow:hidden;top:0;left:0;width:100%;height:100%}.video-js{width:100% !important;height:100% !important;position:relative !important}.vjs-big-play-button{margin-top:-130px !important}.video-js .vjs-text-track-display>div>div>div{font-size:24px !important;line-height:36px !important;padding:5px !important;background:transparent !important;text-shadow:1px 1px 2px #000;display:inline-block !important}.video-js .vjs-big-play-button{font-size:2.5em;line-height:2.5em;height:2.5em;width:2.5em;-webkit-border-radius:2.5em;-moz-border-radius:2.5em;border-radius:2.5em;background-color:#73859f;background-color:rgba(115,133,159,.5);border-width:.15em;margin-top:-1.25em !important;margin-left:-1.75em}.vjs-big-play-button .vjs-icon-placeholder{font-size:1.63em}.vjs-loading-spinner{font-size:2.5em;width:2em;height:2em;border-radius:1em;margin-top:-1em;margin-left:-1.5em}.vjs-paused .vjs-big-play-button,.vjs-paused.vjs-has-started .vjs-big-play-button{display:block}.video-js.vjs-playing .vjs-tech{pointer-events:auto}.video-js .vjs-time-control{display:block}.video-js .vjs-remaining-time{display:none}.player-row{text-align:right;border-bottom:1px solid #2b333fb3}.player-title{color:#fff;float:left;line-height:36px;overflow:auto;white-space:normal;text-overflow:ellipsis;width:50vw;text-align:left}.prev-next{display:none}.prev-next>.baguetteBox-button:before{content:"";position:absolute;top:-180px;width:100px;bottom:-180px}.prev-next>#previous-button{left:0 !important;top:calc(40%)}.prev-next>#previous-button:before{left:-50px}.prev-next>#next-button{right:0 !important;top:calc(40%)}.prev-next>#next-button:before{right:-50px}@media screen and (max-width:980px){.player-row{display:none}}
    </style>
</head>
<body>
<div class="container mdui-container"><div class="mdui-container-fluid"><div class="mdui-toolbar nexmoe-item nav"><i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-blue" id="main-page" onclick="goto(rootPath)">home</i><span id="path">/</span><div class="mdui-toolbar-spacer"></div><input type="text" id="text-input" class="mdui-textfield-input" oninput="search(this)" placeholder="请输入关键字"><button type="button" id="close" class="mdui-textfield-close mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">close</i></button><button type="button" id="btn" class="mdui-textfield-icon mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">search</i></button></div></div><div class="prev-next"><button type="button" id="previous-button" aria-label="Previous" class="baguetteBox-button"><svg width="44" height="60"><polyline points="30 10 10 30 30 50" stroke="rgba(255,255,255,0.5)" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"></polyline></svg></button><button type="button" id="next-button" aria-label="Next" class="baguetteBox-button"><svg width="44" height="60"><polyline points="14 10 34 30 14 50" stroke="rgba(255,255,255,0.5)" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"></polyline></svg></button></div><div class="mdui-container-fluid"><div class="list-wrapper nexmoe-item"><div class="list-header"><div class="file mdui-list-item th"><span class="name mdui-col-xs-12 mdui-col-sm-7" onclick="view('name')">列表</span><span class="time mdui-col-sm-3 mdui-text-right" onclick="view('date')">时间</span><span class="size mdui-col-sm-2 mdui-text-right" onclick="view('size')">大小</span></div></div><div id="file-list"></div></div></div></div>
<script src="//s.pstatp.com/cdn/expire-3-M/??mdui/0.4.0/js/mdui.min.js,video.js/7.3.0/video.min.js,video.js/7.3.0/lang/zh-CN.js,baguettebox.js/1.11.0/baguetteBox.min.js"></script>
<script>
"use strict";function goto(e){window.location.href=e}function sizeNum(e){var t=e.split(" ",2),i=0;switch(t[1]){case"B":i=Math.pow(2,0)*t[0];break;case"KB":i=Math.pow(2,10)*t[0];break;case"MB":i=Math.pow(2,20)*t[0];break;case"GB":i=Math.pow(2,30)*t[0];break;case"TB":i=Math.pow(2,40)*t[0];break;default:i=Math.pow(2,50)*t[0]}return i}function compare(e){return"size"===e?function(t,i){return sizeNum(t[e].toUpperCase())-sizeNum(i[e].toUpperCase())}:function(t,i){var n=t[e].toLowerCase(),o=i[e].toLowerCase();return n.localeCompare(o)}}function clear(){var e=new Array("file-wrapper"),t=void 0;for(var i in e)for(var n=document.getElementsByClassName(e[i]),o=n.length-1;o>=0;o--)n[o].parentNode.removeChild(n[o]);var a=document.getElementById("path"),r=document.createElement("span"),s=currentPath.trim().replace(/^\//,"").replace(/\/$/,""),d=new Array(""),l="";if(a.innerHTML.length>0&&(a.innerHTML=""),""!==s)for(var c=s.split("/"),p="",u=0;u<c.length;u++)p+="/"+c[u],0===u&&"/"!==rootPath||(l='<a class="nav-a" href="//'+window.location.host+p+'">'+c[u]+"</a>",d.push(l));r.innerHTML=d.join("/"),a.appendChild(r),t=0===a.innerHTML.length?"/":r.innerHTML.replace(/<[^>]+>/g,""),document.title+=t.substr(1),pathArray=d}function search(e){var t=e.value;if(void 0!==t){t=t.toString().toLowerCase();for(var i=document.getElementsByClassName("file-wrapper"),n=0;n<i.length;n++){var o=i[n].children[0].querySelector("span.mdui-text-truncate").innerText;if(void 0!==o&&o.length>0){var a="";o.toLowerCase().indexOf(t)<0&&(a="none"),i[n].style.display=a}}}}function view(e){floderArray.sort(compare(e)),fileArray.sort(compare(e)),reverse&&(floderArray.reverse(),fileArray.reverse()),reverse=!reverse,clear();var t=document.getElementById("file-list"),i=floderArray.concat(fileArray);for(var n in i)!function(e){var n=document.createElement("div"),o="folder"==i[e]["@type"]?"folder_open":"image_aspect_ratio",a=decodeURIComponent(i[e].name),r=protocol+"//"+domain+currentPath+"/"+a,s=getFileType(a),d=r;"image_aspect_ratio"==o&&(o=getFileIcon(s)),"image"===o&&t.setAttribute("class","gallery"),n.setAttribute("class","row file-wrapper mdui-list-item mdui-ripple"),n.innerHTML='\n        <div class="file">\n            <i class="mdui-icon material-icons">'+o+'</i>\n            <a href="'+r+'">\n                <span class="name mdui-col-xs-12 mdui-col-sm-7 mdui-text-truncate">'+a+'</span>\n                <span class="time mdui-col-sm-3 mdui-text-right">'+i[e].date+'</span>\n                <span class="size mdui-col-sm-2 mdui-text-right">'+(i[e].size?i[e].size:"0 B")+"</span>\n            </a>\n        </div>",t.appendChild(n),$$(n).find("i.mdui-icon.material-icons").on("click",function(e){e.preventDefault(),"video"==s&&($$(n).after(initial()),playVideo(d,a))},!1)}(n);baguetteBox.run(".gallery")}function initial(){return $$("#playerContainer").length>0&&$$("#playerContainer").remove(),'\n    <div id="playerContainer" class="mdui-container-fluid">\n        <div class="player-row">\n            <span class="player-title"></span>\n            <button type="button" id="closevideo" onclick="playerClose()" class="mdui-textfield-close mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons close-icon">close</i></button>\n        </div>\n        <video id="video" class="video-js vjs-default-skin vjs-16-9 vjs-big-play-centered" controls oncontextmenu="return false;" webkit-playsinline="true" playsinline="true">\n            <track kind="captions" id="textTracks" srclang="zh-CN" label="字幕" default>\n        </video>\n    </div>'}function playVideo(e,t){var i=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];$$("#playerContainer").show(),$$(".player-title").html(t),t&&(videoIndex=videoArry.indexOf(t)),videoMaskShow(),$$("video").attr("src",e),videoVtt(e),player&&i&&player.dispose(),player=videojs("video",{html5:{hls:{overrideNative:!videojs.browser.IS_SAFARI}},sources:[{src:e}],controlBar:{volumePanel:{inline:!1}},fluid:!0,playbackRates:[.5,1,1.5,2]}),void 0!==player.play()&&player.play().then(function(e){}).catch(function(e){})}function playerClose(){$$("#playerContainer").remove(),window.outerWidth>980&&($$(".mdui-loaded").removeClass("mask"),$$(".list-header").show(),$$(".mdui-container-fluid:first-child").show(),$$(".file-wrapper").show(),$$(".container.mdui-container").css("margin-top",0),$$(".prev-next").hide(),$$(".mdui-loaded").css({width:"unset",position:"unset",left:"unset",top:"unset"}))}function videoMaskShow(){if(window.outerWidth>980){$$(".mdui-loaded").addClass("mask"),$$(".list-header").hide(),$$(".mdui-container-fluid:first-child").hide(),$$(".file-wrapper").hide();var e=void 0;e=window.outerHeight<820?"calc(5vh - 10px)":"calc(10vh - 30px)",$$(".mdui-loaded.mask").css({width:"82vw",position:"fixed",left:"10vw",top:e}),$$(".prev-next.baguetteBox-button#next-button, .prev-next.baguetteBox-button#previous-button").css("top","calc(45% - 30px)")}}function checkVtt(e){if(!e)return!1;var t=new XMLHttpRequest;return t.open("GET",e,!1),t.send(),4==t.readyState&&200==t.status}function videoVtt(e){if(e){var t=e.substring(e.lastIndexOf(".")+1),i=e.substring(e,e.length-t.length)+"vtt";checkVtt(i)?$$("#textTracks").attr("src",i):$$("#textTracks").remove()}}function videoIndexs(e){if(e>=0){playVideo(protocol+"//"+domain+currentPath+"/"+videoArry[e],videoArry[e],!1)}}function optShow(){videoArry.length>1&&(setTimeout(function(){$$(".prev-next").show()},200),0==videoIndex?$$("#previous-button").hide():$$("#previous-button").show(),videoIndex==videoArry.length-1?$$("#next-button").hide():$$("#next-button").show(),setTimeout(function(){$$(".prev-next").hide()},3e3))}function getFileType(e){if(!e)return!1;var t=["gif","jpeg","jpg","bmp","png"],i=["avi","wmv","mkv","mp4","mov","3gp","flv","mpg","rmvb"],n=["txt","pdf","css","js","text","doc","docx","ppt","xml"],o=["wav","acc","flac","ape","ogg","mp3"];return RegExp(".("+t.join("|")+")$","i").test(e.toLowerCase())?"image":RegExp(".("+i.join("|")+")$","i").test(e.toLowerCase())?"video":RegExp(".("+n.join("|")+")$","i").test(e.toLowerCase())?"text":!!RegExp(".("+o.join("|")+")$","i").test(e.toLowerCase())&&"music"}function getFileIcon(e){var t=void 0;switch(e){case"image":t="image";break;case"video":t="ondemand_video";break;case"music":t="music_video";break;case"text":t="text_fields";break;default:t="insert_drive_file"}return t}var domain=window.location.host,rootPath="{{.RootPath}}",currentPath="{{.CurrentPath}}",rawData="{{.RawData}}",title="CTList - ",$$=mdui.JQ,protocol="https:"==document.location.protocol?"https:":"http:";"/"===currentPath&&(currentPath="");var reverse=!1,pageData=JSON.parse(window.atob(rawData)),pathArray=[],floderArray=[],videoArry=[],fileArray=[],videoIndex=0,player="";for(var item in pageData)0!=item.indexOf("@")&&("video"==getFileType(decodeURIComponent(pageData[item].name))&&videoArry.push(decodeURIComponent(pageData[item].name)),"file"==pageData[item]["@type"]?fileArray.push(pageData[item]):"folder"==pageData[item]["@type"]&&floderArray.push(pageData[item]));$$("#btn").on("click",function(e){e.preventDefault(),$$("#text-input").show(),$$("#close").show(),$$("#btn").hide()}),$$("#close").on("click",function(e){e.preventDefault(),$$("#text-input").hide(),$$("#close").hide(),$$("#btn").show()}),$$("#next-button").on("click",function(e){e.preventDefault(),videoIndex+=1,videoIndexs(videoIndex)}),$$("#previous-button").on("click",function(e){e.preventDefault(),videoIndex-=1,videoIndexs(videoIndex)}),document.getElementById("file-list").addEventListener("mouseenter",function(e){e.preventDefault(),$$("#playerContainer").length>0&&window.outerWidth>980&&optShow()},!1),window.onload=view("name");
</script></body></html>