Skip to content

Commit 1dbe706

Browse files
novafurrynovafurry
committed
large dog fart
1 parent 7788325 commit 1dbe706

File tree

5 files changed

+311
-6
lines changed

5 files changed

+311
-6
lines changed

‎NovaOS Desktop NG (powered by webdesk).code-workspace

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"folders": [
3+
{
4+
"path": "."
5+
}
6+
],
7+
"settings": {}
8+
}

‎assets/code/core.js

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,9 @@ var wd = {
8585
ui.dest(tk.g('setuparea'));
8686
function startmenu() {
8787
if (el.sm == undefined) {
88+
if (document.querySelector(".contcent")) {
89+
$(".contcent").fadeOut(150, function () { });
90+
}
8891
el.sm = tk.c('div', document.body, 'tbmenu');
8992
const btm = el.taskbar.getBoundingClientRect();
9093
el.sm.style.bottom = btm.height + btm.x + 4 + "px";
@@ -112,9 +115,13 @@ var wd = {
112115
el.taskbar = tk.c('div', document.body, 'taskbar');
113116
const lefttb = tk.c('div', el.taskbar, 'tnav');
114117
const titletb = tk.c('div', el.taskbar, 'title');
115-
const start = tk.cb('b1', 'Apps', () => startmenu(), lefttb);
118+
const start = tk.cb('b1 start', '', () => startmenu(), el.taskbar);
119+
const smtxt = tk.c("span", start, "smtxt");
120+
smtxt.innerText = "Apps";
121+
const smico = tk.c("span", start, "smico");
122+
smico.innerText = "🏠";
116123
el.tr = tk.c('div', lefttb);
117-
tk.cb('b1 time', '--:--', () => wm.notif(`In progress`, `Control Center`), titletb);
124+
tk.cb('b1 time', '--:--', () => wd.controls.toggle(), titletb);
118125
}
119126
if (waitopt === "wait") {
120127
setTimeout(function () { desktopgo(); }, 400);
@@ -169,6 +176,22 @@ var wd = {
169176
ui.cv('ui3', 'rgba(var(--accent) 0.2)');
170177
ui.cv('font', '#fff');
171178
fs.write('/user/info/lightdark', 'clear2');
179+
},
180+
controls: {
181+
toggle: function () {
182+
// document.querySelector(".taskbar > .tnav > .b1").onclick = startmenu
183+
var cc = document.querySelector("#contcent")
184+
// if(cc.computedStyleMap().get("display").value === "none" || cc.style.display === "none"){
185+
if (cc.style.display === "none") {
186+
cc.style.display = "block";
187+
if (document.querySelector(".tbmenu")) {
188+
ui.dest(document.querySelector(".tbmenu"), 150);
189+
}
190+
}
191+
else {
192+
cc.style.display = "none";
193+
}
194+
}
172195
}
173196
}
174197

‎assets/code/ui.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,15 @@ var ui = {
5050
$(dr1).fadeIn(210);
5151
}
5252
}
53+
console.log(dr1)
54+
if(dr1.classList.contains("winf") && dr1.classList.contains("window")){
55+
dr1.classList.remove("winf");
56+
} else {
57+
document.querySelectorAll(".winf").forEach(function (item) {
58+
item.classList.remove("winf");
59+
})
60+
dr1.classList.add("winf");
61+
}
5362
},
5463
showfi: function (dr1, anim) {
5564
if (dr1) {
@@ -220,6 +229,7 @@ var tk = {
220229
mbw: function (title, wid, hei, full, min, quit, id) {
221230
var windowDiv = document.createElement('div');
222231
windowDiv.classList.add('window');
232+
windowDiv.classList.add('winf');
223233
windowDiv.style.width = wid;
224234
windowDiv.style.height = hei;
225235
if(id){

‎assets/style.css

Lines changed: 243 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,8 @@
1919
--inv: 0;
2020
}
2121
*{
22-
/* transition: all cubic-bezier(0.075, 0.82, 0.165, 1) 0.05s; */
22+
user-select: none;
23+
transition: all cubic-bezier(0.075, 0.82, 0.165, 1) 0.5s;
2324
}
2425
#background {
2526
position: fixed;
@@ -148,7 +149,43 @@ p {
148149
}
149150
}
150151
}
151-
152+
@media (max-width: 800px){
153+
#contcent{
154+
position: absolute;
155+
top:48px;
156+
right:5px !important;
157+
left:5px !important;
158+
left:unset !important;
159+
width: calc(100vw - 30px);
160+
height: calc(100vh - 122px);
161+
max-height: unset !important;
162+
max-width: unset !important;
163+
}
164+
#cccb{
165+
left:10px;
166+
width: calc(100% - 20px) !important;
167+
position: fixed;
168+
bottom: 10px !important;
169+
}
170+
}
171+
#contcent{
172+
position: fixed;
173+
border-radius: var(--rad1);
174+
border: 1px solid var(--ui2);
175+
background-color: var(--ui1);
176+
box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 75px 15px;
177+
backdrop-filter: blur(var(--bl2));
178+
-webkit-backdrop-filter: blur(var(--bl2));
179+
padding: 10px;
180+
max-width: 80%;
181+
max-width: 360px;
182+
max-height: 80%;
183+
z-index: 4;
184+
right: 5px;
185+
bottom: 57px;
186+
z-index: 9002451;
187+
animation: tb2 0.28s;
188+
}
152189
.setupbox {
153190
position: fixed;
154191
transform: translate(-50%, -50%) scale(1.0);
@@ -643,11 +680,10 @@ p {
643680
max-width: 80%;
644681
max-width: 360px;
645682
max-height: 80%;
646-
left: 5px;
647683
z-index: 4;
648684
animation: tb2 0.28s;
685+
left: 5px;
649686
}
650-
651687
@keyframes tb2 {
652688
0% {bottom: 90px; opacity: 0%;}
653689
100% {opacity: 100%;}
@@ -707,4 +743,207 @@ p {
707743
}
708744
.tbmenu{
709745
z-index: 9002451;
746+
}
747+
/* {
748+
width: 20px;
749+
height: 20px;
750+
border-radius: 10px;
751+
padding:5px;
752+
border: 1px solid var(--ui3);
753+
background-color: rgba(var(--acc), 0.3);
754+
cursor: pointer;
755+
transition: 0.05s;
756+
} */
757+
select {
758+
background-color: rgba(var(--acc), 0.3);
759+
border-radius: var(--rad2);
760+
font-size: var(--fz1);
761+
padding: 6px 8px;
762+
margin: 1px;
763+
transition: 0.08s ease-in-out;
764+
cursor: pointer;
765+
border: 1px solid transparent;
766+
width: max-content;
767+
min-width: fit-content;
768+
display: inline-block;
769+
}
770+
771+
select:hover {
772+
background-color: rgba(var(--acc), 0.4);
773+
border: 1px solid rgba(var(--acc), 0.6);
774+
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 20px 4px;
775+
}
776+
777+
select:active {
778+
/* transform: scale(0.88); */
779+
/* padding: 4px 6px; */
780+
background-color: rgba(var(--acc), 0.20);
781+
}
782+
783+
784+
785+
.ckbx {
786+
background-color: rgba(var(--acc), 0.3);
787+
border-radius: var(--rad2);
788+
font-size: var(--fz1);
789+
padding: 5px 8px;
790+
margin: 1px;
791+
transition: 0.08s ease-in-out;
792+
cursor: pointer;
793+
border: 1px solid transparent;
794+
width: max-content;
795+
min-width: fit-content;
796+
display: inline-block;
797+
}
798+
799+
.ckbx:hover {
800+
background-color: rgba(var(--acc), 0.4);
801+
border: 1px solid rgba(var(--acc), 0.6);
802+
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 20px 4px;
803+
}
804+
805+
.ckbx:active {
806+
transform: scale(0.88);
807+
background-color: rgba(var(--acc), 0.20);
808+
}
809+
810+
/* .ckbx input:after {
811+
content:attr(name);
812+
height: min-content;
813+
padding-left: 15px;
814+
margin-top: -2px;
815+
display: block;
816+
min-width: min-content;
817+
width: max-content;
818+
} */
819+
.topbar {
820+
position: absolute;
821+
display: flex;
822+
align-items: center;
823+
justify-content: flex-start;
824+
left: 0px;
825+
top: -100px;
826+
right: 0px;
827+
padding: 0px;
828+
border-bottom: 1px solid var(--ui2);
829+
background-color: var(--ui1);
830+
box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 75px 15px;
831+
animation: tb 1.0s cubic-bezier(0.25, 1, 0.5, 1) forwards;
832+
backdrop-filter: blur(var(--bl2));
833+
-webkit-backdrop-filter: blur(var(--bl2));
834+
z-index: 303369;
835+
overflow-x: auto;
836+
white-space: nowrap;
837+
bottom: unset !important;
838+
839+
}
840+
.topbar *{
841+
margin: 0px;
842+
padding: 4px;
843+
}
844+
.topbar .b1{
845+
background-color: transparent;
846+
}
847+
@media (max-width:800px){
848+
.topbar{
849+
display: flex;
850+
top: 0px;
851+
height: 4vh;
852+
}
853+
.taskbar{
854+
left:0px;
855+
bottom: 0px !important;
856+
right: 0px;
857+
border:none;
858+
border-top: 1px solid var(--ui2);
859+
border-radius: 0px;
860+
height: 6vh;
861+
}
862+
.tbmenu{
863+
width: 100vw !important;
864+
height: calc(76vh - 3px) !important;
865+
max-height: calc(76vh - 3px) !important;
866+
max-width: unset !important;
867+
position: absolute !important;
868+
left:0px !important;
869+
top:4vh !important;
870+
border-radius: 0px !important;
871+
overflow:visible !important;
872+
z-index: 303367 !important;
873+
}
874+
.window{
875+
width: 100vw !important;
876+
height: calc(76vh - 3px) !important;
877+
max-height: calc(76vh - 3px) !important;
878+
max-width: unset !important;
879+
position: absolute !important;
880+
left:0px !important;
881+
top:4vh !important;
882+
border-radius: 0px !important;
883+
overflow:visible !important;
884+
}
885+
.window .content{
886+
padding:2px;
887+
}
888+
.window .tnav{
889+
/* display: none; */
890+
}
891+
.window .title{
892+
/* position: absolute;
893+
top:0;
894+
left:0; */
895+
}
896+
.window .tb{
897+
border-radius: 0px !important;
898+
}
899+
.window:not(.winf){
900+
z-index: -100 !important;
901+
}
902+
#contcent{
903+
width: 100vw !important;
904+
height: calc(76vh - 3px) !important;
905+
max-height: calc(76vh - 3px) !important;
906+
max-width: 100vw !important;
907+
position: absolute !important;
908+
left:0px !important;
909+
top:4vh !important;
910+
border-radius: 0px !important;
911+
overflow:visible !important;
912+
z-index: 303367 !important;
913+
padding:2px;
914+
}
915+
#cccb{
916+
margin:0px !important;
917+
left:2px;
918+
width:calc(100% - 10px) !important;
919+
}
920+
.taskbar .time{
921+
display: none;
922+
}
923+
.smtxt{
924+
display: none;
925+
}
926+
.smico{
927+
display: block !important;
928+
}
929+
.taskbar .tnav{
930+
margin-left: 40px !important;
931+
overflow: scroll;
932+
border-radius: var(--rad2);
933+
}
934+
}
935+
.winf{
936+
z-index: 303365 !important;
937+
}
938+
.start{
939+
position: absolute;
940+
left:5px;
941+
}
942+
.taskbar .tnav{
943+
margin-left: 60px;
944+
overflow: scroll;
945+
border-radius: var(--rad2);
946+
}
947+
.smico{
948+
display: none;
710949
}

‎desktop.html

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,11 +38,36 @@
3838
</script>
3939

4040
<body>
41+
<div class="topbar"><div class="title"><button class="b1 time" onclick="wd.controls.toggle()">14:07:10</button></div></div>
4142
<div id="background"></div>
4243
<!-- <div class="circle"></div>
4344
<div class="circle2"></div> -->
4445
<div id="setuparea">
4546
</div>
47+
<div style="display: none;" id="contcent" class="contcent">
48+
<p class="h3">Control Center</p>
49+
<p class="lockdown">Your DeskID is <span class="mcode bold">----</span></p>
50+
<span class="ckbx" onclick="console.log(this.childNodes[1].checked = this.childNodes[1].checked == true ? false : true)">
51+
<input type="checkbox" name="Do Not Disturb" class="b1">
52+
Do not disturb
53+
</span>
54+
<span class="ckbx" onclick="console.log(this.childNodes[1].checked = this.childNodes[1].checked == true ? false : true)">
55+
<input type="checkbox" name="Do Not Disturb" class="b1">
56+
Network Services
57+
</span>
58+
<select name="" id="" default="a">
59+
<option value="a" selected>Display mode</option>
60+
<option value="">Display mode</option>
61+
<option value="">Display mode</option>
62+
<option value="">Display mode</option>
63+
<option value="">Display mode</option>
64+
</select>
65+
<p class="med" style="margin-top: 3px; margin-bottom: 3px">Notifications (select to delete)</p>
66+
<div id="notifold">
67+
<div class="notif2" id="defnotif">No notifications yet.</div>
68+
</div>
69+
<button id="cccb" class="b1" style="margin-top: 7px; width: 60%;" onclick="wd.controls.toggle()">Close</button>
70+
</div>
4671
<div id="notif"></div>
4772
<div class="splashscreen">
4873
<div class="splashscreen-content">

0 commit comments

Comments
 (0)