From bea68594571ca729dd9613d396505a3152aae59a Mon Sep 17 00:00:00 2001 From: cyber-dream Date: Thu, 4 May 2023 17:58:38 +0300 Subject: [PATCH] Improve contex menu in finder, small fixes --- apps/finder/finder.go | 55 ++++++++++++++++++++++++- resources/sys/finder/finder.js | 40 +++++++----------- resources/sys/wde/file-view.js | 18 +++++++- resources/wde.js | 4 +- resources/wdeUI.css | 4 ++ templates/wde-widgets/context-menu.tmpl | 32 ++++---------- wde/contextmenu.go | 10 +++++ 7 files changed, 108 insertions(+), 55 deletions(-) create mode 100644 wde/contextmenu.go diff --git a/apps/finder/finder.go b/apps/finder/finder.go index 7ddd076..c8de1e8 100644 --- a/apps/finder/finder.go +++ b/apps/finder/finder.go @@ -3,6 +3,7 @@ package finder import ( "net/http" "personalwebsite/apps" + "personalwebsite/wde" "personalwebsite/webfilesystem" "github.com/gin-gonic/gin" @@ -34,6 +35,54 @@ func (f *FinderApplication) Render(isMobile bool) gin.H { return gin.H{} } +func (f *FinderApplication) RenderContextMenu(context string, data string) gin.H { + islands := [][]wde.ContexMenuRow{} + switch context { + case "FileTileView": + islands = [][]wde.ContexMenuRow{ + { + { + Label: "New Directory", + Action: []string{}, + }, + }, + } + case "directory": + islands = [][]wde.ContexMenuRow{ + { + {Label: "Test"}, + {Label: "Delete"}, + }, + { + { + Label: "Get Info", + Action: []string{"openApp", "properties"}, + }, + }, + } + default: + islands = [][]wde.ContexMenuRow{ + { + { + Label: "temp Menu 1", + }, + { + Label: "temp Menu 2", + }, + { + Label: "temp Menu 3", + }, + { + Label: "temp Menu 4", + }, + }, + } + } + return gin.H{ + "Islands": islands, + } +} + func (f *FinderApplication) Routes(routes *gin.RouterGroup) { routes.GET("render", func(ctx *gin.Context) { isMobileParam := ctx.Query("isMobile") @@ -61,7 +110,11 @@ func (f *FinderApplication) Routes(routes *gin.RouterGroup) { } ctx.HTML(http.StatusOK, "finder/desktop.tmpl", gin.H{}) }) + routes.GET("contextMenu", func(ctx *gin.Context) { - ctx.HTML(http.StatusOK, "wde-widgets/context-menu.tmpl", gin.H{}) + context := ctx.Query("context") + data := ctx.Query("data") + ginH := f.RenderContextMenu(context, data) + ctx.HTML(http.StatusOK, "wde-widgets/context-menu.tmpl", ginH) }) } diff --git a/resources/sys/finder/finder.js b/resources/sys/finder/finder.js index 75ba433..f7a347f 100644 --- a/resources/sys/finder/finder.js +++ b/resources/sys/finder/finder.js @@ -145,14 +145,19 @@ class Finder{ RightClick(event){ // console.log(event) // console.log() - if (event.target.className="FileTileView" ||event.target.getAttribute('filetype') != ""){ - this.CreateContextMenu(event.target, [event.clientY, event.clientX]) - } + this.CreateContextMenu(event.target, [event.clientY, event.clientX]) } CreateContextMenu(target, pos){ + let context + if (target.classList.contains("FileTileView")) + { + context = "FileTileView" + + } fetch(`${window.location.origin}/application/${this.appId}/contextMenu?` + new URLSearchParams({ - kek: "kek" + context: context + })) .then((response) => response.text()) .then((html) => { @@ -161,21 +166,22 @@ class Finder{ overlay.style.position = 'absolute' overlay.style.width = "100%" overlay.style.height = "100%" + let menu = document.createElement("div") menu.setAttribute('class', 'ContextMenu WindowFrameShadow') menu.style.position = 'absolute'; - // menu.style.backgroundColor = '#000000'; menu.style.top = pos[0] + "px"; menu.style.left = pos[1] + "px"; menu.innerHTML = html + menu.children[0].lastElementChild.remove() //FIXME Can't ommit rendering of horLine in end of menu on backend overlay.appendChild(menu) document.body.appendChild(overlay) overlay.addEventListener('click',(event) => { - if (event.target.className == "Row"){ //TODO add uuid id to rows to more accurate checks?? - // console.log("aaaa") + if (event.target.classList.contains("Row")){ //TODO add uuid id to rows to more accurate checks?? + //TODO } overlay.remove() }) @@ -186,24 +192,6 @@ class Finder{ }) .catch((error) => { WebDesktopEnvironment.Alert(error); - }) - - + }) } - - // /** - // * @param {path} string - // */ - // renderFileView(path){ - // fetch(`${window.location.origin}/fs/list?` + new URLSearchParams({ - // path: path, - // })) - // .then((response) => response.text()) - // .then((html) => { - // this.fileView.innerHTML = html - // }) - // .catch((error) => { - // WebDesktopEnvironment.Alert(error); - // }) - // } } diff --git a/resources/sys/wde/file-view.js b/resources/sys/wde/file-view.js index 646e1b6..d392b07 100644 --- a/resources/sys/wde/file-view.js +++ b/resources/sys/wde/file-view.js @@ -18,8 +18,7 @@ class FileView{ } if (event.detail === 1){ this.DeselectAll() - this.selected.push(event.target) - event.target.classList.add("Selected") + this.Select([event.target]) } else if (event.detail === 2) { doubleClickCallback(event) } @@ -27,10 +26,25 @@ class FileView{ fileViewElem.addEventListener('contextmenu', (event) => { event.preventDefault(); + if (event.target.classList.contains("Tile")){ + this.DeselectAll() + this.Select([event.target]) + } + this.Select([event.target]) rightClickCallback(event) }) } + /** + * @param {[]Element} elements + */ + Select(elements){ + elements.forEach(element => { + this.selected.push(element) + element.classList.add("Selected") + }); + } + DeselectAll(){ this.selected.forEach(element => { element.classList.remove("Selected") diff --git a/resources/wde.js b/resources/wde.js index d837d5f..d3b228b 100644 --- a/resources/wde.js +++ b/resources/wde.js @@ -4,8 +4,8 @@ document.addEventListener('DOMContentLoaded', function() { // console.log(window.screen.width) wde = new WebDesktopEnvironment if (!WebDesktopEnvironment.isMobile){ - // WebDesktopEnvironment.Open("finder", ["/home/user"]) - WebDesktopEnvironment.Open("blog-viewer", ["/home/user/blog/test-1.blog"]) + WebDesktopEnvironment.Open("finder", ["/home/user"]) + // WebDesktopEnvironment.Open("blog-viewer", ["/home/user/blog/test-1.blog"]) // WebDesktopEnvironment.Open("personal-properties", ["kek"]) } else { WebDesktopEnvironment.Open("blog-viewer", ["/home/user/blog/test-1.blog"]) diff --git a/resources/wdeUI.css b/resources/wdeUI.css index 021c2ab..191b933 100644 --- a/resources/wdeUI.css +++ b/resources/wdeUI.css @@ -60,6 +60,10 @@ height: 0px; } +.AdjectiveHorizontalLine:last-child { + height: 0%; + visibility: hidden; +} .WindowFrame .TitleBar { diff --git a/templates/wde-widgets/context-menu.tmpl b/templates/wde-widgets/context-menu.tmpl index 24aa755..9a9f613 100644 --- a/templates/wde-widgets/context-menu.tmpl +++ b/templates/wde-widgets/context-menu.tmpl @@ -1,28 +1,12 @@ {{ define "wde-widgets/context-menu.tmpl" }} - - {{ end }} \ No newline at end of file diff --git a/wde/contextmenu.go b/wde/contextmenu.go new file mode 100644 index 0000000..428b2f6 --- /dev/null +++ b/wde/contextmenu.go @@ -0,0 +1,10 @@ +package wde + +type ContexMenuIsland struct { + Rows []ContexMenuRow +} + +type ContexMenuRow struct { + Label string + Action []string +}