|
@@ -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>
|