diff --git a/src/controllers/panel/placeholder.js b/src/controllers/panel/placeholder.js new file mode 100644 index 0000000..1455783 --- /dev/null +++ b/src/controllers/panel/placeholder.js @@ -0,0 +1,20 @@ +/*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 .*/ + +//root index functions +module.exports.get = async function(req, res){ + res.render('panels/placeholder', {}); +} \ No newline at end of file diff --git a/src/routers/panelRouter.js b/src/routers/panelRouter.js new file mode 100644 index 0000000..cd6add6 --- /dev/null +++ b/src/routers/panelRouter.js @@ -0,0 +1,30 @@ +/*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 .*/ + +//npm imports +const { Router } = require('express'); + + +//local imports +const placeholderController = require("../controllers/panel/placeholder"); + +//globals +const router = Router(); + +//routing functions +router.get('/placeholder', placeholderController.get); + +module.exports = router; diff --git a/src/server.js b/src/server.js index ce9f68f..cc3d9e8 100644 --- a/src/server.js +++ b/src/server.js @@ -32,6 +32,7 @@ const profileRouter = require('./routers/profileRouter'); const adminPanelRouter = require('./routers/adminPanelRouter'); const channelRouter = require('./routers/channelRouter'); const newChannelRouter = require('./routers/newChannelRouter'); +const panelRouter = require('./routers/panelRouter'); const apiRouter = require('./routers/apiRouter'); //Define Config @@ -88,6 +89,8 @@ app.use('/profile', profileRouter); app.use('/adminPanel', adminPanelRouter); app.use('/c', channelRouter); app.use('/newChannel', newChannelRouter); +//Panel +app.use('/panel', panelRouter); //Bot-Ready app.use('/api', apiRouter); diff --git a/src/views/channel.ejs b/src/views/channel.ejs index 131a025..e7dab2c 100644 --- a/src/views/channel.ejs +++ b/src/views/channel.ejs @@ -13,6 +13,7 @@ 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 .--> + @@ -66,7 +67,14 @@ along with this program. If not, see .-->
-
+
+
+

NULL PANEL

+ + +
+
+
@@ -96,6 +104,7 @@ along with this program. If not, see .--> + \ No newline at end of file diff --git a/src/views/panels/placeholder.ejs b/src/views/panels/placeholder.ejs new file mode 100644 index 0000000..7b8f493 --- /dev/null +++ b/src/views/panels/placeholder.ejs @@ -0,0 +1,16 @@ + +

This is a test panel!

\ No newline at end of file diff --git a/www/css/channel.css b/www/css/channel.css index 77062b2..865680d 100644 --- a/www/css/channel.css +++ b/www/css/channel.css @@ -77,6 +77,7 @@ div#chat-panel-div{ div#chat-panel-main-div{ display: flex; + position: relative; flex: 1; height: 1%; } @@ -88,6 +89,7 @@ div#chat-panel-main-div{ bottom: 0; left: 0; width: 0.4em; + z-index: 8; } #chat-panel-multipanel-div{ @@ -210,4 +212,37 @@ input#chat-panel-prompt{ #chat-panel-show-video-icon{ display: none; +} + +#cpanel-active-div{ + display: none; + position: absolute; + flex-direction: column; + overflow: hidden; + z-index: 3; + top: 0; + bottom: 0; + left: 0; + width: 30%; +} + +#cpanel-active-header-div{ + display: flex; + margin: 0 auto; + width: 96%; + height: 1.2em; +} + +#cpanel-active-title{ + margin: 0; + white-space: nowrap; + overflow: hidden; +} + +#cpanel-active-title-spacer{ + flex: 1; +} + +#cpanel-active-close-icon{ + cursor: pointer; } \ No newline at end of file diff --git a/www/css/theme/movie-night.css b/www/css/theme/movie-night.css index 3edd805..5cc335b 100644 --- a/www/css/theme/movie-night.css +++ b/www/css/theme/movie-night.css @@ -242,4 +242,13 @@ div#chat-panel-control-div{ select.panel-head-element{ height: 1.2em; margin: auto; +} + +#cpanel-active-div{ + background-color: var(--bg0); +} + + +#cpanel-active-header-div{ + border-bottom: solid 1px var(--accent0); } \ No newline at end of file diff --git a/www/js/channel/channel.js b/www/js/channel/channel.js index d87f653..2e1979e 100644 --- a/www/js/channel/channel.js +++ b/www/js/channel/channel.js @@ -30,6 +30,8 @@ class channel{ this.chatBox = new chatBox(this); //Create the User List Object this.userList = new userList(this); + //Create the Canopy Panel Object + this.cPanel = new cPanel(this); } connect(){ diff --git a/www/js/channel/cpanel.js b/www/js/channel/cpanel.js new file mode 100644 index 0000000..4935498 --- /dev/null +++ b/www/js/channel/cpanel.js @@ -0,0 +1,59 @@ +/*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 .*/ + +class cPanel{ + constructor(client){ + //Client Object + this.client = client; + + //Element Nodes + this.activePanel = document.querySelector("#cpanel-active-div"); + this.activePanelTitle = document.querySelector("#cpanel-active-title"); + this.activePanelDoc = document.querySelector("#cpanel-active-doc"); + this.activePanelCloseIcon = document.querySelector("#cpanel-active-close-icon"); + + this.setupInput(); + } + + setupInput(){ + this.activePanelCloseIcon.addEventListener("click", this.hidePanel.bind(this)); + } + + async setPanel(panel){ + this.activePanel.style.display = "flex"; + this.activePanelTitle.textContent = panel.name; + this.activePanelDoc.innerHTML = await panel.getPage(); + } + + hidePanel(){ + this.activePanel.style.display = "none"; + } +} + +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(); + } +} \ No newline at end of file