95 lines
3.4 KiB
JavaScript
95 lines
3.4 KiB
JavaScript
class buiProgressBar {
|
|
constructor (name) {
|
|
this.root = document.createElement("span");
|
|
this.lable = document.createElement("span");
|
|
this.progress = document.createElement("span");
|
|
this.progressFilled = document.createElement("span");
|
|
this.root.setAttribute("class","bui_progress_bar_root");
|
|
this.lable.setAttribute("class","bui_progress_bar_lable");
|
|
this.progress.setAttribute("class","bui_progress_bar_progress");
|
|
this.progressFilled.setAttribute("class","buo_progress_bar_progress_filled");
|
|
this.root.appendChild(this.progress);
|
|
this.progress.appendChild(this.progressFilled);
|
|
this.root.appendChild(this.lable);
|
|
this.name = "string" == typeof name ? name : "";
|
|
this.value = 0;
|
|
this.progress = 0;
|
|
}
|
|
|
|
function update (value,progress) {
|
|
this.value = !isNaN(value) ? value : 0;
|
|
this.progress = !isNaN(progress) ? Math.max(0,Math.min(1,progress)) : 0;
|
|
this.lable.innerText = this.name+": "+numberShorten(this.value,4);
|
|
this.progressFilled.style.width = (this.progress*100)+"%";
|
|
}
|
|
}
|
|
|
|
class buiButton {
|
|
constructor (name, myFunction) {
|
|
this.root = document.createElement("span");
|
|
this.lable = document.createElement("span");
|
|
this.root.setAttribute("class","bui_button_root"+("string" == typeof name ? " "+name+"_button" : ""));
|
|
this.lable.setAttribute("class","bui_button_lable");
|
|
this.lable.innerText = "string" == typeof name ? name : "";
|
|
this.root.appendChild(this.lable);
|
|
this.root.addEventListener("click", "function" == typeof myFunction ? myFunction : () => {});
|
|
}
|
|
}
|
|
|
|
function makeDraggable (targetNode, handleNode) {}
|
|
|
|
function makeResizeable (targetNode, handleNode) {}
|
|
|
|
|
|
class buiWindow {
|
|
constructor (title="", height=100, width=100, min=false, close=true, dragable=true, sizeable=true) {
|
|
this.root = document.createElement("div");
|
|
this.root.setAttribute("class","bui_window_root");
|
|
this.titlebar = document.createElement("div");
|
|
this.titlebar.setAttribute("class","bui_window_titlebar");
|
|
this.title = document.createElement("span");
|
|
this.title.setAttribute("class","bui_window_title");
|
|
this.title.innerText = "string" == title ? title : "";
|
|
this.titlebar.appendChild(this.title);
|
|
draggable = "boolean" == typeof draggable ? draggable : true;
|
|
if (draggable) {
|
|
makeDraggable(this.root, this.titlebar);
|
|
}
|
|
min = "boolean" == typeof min ? min : false;
|
|
close = "boolean" == typeof close ? close : false;
|
|
if (min || close) {
|
|
this.controls = document.createElement("span");
|
|
this.controls.setAttribute("class","bui_window_controls");
|
|
if (min) {
|
|
this.minimizeButton = new buiButton("_",this.minimize);
|
|
this.controls.appendChild(this.minimizeButton.root);
|
|
}
|
|
if (close) {
|
|
this.closeButton = new buiButton("X",this.close);
|
|
this.controls.appendChild(this.closeButton.root)
|
|
}
|
|
this.titlebar.appendChild(this.controls);
|
|
}
|
|
this.main = document.createElement("div");
|
|
this.main.setAttribute("class","bui_window_main");
|
|
this.content = document.createElement("div");
|
|
this.content.setAttribute("class","bui_window_content");
|
|
this.main.appendChild(this.content);
|
|
sizeable = "boolean" == typeof sizeable ? sizeable : true;
|
|
if (sizeable) {
|
|
this.resizeHandle = document.createElement("div");
|
|
this.resizeHandle.setAttribute("class","bui_window_resize_handle");
|
|
makeResizeable(this.content, this.resizeHandle);
|
|
this.main.appendChild(this.resizeHandle);
|
|
}
|
|
this.root.appendChild(this.titlebar);
|
|
this.root.appendChild(this.content);
|
|
}
|
|
|
|
function minimize () {
|
|
}
|
|
|
|
function close () {
|
|
}
|
|
}
|