| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <script src="../script/jquery.min.js"></script>
- <link rel="stylesheet" href="../script/tocas/tocas.css">
- <script type='text/javascript' src="../script/tocas/tocas.js"></script>
- <script type='text/javascript' src="../script/ao_module.js"></script>
- <title>7z File Manager</title>
- <style>
- body{
- background-color:white;
- -webkit-user-select: none; /* Safari */
- -moz-user-select: none; /* Firefox */
- -ms-user-select: none; /* IE10+/Edge */
- user-select: none; /* Standard */
- }
- tr:hover {
- background-color: #fafafa;
- }
- @media (max-width: 767px){
- .ts.bottom.right.snackbar.active{
- width: 100% !important;
- bottom: 0px !important;
- right: 0px !important;
- }
- .ts.snackbar:not(.inline) .content {
- margin-bottom: 7px;
- }
- }
- </style>
- </head>
- <body>
- <div class="ts labeled icon menu" style="box-shadow: 0px 0px 0px 0 #000000 !important;">
- <a class="item" onclick="msgbox('Error: Operation is not supported','red','white')">
- <i class="plus icon"></i> Add
- </a>
- <a class="item" onclick="functionbar_extract();">
- <i class="minus icon"></i> Extract
- </a>
- <a class="item" onclick="msgbox('Warning: Not implemented','yellow','Black')">
- <i class="chevron down icon"></i> Test
- </a>
- <a class="item" onclick="functionbar_extract();">
- <i class="copy icon"></i> Copy
- </a>
- <a class="item" onclick="functionbar_extract();">
- <i class="move icon"></i> Move
- </a>
- <a class="item" onclick="msgbox('Error: Operation is not supported','red','white')">
- <i class="remove icon"></i> Delete
- </a>
- <a class="item" onclick="functionbar_info();">
- <i class="notice icon"></i> Info
- </a>
- </div>
- <div class="ts breadcrumb" style="left: 20px;" id="breadcrumb">
- <button class="ts icon mini basic button" path="" attr="Dir" id="returnBtn" onclick="load(this)">
- <i class="level up icon"></i>
- </button>
- <p href="#!" class="section"><?php echo $_GET["file"] ?></p>
- </div>
- <table class="ts borderless table">
- <thead>
- <tr id="thead">
- </tr>
- </thead>
- <tbody id="tbody">
- </tbody>
- </table>
- <!-- use for displaying dialog , for VDI user , use VDI module instead -->
- <div class="ts modals dimmer">
- <dialog id="modal" class="ts basic modal" style="background-color: white;color: black!important" open>
- <div class="content" id="modaldata">
- </div>
- </dialog>
- </div>
- <div class="ts bottom right snackbar">
- <div class="content"></div>
- </div>
- <div class="ts contextmenu">
- <div class="item" onclick="contextmenu_extract()">
- Open
- <span class="description">Enter</span>
- </div>
- <div class="item" onclick="functionbar_extract()">
- Extract
- <span class="description">F5</span>
- </div>
- <div class="item" onclick="functionbar_info()">
- Properties
- <span class="description">Alt-Enter</span>
- </div>
- </div>
- </body>
- <script>
- //Global variable
- var random = Math.floor((Math.random() * 10000) + 1000);
- var file = "<?php echo $_GET["file"] ?>";
- ts('*').contextmenu({
- menu: '.ts.contextmenu'
- });
- $('body').on('click', function(e) {
- if (e.target !== this)
- return;
- $("tr").removeAttr("style");
- });
- document.onkeydown = function(e) {
- if($("[style='background-color: #e9e9e9;']").length > 0){
- var htmlelement = $("[style='background-color: #e9e9e9;']");
- }else{
- var htmlelement = $("#tbody tr:first");
- }
- switch (e.keyCode) {
- case 9:
- if(htmlelement.prev().length > 0){
- var next = htmlelement.prev();
- $("tr").removeAttr("style");
- $(next).attr("style","background-color: #e9e9e9;");
- }
- case 13:
- var htmlelement = $("[style='background-color: #e9e9e9;']");
- load(htmlelement);
- break;
- case 38:
- if(htmlelement.prev().length > 0){
- var next = htmlelement.prev();
- $("tr").removeAttr("style");
- $(next).attr("style","background-color: #e9e9e9;");
- }else{
- $("tr").removeAttr("style");
- $(htmlelement).attr("style","background-color: #e9e9e9;");
- }
- break;
- case 40:
- if(htmlelement.next().length > 0){
- var next = htmlelement.next();
- $("tr").removeAttr("style");
- $(next).attr("style","background-color: #e9e9e9;");
- }else{
- $("tr").removeAttr("style");
- $(htmlelement).attr("style","background-color: #e9e9e9;");
- }
- break;
- }
- };
- //for load data into table
- load($(returnBtn));
- function onsingleclick(htmlelement){
- $("tr").removeAttr("style");
- $(htmlelement).attr("style","background-color: #e9e9e9;");
- }
- function load(htmlelement){
- if($(htmlelement).attr("attr") == "Dir"){
- $("#breadcrumb").html('<button class="ts icon mini basic button" disabled><i class="level up icon"></i></button> <p class="section"><i class="loading circle notched icon"></i>Fetching..</p>');
- //for load data into table
- $.get("opr.php?method=l&rand=" + random + "&file=" + file + "&dir=" + $(htmlelement).attr("path"), function( raw ) {
- //clear table for pepare load data into table
- $("#thead").html("");
- $("#tbody").html("");
- var data = JSON.parse(raw); //parse it
- var header = data["Header"];
- //create thead
- $(data["Header"]).each(function( key, value ) {
- $("#thead").append("<th>" + value + "</th>");//create header (thead) first
- });
- //create tbody
- $(data["Information"]).each(function( a, value ) {
- //to check if attr not exists. if not exists, assume it is an file.
- if(typeof value["Attributes"] === 'undefined'){
- var attr = "File";
- }else{
- if(value["Attributes"].includes("D")){
- var attr = "Dir";
- }else{
- var attr = "File";
- }
- }
- //create HTML structure
- var tmp = "";
- tmp = tmp + '<tr path="' + value["Path"] + '" attr="' + attr + '" ondblclick="load(this)" onclick="onsingleclick(this)" oncontextmenu="onsingleclick(this)">'
- $.each(data["Header"], function( a, key ) {
- if(typeof value[key] !== 'undefined'){
- if(key == "Path"){
- //create fanastic icon to user
- if(attr == "Dir"){
- var tdicon = '<i class="folder outline icon"></i>';
- }else{
- var tdicon = '<i class="file outline icon"></i>';
- }
- var tdpath = value[key].replace(new RegExp($(htmlelement).attr("path") + "/"),"");
- if(tdpath.includes("?")){
- var tdicon = '<i class="exclamation triangle icon"></i>';
- }
- tmp = tmp + "<td>" + tdicon + tdpath + "</td>";
- }else{
- tmp = tmp + "<td>" + value[key] + "</td>";
- }
- }else{
- tmp = tmp + "<td></td>";
- }
- });
- $("#tbody").append(tmp + "</tr>");
- });
-
- //process for Prev button
- var path = $(htmlelement).attr("path").split("/");
- var previousPath = $(htmlelement).attr("path").replace(/([^\/]+)$/, '').slice(0, -1);
- if(previousPath == $(htmlelement).attr("path")){
- previousPath = "";
- }
- console.log(previousPath);
- $("#breadcrumb").html('<button class="ts icon mini basic button" currPath="' + $(htmlelement).attr("path") + '" path="' + previousPath + '" attr="Dir" id="returnBtn" onclick="load(this)"><i class="level up icon"></i></button> <p href="#!" class="section">' + file.replace(/^.*[\\\/]/, '') +'</p><div class="divider">/</div>');
- if($(htmlelement).attr("path").length > 1){
- $.each(path, function( a, key ) {
- $("#breadcrumb").append('<p href="#!" class="section"><i class="folder icon"></i>' + key + '</p><div class="divider">/</div>');
- });
- }
- });
- }else{
- //if it was file, show it.
- showDialog("ProgressUI.php?method=e&rand=" + random + "&file=" + file + "&dir=" + $(htmlelement).attr("path"),720,250);
- random = Math.floor((Math.random() * 10000) + 1000);
- }
- }
- function contextmenu_extract(){
- showDialog("ProgressUI.php?method=e&rand=" + random + "&file=" + file + "&dir=" + $("[style='background-color: #e9e9e9;']").attr("path"),720,250);
- random = Math.floor((Math.random() * 10000) + 1000);
- }
- function functionbar_extract(){
- //extract files or dir , if file then pass method=e , if dir then pass method=x
- if($("[style='background-color: #e9e9e9;']").attr("attr") == "Dir"){
- showDialog("CopyNMoveUI.php?method=x&rand=" + random + "&file=" + file + "&dir=" + $($("[style='background-color: #e9e9e9;']")).attr("path"),720,250);
- }else if($("[style='background-color: #e9e9e9;']").attr("attr") == "File"){
- showDialog("CopyNMoveUI.php?method=e&rand=" + random + "&file=" + file + "&dir=" + $("[style='background-color: #e9e9e9;']").attr("path"),720,250);
- }else{
- showDialog("CopyNMoveUI.php?method=x&rand=" + random + "&file=" + file + "&dir=" + $("#returnBtn").attr("currPath"),720,250);
- }
- //generate new number for next extraction
- random = Math.floor((Math.random() * 10000) + 1000);
- }
- function functionbar_info(){
- showDialog("infoUI.php?file=" + file,340,250);
- }
- function showDialog(href,x,y){
- if(ao_module_virtualDesktop){
- ao_module_newfw('7-Zip File Manager/' + href,'7-Zip','file outline','7-ZipProgressUI' + Math.floor(Math.random()*100),x,y);
- }else{
- $.get( href, function( data ) {
- $( "#modaldata" ).html( data );
- ts('#modal').modal("show");
- });
- }
- }
- function msgbox(content,bgcolor,fontcolor){
- $(".snackbar").attr("style",'background-color: ' + bgcolor + ';color:' + fontcolor);
- ts('.snackbar').snackbar({
- content: content,
- onAction: () => {
- $(".snackbar").removeAttr("style");
- }
- });
- }
- </script>
- </html>
|