almost done with win api

author: amy <[email protected]> 2023-02-01 14:15:04 -0600
committer: amy <[email protected]> 2023-02-01 14:15:04 -0600
commit: 7621e4424cf8aac22597bd28b0bc000ac3886e93 (patch)
tree: 51458a84d8bbec26b32230412d47cc4ece16c698
parent: 73050b11adf1caed1b4790c8a116de11443e2e6f (diff)
2 files changed, 224 insertions, 20 deletions
diff --git a/display.html b/display.html
new file mode 100644
index 0000000..2bb7e03
--- /dev/null
+++ b/display.html
@@ -0,0 +1,190 @@
+<html>
+
+<head>
+    <style>
+        * {
+            margin: 0;
+        }
+
+        .window {
+            width: 56%;
+            max-width: inherit;
+            height: 30%;
+            max-height: inherit;
+            background-color: #c3c3c3;
+            position: absolute;
+        }
+
+        .head-border {
+            width: calc(100% - 2px);
+            background-color: #010081;
+            height: 25px;
+            position: absolute;
+            top: 1px;
+            left: 1px;
+            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: 5px;
+            background-color: rgba(0, 0, 0, 0);
+            cursor: ns-resize;
+        }
+
+        .resize-s {
+            position: absolute;
+            bottom: -1px;
+            width: 100%;
+            height: 5px;
+            background-color: rgba(0, 0, 0, 0);
+            cursor: ns-resize;
+        }
+
+        .resize-e {
+            position: absolute;
+            right: -1px;
+            width: 5px;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0);
+            cursor: ew-resize;
+        }
+
+        .resize-w {
+            position: absolute;
+            left: -1px;
+            width: 5px;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0);
+            cursor: ew-resize;
+        }
+    </style>
+    <script>
+        function window_create(uid, name) {
+            let a = ''
+            a += "<div id='" + uid + "-root' class='window' style='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 + "'>"
+            a += "<div id='" + uid + "-close' class='close-button' window-name='" + name + "'>" + `<svg xmlns="http://www.w3.org/2000/svg" style="position:absolute;left:-3.5px;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>"
+            document.getElementById("root").innerHTML += a
+            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
+                for (let ii = 0; ii != elec.length; ii++) {
+                    console.log(elec.item(ii).className)
+                    if (elec.item(ii).className == 'head-border') {
+                        elem = elec.item(ii)
+                        break
+                    }
+                }
+                let elep = elem.parentElement
+                let px = 0, py = 0;
+
+                if (elem.className == 'head-border') {
+                    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'
+                        elem.style.cursor = 'grabbing'
+                        px = ev.clientX
+                        py = ev.clientY
+                        document.onmouseup = ((evu) => {
+
+                            document.onmousemove = null
+                            document.onmouseup = null
+                            document.body.style.cursor = 'initial'
+                            elem.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)
+                        })
+                    })
+                }
+
+                for (let ii = 0; ii != elec.length; ii++) {
+                    console.log(elec.item(ii))
+                    if (elec.item(ii).className == 'resize-n') {
+                        elem = elec.item(ii)
+                        break
+                    }
+                }
+                console.log(elem)
+                if (elem.className == 'resize-n') {
+                    elem.onmousedown = ((ev) => {
+                        console.log("hi")
+                        for (let i = 0; i != elems.length; i++) {
+                            elems.item(i).style.zIndex = 0;
+                        }
+                        elep.style.zIndex = 1
+                        px = ev.clientX
+                        py = ev.clientY
+                        document.onmouseup = ((evu) => {
+
+                            document.onmousemove = null
+                            document.onmouseup = null
+                            document.body.style.cursor = 'initial'
+                            elem.style.cursor = 'grab'
+                        })
+                        document.onmousemove = ((evm) => {
+                            console.log(elem.offsetLeft)
+                            elep.style.width = (px - evm.clientX) + "px"
+                            elep.style.height = (py - evm.clientY) + "px"
+                        })
+                    })
+                }
+            }
+
+
+
+        }
+
+    </script>
+</head>
+
+<body>
+    <div id="root"></div>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/tty.html b/tty.html
index 79fb9df..2f2b737 100644
--- a/tty.html
+++ b/tty.html
@@ -56,9 +56,10 @@
         let working_dir = "/"
         let fs = [
             { name: ".bashrc", perms: { r: true }, dir: false, content: "neofetch" },
-            { name: "readme", perms: { r: true }, dir: false, content: "test test acr" }
-            , { name: "help", 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: "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" }] }
 
         ]
         function set_wd(dir) {
@@ -104,8 +105,18 @@
             return "/" + path.join("/")
         }
         function main() {
-            document.getElementById("line").value = "neofetch"
-            ex()
+            for (let d of fs) {
+                if (d.name == '.bashrc') {
+                    for (let line of d.content.split("\n")) {
+                        document.getElementById("line").value = line
+                        ex()
+                    }
+                    break
+                }
+            }
+            setInterval(() => {
+                document.getElementById("line").focus()
+            }, 10)
         }
         function ex() {
             let temp_working_dir = working_dir
@@ -113,8 +124,12 @@
             let com = document.getElementById("line").value;
             let stripped = com.split(" ")
             switch (stripped[0]) {
+                case 'jssh':
+                    main()
+                    break;
                 case 'neofetch':
-                document.getElementById("history").innerHTML += "<pre>\
+                    let add = ''
+                    add += "<table style='padding:5px;'><tr style='padding:5px;'><td style='padding:5px;'><pre id='txt'>\
   ,-.       _,---._ __   / \\ \n \
  /  )    .-'       `./ /   \\ \n \
 (  (   ,'            `/    /| \n \
@@ -126,29 +141,28 @@
   |  | (   |            | / \n \
   )  |  \\  `.___________|/ \n \
   `--'   `--' </pre>" //position this plz:)
-                    document.getElementById("history").innerHTML += "hello, i am grant, they/them</br>i am mostly a typescript and c++ dev, but</br>i can work in most languages</br>--</br>i enjoy manga, and coding in free time</br>contact me at [email protected]</br></br>"
-                    colors = ['#cdb4db','#ffc8dd','#ffafcc','#bde0fe','#a2d2ff']
-                    for(let co of colors){
-                        document.getElementById("history").innerHTML += "<pre style='margin-bottom:-2px;display:inline-block;height:25px;width:30px;background-color:"+co+";'></pre>"
+                    add += "</td><td style='padding:5px;'>hello, i am grant, they/them</br>i am mostly a typescript and c++ dev, but</br>i can work in most languages</br>--</br>i enjoy manga, and coding in free time</br>contact me at [email protected]</br></br>"
+                    colors = ['#cdb4db', '#ffc8dd', '#ffafcc', '#bde0fe', '#a2d2ff']
+                    for (let co of colors) {
+                        add += "<pre style='margin-bottom:-2px;display:inline-block;height:25px;width:30px;background-color:" + co + ";'></pre>"
                     }
-                    document.getElementById("history").innerHTML += "</br>"
-                    colors = ['#a81d61','#ff218e','#fcd800','#0194fc','#007cd5']
-                    for(let co of colors){
-                        document.getElementById("history").innerHTML += "<pre style='display:inline-block;height:25px;width:30px;background-color:"+co+";'></pre>"
+                    add += "</br>"
+                    colors = ['#a81d61', '#ff218e', '#fcd800', '#0194fc', '#007cd5']
+                    for (let co of colors) {
+                        add += "<pre style='display:inline-block;height:25px;width:30px;background-color:" + co + ";'></pre>"
                     }
-                    
-                    document.getElementById("history").innerHTML +="</br></br>"
 
+                    add += "</td></tr></table></br></br>"
+                    document.getElementById("history").innerHTML += add
                     break;
                 case 'clear':
                     document.getElementById("history").innerHTML = '';
                     break;
                 case 'echo':
-                    let l = stripped.splice(1, 1)
-                    document.getElementById("history").innerHTML += l + "</br>";
+                    document.getElementById("history").innerHTML += com.substr(4) + "</br>";
                     break;
                 case 'help':
-                    document.getElementById("history").innerHTML += "jssh -- version 1.0.0 (dev)</br></br>commands: neofetch, help,</br> cat [path],pwd,</br>ls [path] [-a], cd [path],</br>clear, echo [str]</br>"
+                    document.getElementById("history").innerHTML += "jssh -- version 1.0.0 (dev)</br></br>commands: neofetch, help,</br> cat [path],pwd,</br>ls [path] [-a], cd [path],</br>clear, echo [str],jssh</br>"
                     break;
                 case 'cat':
 
@@ -247,7 +261,7 @@
 
     </div>
     <form autocomplete="off" onsubmit="ex();return false;">
-        λ <input id="line" style="width:95%;">
+        λ <input id="line" style="width:95%;" onblur="this.focus()" autofocus>
         <input type="submit" style="display: none" />
     </form>
author	amy <[email protected]>	2023-02-01 14:15:04 -0600
committer	amy <[email protected]>	2023-02-01 14:15:04 -0600
commit	7621e4424cf8aac22597bd28b0bc000ac3886e93 (patch)
tree	51458a84d8bbec26b32230412d47cc4ece16c698
parent	73050b11adf1caed1b4790c8a116de11443e2e6f (diff)