126 lines
4 KiB
JavaScript
126 lines
4 KiB
JavaScript
/*Canopy - The next generation of stoner streaming software
|
|
Copyright (C) 2024 Rainbownapkin and the TTN Community
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as
|
|
published by the Free Software Foundation, either version 3 of the
|
|
License, or (at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with this program. If not, see <https://www.gnu.org/licenses/>.*/
|
|
|
|
class cPanel{
|
|
constructor(client){
|
|
//Client Object
|
|
this.client = client;
|
|
|
|
//Panel Objects
|
|
this.activePanel = null;
|
|
this.pinnedPanel = null;
|
|
this.poppedPanels = [];
|
|
|
|
//Element Nodes
|
|
//Active Panel
|
|
this.activePanelDiv = document.querySelector("#cpanel-active-div");
|
|
this.activePanelTitle = document.querySelector("#cpanel-active-title");
|
|
this.activePanelDoc = document.querySelector("#cpanel-active-doc");
|
|
this.activePanelPinIcon = document.querySelector("#cpanel-active-pin-icon");
|
|
this.activePanelCloseIcon = document.querySelector("#cpanel-active-close-icon");
|
|
//Pinned Panel
|
|
this.pinnedPanelDiv = document.querySelector("#cpanel-pinned-div");
|
|
this.pinnedPanelTitle = document.querySelector("#cpanel-pinned-title");
|
|
this.pinnedPanelDoc = document.querySelector("#cpanel-pinned-doc");
|
|
this.pinnedPanelCloseIcon = document.querySelector("#cpanel-pinned-close-icon");
|
|
|
|
this.setupInput();
|
|
}
|
|
|
|
setupInput(){
|
|
this.activePanelCloseIcon.addEventListener("click", this.hideActivePanel.bind(this));
|
|
this.activePanelPinIcon.addEventListener("click", this.pinActivePanel.bind(this));
|
|
this.pinnedPanelCloseIcon.addEventListener("click", this.hidePinnedPanel.bind(this));
|
|
}
|
|
|
|
async setActivePanel(panel){
|
|
//Set active panel
|
|
this.activePanel = panel;
|
|
|
|
//Grab panel hypertext content and load it into div
|
|
this.activePanelDoc.innerHTML = await this.activePanel.getPage();
|
|
|
|
//Display panel
|
|
this.activePanelDiv.style.display = "flex";
|
|
this.activePanelTitle.textContent = this.activePanel.name;
|
|
|
|
//Call panel initialization function
|
|
this.activePanel.panelInit();
|
|
}
|
|
|
|
hideActivePanel(){
|
|
this.activePanelDiv.style.display = "none";
|
|
this.activePanel = null;
|
|
}
|
|
|
|
pinActivePanel(){
|
|
//Yoink panel object
|
|
this.pinnedPanel = this.activePanel
|
|
|
|
//Yoink Content and Title
|
|
this.pinnedPanelTitle.textContent = this.pinnedPanel.name;
|
|
this.pinnedPanelDoc.innerHTML = this.activePanelDoc.innerHTML;
|
|
|
|
//Do a switchem
|
|
this.pinnedPanelDiv.style.display = "flex";
|
|
this.hideActivePanel();
|
|
|
|
//Re-Run panel init function
|
|
this.pinnedPanel.panelInit();
|
|
}
|
|
|
|
async setPinnedPanel(panel){
|
|
//Set pinned panel
|
|
this.pinnedPanel = panel;
|
|
|
|
//Set Title
|
|
this.pinnedPanelTitle.textContent = this.pinnedPanel.name;
|
|
|
|
//Grab panel hypertext content and load it into div
|
|
this.pinnedPanelDoc.innerHTML = await this.pinnedPanel.getPage();
|
|
|
|
//Display panel
|
|
this.pinnedPanelDiv.style.display = "flex";
|
|
|
|
//Call panel initialization function
|
|
this.pinnedPanel.panelInit();
|
|
}
|
|
|
|
hidePinnedPanel(){
|
|
this.pinnedPanelDiv.style.display = "none";
|
|
this.pinnedPanel = null;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
class panelObj{
|
|
constructor(name = "Placeholder Panel", pageURL = "/panel/placeholder"){
|
|
this.name = name;
|
|
this.pageURL = pageURL;
|
|
}
|
|
|
|
async getPage(){
|
|
var response = await fetch(this.pageURL,{
|
|
method: "GET",
|
|
});
|
|
|
|
return await response.text();
|
|
}
|
|
|
|
panelInit(){
|
|
}
|
|
} |