365 lines
12 KiB
JavaScript
365 lines
12 KiB
JavaScript
class Finder{
|
|
static appId = "Finder"
|
|
appId = "Finder"
|
|
fileView = undefined
|
|
path = "/"
|
|
homePath = "/home/user"
|
|
windowElement
|
|
// previousPath = "/"
|
|
pathHistory = [] //FIXME Fixed length
|
|
constructor(){
|
|
// this.appElem = appElem
|
|
// WebDesktopEnvironment.RegisterApp(this)
|
|
}
|
|
/**
|
|
* @param {string[]} args
|
|
*/
|
|
async NewWindow(args){
|
|
let newFinder = new FinderWindow()
|
|
await newFinder.Init(args)
|
|
return
|
|
this.path = args[0]
|
|
if (args[1] == "desktop"){
|
|
this.NewDesktop(args)
|
|
return
|
|
}
|
|
// const params = new URLSearchParams({isMobile: WebDesktopEnvironment.isMobile})
|
|
fetch(`/app/${Finder.appId}/render?` + params)
|
|
.then((response) => response.text())
|
|
.then((html) => {
|
|
let newWindow = WebDesktopEnvironment.CreateNewWindow(Finder.appId, 500, 350 )
|
|
newWindow.innerHTML = html
|
|
|
|
this.fileView = new FileView(newWindow.querySelector(".FileTileView"),
|
|
(event) =>{ this.Click(event) },
|
|
(event) =>{ this.RightClick(event) },
|
|
(event, draggedElem) =>{ this.DropEvent(event, draggedElem) },
|
|
)
|
|
this.OpenDir(this.path)
|
|
|
|
newWindow.querySelector("#RootButton").addEventListener('click', () =>{
|
|
this.OpenDir('/')
|
|
})
|
|
|
|
newWindow.querySelector("#HomeButton").addEventListener('click', () =>{
|
|
this.OpenDir('/home/user')
|
|
})
|
|
|
|
this.windowElement = newWindow
|
|
|
|
if (!WebDesktopEnvironment.isMobile){
|
|
let scrollBar = new WdeScrollBar(newWindow.querySelector(".ScrollbarPlace"), newWindow.querySelector(".FileTileView"))
|
|
// console.log(newWindow.querySelector("#closeWindowButton"))
|
|
|
|
newWindow.querySelector("#closeWindowButton").addEventListener('click', function (params) {
|
|
|
|
WebDesktopEnvironment.CloseWindow(newWindow)
|
|
|
|
})
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
WebDesktopEnvironment.Alert(error);
|
|
})
|
|
}
|
|
|
|
|
|
/**
|
|
* @param {string[]} args
|
|
*/
|
|
NewDesktop(args){
|
|
fetch(`${window.location.origin}/application/${Finder.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.Click(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.path = path
|
|
this.fileView.OpenFolder(path)
|
|
}
|
|
|
|
|
|
// /**
|
|
// */
|
|
// OpenNewDir(){
|
|
// WebDesktopEnvironment.Open("finder", [this.path])
|
|
// }
|
|
/**
|
|
* @param {string} path
|
|
* @returns {boolean}
|
|
*/
|
|
static async RenderProperites(path){
|
|
const params = new URLSearchParams({
|
|
path: path
|
|
})
|
|
const response = await fetch(`/application/${Finder.appId}/renderProps?` + params)
|
|
if (response.status != 200){
|
|
WebDesktopEnvironment.Alert("Error in properties render") //TODO
|
|
return false
|
|
}
|
|
const html = response.text()
|
|
let newWindow = WebDesktopEnvironment.CreateNewWindow(Finder.appId, 350, 500 )
|
|
newWindow.innerHTML = html
|
|
newWindow.querySelector("#closeWindowButton").addEventListener('click', function (params) {
|
|
WebDesktopEnvironment.CloseWindow(newWindow)
|
|
})
|
|
}
|
|
}
|
|
|
|
|
|
class FinderWindow{
|
|
CurPath = ""
|
|
fileView = undefined
|
|
windowElem = undefined
|
|
|
|
async Init(args){
|
|
// console.log(args)
|
|
if (args[1] === "-desktop"){
|
|
const params = new URLSearchParams({
|
|
isMobile: WebDesktopEnvironment.isMobile,
|
|
path: args[0]
|
|
})
|
|
const response = await fetch(`/app/${Finder.appId}/renderDesktop?` + params)
|
|
if (response.status != 200){
|
|
WebDesktopEnvironment.Alert("Error in render desktop") //TODO
|
|
}
|
|
const html = await response.text()
|
|
args[2].innerHTML = html
|
|
|
|
this.fileView = new FileView(args[2].querySelector(".FileTileView"), (event) =>{
|
|
this.Click(event, true)
|
|
})
|
|
this.RenderDir(args[0])
|
|
return
|
|
}
|
|
const params = new URLSearchParams({isMobile: WebDesktopEnvironment.isMobile})
|
|
const response = await fetch(`/app/${Finder.appId}/render?` + params)
|
|
if (response.status != 200){
|
|
WebDesktopEnvironment.Alert("Finder ERROR TODO") //TODO
|
|
return
|
|
}
|
|
const html = await response.text()
|
|
|
|
let newWindow = WebDesktopEnvironment.CreateNewWindow(Finder.appId, 500, 350 )
|
|
newWindow.innerHTML = html
|
|
|
|
// console.log(this.ReRenderDir)
|
|
this.fileView = new FileView(
|
|
newWindow.querySelector(".FileTileView"),
|
|
(event) => { this.Click(event) },
|
|
(event) => { this.RightClick(event) },
|
|
(event, draggedElem) => { this.DropEvent(event, draggedElem)},
|
|
() => { this.ReRenderDir() }
|
|
)
|
|
|
|
newWindow.querySelector("#closeWindowButton").addEventListener('click', function (params) {
|
|
|
|
WebDesktopEnvironment.CloseWindow(newWindow)
|
|
|
|
})
|
|
|
|
newWindow.querySelector("#RootButton").addEventListener('click', () =>{
|
|
this.RenderDir('/')
|
|
})
|
|
|
|
newWindow.querySelector("#HomeButton").addEventListener('click', () =>{
|
|
this.RenderDir('/home/user')
|
|
})
|
|
|
|
let scrollBar = new WdeScrollBar(newWindow.querySelector(".ScrollbarPlace"), newWindow.querySelector(".FileTileView"))
|
|
|
|
|
|
this.windowElem = newWindow
|
|
this.RenderDir(args[0])
|
|
}
|
|
|
|
RenderDir(path){
|
|
this.CurPath = path
|
|
this.fileView.OpenFolder(path)
|
|
}
|
|
|
|
ReRenderDir(){
|
|
this.RenderDir(this.CurPath)
|
|
}
|
|
|
|
/**
|
|
* @param {DragEvent} event
|
|
* @param {HTMLElement} draggedElem
|
|
*/
|
|
async DropEvent(event){
|
|
// console.log(event.dataTransfer.getData("dropType"))
|
|
if (event.dataTransfer.getData("dropType") == "move"){
|
|
const sourcePath= event.dataTransfer.getData("filePath")
|
|
const targetPath = this.CurPath + "/" + event.dataTransfer.getData("fileName")
|
|
const res = await WebFS.MoveFile(sourcePath, targetPath)
|
|
if (res){
|
|
this.ReRenderDir()
|
|
} else {
|
|
WebDesktopEnvironment.Alert("UWAGA TODO MOVE FILE ERROR") //TODO
|
|
}
|
|
} else {
|
|
WebDesktopEnvironment.Alert("Not fixed yet")
|
|
return
|
|
let formData = new FormData()
|
|
let files = event.dataTransfer.files
|
|
for (let i = 0; i < files.length; i++) {
|
|
const element = files[i];
|
|
console.log(element)
|
|
formData.append("file", element) //FIXME Conn reset
|
|
}
|
|
const params = new URLSearchParams({
|
|
parentPath: this.CurPath,
|
|
})
|
|
const response = await fetch('/fs/upload/?' + params,
|
|
{
|
|
method: "POST", //TODO Change to PUT?
|
|
body: formData
|
|
})
|
|
if (response.status != 200){
|
|
WebDesktopEnvironment.Alert("ERROR IN UPLOADING FILE")//TODO
|
|
} else {
|
|
this.ReRenderDir()
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @param {MouseEvent} event
|
|
*/
|
|
Click(event){
|
|
let fileType = event.target.getAttribute("fileType")
|
|
let fileName = event.target.getAttribute("name")
|
|
const fileExtension = fileName.split(".")[fileName.split(".").length - 1] //FIXME
|
|
switch (fileType) {
|
|
case "directory":
|
|
if (fileExtension == "app"){
|
|
WebDesktopEnvironment.Open(`${this.CurPath}/${fileName}`, [])
|
|
} else{
|
|
WebDesktopEnvironment.Open(`/Applications/Finder.app`, [`${this.CurPath}/${fileName}`])
|
|
}
|
|
break
|
|
case "blog":
|
|
WebDesktopEnvironment.Open("/Applications/BlogViewer.app", [`${this.CurPath}/${fileName}`])
|
|
break
|
|
case "jpeg":
|
|
case "png":
|
|
WebDesktopEnvironment.Open("img-viewer", [this.CurPath + "/" + fileName])
|
|
break;
|
|
default:
|
|
// console.log("Unsupported file type")
|
|
WebDesktopEnvironment.Alert("Unsupported file type")
|
|
break;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @param {MouseEvent} event
|
|
*/
|
|
RightClick(event){
|
|
this.CreateContextMenu(event.target, [event.clientY, event.clientX])
|
|
}
|
|
|
|
/**
|
|
* @param {HTMLElement} target
|
|
* @param {string[]} pos
|
|
*/
|
|
async CreateContextMenu(target, pos){
|
|
let context = ""
|
|
const fileName = target.getAttribute("name")
|
|
const fileType = target.getAttribute("fileType")
|
|
if (target.classList.contains("FileTileView"))
|
|
{
|
|
context = "FileTileView"
|
|
} else {
|
|
context = fileType
|
|
}
|
|
const params = new URLSearchParams({context: context, path: `${this.CurPath}/${fileName}`})
|
|
const response = await fetch(`/app/${Finder.appId}/contextMenu?` + params)
|
|
if (response.status != 200){
|
|
WebDesktopEnvironment.Alert("ERROR in Context menu TODO"); //TODO
|
|
return
|
|
}
|
|
const html = await response.text()
|
|
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].firstElementChild.remove()
|
|
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', async (event) => {
|
|
if (event.target.classList.contains("Row")){ //TODO add uuid id to rows to more accurate checks??
|
|
let res = false
|
|
switch (event.target.children[0].getAttribute("action")) {
|
|
case "createDir":
|
|
res = await WebFS.CreateDirectory(`${this.CurPath}`)
|
|
console.log(res)
|
|
if (res){
|
|
this.ReRenderDir()
|
|
}
|
|
break
|
|
case "deleteFile":
|
|
res = await WebFS.DeleteFile(`${this.CurPath}/${fileName}`)
|
|
console.log(res)
|
|
if (res){
|
|
this.ReRenderDir()
|
|
}
|
|
break
|
|
case "getInfo":
|
|
res = await Finder.RenderProperites(`${this.CurPath}/${fileName}`)
|
|
break
|
|
case "openAsDir":
|
|
WebDesktopEnvironment.Open(`/Applications/${Finder.appId}.app`,[`${this.CurPath}/${fileName}`])
|
|
break
|
|
default:
|
|
break;
|
|
}
|
|
}
|
|
overlay.remove()
|
|
})
|
|
overlay.addEventListener('contextmenu', (event) => {
|
|
event.preventDefault();
|
|
overlay.remove()
|
|
})
|
|
}
|
|
} |