89 lines
2.7 KiB
JavaScript
89 lines
2.7 KiB
JavaScript
class FileView{
|
|
parentElem = undefined
|
|
selected = []
|
|
/**
|
|
* @param {HTMLElement} fileViewElem
|
|
* @param {Function} doubleClickCallback
|
|
* @param {Function} rightClickCallback
|
|
*/
|
|
constructor(fileViewElem, doubleClickCallback, rightClickCallback, fileUploadCallback){
|
|
//TODO check all params
|
|
this.parentElem = fileViewElem
|
|
|
|
fileViewElem.addEventListener('click', (event) => {
|
|
if (event.target.classList[0] == 'FileTileView')
|
|
{
|
|
this.DeselectAll()
|
|
return
|
|
}
|
|
if (event.detail === 1){
|
|
this.DeselectAll()
|
|
this.Select([event.target])
|
|
} else if (event.detail === 2) {
|
|
doubleClickCallback(event)
|
|
}
|
|
})
|
|
|
|
fileViewElem.addEventListener('contextmenu', (event) => {
|
|
event.preventDefault();
|
|
if (event.target.classList.contains("Tile")){
|
|
this.DeselectAll()
|
|
this.Select([event.target])
|
|
}
|
|
this.Select([event.target])
|
|
rightClickCallback(event)
|
|
})
|
|
|
|
if (fileUploadCallback !== undefined) {
|
|
fileViewElem.addEventListener('dragenter', function(event) {
|
|
// console.log("start")
|
|
})
|
|
|
|
fileViewElem.addEventListener('dragover', function(event) {
|
|
event.preventDefault();
|
|
// console.log("over")
|
|
})
|
|
|
|
fileViewElem.addEventListener("drop", (event) => {
|
|
event.preventDefault();
|
|
// console.log(event.dataTransfer.items[0])
|
|
fileUploadCallback(event.dataTransfer.items)
|
|
})
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @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")
|
|
});
|
|
this.selected = []
|
|
}
|
|
|
|
/** Get html of folder by path
|
|
* @param {string} path
|
|
*/
|
|
OpenFolder(path){
|
|
fetch(`${window.location.origin}/system/wde/widgets/file-tile-view?path=${path}`) //TODO Move to wde func. Or Not?
|
|
.then((response) => response.text())
|
|
.then((html) => {
|
|
//TODO
|
|
// console.log(responseStatus)
|
|
// if (responseStatus != 200) {
|
|
// WebDesktopEnvironment.Alert("Error")
|
|
// }
|
|
this.parentElem.innerHTML = html
|
|
}).catch((error) => {
|
|
WebDesktopEnvironment.Alert(error);
|
|
})
|
|
}
|
|
} |