From 392cf3d4e75debfb8ebb55525404ff71793b7d5b Mon Sep 17 00:00:00 2001 From: luukas Date: Tue, 14 Jun 2022 01:35:43 +0300 Subject: [PATCH 01/13] Make the file editor stick to the top of the page --- .../templates/panel/server_files.html | 53 +++++++++++-------- 1 file changed, 32 insertions(+), 21 deletions(-) diff --git a/app/frontend/templates/panel/server_files.html b/app/frontend/templates/panel/server_files.html index 66ed9c86..4603fd24 100644 --- a/app/frontend/templates/panel/server_files.html +++ b/app/frontend/templates/panel/server_files.html @@ -211,29 +211,40 @@ .tree-nested { display: none; } + + html, body, body > .container-scroller { + overflow: initial; + } + + .editorManager { + top: 63px; + position: sticky; + }
-

-
- {{ translate('serverFiles', 'editingFile', data['lang']) }} -
file_contents
-
+
+

+
+ {{ translate('serverFiles', 'editingFile', data['lang']) }} +
file_contents
+
+
+ {{ translate('serverFiles', 'keybindings', data['lang']) }}: +
+ + + + +
+

+ +
- {{ translate('serverFiles', 'keybindings', data['lang']) }}: -
- - - - -
-

- -
@@ -1113,4 +1124,4 @@ -{% end %} \ No newline at end of file +{% end %} From a67f069709417dd213911af1148b995a64ee215e Mon Sep 17 00:00:00 2001 From: luukas Date: Tue, 14 Jun 2022 02:45:17 +0300 Subject: [PATCH 02/13] Fix Ace editor saving keybinds and ex-commands * Remove our manual keydown handler and use an Ace builtin function * Define Vim's :write aka :w ex-command --- .../templates/panel/server_files.html | 28 ++++++++++++------- 1 file changed, 18 insertions(+), 10 deletions(-) diff --git a/app/frontend/templates/panel/server_files.html b/app/frontend/templates/panel/server_files.html index 4603fd24..d6cdf220 100644 --- a/app/frontend/templates/panel/server_files.html +++ b/app/frontend/templates/panel/server_files.html @@ -278,6 +278,17 @@ let editor = ace.edit('editor'); editor.setTheme('ace/theme/dracula'); editor.session.setUseSoftTabs(true); + editor.commands.addCommand({ + name: 'saveFile', + bindKey: { + win: 'Ctrl-S', + mac: 'Command-S', + sender: 'editor|cli' + }, + exec: function(env, args, request) { + save() + } + }); // mouseup = css resize end document.addEventListener("mouseup", function (e) { @@ -534,15 +545,6 @@ }); - $('#editor').bind('keydown', function (event) { - file_loaded = true; - if (event.ctrlKey && event.key === 's') { - event.preventDefault(); - save(); - } - //console.log(event.keyCode); - }); - setFileName(); $('#editorParent').toggle(false) // show @@ -1108,7 +1110,13 @@ function setKeyboard(target) { var handlerName = target.getAttribute('data-handler-name'); if (handlerName == 'null') handlerName = null; - editor.setKeyboardHandler(handlerName); + editor.setKeyboardHandler(handlerName, () => { + if (handlerName == 'ace/keyboard/vim') { + require("ace/keyboard/vim").Vim.defineEx('write', 'w', function() { + save(); + }); + } + }); var nodes = target.parentNode.querySelectorAll("[data-handler-name]"); nodes.forEach(node => { From c9744554d47da4199e4844fe29908321a667a83c Mon Sep 17 00:00:00 2001 From: luukas Date: Tue, 14 Jun 2022 03:07:26 +0300 Subject: [PATCH 03/13] Improve the code for save status --- .../templates/panel/server_files.html | 43 ++++++------------- 1 file changed, 14 insertions(+), 29 deletions(-) diff --git a/app/frontend/templates/panel/server_files.html b/app/frontend/templates/panel/server_files.html index d6cdf220..45e02ced 100644 --- a/app/frontend/templates/panel/server_files.html +++ b/app/frontend/templates/panel/server_files.html @@ -386,8 +386,7 @@ }, ]; - var filePath = ''; - let file_loaded = false; + let filePath = '', serverFileContent = ''; function clickOnFile(event) { filePath = event.target.getAttribute('data-path'); @@ -408,7 +407,7 @@ $('#fileError').toggle(false) // hide setFileName(event.target.innerText); editor.session.setValue(json.content); - file_loaded = false; + serverFileContent = json.content; } }, }); @@ -523,27 +522,14 @@ timer = null; }; } - editor.on('change', function (event) { - if (!event.ctrlKey && !event.shiftKey) { - if (file_loaded) { - document.getElementById('save_status').innerHTML = ''; - document.getElementById('save_status').style.color = 'gray'; - } else { - document.getElementById('save_status').innerHTML = ''; - document.getElementById('save_status').style.color = '#2fb689'; - } - } - }); - editor.on('undo', function (event) { - document.getElementById('save_status').innerHTML = ''; - document.getElementById('save_status').style.color = 'gray'; - - }); - editor.on('redo', function (event) { - document.getElementById('save_status').innerHTML = ''; - document.getElementById('save_status').style.color = 'gray'; - - }); + /** + * @param {boolean} saved + */ + const setSaveStatus = (saved) => { + document.getElementById('save_status').innerHTML = ``; + document.getElementById('save_status').style.color = saved ? '#2fb689' : 'gray'; + } + ['change', 'undo', 'redo'].forEach(event => editor.on(event, (event) => setSaveStatus(serverFileContent === editor.session.getValue()))) setFileName(); @@ -589,11 +575,10 @@ file_contents: text, file_path: filePath }, - success: function (data) { - console.log("got response:"); - document.getElementById("save_status").innerHTML = ''; - document.getElementById('save_status').style.color = '#2fb689'; - }, + success: (data) => { + serverFileContent = text; + setSaveStatus(true) + } }); } From cd8ebfdcbe61ab461ef591ed98bba2c39614f12b Mon Sep 17 00:00:00 2001 From: luukas Date: Thu, 16 Jun 2022 00:10:48 +0300 Subject: [PATCH 04/13] Make the WebSocket automatically reconnect. The WebSocket reconnects 5 seconds after the connection's closure. If the connection reconnection fails it will try to reconnect after another 5 seconds. --- app/frontend/templates/base.html | 133 ++++++++++++++++++------------- 1 file changed, 78 insertions(+), 55 deletions(-) diff --git a/app/frontend/templates/base.html b/app/frontend/templates/base.html index 4b28120a..6d8c7332 100755 --- a/app/frontend/templates/base.html +++ b/app/frontend/templates/base.html @@ -164,7 +164,7 @@ -{% end %} \ No newline at end of file +{% end %} From f39e75616ce1963906daf8df443e5096ead30995 Mon Sep 17 00:00:00 2001 From: luukas Date: Thu, 16 Jun 2022 02:37:53 +0300 Subject: [PATCH 06/13] Use an exponential backoff algorhithm. https://stackoverflow.com/a/37038217/15388424 --- app/frontend/templates/base.html | 34 +++++++++++++++++++++++++++----- 1 file changed, 29 insertions(+), 5 deletions(-) diff --git a/app/frontend/templates/base.html b/app/frontend/templates/base.html index 6d8c7332..eba6c2e8 100755 --- a/app/frontend/templates/base.html +++ b/app/frontend/templates/base.html @@ -163,6 +163,27 @@