aboutsummaryrefslogtreecommitdiff
path: root/html
diff options
context:
space:
mode:
Diffstat (limited to 'html')
-rw-r--r--html/display.html809
-rw-r--r--html/tty.html82
2 files changed, 891 insertions, 0 deletions
diff --git a/html/display.html b/html/display.html
new file mode 100644
index 0000000..09ea35a
--- /dev/null
+++ b/html/display.html
@@ -0,0 +1,809 @@
+<html>
+
+<head>
+ <!--<script src="https://raw.githubusercontent.com/a-weeb-programmer/libcute/main/src/libcute.h"></script> lol-->
+ <link rel="preconnect" href="https://fonts.googleapis.com">
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+ <script rel="preconnect" src="./src/jssh.js" crossorigin></script>
+ <link href="https://fonts.googleapis.com/css2?family=Flow+Circular&display=swap" rel="stylesheet">
+ <style>
+ @font-face {
+ font-family: f98;
+ src: url(src/98.ttf);
+ }
+
+ * {
+ margin: 0;
+ font-family: f98;
+
+ scrollbar-width: none;
+ }
+
+ .window {
+ width: 56%;
+ max-width: inherit;
+ height: 30%;
+ max-height: inherit;
+ background-color: #c3c3c3;
+ position: absolute;
+ }
+
+ .head-border {
+ width: calc(100%);
+ background: linear-gradient(90deg, rgba(1, 0, 129, 1) 0%, rgba(0, 128, 128, 1) 100%);
+ height: 25px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ cursor: grab;
+ }
+
+ .close-button {
+ width: calc(25px - 7px);
+ background-color: #c3c3c3;
+ height: calc(100% - 7px);
+ position: absolute;
+ top: 3.5px;
+ right: 3.5px;
+ cursor: initial;
+
+ }
+
+ #root {
+ position: relative;
+ background-color: cornsilk;
+ width: 90%;
+ height: 90%;
+ margin-left: 5%;
+ margin-top: 2.5%;
+ margin-bottom: 2.5%;
+ overflow: hidden;
+
+ }
+
+ .resize-n {
+ position: absolute;
+ top: -1px;
+ width: 100%;
+ height: 7px;
+ background-color: rgba(0, 0, 0, 0);
+ cursor: ns-resize;
+ }
+
+ .resize-s {
+ position: absolute;
+ bottom: -1px;
+ width: 100%;
+ height: 7px;
+ background-color: rgba(0, 0, 0, 0);
+ cursor: ns-resize;
+ }
+
+ .resize-e {
+ position: absolute;
+ right: -3px;
+ width: 7px;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0);
+ cursor: ew-resize;
+ }
+
+ .resize-w {
+ position: absolute;
+ left: -3px;
+ width: 7px;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0);
+ cursor: ew-resize;
+
+ }
+
+ .resize-ne {
+ position: absolute;
+ right: -3px;
+ top: -3px;
+ width: 15px;
+ height: 15px;
+ background-color: rgba(255, 0, 0, 0);
+ cursor: ne-resize;
+
+ }
+
+ .resize-es {
+ position: absolute;
+ right: -3px;
+ bottom: -3px;
+ width: 15px;
+ height: 15px;
+ background-color: rgba(255, 0, 0, 0);
+ cursor: se-resize;
+
+ }
+
+ .resize-sw {
+ position: absolute;
+ left: -3px;
+ bottom: -3px;
+ width: 15px;
+ height: 15px;
+ background-color: rgba(255, 0, 0, 0);
+ cursor: sw-resize;
+
+ }
+
+ .resize-nw {
+ position: absolute;
+ left: -3px;
+ top: -3px;
+ width: 15px;
+ height: 15px;
+ background-color: rgba(255, 0, 0, 0);
+ cursor: nw-resize;
+
+ }
+
+
+ ::-webkit-scrollbar {
+ display: none;
+ }
+
+ .scrollbar {
+ width: 10px;
+ height: calc(100% - 25px);
+ background-color: #aaaaaa;
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ }
+
+ .scrollbar-point {
+ width: 100%;
+ background-color: #999999;
+ position: absolute;
+ top: 0;
+ outline: 2px outset;
+ outline-offset: -2px;
+ cursor: grab;
+ }
+
+ #bar {
+ width: 100%;
+ height: 30px;
+ background-color: #c3c3c3;
+ position: absolute;
+ bottom: 0;
+ display: inline-block;
+ left: 0;
+ }
+
+ .bar-item {
+ height: 80%;
+ background-color: #c3c3c3;
+ width: fit-content;
+ padding-left: 20px;
+ padding-right: 20px;
+ border-style: outset;
+ cursor: grab;
+ user-select: none;
+ display: block;
+ position: absolute;
+ top: 0;
+ }
+
+ #bar-items {
+ height: 100%;
+ width: 100%;
+ position: relative;
+ display: block;
+ }
+
+ #bar-children {
+ position: relative;
+ width: 100%;
+ height: 100%;
+ display: flex;
+
+ }
+
+ #bar-menu {
+ display: flex;
+ position: relative;
+ height: calc(100% - 5px);
+ font-size: large;
+ padding: 3px;
+ user-select: none;
+ padding-left: 10px;
+ padding-right: 10px;
+ outline: 2px outset;
+ outline-offset: -2px;
+ cursor: pointer;
+
+
+ }
+
+ #bar-menu-root {
+ padding-top: 2px;
+ height: 280px;
+ width: 180px;
+ background-color: #c7c7c7;
+ position: absolute;
+ border-style: outset;
+ bottom: 30px;
+ display: none;
+ }
+
+ .bar-menu-item {
+ padding-left: 5px;
+ width: 100%;
+ height: 25px;
+ display: flex;
+ font-size: 14px;
+ font-weight: bold;
+ padding-top: 1px;
+ user-select: none;
+ }
+
+ .bar-menu-image {
+ height: 18px;
+ padding-left: 5px;
+ padding-right: 5px;
+ }
+
+ .bar-menu-text {
+ position: absolute;
+ left: 35px;
+ padding-top: 2px;
+ }
+
+ .bar-menu-separator {
+ width: calc(100% - 20px);
+ height: 3px;
+ margin-bottom: 5px;
+ background-color: #a1a1a1;
+ border-style: none none solid none;
+ border-color: #dddddd;
+ border-width: 2px;
+ left: 10px;
+ position: relative;
+ }
+
+ .bar-menu-more {
+ width: 0;
+ height: 0;
+ border-top: 5px solid transparent;
+ border-left: 7px solid #000000;
+ border-bottom: 5px solid transparent;
+ position: absolute;
+ right: 5px;
+ margin-top: 6px;
+
+ }
+
+ .bar-menu-more-root {
+ display: none;
+ width: 120px;
+ height: fit-content;
+ border-style: outset outset outset none;
+ right: -123px;
+ position: absolute;
+ padding-top: 3px;
+ background-color: #c7c7c7;
+
+ }
+ </style>
+ <script>
+ function compare(a, b) {
+ if (a.left < b.left) {
+ return -1;
+ }
+ if (a.left > b.left) {
+ return 1;
+ }
+ return 1;
+ }
+ let bar_items_left = []
+ function load_bar() {
+ let bar = document.getElementById("bar-items")
+ let windows = document.getElementsByClassName("window")
+ let put = ""
+ let last_left = 0;
+ let temp = []
+ bar.innerHTML = ""
+ for (let i = 0; i != windows.length; i++) {
+ bar.innerHTML += "<div style='left:" + last_left + ";' id='" + windows.item(i).id + "' class='bar-item'>" + windows.item(i).getAttribute("window-name") + "</div>"
+ temp.push({ left: last_left, id: windows.item(i).id, width: bar.children.item(bar.children.length - 1).clientWidth + 5 })
+ last_left += bar.children.item(bar.children.length - 1).clientWidth + 5
+
+
+ }
+ bar_items_left = temp;
+ //bar.innerHTML = put;
+ for (let i = 0; i != bar.children.length; i++) {
+ let elemy = bar.children.item(i)
+ for (let ii = 0; ii != windows.length; ii++) {
+ if (windows.item(ii).id == elemy.id) {
+ //let px = 0, py = 0;
+ elemy.onmousedown = ((ev) => {
+ for (let iii = 0; iii != windows.length; iii++) {
+ windows.item(iii).style.zIndex = 0;
+ bar.children.item(iii).style.zIndex = 0;
+ }
+ document.body.style.cursor = "grabbing"
+ windows.item(ii).style.zIndex = 1
+ bar.children.item(ii).style.zIndex = 1;
+ document.onmouseup = ((ev) => {
+ document.onmousemove = null
+ document.body.style.cursor = ''
+ temp = [];
+ for (let iii = 0; iii != bar.children.length; iii++) {
+ temp.push({ left: bar.children.item(iii).offsetLeft, id: bar.children.item(iii).id, width: bar.children.item(iii).clientWidth + 5 })
+ }
+ temp = temp.sort(compare)
+ bar_items_left = []
+ let len = 0
+ for (let item in temp) {
+ for (let iii = 0; iii != bar.children.length; iii++) {
+ if (bar.children.item(iii).id == temp[item].id) {
+ bar.children.item(iii).style.left = len
+ bar_items_left.push({ left: len, id: bar.children.item(iii).id, width: bar.children.item(iii).clientWidth + 5 })
+ len += temp[item].width
+
+ }
+ }
+
+ }
+
+ })
+ let px = 0;
+ document.onmousemove = ((evm) => {
+ if ((elemy.parentElement.clientWidth * (evm.clientX / elemy.parentElement.clientWidth) - (elemy.parentElement.offsetLeft + document.getElementById("root").offsetLeft + (elemy.clientWidth / 2))) > 0) {
+ if ((elemy.parentElement.clientWidth * (evm.clientX / elemy.parentElement.clientWidth) - (elemy.parentElement.offsetLeft + document.getElementById("root").offsetLeft - (elemy.clientWidth / 2))) < elemy.parentElement.clientWidth - 5) {
+ elemy.style.left = (elemy.parentElement.clientWidth * (evm.clientX / elemy.parentElement.clientWidth) - (elemy.parentElement.offsetLeft + document.getElementById("root").offsetLeft + (elemy.clientWidth / 2)))
+ } else {
+ elemy.style.left = elemy.parentElement.clientWidth - elemy.clientWidth - 5
+ }
+ } else {
+ elemy.style.left = 0;
+ }
+ //console.log((px - evm.clientX), px, evm.clientX, m)
+
+ })
+ })
+ }
+ }
+ }
+ }
+ function window_create(uid, name, content, options = {}) {
+ let lines = content.split("</br>").length
+ let a = ''
+ let minx = 150;
+ let miny = 150;
+ let size = (options.size != undefined) ? ("width:" + options.size.width + "px;height:" + options.size.height + "px;") : ("width:" + Math.max(document.body.clientWidth * .56, minx) + "px;height:" + Math.max(miny, document.body.clientHeight * .30) + "px;");
+
+ a += "<div id='" + uid + "-root' class='window' style=\"" + size + "top:0px;left:0px;position:absolute;\" window-name='" + name + "'>"
+ //console.log(document.getElementById(uid).attributes["window-name"].value)
+ a += "<div id='" + uid + "-head' class='head-border' window-name='" + name + "'> <div style='color:fdffff'>" + name + "</div>"
+ a += "<div id='" + uid + "-close' class='close-button' window-name='" + name + "'>" + `<svg draggable="false" xmlns="http://www.w3.org/2000/svg" style="position:absolute;left:-3px;top:0px;" xmlns:xlink="http://www.w3.org/1999/xlink" width="23px" height="20px" viewBox="0 0 23 20" version="1.1">
+<g id="surface1">
+<path style=" stroke:none;fill-rule:evenodd;fill:rgb(2.745098%,3.137255%,2.745098%);fill-opacity:1;" d="M 8.476562 6.042969 C 9.042969 6.042969 9.613281 6.042969 10.179688 6.042969 C 10.179688 6.332031 10.179688 6.625 10.179688 6.914062 C 10.464844 6.914062 10.746094 6.914062 11.03125 6.914062 C 11.03125 7.203125 11.03125 7.492188 11.03125 7.78125 C 11.597656 7.78125 12.167969 7.78125 12.734375 7.78125 C 12.734375 7.492188 12.734375 7.203125 12.734375 6.914062 C 13.019531 6.914062 13.304688 6.914062 13.585938 6.914062 C 13.585938 6.625 13.585938 6.332031 13.585938 6.042969 C 14.15625 6.042969 14.722656 6.042969 15.289062 6.042969 C 15.289062 6.332031 15.289062 6.625 15.289062 6.914062 C 15.007812 6.914062 14.722656 6.914062 14.4375 6.914062 C 14.4375 7.203125 14.4375 7.492188 14.4375 7.78125 C 14.15625 7.78125 13.871094 7.78125 13.585938 7.78125 C 13.585938 8.074219 13.585938 8.363281 13.585938 8.652344 C 13.304688 8.652344 13.019531 8.652344 12.734375 8.652344 C 12.734375 8.941406 12.734375 9.230469 12.734375 9.523438 C 13.019531 9.523438 13.304688 9.523438 13.585938 9.523438 C 13.585938 9.8125 13.585938 10.101562 13.585938 10.390625 C 13.871094 10.390625 14.15625 10.390625 14.4375 10.390625 C 14.4375 10.679688 14.4375 10.972656 14.4375 11.261719 C 14.722656 11.261719 15.007812 11.261719 15.289062 11.261719 C 15.289062 11.550781 15.289062 11.839844 15.289062 12.128906 C 14.722656 12.128906 14.15625 12.128906 13.585938 12.128906 C 13.585938 11.839844 13.585938 11.550781 13.585938 11.261719 C 13.304688 11.261719 13.019531 11.261719 12.734375 11.261719 C 12.734375 10.972656 12.734375 10.679688 12.734375 10.390625 C 12.167969 10.390625 11.597656 10.390625 11.03125 10.390625 C 11.03125 10.679688 11.03125 10.972656 11.03125 11.261719 C 10.746094 11.261719 10.464844 11.261719 10.179688 11.261719 C 10.179688 11.550781 10.179688 11.839844 10.179688 12.128906 C 9.613281 12.128906 9.042969 12.128906 8.476562 12.128906 C 8.476562 11.839844 8.476562 11.550781 8.476562 11.261719 C 8.761719 11.261719 9.042969 11.261719 9.328125 11.261719 C 9.328125 10.972656 9.328125 10.679688 9.328125 10.390625 C 9.613281 10.390625 9.894531 10.390625 10.179688 10.390625 C 10.179688 10.101562 10.179688 9.8125 10.179688 9.523438 C 10.464844 9.523438 10.746094 9.523438 11.03125 9.523438 C 11.03125 9.230469 11.03125 8.941406 11.03125 8.652344 C 10.746094 8.652344 10.464844 8.652344 10.179688 8.652344 C 10.179688 8.363281 10.179688 8.074219 10.179688 7.78125 C 9.894531 7.78125 9.613281 7.78125 9.328125 7.78125 C 9.328125 7.492188 9.328125 7.203125 9.328125 6.914062 C 9.042969 6.914062 8.761719 6.914062 8.476562 6.914062 C 8.476562 6.625 8.476562 6.332031 8.476562 6.042969 Z M 8.476562 6.042969 "/>
+</g>
+</svg></div></div>`
+ a += "<div id='" + uid + "-resize-n' class='resize-n'></div>"
+ a += "<div id='" + uid + "-resize-s' class='resize-s'></div>"
+ a += "<div id='" + uid + "-resize-e' class='resize-e'></div>"
+ a += "<div id='" + uid + "-resize-w' class='resize-w'></div>"
+ a += "<div style='height:25px;'></div>"
+ a += "<div id='" + uid + "-content-root' class='content-root' style='overflow:scroll;height:calc(100% - 26px);width:100%'>"
+ a += "<div id='" + uid + "-content-content' class='content-content'>" + content + "</div>"
+ a += "<div id='" + uid + "-content-scrollbar' class='scrollbar'><div id='" + uid + "-content-scrollbar-point' class='scrollbar-point'></div>"
+ a += "</div>"
+ a += "</div>"
+
+ a += "<div id='" + uid + "-resize-ne' class='resize-ne'></div>"
+ a += "<div id='" + uid + "-resize-nw' class='resize-nw'></div>"
+ a += "<div id='" + uid + "-resize-sw' class='resize-sw'></div>"
+ a += "<div id='" + uid + "-resize-es' class='resize-es'></div>"
+ document.getElementById("root").innerHTML += a
+ //console.log(document.getElementById(uid + "-content-root").clientHeight / (document.getElementById(uid + "-content-content").clientHeight / document.getElementById(uid + "-content-root").clientHeight))
+ document.getElementById(uid + "-content-scrollbar-point").style.height = (document.getElementById(uid + "-content-root").clientHeight / (document.getElementById(uid + "-content-content").clientHeight / document.getElementById(uid + "-content-root").clientHeight)) + "px"
+ if (document.getElementById(uid + "-content-scrollbar-point").clientHeight > document.getElementById(uid + "-content-root").clientHeight)
+ document.getElementById(uid + "-content-scrollbar").style.display = 'none'
+ //console.log(document.getElementById(uid + "-content-scrollbar-point"))
+ let elems = document.getElementsByClassName("window")
+ for (let i = 0; i != elems.length; i++) {
+ //let elem = elems.item(i).children[0]
+ let elec = elems.item(i).children
+ let elem
+ //console.log(elec)
+ for (let ii = 0; ii != elec.length; ii++) {
+ if (elec.item(ii).className == 'head-border') {
+ elem = elec.item(ii)
+ for (let iii = 0; iii != elem.children.length; iii++) {
+ if (elem.children.item(iii).className == "close-button") {
+ //console.log(elem.children.item(iii))
+ let ii = elems.item(i)
+ elem.children.item(iii).onmousedown = ((ev) => {
+ //console.log(elems.item(i))
+ ii.remove()
+ load_bar()
+ })
+ break
+ }
+ }
+ break
+ }
+ }
+ let elep = elems.item(i)
+ let px = 0, py = 0;
+
+ if (elem.className == 'head-border') {
+ elemhb = elem
+ elem.onmousedown = ((ev) => {
+
+ for (let i = 0; i != elems.length; i++) {
+ elems.item(i).style.zIndex = 0;
+ }
+ elep.style.zIndex = 1
+ document.body.style.cursor = 'grabbing'
+ elemhb.style.cursor = 'grabbing'
+ px = ev.clientX
+ py = ev.clientY
+ document.body.style.userSelect = "none"
+ document.onmouseup = ((evu) => {
+ document.body.style.userSelect = "unset"
+ document.onmousemove = null
+ document.onmouseup = null
+ document.body.style.cursor = ''
+ elemhb.style.cursor = 'grab'
+ })
+ document.onmousemove = ((evm) => {
+ //console.log(elem.id)
+ elep.style.left = (elep.offsetLeft - (px - evm.clientX)) + "px"
+ elep.style.top = (elep.offsetTop - (py - evm.clientY)) + "px"
+ px = (evm.clientX)
+ py = (evm.clientY)
+ })
+ })
+ }
+
+
+ ['resize-s', 'resize-n', 'resize-e', 'resize-w', 'resize-ne', 'resize-nw', 'resize-sw', 'resize-es'].forEach((sel) => {
+ for (let ii = 0; ii != elec.length; ii++) {
+ if (elec.item(ii).className == sel) {
+ elem = elec.item(ii)
+ break
+ }
+ }
+ if (elem.className == sel) {
+ elem.onmousedown = ((ev) => {
+ px = ev.clientX
+ py = ev.clientY
+ if (sel == 'resize-s' || sel == 'resize-n')
+ document.body.style.cursor = 'ns-resize'
+ else if (sel == 'resize-e' || sel == 'resize-w')
+ document.body.style.cursor = 'ew-resize'
+ else if (sel == 'resize-ne')
+ document.body.style.cursor = 'ne-resize'
+ else if (sel == 'resize-nw')
+ document.body.style.cursor = 'nw-resize'
+ else if (sel == 'resize-sw')
+ document.body.style.cursor = 'sw-resize'
+ else if (sel == 'resize-es')
+ document.body.style.cursor = 'se-resize'
+ document.body.style.userSelect = "none"
+ document.onmouseup = ((evu) => {
+ document.body.style.userSelect = "unset"
+ document.onmousemove = null
+ document.onmouseup = null
+ document.body.style.cursor = ''
+
+ })
+ document.onmousemove = ((evm) => {
+ if (sel == 'resize-s' || sel == 'resize-es' || sel == 'resize-sw')
+ if ((parseInt(elep.style.height.replace("px", "")) + (evm.clientY - py)) > miny) {
+ elep.style.height = (parseInt(elep.style.height.replace("px", "")) + (evm.clientY - py)) + "px"
+ } if (sel == 'resize-n' || sel == 'resize-nw' || sel == 'resize-ne') {
+ if ((parseInt(elep.style.height.replace("px", "")) - (evm.clientY - py)) > miny) {
+ elep.style.top = (elep.offsetTop - (py - evm.clientY)) + "px"
+ elep.style.height = (parseInt(elep.style.height.replace("px", "")) - (evm.clientY - py)) + "px"
+ //console.log(elem.parentElement.parentElement.parentElement)
+
+ //document.getElementById(uid + "-content-scrollbar-point").style.height = (document.getElementById(uid + "-content-root").clientHeight / (document.getElementById(uid + "-content-content").clientHeight / document.getElementById(uid + "-content-root").clientHeight)) + "px"
+ }
+ }
+ if (sel == 'resize-e' || sel == 'resize-es' || sel == 'resize-ne')
+ if ((parseInt(elep.style.width.replace("px", "")) + (evm.clientX - px)) > minx) {
+ elep.style.width = (parseInt(elep.style.width.replace("px", "")) + (evm.clientX - px)) + "px"
+ } if (sel == 'resize-w' || sel == 'resize-nw' || sel == 'resize-sw') {
+ //console.log((parseInt(elep.style.width.replace("px", "")) - (evm.clientX - px)))
+ if ((parseInt(elep.style.width.replace("px", "")) - (evm.clientX - px)) > minx) {
+ elep.style.left = (elep.offsetLeft - (px - evm.clientX)) + "px"
+ elep.style.width = (parseInt(elep.style.width.replace("px", "")) - (evm.clientX - px)) + "px"
+ }
+ }
+ //
+ //if (sel == 'resize-s' || sel == 'resize-n' || ) {
+ for (let iii = 0; iii != elem.parentElement.parentElement.parentElement.children.length; iii++) {
+ //console.log(elem.parentElement.parentElement.parentElement.children.item(iii).className)
+ if (elem.parentElement.parentElement.parentElement.children.item(iii).className == "content-root") {
+
+ for (let iiii = 0; iiii != elem.parentElement.parentElement.parentElement.children.item(iii).children.length; iiii++) {
+ if (elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).className == "scrollbar") {
+ for (let iiiii = 0; iiiii != elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.length; iii++) {
+ if (elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).className == "scrollbar-point") {
+ for (let iiiiii = 0; iiiiii != elem.parentElement.parentElement.parentElement.children.item(iii).children.length; iiiiii++) {
+
+ if (elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiiiii).className == "content-content") {
+
+ if (elem.parentElement.parentElement.parentElement.children.item(iii).clientHeight / (elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiiiii).clientHeight / elem.parentElement.parentElement.parentElement.children.item(iii).clientHeight) < elem.parentElement.parentElement.parentElement.children.item(iii).clientHeight) {
+ elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).style.display = "block"
+ elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).style.height = (elem.parentElement.parentElement.parentElement.children.item(iii).clientHeight / (elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiiiii).clientHeight / elem.parentElement.parentElement.parentElement.children.item(iii).clientHeight))
+ if (elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).offsetTop > elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).clientHeight - elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).clientHeight) {
+ elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).style.top = elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).clientHeight - elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).clientHeight
+ }
+ //elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).style.top = Math.min(elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).children.item(iiiii).style.top, elem.parentElement.parentElement.parentElement.children.item(iii).clientHeight)
+ } else {
+ elem.parentElement.parentElement.parentElement.children.item(iii).children.item(iiii).style.display = "none"
+ }
+ break
+ }
+ }
+
+ break
+ }
+ }
+ break
+ }
+ }
+ break
+ }
+ }
+ //}
+ py = (evm.clientY)
+ px = (evm.clientX)
+
+ })
+ })
+ }
+ })
+ let temp
+ let scrolling = false
+ for (let ii = 0; ii != elec.length; ii++) {
+
+ if (elec.item(ii).className == 'content-root') {
+ //console.log(elec.item(ii).className)
+ temp = elec.item(ii).children
+ for (let iii = 0; iii != temp.length; iii++) {
+ //console.log(temp.item(iii).className)
+ if (temp.item(iii).className == 'scrollbar') {
+ temp = temp.item(iii).children
+ for (let iiii = 0; iiii != temp.length; iiii++) {
+ //console.log(temp.item(iiii).className)
+ if (temp.item(iiii).className == 'scrollbar-point') {
+ elem = temp.item(iiii)
+
+ for (let iiiii = 0; iiiii != elec.item(ii).children.length; iiiii++) {
+
+ if (elec.item(ii).children.item(iiiii).className == 'content-content') {
+ //console.log(elec.item(ii).children.item(iiiii), "hi")
+ con = elec.item(ii).children.item(iiiii)
+ elec.item(ii).onscroll = ((ev) => {
+ if (!scrolling) {
+ let aaaa = (elec.item(ii).clientHeight - elem.clientHeight)
+ let scro = (elec.item(ii).scrollTop / (elec.item(ii).scrollHeight - elec.item(ii).clientHeight))
+ //console.log(aaaa, (elec.item(ii).scrollHeight - elec.item(ii).clientTop))
+ elem.style.top = scro * aaaa
+ }
+ })
+ elem.onmousedown = ((ev) => {
+ let thi = elec.item(ii).children.item(iiiii)
+ let eel = temp.item(iiii)
+ document.body.style.cursor = 'grabbing'
+ eel.style.cursor = 'grabbing'
+ py = ev.clientY
+ document.body.style.userSelect = "none"
+ document.onmouseup = ((evu) => {
+ document.body.style.userSelect = "unset"
+ document.onmousemove = null
+ document.onmouseup = null
+ document.body.style.cursor = ''
+ eel.style.cursor = 'grab'
+ scrolling = false
+ })
+ document.onmousemove = ((evm) => {
+ scrolling = true
+ let z = (eel.offsetTop - (py - evm.clientY))
+ //let b = (elem.clientHeight - elem.offsetTop - (py - evm.clientY))
+ //console.log(elem.clientHeight/2 - elem.offsetTop - (py - evm.clientY))
+ //console.log(z, elem.parentElement.clientHeight - elem.clientHeight)
+ if (z >= 0 && z < eel.parentElement.clientHeight - eel.clientHeight) {
+ eel.style.top = z
+ thi.parentElement.scrollTop = ((z / (eel.parentElement.clientHeight - eel.clientHeight)) * (thi.scrollHeight - eel.parentElement.clientHeight + 24))
+ } else {
+ if (z < elem.parentElement.clientHeight - elem.clientHeight) {
+ elem.style.top = 0
+ } else {
+ elem.style.top = elem.parentElement.clientHeight - elem.clientHeight
+ }
+ }
+ py = (evm.clientY)
+ })
+ })
+ break
+ }
+ }
+
+ break
+ }
+ }
+ break
+ }
+ }
+ break
+ }
+ }
+ px = 0, py = 0;
+
+ if (elem.className == 'scrollbar-point') {
+
+
+ }
+
+
+
+ }
+
+
+
+ }
+ let fs = [{ name: "apps", perms: { r: true }, dir: true, content: [{ name: "notepad", icon: "./src/img/notepad.png", perms: { r: true }, dir: false, content: "window Notepad <input>uwu" }, { name: "cmd", icon: "./src/img/cmd.png", perms: { r: true }, dir: false, content: "window" }] }]
+ function shortcut(i) {
+ let parsed = i.split("\n")
+ for (let line of parsed) {
+ let words = line.split(" ")
+ if (words[0] == "window") {
+ let t = line.split(" ")
+ t.splice(0, 2)
+ window_create(0, words[1], t.join(" "), { size: { width: 500, height: 500 } })
+ load_bar()
+ }
+ }
+ }
+ function close_menu() {
+ let items = document.getElementsByClassName("bar-menu-item")
+ for (let item = 0; item != items.length; item++) {
+ let i_c = items.item(item).children
+ for (let i = 0; i != i_c.length; i++) {
+ let id = i_c.item(i)
+ if (id.className == "bar-menu-more-root") {
+ id.style.display = "none"
+ }
+ }
+ }
+ document.getElementById("bar-menu-root").style.display = "none"
+ main()
+ }
+ function main() {
+ document.getElementById("bar-menu").onclick = ((ev) => {
+ if (document.getElementById("bar-menu-root").style.display == "block")
+ document.getElementById("bar-menu-root").style.display = "none"
+ else
+ document.getElementById("bar-menu-root").style.display = "block"
+ })
+ let items = document.getElementsByClassName("bar-menu-item")
+ for (let item = 0; item != items.length; item++) {
+ let i_c = items.item(item).children
+ for (let i = 0; i != i_c.length; i++) {
+ let id = i_c.item(i)
+ if (id.className == "bar-menu-more-root") {
+ let dd = (jssh.set_wd(items.item(item).getAttribute("dir")))
+ /*
+ <div class="bar-menu-item" id="bar-menu-favorites"><img class="bar-menu-image"
+ src="./src/img/notepad.png">
+ <div class="bar-menu-text">Notepad--</div>
+ </div>
+ */
+ id.innerHTML = ''
+ let ins = ""
+ for (let ite = 0; ite != dd.length; ite++) {
+
+ ins += `<div class="bar-menu-item" onclick="shortcut('${dd[ite].content}');close_menu();" id="bar-menu-${dd[ite].name}">`
+ if (dd[ite].icon)
+ ins += `<img class="bar-menu-image" src="${dd[ite].icon}">`
+ ins += `<div class="bar-menu-text">${dd[ite].name}</div></div>`
+
+
+ //console.log(id.children.item(ite))
+ }
+ id.innerHTML = ins;
+ items.item(item).onmouseover = ((ev) => {
+ id.style.display = "block"
+ items.item(item).onmouseout = ((ev) => {
+ id.style.display = "none"
+ })
+ })
+ break;
+ }
+ }
+ }
+ }
+
+ </script>
+</head>
+
+<body onload="main()">
+ <div id="root">
+ <div id="bar">
+ <div id="bar-children">
+ <div id="bar-menu"><img src="./src/img/windows.png">
+ <pre> </pre>Start
+
+ </div>
+ <div id="bar-items">
+ </div>
+
+
+ </div>
+ </div>
+ <div id="bar-menu-root">
+ <div class="bar-menu-item" id="bar-menu-windows-update"><img class="bar-menu-image"
+ src="./src/img/update.png">
+ <div class="bar-menu-text">Windows Update</div>
+
+ </div>
+ <div class="bar-menu-separator"></div>
+ <div class="bar-menu-item" id="bar-menu-programs" dir="/apps/"><img class="bar-menu-image"
+ src="./src/img/programs.png">
+ <div class="bar-menu-text">Programs</div>
+ <div class="bar-menu-more"></div>
+ <div class="bar-menu-more-root">
+ <!--
+ <div class="bar-menu-item" id="bar-menu-favorites" shortcut-path=""><img class="bar-menu-image"
+ src="./src/img/notepad.png">
+ <div class="bar-menu-text">Notepad</div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-favorites"><img class="bar-menu-image"
+ src="./src/img/notepad.png">
+ <div class="bar-menu-text">Notepad--</div>
+ </div>-->
+ </div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-favorites"><img class="bar-menu-image"
+ src="./src/img/favorites.png">
+ <div class="bar-menu-text">Favorites</div>
+ <div class="bar-menu-more"></div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-docs"><img class="bar-menu-image" src="./src/img/docs.png">
+ <div class="bar-menu-text">Documents</div>
+ <div class="bar-menu-more"></div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-settings"><img class="bar-menu-image"
+ style="height:27px;padding-left:2px" src="./src/img/settings.png">
+ <div class="bar-menu-text">Settings</div>
+ <div class="bar-menu-more"></div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-find"><img class="bar-menu-image"
+ style="height:27px;padding-left:2px" src="./src/img/find.png">
+ <div class="bar-menu-text">Find</div>
+ <div class="bar-menu-more"></div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-help"><img class="bar-menu-image" src="./src/img/help.png">
+ <div class="bar-menu-text">Help</div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-run"><img class="bar-menu-image" src="./src/img/run.png">
+ <div class="bar-menu-text">Run</div>
+ </div>
+ <div class="bar-menu-separator"></div>
+ <div class="bar-menu-item" id="bar-menu-help"><img class="bar-menu-image" style="height:24px"
+ src="./src/img/log-off.png">
+ <div class="bar-menu-text">Log Off...</div>
+ </div>
+ <div class="bar-menu-item" id="bar-menu-run"><img class="bar-menu-image" style="height:24px"
+ src="./src/img/shut-down.png">
+ <div class="bar-menu-text">Shut Down...</div>
+ </div>
+ </div>
+ </div>
+</body>
+
+</html> \ No newline at end of file
diff --git a/html/tty.html b/html/tty.html
new file mode 100644
index 0000000..34b6be7
--- /dev/null
+++ b/html/tty.html
@@ -0,0 +1,82 @@
+<html>
+
+<head>
+ <meta charset="UTF-8">
+ <title>nya~</title>
+ <link rel="preconnect" href="https://fonts.googleapis.com">
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+ <script rel="preconnect" src="./src/jssh.js" crossorigin></script>
+ <link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
+
+ <style>
+ :root {
+ --primary: #ee2757;
+ --complement: #eb586f;
+ --contrast: #8144e9;
+ --white: #f0fcfb;
+ --black: #212121;
+ --font-size: 17px;
+ }
+
+ * {
+ margin: 0;
+ }
+
+ body {
+ background-color: var(--black);
+ font-family: 'Press Start 2P';
+ color: var(--white);
+ font-size: var(--font-size);
+ text-shadow: 0 0 10px var(--white);
+
+ }
+
+ input {
+ background-color: rgba(0, 0, 0, 0);
+ font-family: 'Press Start 2P';
+ color: var(--white);
+ font-size: var(--font-size);
+ text-shadow: 0 0 10px var(--white);
+ border: none;
+ }
+
+ input {
+ border: 0;
+ outline: 0;
+ }
+
+ input:focus {
+ outline: none !important;
+ }
+
+ input:hover {
+ cursor: text;
+ }
+ </style>
+ <script>
+ let working_dir = "/"
+ let fs = [
+ { name: ".bashrc", perms: { r: true }, dir: false, content: "neofetch" },
+ { name: "readme", perms: { r: true }, dir: false, content: "i dont really know what to put here:(" }
+ , { name: "more-aboutme", perms: { r: true }, dir: false, content: "experienced development in ts/js and c/c++\nless experience but still some in\nclojure, java, python, and probably some more.\n\ni like manga and anime, favorites are something like\n(not ordered) mushoku tensei, pet girl of sakurasou\noverlord, rising of shield here\nand that time i got reincarnated as a slime.\n\ni also play some games n stuff,\nlove terraria, and some other similar games\ni also lovelove visual novels\nusually romance/horror ones" }
+ , { name: "test", perms: { r: true }, dir: true, content: [{ name: "aaa", perms: { r: true }, dir: false, content: "test test test" }] }
+ , { name: ".secret", perms: { r: true }, dir: true, content: [{ name: "readme", perms: { r: true }, dir: false, content: "still working on things:) nothing here is final\n or even close" }] }
+
+ ]
+
+ </script>
+</head>
+
+<body onload="jssh.main()">
+
+ <div id="history">
+
+ </div>
+ <form autocomplete="off" onsubmit="jssh.ex();return false;">
+ λ <input id="line" style="width:95%;" onblur="this.focus()" autofocus>
+ <input type="submit" style="display: none" />
+ </form>
+
+</body>
+
+</html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2025-11-09 18:09:52 +0000