124 lines
3.1 KiB
JavaScript
124 lines
3.1 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
wde = new WebDesktopEnvironment
|
|
|
|
}, false);
|
|
|
|
class WebDesktopEnvironment{
|
|
|
|
constructor(){
|
|
this.wc = new WindowsCompositor
|
|
|
|
//Get basic window ready frame
|
|
fetch("http://192.168.88.10:8080/system/wde/getbasicwindow") //TODO Move to wde func
|
|
.then((response) => response.text())
|
|
.then((html) => {
|
|
WebDesktopEnvironment.SetBasicWindow(html)
|
|
let app = this.loadApp("personal-properties")
|
|
})
|
|
.catch((error) => {
|
|
WebDesktopEnvironment.Alert(error);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* @param {string} appId
|
|
* @returns {Application | undefined}
|
|
*/
|
|
loadApp(appId){
|
|
let newApp = document.createElement("application")
|
|
newApp.setAttribute("id", `application-${appId}`)
|
|
let appElem = document.getElementById("WindowsLayer").appendChild(newApp)
|
|
|
|
let script = document.createElement("script")
|
|
script.setAttribute("src", "http://192.168.88.10:8080/system/applications/personal-properties/app.js")
|
|
script.setAttribute("async", "false")
|
|
appElem.appendChild(script)
|
|
script.addEventListener("load", function () {
|
|
let newApp = new PersonalProperties(appElem)
|
|
newApp.Init()
|
|
}, false)
|
|
}
|
|
|
|
static basicWindow
|
|
/**
|
|
*
|
|
* @param {string} html
|
|
*/
|
|
static SetBasicWindow(html){
|
|
this.basicWindow = html
|
|
}
|
|
/**
|
|
*
|
|
* @returns {string}
|
|
*/
|
|
static GetBasicWindow(){
|
|
// console.log(this.basicWindow)
|
|
return this.basicWindow
|
|
}
|
|
|
|
static Alert(alertText){
|
|
console.log(alertText)
|
|
}
|
|
}
|
|
|
|
var getJSON = function(url, callback) {
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.open('GET', url, true);
|
|
xhr.responseType = 'json';
|
|
xhr.onload = function() {
|
|
var status = xhr.status;
|
|
if (status === 200) {
|
|
callback(null, xhr.response);
|
|
} else {
|
|
callback(status, xhr.response);
|
|
}
|
|
};
|
|
xhr.send();
|
|
};
|
|
|
|
class WindowsCompositor{
|
|
movingElement = null
|
|
|
|
constructor(){
|
|
console.log("Windows Compositor is online :)");
|
|
addEventListener("mousedown", (event) => {
|
|
this.catchClick(event)
|
|
})
|
|
addEventListener("mouseup", (event) => {
|
|
this.movingElement = null
|
|
})
|
|
addEventListener("mousemove", (event) => {
|
|
if (this.movingElement != null) {
|
|
this.dragElement(this.movingElement, event.clientX, event.clientY)
|
|
} else {
|
|
|
|
}
|
|
|
|
})
|
|
}
|
|
|
|
/**
|
|
* @param {MouseEvent} event
|
|
*/
|
|
catchClick(event){
|
|
switch (true) {
|
|
case event.target.className == "TestWindowHeader":
|
|
this.movingElement = event.target.parentElement.parentElement.parentElement
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @param {HTMLDivElement} element
|
|
* @param {number} posX
|
|
* @param {number} posY
|
|
*/
|
|
dragElement(element, posX, posY) {
|
|
element.style.left = posX + "px";
|
|
element.style.top = posY + "px";
|
|
}
|
|
}
|
|
|