Bläddra i källkod

Incremental update of NotepadA functions

TC pushbot 5 4 år sedan
förälder
incheckning
bf9d249944
1 ändrade filer med 186 tillägg och 42 borttagningar
  1. 186 42
      web/NotepadA/index.html

+ 186 - 42
web/NotepadA/index.html

@@ -22,7 +22,13 @@
                padding:1px;
                background-color:#292929;
            }
-          
+           #terminals{
+               position: fixed;
+               right: 0px;
+               bottom: 24px;
+               width: calc(100% - 240px);
+               
+           }
        </style>
     </head>
     <body>
@@ -49,14 +55,14 @@
         <div id="codeArea" onclick="hideContextMenu();">
 
             <div id="ca1" class="codeBoard">
-                <div class="tabs">
+                <div class="tabs" editorUID="mainEditor" ondrop="TabDrop(event)" ondragover="allowDrop(event)">
                   
                 </div>
                 <div class="editor" editorUID="mainEditor" onclick="focusThisEditor(this);"></div>
                 <div class="editorcover" editorUID="mainEditor" onclick="focusThisEditor(this);"></div>
             </div>
             <div id="ca2" class="codeBoard splitMode right" style="display:none;">
-                <div class="tabs">
+                <div class="tabs" editorUID="subEditor" ondrop="TabDrop(event)" ondragover="allowDrop(event)">
 
                 </div>
                 <div class="editor"  editorUID="subEditor" onclick="focusThisEditor(this);"></div>
@@ -162,7 +168,7 @@
             let files = ao_module_loadInputFiles(); //Files imported from file system
 
             //Terminal realted
-            let terminalStartingEndpoint = "../SystemAO/wstty/console.html";
+            let terminalStartingEndpoint = "../wstty/";
 
             //Initiation functions  
             initEditor($("#ca1").find(".editor")[0], "mainEditor", files, restoreEditorState);
@@ -170,18 +176,18 @@
 
             //Load ready page into the editorCover
             $(".editorcover").load("home.html");
-
-            //Get system info to determind the terminal endpoint
-            $.get("../system/info/getArOZInfo", function(data){
-                if (data.HostOS == "windows"){
-                    terminalStartingEndpoint = "../SystemAO/wstty/console.html";
-                }else if (data.HostOS == "linux"){
-                    terminalStartingEndpoint = "../wstty/";
-                    $("#initTerminal").attr('src', terminalStartingEndpoint);
-
-                }
-            });
            
+            //Get the editor by id
+            function getEditor(uuid){
+                var resultEditor = undefined;
+                editors.forEach(thisEditor => {
+                    if (thisEditor.uuid == uuid){
+                        resultEditor = thisEditor;
+                    }
+                });
+
+                return resultEditor;
+            }
 
             //Restore the previous editor state
             function restoreEditorState(editor){
@@ -440,6 +446,7 @@
                 var tabInfo = getFocusedTabInfo();
                 if (tabInfo !== undefined){
                     updateFileStatusDisplay(tabInfo.filepath);
+                    focusTabWithUUID(tabInfo.tabUUID);
                 }
             }
 
@@ -507,7 +514,7 @@
                     </div>
                     <div class="divider"></div>
                     <div class="item" onclick="saveCurrentFile();">Save</div>
-                    <div class="item">Save As</div>
+                    <div class="item" onclick="saveCurrentFileAs();">Save As</div>
                     <div class="item" onclick="saveAllFiles();">Save All</div>
                     <!--<div class="divider"></div>
                     <div class="item">Preference</div>-->
@@ -612,6 +619,16 @@
                 hideContextMenu();
             }
 
+            function closeAllFiles(){
+                editors.forEach(editor => {
+                    var editorId = editor.uuid;
+                    editor.tabs.forEach(tab => {
+                        closeTabWithUUIDAndEditorID(tab.tabUUID, editorId);
+                    });
+                });
+                hideContextMenu();
+            }
+
           
             function saveAllFiles(){
                 //Store the editor object before saveall
@@ -654,8 +671,21 @@
                     $("#ca1").attr("class","codeBoard")
                     $("#ca2").hide();
                     setStorage("splitmode","false");
+
+                    //Move all tabs from subEditor to main editor
+                    var mainEditor = getEditor("mainEditor");
+                    var subEditor = getEditor("subEditor");
+                    subEditor.tabs.forEach(tab => {
+                        var filepath = tab.filepath;
+                        //Open tab in main editor
+                        openFile(filepath, false, mainEditor);
+
+                        //Close tab in sub editor
+                        closeTabWithUUIDAndEditorID(tab.tabUUID, "subEditor");
+                    });
                 }
 
+
                 //Update all editor's size
                 for (var i =0; i < editors.length; i++){
                     editors[i].editor.layout();
@@ -670,13 +700,19 @@
             }
 
             //open a file with a new editor by the given filepath
-            function openFile(filepath, updateHashStatus=true){
+            function openFile(filepath, updateHashStatus=true, overrideEditor=undefined){
                 //Get the focused editor
                 var targetEditorGroup = undefined;
-                for (var i =0; i < editors.length; i++){
-                    if (editors[i].uuid == focusedEditor){
-                        targetEditorGroup = editors[i];
+                if (overrideEditor == undefined){
+                    //Do not override editor
+                    for (var i =0; i < editors.length; i++){
+                        if (editors[i].uuid == focusedEditor){
+                            targetEditorGroup = editors[i];
+                        }
                     }
+                }else{
+                    //Use override editor
+                    targetEditorGroup = overrideEditor;
                 }
 
                 if (targetEditorGroup === undefined){
@@ -699,12 +735,8 @@
                     file: filepath
                 }, function(filecontent){
                     //Get the target Opening Editor
-                    let targetOpeningEditor;
-                    for (var i = 0; i < editors.length; i++){
-                        if (editors[i].uuid == focusedEditor){
-                            targetOpeningEditor = editors[i];
-                        }
-                    }
+                    let targetOpeningEditor = targetEditorGroup;
+                    
                     if (typeof targetOpeningEditor === undefined){
                         console.log("Error when trying to get editor info")
                         return;
@@ -727,7 +759,7 @@
                     var tabUUID = new Date().getTime();
                     var filename = filepath.split("/").pop();
                     $(targetTabMenu).find(".item.selected").removeClass("selected");
-                    $(targetTabMenu).append(`<div class="item selected" uuid="${tabUUID}"  editorUUID="${editorUUID}"><i class="code file icon"></i> ${filename} <div class="closebtn"><i class="remove icon"></i></i></div></div>`);
+                    $(targetTabMenu).append(`<div class="item selected fileTab" title="${filepath}" draggable="true" ondragstart="fileTabDrag(event)" uuid="${tabUUID}"  editorUUID="${editorUUID}" filepath="${filepath}"><i class="code file icon"></i> ${filename} <div class="closebtn"><i class="remove icon"></i></i></div></div>`);
 
                     //Add this tab into the open editor list
                     $("#openeditors .item").removeClass("selected");
@@ -786,7 +818,10 @@
                         console.log(currentState);
                         writeHashObject(currentState);
                     }
-                  
+
+                    //Finally, focus on the newly opened tab
+                    focusTabWithUUID(tabUUID);
+                
                 });
             }
 
@@ -846,7 +881,7 @@
                                 `);
                             }else{
                                 files.push(`
-                                <div class="item" title="${filepath}" style="overflow:hidden;" onclick="openFileViaDirectoryExplorer(this, event);">
+                                <div class="item" title="${filepath}" draggable="true" ondragstart="directoryFileDrag(event)" filepath="${filepath}" filename="${filename}"  style="overflow:hidden;" onclick="openFileViaDirectoryExplorer(this, event);">
                                     <i class="${icon} icon"></i> ${filename} 
                                 </div>
                                 `);
@@ -1061,16 +1096,11 @@
             function openFileInFileManager(){
                 var tabInfo = getFocusedTabInfo();
                 var filepath = tabInfo.filepath;
-                //Extract the parent dir
-                var folderPath = "";
-                if (filepath.substr(filepath.length -1) == "/"){
-                    var tmp = filepath.split("/");
-                    tmp.pop();
-                    folderPath = tmp.pop();
-                }else{
-                    folderPath = filepath.split("/").pop();
-                }
-                ao_module_openPath(folderPath);
+                var fileinfo = filepath.split("/");
+                var filename = fileinfo.pop();
+                var dirname = fileinfo.join("/");
+
+                ao_module_openPath(dirname, filename);
             }
 
             function getHashObject(){
@@ -1097,7 +1127,10 @@
                 var openedFilepaths = [];
                 editors.forEach(editor => {
                     editor.tabs.forEach(tab => {
-                        openedFilepaths.push(tab.filepath);
+                        if (!openedFilepaths.includes(tab.filepath)){
+                            openedFilepaths.push(tab.filepath);
+                        }
+                        
                     })
                 });
 
@@ -1183,6 +1216,42 @@
 		        editorObject.editor.focus();
             }
 
+            //Save current file as a new file
+            function saveCurrentFileAs(){
+                var tabInfo = getFocusedTabInfo();
+                var filepath = tabInfo.filepath;
+                var fileinfo = filepath.split("/");
+                var filename = fileinfo.pop();
+                var dirname = fileinfo.join("/") + "/";
+                ao_module_openFileSelector(writeToSaveAsFile, dirname, "new",false,{
+                    defaultName: filename
+                });
+                hideContextMenu();
+            }
+
+            function writeToSaveAsFile(filedata){
+                for (var i=0; i < filedata.length; i++){
+                    var filename = filedata[i].filename;
+                    var filepath = filedata[i].filepath;
+                    var content = getFocusedEditorObject().editor.getValue();
+                    //Write to this filepath
+                    syscall("writeFile",{"filepath":filepath, "content":content}, function(data){
+                        if (data.error !== undefined){
+                            alert(data.error);
+                        }else{
+                            //OK
+                            console.log("File saved");
+                            msgbox("save","File Saved")
+                        }
+                    });
+
+                    //Handle only one file write
+                    return
+                }
+            }
+
+
+
             function saveCurrentFile(){
                 var tabInfo = getFocusedTabInfo();
                 var focusedEditor = getFocusedEditorObject();
@@ -1201,6 +1270,22 @@
                 hideContextMenu();
             }
 
+            function getAllOpenedTabs(){
+                var results = [];
+                editors.forEach(editor => {
+                    let thisEditor = editor;
+                    editor.tabs.forEach(tab => {
+                        let thisTab = tab;
+                        results.push({
+                            editor: thisEditor,
+                            tab: thisTab
+                        })
+                    })
+                });
+
+                return results;
+            }
+
             function saveContentToFile(tabUUID, filepath, content, callback=undefined){
                 syscall("writeFile",{"filepath":filepath, "content":content}, function(data){
                     if (callback !== undefined){
@@ -1242,8 +1327,13 @@
             }
 
             function hanleUserExit(){
-                //Check for unsaved file, wip
-                if (confirm("Some files might not be saved. Confirm exit?")){
+                //Check if there are opened files
+                var openedTabs = getAllOpenedTabs();
+                if (openedTabs.length > 0){
+                    if (confirm("Some files might not be saved. Confirm exit?")){
+                        ao_module_close();
+                    }
+                }else{
                     ao_module_close();
                 }
             }
@@ -1275,6 +1365,60 @@
                     }
                 })
             }
+
+            //Drag events for fileTabs
+            function allowDrop(ev) {
+                ev.preventDefault();
+            }
+
+            //Drag file from directory explorer to editor tabs
+            function directoryFileDrag(ev){
+                var tabFilepath = $(ev.target).attr("filepath");
+                var tabFilename = $(ev.target).attr("filename");
+                var uuid = Date.now(); //Generate a new UUID for this
+
+                ev.dataTransfer.setData("uuid", uuid);
+                ev.dataTransfer.setData("filename", tabFilename);
+                ev.dataTransfer.setData("filepath", tabFilepath);
+            }
+
+            //Drag tab from one editor top to another
+            function fileTabDrag(ev) {
+                var tabUUID = $(ev.target).attr("uuid");
+                var tabFilepath = $(ev.target).attr("filepath");
+                var tabFilename = $(ev.target).text();
+                
+                ev.dataTransfer.setData("uuid", tabUUID);
+                ev.dataTransfer.setData("filename", tabFilename);
+                ev.dataTransfer.setData("filepath", tabFilepath);
+            }
+
+            function TabDrop(ev) {
+                if ($(ev.target).hasClass("tabs") == false){
+                    return;
+                }
+                ev.preventDefault();
+                //Get the file information
+                var tabUUID = ev.dataTransfer.getData("uuid");
+                var tabFilename = ev.dataTransfer.getData("filename");
+                var tabFilepath = ev.dataTransfer.getData("filepath");
+                
+                if (tabFilename == "" || tabFilepath == ""){
+                    return;
+                }
+
+                //Get the target dropping editor
+                var targetEditor = getEditor($(ev.target).attr("editoruid"));
+                if (targetEditor == undefined){
+                    console.log("Editor with given ID not found");
+                    return
+                }
+
+                //Open the file in the given editor
+                openFile(tabFilepath, true, targetEditor);
+                console.log(targetEditor, tabUUID, tabFilename, tabFilepath);
+            }
+
         </script>
     </body>
 </html>