TC
/
arozos


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648
							<html>
    <head>
        <title>File Operation</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
        <link rel="stylesheet" href="../../script/semantic/semantic.min.css">
        <script type="text/javascript" src="../../script/jquery.min.js"></script>
        <script type="text/javascript" src="../../script/semantic/semantic.min.js"></script>
        <script type="text/javascript" src="../../script/ao_module.js"></script>
        <style>
            .banner{
                background-color:#4287f5;
                height:50px;
                padding:12px;
                padding-left:20px;
                padding-top:16px;
            }

            #opricon{
                position:absolute;
                top:0px;
                right:0px;
                width:80px;
                height:80px;
            }
            .title{
                color:white;
                font-size:130%;
            }
            .content{
                padding:12px;
            }
            .info{
                margin-top:3px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        </style>
    </head>
    <body>
        <div class="banner">
            <div class="title">Calculating Operation</div>
            <img id="opricon" src="img/loading.png" class="ui image"></img>
        </div>
        <div class="content">
            <div class="info">From: <span id="src"></span></div>
            <div class="info">To: <span id="dest"></span></div>
            <div class="info">Progress: <span id="progress"> <i class="loading spinner icon"></i> Calculating</span></div>
            <div class="ui active small progress" style="margin-top:18px;">
                <div id="progressbar" class="bar" style="width:100%; background-color:#4287f5;"></div>
            </div>
        </div>
        <div class="ui modal" id="duplicateAction">
            <div class="content">
                <div class="description" style="padding: 0px !important;">
                    <p><i class="big exclamation triangle icon"></i> At least one file has the same filename with another existsing file. <b>Which action should be taken?</b></p><br>
                </div>
            </div>
            <div class="actions">
                <div class="ui labeled button" onclick="continueProcess('overwrite');">
                    Overwrite
                </div>
                <div class="ui labeled button" onclick="continueProcess('skip');">
                    Skip
                </div>
                <div class="ui labeled button" style="color: #2fb55c;" onclick="continueProcess('keep');">
                    Rename & Keep
                </div>
              
            </div>
        </div>
        <script>
            /*
                ArOZ Online File Operation Listener
                Usage: Pass in the following JSON object as hash with encodeURIComponent after JSON stringify
                {
                    opr: {move / copy / zip / unzip / download / zipAndDown / unzipAndOpen},
                    src: {filelist, allow multiple files},
                    dest: {filepath},
                    
                    //Optional paramters
                    overwriteMode: {skip / overwrite / keep},
                    callbackWindowID: {floatWindow ID},
                    callbackFunction: {target Window Function Name as String}
                }

                **For download opr, it will first buffer into the browser memory.
                It is not recommended for files > 2GB (Firefox Limit)

                Example callbackFunction: "refreshList()" (string)

            */
            var operationConfig = null;
            var opr = "";
            var maxPathDisplayLength = 40;
            var legacyMode = !('WebSocket' in window || 'MozWebSocket' in window); //Use AJAX instead of WebSocket if legacy mode is activated
            var enterErrorMode = false;

            //Initalized floatWindow events
            ao_module_setFixedWindowSize();
            ao_module_setWindowSize(400,220);

            init();
            function init(){
                console.log("Checking launch parameters...");
                if (window.location.hash.length > 0){
                    //OK to proceed
                    try{
                        operationConfig = JSON.parse(decodeURIComponent(window.location.hash.substring(1)));
                        
                        //Check if there are any missing paratmers
                        configValid = true;
                        if (typeof operationConfig.opr == "undefined"){ configValid = false; }
                        if (typeof operationConfig.src == "undefined"){ configValid = false; }
                        if (typeof operationConfig.dest == "undefined"){ configValid = false; }
                        
                        if (!configValid){
                            console.log("Invalid file operation config. Please see the file_operation.html source code for the correct config json object.")
                            ao_module_close();
                            return;
                        }

                        //Parse the missing argument if there are any
                        if (typeof operationConfig.overwriteMode == "undefined"){
                            operationConfig.overwriteMode = "skip";
                        }

                        //Update 17-12-2020, ask the user for overwrite mode if file duplicate exists
                        if (operationConfig.overwriteMode == "ask"){
                            //Check if any file duplication before proceeding
                            console.log(operationConfig.src);

                            $.ajax({
                                url: "../../system/file_system/listDir",
                                data: {dir: operationConfig.dest},
                                success: function(filelist){
                                    //Check fod duplication
                                    var duplicateFound = false;
mainloop:
                                    for (var i = 0; i < filelist.length; i++){
                                        var desktopFile = filelist[i];
                                        for (var j = 0; j < operationConfig.src.length; j++){
                                            var srcfile = operationConfig.src[j];
                                            var srcFilename = srcfile.split("/").pop();
                                            if (srcFilename == desktopFile.Filename){
                                                duplicateFound = true
                                                break mainloop;
                                            }
                                        }
                                    }; 

                                    if (duplicateFound){
                                        //Duplication found. 
                                        $("#duplicateAction").modal({
                                            closable: false
                                        }).modal("show");

                                    }else{
                                        //Duplication not found. Start the operation with default mode
                                        operationConfig.overwriteMode = "skip";
                                        processOperations(operationConfig);
                                    }


                                }
                            })
                        }else{
                            //All information are defined. Process it now.
                            processOperations(operationConfig)
                        }
                       
                    }catch(ex){
                        //Failed
                        console.log("Argument parse error", ex);
                    }

                }else{
                    alert("Invalid use of File Operation Listener.")
                    ao_module_close();
                }
            }

            function continueProcess(duplicateMode){
                operationConfig.overwriteMode = duplicateMode;
                $("#duplicateAction").modal("hide");
                processOperations(operationConfig)
            }

            function processOperations(operationConfig){
                //Update the display information
                $("#src").text(operationConfig.src);
                $("#dest").text(operationConfig.dest);
                opr = operationConfig.opr;
                updateTitle(operationConfig.src.length, operationConfig.opr);

                //Check which type of the oprs is about. And assign the related functions to start
                if (operationConfig.opr == "move"){
                    $("#opricon").attr("src","img/move.gif");
                    cut(operationConfig.src, operationConfig.dest, operationConfig.overwriteMode);
                
                }else if (operationConfig.opr == "copy"){
                    $("#opricon").attr("src","img/copy.gif");
                    copy(operationConfig.src, operationConfig.dest, operationConfig.overwriteMode);
                
                }else if (operationConfig.opr == "zip"){
                    $("#opricon").attr("src","img/zip.gif");
                    zip(operationConfig.src, operationConfig.dest, operationConfig.overwriteMode);
                
                }else if (operationConfig.opr == "unzip"){
                    $("#opricon").attr("src","img/unzip.gif");
                    unzip(operationConfig.src, operationConfig.dest, operationConfig.overwriteMode);
                }else if (operationConfig.opr == "unzipAndOpen"){
                    $("#opricon").attr("src","img/unzip.gif");
                    unzip(operationConfig.src, operationConfig.dest, operationConfig.overwriteMode, function(){
                        //Open the target directory

                    });
                }
            }

            //Unzip zip
            function unzip(srcList, dest, overwriteMode, callback=undefined){
                if (legacyMode){
                    //Run in legacy mode
                    $.ajax({
                        type: 'POST',
                        url: `../../system/file_system/fileOpr`,
                        data: {opr: "unzip" ,src: JSON.stringify(srcList), dest: dest},
                        success: function(data){
                            handleFinish(data);
                        }
                    });
                }else{
                    //Filter all + sign in the list
                    var filteredSrcList = [];
                    srcList.forEach(src => {
                        filteredSrcList.push(src.split("+").join("{{plug_sign}}"));
                    });

                    //Open WebSocket
                    var endpoint = getWSEndpoint() + `?opr=unzip&src=${encodeURIComponent(JSON.stringify(filteredSrcList))}&dest=${encodeURIComponent(dest)}&existsresp=${overwriteMode}`
                    console.log(endpoint);
                    var ws = new WebSocket(endpoint);

                    ws.onopen = function(){
                        //Do nothing. Just listen to the progress update
                    };

                    ws.onmessage = function (evt) { 
                        var data = evt.data;
                        var progress = JSON.parse(data);
                        console.log(progress);
                        if (progress.Error != ""){
                            //Something went wrong
                            $("#progressbar").css("background-color", "#eb3f28");
                            $("#opricon").attr("src", "img/error.png");
                            enterErrorMode = true;
                            alert(progress.Error);
                        }else{
                            //Update the progress display
                            $("#progressbar").css("width", progress.Progress + "%");
                            var currentSrc = truncate(progress.LatestFile, maxPathDisplayLength);
                            var filteredDest = operationConfig.dest.trim();
                            if (filteredDest.substr(filteredDest.length -1, 1) != "/"){
                                filteredDest += "/"
                            }
                            var currentDest = truncate(filteredDest + progress.LatestFile, maxPathDisplayLength);

                            $("#src").text(currentSrc);
                            $("#dest").text(currentDest);
                            $("#progress").text(progress.Progress + "%")

                            if (progress.Progress == 100){
                                //Set progress bar to green
                                $("#progressbar").css("background-color", "#2bba35");
                            }
                        }
                    };

                    ws.onclose = function() { 
                        if (!enterErrorMode){
                            $("#progressbar").css("background-color", "#2bba35");
                            $("#progressbar").css("width", "100%");
                            $("#progress").text("100%");
                            $("#opricon").attr("src", "img/done.png")
                            setTimeout(function(){
                                if (operationConfig.opr == "unzipAndOpen"){
                                    //If open after unzip is required
                                    ao_module_openPath(operationConfig.dest);
                                }
                                ao_module_close();
                            }, 1000);
                        }
                    };  

                    ws.onerror = function(event){
                        console.error("WebSocket error observed:", event);
                        legacyMode = true;
                        console.log("Falling back to Legacy Mode");
                        unzip(srcList, dest, overwriteMode, callback);
                    }
                }
            }

            //Create zip
            function zip(srcList, dest, overwriteMode){
                if (legacyMode){
                    //Run in legacy mode
                    $.ajax({
                        type: 'POST',
                        url: `../../system/file_system/fileOpr`,
                        data: {opr: "zip" ,src: JSON.stringify(srcList), dest: dest},
                        success: function(data){
                            handleFinish(data);
                        }
                    });
                }else{
                     //Replace all + sign with tag
                    var filteredSrcList = [];
                    srcList.forEach(src => {
                        filteredSrcList.push(src.split("+").join("{{plug_sign}}"));
                    })

                    //Start WebSocket connection
                    var endpoint = getWSEndpoint() + `?opr=zip&src=${encodeURIComponent(JSON.stringify(filteredSrcList))}&dest=${encodeURIComponent(dest)}&existsresp=${overwriteMode}`
                    console.log(endpoint);
                    var ws = new WebSocket(endpoint);
                    var srcZipRoot = "";
                    ws.onopen = function() {
                        console.log("File Operation WebSocket opened")
                        //Emulate the src folder
                        var srcDir = srcList[0].split("/");
                        srcDir.pop();
                        srcDir = srcDir.join("/");
                        srcZipRoot = srcDir;
                        var currentSrc = truncate(srcDir, maxPathDisplayLength);
                        $("#src").text(currentSrc);

                        //Emulate the dest folder
                        var destFolderName = dest.substr(0, dest.length - 1).split('/').pop();
                        destFolderName += ".zip";
                        var currentDest = truncate(dest + destFolderName, maxPathDisplayLength);
                        $("#dest").text(currentDest);

                    };

                    ws.onmessage = function (evt) { 
                        var data = evt.data;
                        var progress = JSON.parse(data);
                        if (progress.Error != ""){
                            //Something went wrong
                            $("#progressbar").css("background-color", "#eb3f28");
                            enterErrorMode = true;
                            alert(progress.Error);
                        }else{
                            //Update the progress display
                            $("#progressbar").css("width", progress.Progress + "%");
                            var currentSrc = truncate(srcZipRoot + "/" + progress.LatestFile, maxPathDisplayLength);
                            var filteredDest = operationConfig.dest.trim();
                            if (filteredDest.substr(filteredDest.length -1, 1) != "/"){
                                filteredDest += "/"
                            }
                            var currentDest = truncate(filteredDest + progress.LatestFile, maxPathDisplayLength);

                            $("#src").text(currentSrc);
                            $("#dest").text(currentDest);
                            $("#progress").text(progress.Progress + "%")

                            if (progress.Progress == 100){
                                //Set progress bar to green
                                $("#progressbar").css("background-color", "#2bba35");
                            }
                        }
                    };
                            
                    ws.onclose = function() { 
                        //Transfer finished! Set OK and close in 1 second
                        if (!enterErrorMode){
                            $("#progressbar").css("background-color", "#2bba35");
                            $("#progressbar").css("width", "100%");
                            $("#progress").text("100%")
                            setTimeout(function(){
                                ao_module_close();
                            }, 1000);
                        }
                    };

                    ws.onerror = function(event){
                        console.error("WebSocket error observed:", event);
                        legacyMode = true;
                        console.log("Falling back to Legacy Mode");
                        zip(srcList, dest, overwriteMode);
                    }
                }
            }

            function cut(srcList, dest, overwriteMode){
                if (legacyMode){
                    console.log("WebSocket not found, Running in legacy mode")
                    $.ajax({
                        type: 'POST',
                        url: `../../system/file_system/fileOpr`,
                        data: {opr: "move" ,src: JSON.stringify(srcList), dest: dest,existsresp: overwriteMode},
                        success: function(data){
                            handleFinish(data);
                        }
                    });
                }else{
                    //Replace all + sign in srclist with {{plus_sign}}
                    var filteredSrcList = [];
                    srcList.forEach(src => {
                        filteredSrcList.push(src.split("+").join("{{plug_sign}}"));
                    })

                    //Use Websocket for operation updates
                    var endpoint = getWSEndpoint() + `?opr=move&src=${encodeURIComponent(JSON.stringify(filteredSrcList))}&dest=${encodeURIComponent(dest)}&existsresp=${overwriteMode}`
                    console.log(endpoint);
                    var ws = new WebSocket(endpoint);
                    ws.onopen = function() {
                        console.log("File Operation WebSocket opened")
                    };
                        
                    ws.onmessage = function (evt) { 
                        var data = evt.data;
                        var progress = JSON.parse(data);
                        if (progress.Error != ""){
                            $("#progressbar").css("background-color", "#eb3f28");
                            enterErrorMode = true;
                            alert(progress.Error);
                           
                        }else{
                            $("#progressbar").css("width", progress.Progress + "%");
                            var currentSrc = truncate(operationConfig.src + "/" + progress.LatestFile, maxPathDisplayLength);
                            var filteredDest = operationConfig.dest.trim();
                            if (filteredDest.substr(filteredDest.length -1, 1) != "/"){
                                filteredDest += "/"
                            }
                            var currentDest = truncate(filteredDest + progress.LatestFile, maxPathDisplayLength);
                            $("#src").text(currentSrc);
                            $("#dest").text(currentDest);
                            $("#progress").text(progress.Progress + "%")

                            if (progress.Progress == 100){
                                //Set progress bar to green
                                $("#progressbar").css("background-color", "#2bba35");
                            }
                        }
                        
                    };
                        
                    ws.onclose = function() { 
                        //Transfer finished! Set OK and close in 1 second
                        if (!enterErrorMode){
                            $("#progressbar").css("background-color", "#2bba35");
                            $("#progressbar").css("width", "100%");
                            $("#progress").text("100%")
                            setTimeout(function(){
                                ao_module_close();
                            }, 1000);
                        }
                     
                        
                    };

                    ws.onerror = function(event){
                        console.error("WebSocket error observed:", event);
                        console.log("Falling back to Legacy Mode")
                        legacyMode = true;
                        cut(srcList, dest, overwriteMode)
                    }

                }
               
            }

            function copy(srcList, dest, overwriteMode){
                if (legacyMode){
                    //Open operation in legacy mode
                    console.log("WebSocket not found, Running in legacy mode")
                    $.ajax({
                        type: 'POST',
                        url: `../../system/file_system/fileOpr`,
                        data: {opr: "copy" ,src: JSON.stringify(srcList), dest: dest,existsresp: overwriteMode },
                        success: function(data){
                            handleFinish(data);
                        }
                    });
                }else{
                    var filteredSrcList = [];
                    srcList.forEach(src => {
                        filteredSrcList.push(src.split("+").join("{{plug_sign}}"));
                    })


                   //Use Websocket for operation updates
                   var endpoint = getWSEndpoint() + `?opr=copy&src=${JSON.stringify(filteredSrcList)}&dest=${encodeURIComponent(dest)}&existsresp=${overwriteMode}`
                    var ws = new WebSocket(endpoint);
                    ws.onopen = function() {
                        console.log("File Operation WebSocket opened")
                    };
                        
                    ws.onmessage = function (evt) { 
                        var data = evt.data;
                        var progress = JSON.parse(data);
                        if (progress.Error != ""){
                            $("#progressbar").css("background-color", "#eb3f28");
                            enterErrorMode = true;
                            alert(progress.Error);
                        }else{
                            $("#progressbar").css("width", progress.Progress + "%");
                            var currentSrc = truncate(operationConfig.src + "/" + progress.LatestFile, maxPathDisplayLength);
                            var filteredDest = operationConfig.dest.trim();
                            if (filteredDest.substr(filteredDest.length -1, 1) != "/"){
                                filteredDest += "/"
                            }
                            var currentDest = truncate(filteredDest + progress.LatestFile, maxPathDisplayLength);

                            $("#src").text(currentSrc);
                            $("#dest").text(currentDest);
                            $("#progress").text(progress.Progress + "%")

                            if (progress.Progress == 100){
                                //Set progress bar to green
                                $("#progressbar").css("background-color", "#2bba35");
                            }
                        }
                        
                    };
                        
                    ws.onclose = function() { 
                        //Transfer finished! Set OK and close in 1 second
                        if (!enterErrorMode){
                            $("#progressbar").css("background-color", "#2bba35");
                            $("#progressbar").css("width", "100%");
                            $("#progress").text("100%")
                            setTimeout(function(){
                                ao_module_close();
                            }, 1000);
                        }
                    };

                    ws.onerror = function(event){
                        console.error("WebSocket error observed:", event);
                        console.log("Falling back to Legacy Mode")
                        legacyMode = true;
                        copy(srcList, dest, overwriteMode)
                    }

                }
               
            }

            var truncate = function (fullStr, strLen, separator) {
                if (fullStr.length <= strLen) return fullStr;

                separator = separator || '...';

                var sepLen = separator.length,
                    charsToShow = strLen - sepLen,
                    frontChars = Math.ceil(charsToShow/2),
                    backChars = Math.floor(charsToShow/2);

                return fullStr.substr(0, frontChars) + 
                        separator + 
                        fullStr.substr(fullStr.length - backChars);
                 };

            function getWSEndpoint(){
                //Open opeartion in websocket
                let protocol = "wss://";
                if (location.protocol !== 'https:') {
                    protocol = "ws://";
                }
                wsControlEndpoint = (protocol + window.location.hostname + ":" + window.location.port + "/system/file_system/ws/fileOpr");
                return wsControlEndpoint;
            }

            function updateTitle(fileNumber, opr){
                var title = "";
                if (opr == "move"){
                    title = "Moving ";
                }else if (opr == "copy"){
                    title = "Copying ";
                }else if (opr == "zip" || opr == "zipAndDownload"){
                    title = "Zipping ";
                }else if (opr == "download"){
                    title = "Downloading ";
                }else if (opr == "unzip" || opr == "unzipAndOpen"){
                    title = "Unzipping ";
                }

                title += fileNumber + " ";
                if (fileNumber == 1){
                    title += " File";
                }else{
                    title += " Files";
                }

                $(".title").text(title);
            }

            function handleFinish(data){
                if (data.error !== undefined){
                    $("#progressbar").css("background-color","#db2828");
                    $("#progressbar").parent().removeClass('active');
                    $(".title").html(`<i class="remove icon"></i>` + data.error);
                }else{
                    $("#progressbar").css("background-color","#21ba45");
                    $("#progressbar").parent().removeClass('active');
                    
                    if (opr == "move" || opr == "copy" || opr == "zip" || opr == "unzip"){
                        //Action completed. close window.
                        setTimeout(function(){
                            //Do callback if exists
                            if (operationConfig.callbackWindowID !== undefined && operationConfig.callbackFunction !== undefined){
                                var callbackWindowObject = parent.getFloatWindowByID(operationConfig.callbackWindowID)
                                var windowObject = $(callbackWindowObject).find("iframe")[0];
                                console.log(windowObject.contentWindow, operationConfig.callbackFunction);
                                windowObject.contentWindow.eval(operationConfig.callbackFunction);
                            }
                            ao_module_close();
                        }, 1000);
                    }else if (opr == "download"){
                        //Create download from buffer
                        
                    }else if (opr == "zipAndDown"){
                        //Download

                    }else if (opr == "unzipAndOpen"){
                        //Unzip and open the target directory
                        setTimeout(function(){
                            //Open the target directory
                            ao_module_openPath(operationConfig.dest);
                            //Close the window
                            ao_module_close();
                        }, 1000);
                       
                    }
                }
                console.log(data);
            }


        </script>
    </body>
</html>