class Finder{ appId = "finder" fileView = undefined path = "/" homePath = "/home/user" windowElement // previousPath = "/" pathHistory = [] //FIXME Fixed length constructor(){ // this.appElem = appElem } /** * @param {string[]} args */ NewWindow(args){ this.path = args[0] if (args[1] == "desktop"){ this.NewDesktop(args) return } fetch(`${window.location.origin}/application/${this.appId}/render?` + new URLSearchParams({ isMobile: WebDesktopEnvironment.isMobile, // path: this.path, // bar: true, })) //TODO Move to wde func. Or Not? .then((response) => response.text()) .then((html) => { let newWindow = WebDesktopEnvironment.CreateNewWindow(this.appId, 500, 350 ) newWindow.innerHTML = html this.fileView = new FileView(newWindow.querySelector(".FileTileView"), (event) =>{ this.Open(event, false) }, (event) =>{ this.RightClick(event) }, (event) =>{ this.FileUploading(event) }, ) this.OpenDir(this.path) newWindow.querySelector("#BackButton").addEventListener('click', () =>{ this.OpenPreviousDir() }) newWindow.querySelector("#HomeButton").addEventListener('click', () =>{ this.OpenDir(this.homePath) }) this.windowElement = newWindow if (!WebDesktopEnvironment.isMobile){ // let scrollBar = new WdeScrollBar(newWindow.children[1].children[1], newWindow.children[1].children[0])// TODO to querry selector // console.log(newWindow.querySelector("#closeWindowButton")) newWindow.querySelector("#closeWindowButton").addEventListener('click', function (params) { WebDesktopEnvironment.CloseWindow(newWindow) }) } }) .catch((error) => { WebDesktopEnvironment.Alert(error); }) } /** * @param {DataTransferItemList} filesList */ FileUploading(filesList){ let formData = new FormData() // console.log(filesList) for (let i = 0; i < filesList.length; i++) { const element = filesList[i]; formData.append("file", element.getAsFile()) console.log(formData) } // console.log(formData) // formData.append("photo", photo); fetch('/fs/upload/?' + new URLSearchParams({ path: '/home/user/', }), { method: "POST", body: formData }) .catch((error) => { WebDesktopEnvironment.Alert(error); }) } /** * @param {string[]} args */ NewDesktop(args){ fetch(`${window.location.origin}/application/${this.appId}/renderDesktop?` + new URLSearchParams({ isMobile: WebDesktopEnvironment.isMobile, path: args[0] })) .then((response) => response.text()) .then((html) => { // console.log(args) args[2].innerHTML = html this.fileView = new FileView(args[2].querySelector(".FileTileView"), (event) =>{ this.Open(event, true) }) this.OpenDir(this.path) }) .catch((error) => { WebDesktopEnvironment.Alert(error); }) } OpenPreviousDir(){ if (this.pathHistory.length > 0){ // console.log(this.pathHistory) let path = this.pathHistory[this.pathHistory.length - 1] // console.log(typeof( this.pathHistory)) this.pathHistory.pop() this.OpenDir(this.path) } } /** * @param {string} path */ OpenDir(path){ this.pathHistory += this.path this.path = path this.fileView.OpenFolder(this.path) } /** * @param {MouseEvent} event * @param {boolean} inNewWindow */ Click(event, inNewWindow){ } /** * @param {MouseEvent} event * @param {boolean} inNewWindow */ Open(event, inNewWindow){ let fileType = event.target.getAttribute("fileType") let fileName = event.target.getAttribute("name") switch (fileType) { case "directory": if (inNewWindow){ WebDesktopEnvironment.Open("finder", ["/home/user/" + fileName]) //FIXME this.path is shared for all windows break } this.OpenDir(this.path +"/" + fileName) break case "blog-page": WebDesktopEnvironment.Open("blog-viewer", [this.path + "/" + fileName]) break case "deleteFile": fetch(`/fs/delete` + new URLSearchParams({ path: "/home/user/" + fileName //FIXME })) .then((response) => { console.log(response.status) }) .catch((error) => { WebDesktopEnvironment.Alert(error); }) break // case "app": // //TODO get real id // WebDesktopEnvironment.Open("personal-properties", []) // break; case "base64img": WebDesktopEnvironment.Open("img-viewer", [this.path + "/" + fileName]) break; default: // console.log("Unsupported file type") WebDesktopEnvironment.Alert("Unsupported file type") break; } } RightClick(event){ 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({ context: context })) .then((response) => response.text()) .then((html) => { let overlay = document.createElement("div") //TODO Move to WDE.CreateOverlay() overlay.setAttribute('id', 'finder-context-menu-overlay') 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.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.classList.contains("Row")){ //TODO add uuid id to rows to more accurate checks?? switch (event.target.children[0].getAttribute("action")) { default: break; } } overlay.remove() }) overlay.addEventListener('contextmenu', (event) => { event.preventDefault(); overlay.remove() }) }) .catch((error) => { WebDesktopEnvironment.Alert(error); }) } }