PossiblyAxolotl/i-eat.rocks
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add app icons

Browse source
This commit is contained in:
PossiblyAxolotl 2024-08-15 23:45:22 -06:00
parent 3987a11aff
commit 5a98b1f5f6
12 changed files with 131 additions and 1345 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

77
apps/info.html
View file

@ -1,39 +1,52 @@
<style> <!DOCTYPE html>
@keyframes hue { <html lang="en">
0% { <head>
filter: hue-rotate(0deg); <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Info</title>
<style>
@keyframes hue {
0% {
filter: hue-rotate(0deg);
}
100% {
filter: hue-rotate(360deg);
}
} }
100% { h1 {
filter: hue-rotate(360deg); animation: hue 2s infinite linear;
color:red;
padding:0;
margin:0;
display: block;
} }
}
h1 { p {
animation: hue 2s infinite linear; text-align: center;
color:red; width: 100%;
padding:0; }
margin:0;
display: block;
}
p { #body {
text-align: center; width: 100%;
width: 100%; padding:0;
} margin:0;
height: 100%;
#body { text-align: center;
width: 100%; }
padding:0; </style>
margin:0;
height: 100%;
text-align: center; <link rel="stylesheet" href="/apps/standard.css">
} </head>
</style> <body>
<div id="body">
<div id="body"> <h1>i-eat.rocks</h1>
<h1>i-eat.rocks</h1> <p>Rock-OS v0.1.0</p>
<p>v0.0.1</p> <p>Created by PossiblyAxolotl</p>
<a href = 'https://www.possiblyaxolotl.com/'>Created by PossiblyAxolotl</a> <button onclick="window.top.postMessage('url https://directory.possiblyaxolotl.com')">PossiblyAxolotl Directory</button>
</div> </div>
</body>
</html>

1128
apps/slimekoban.html
View file

File diff suppressed because it is too large Load diff

157
apps/slimekoban.js
View file

File diff suppressed because one or more lines are too long

9
apps/standard.css
View file

@ -23,3 +23,12 @@ button:active {
border: inset white 4px; border: inset white 4px;
background-color: lightgray; background-color: lightgray;
} }
input {
border: inset white 4px;
background-color: #dbdbdb;
}
*:focus, *:active {
outline: none;
}

15
apps/terminal.html
View file

@ -4,6 +4,9 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Terminal</title> <title>Terminal</title>
<link rel="stylesheet" href="standard.css">
<style> <style>
* { * {
background-color: black; background-color: black;
@ -36,15 +39,18 @@
html, body { html, body {
height: 100%; height: 100%;
} }
</style>
<link rel="stylesheet" href="standard.css"> input {
background-color: black;
border:none;
}
</style>
</head> </head>
<body> <body>
<textarea id="output" readonly>Rockterm&NewLine;Type 'help' for help</textarea> <textarea id="output" readonly>Rockterm&NewLine;Type 'help' for help</textarea>
<form id="form"> <form id="form">
<label>&thinsp;$</label> <label>&thinsp;$</label>
<input id="formtext" type="text" autocomplete="off"> <input id="formtext" type="text" autocomplete="off" style="border: none;">
<input id="submit" type="submit" title="submit" value="submit"> <input id="submit" type="submit" title="submit" value="submit">
</form> </form>
@ -60,7 +66,8 @@
if (command != "help") { if (command != "help") {
window.top.postMessage(command) window.top.postMessage(command)
} else { } else {
ta.value += "\nwin (url) (title) (wid) (height) - create a window"; ta.value += "\nwin (url) (title) (width) (height) - create a window";
ta.value += "\nwg - open windowgen";
ta.value += "\nurl (url) - go to url" ta.value += "\nurl (url) - go to url"
} }
}) })

4
apps/welcome.html
View file

@ -23,8 +23,6 @@
<p>Page coming soon!</p> <p>Page coming soon!</p>
<button onclick="createWindow('https://www.possiblyaxolotl.com', 'possiblyaxolotl', '800', '500')">Created by PossiblyAxolotl</button><button onclick="createWindow('https://www3.cbox.ws/box/?boxid=3540114&boxtag=qbEaqt', 'rockchat', '300', '450')">Chatroom</button><button onclick="createWindow('apps/notepad.html', 'notepad', '500', '450')">notepad</button><button onclick="createWindow('https://ko-fi.com/possiblyaxolotl/?hidefeed=true&widget=true&embed=true&preview=true', 'donate', '400', '630')">support</button><button onclick="createWindow('apps/slimekoban.html', 'slimekoban', '450', '350')">slimekoban</button><button onclick="createWindow('apps/info.html', 'info', '200', '120')">info</button><button onclick="createWindow('apps/terminal.html', 'terminal', '800', '500')">terminal</button> <button onclick="createWindow('https://www.possiblyaxolotl.com', 'possiblyaxolotl', '900', '500')">Created by PossiblyAxolotl</button><button onclick="createWindow('https://ko-fi.com/possiblyaxolotl/?hidefeed=true&widget=true&embed=true&preview=true', 'donate', '400', '630')">support me!</button><button onclick="createWindow('apps/info.html', 'info', '350', '190')">info</button>
<p><a onclick="window.top.postMessage('url https://directory.possiblyaxolotl.com')" style="text-decoration: underline; color: purple;">PossiblyAxolotl Directory</a></p>
</body> </body>
</html> </html>

14
apps/windowgen.html
View file

@ -4,20 +4,22 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> <title>Document</title>
<link rel="stylesheet" href="standard.css">
</head> </head>
<body> <body>
<form id="form"> <form id="form">
<input id="url" type="url" placeholder="url"> <input id="url" type="url" placeholder="url" required>
<input id="titl" type="text" placeholder="title"> <input id="titl" type="text" placeholder="title" required>
<input id="wid" type="number" placeholder="width"> <input id="wid" type="number" placeholder="width" required>
<input id="hei" type="number" placeholder="height"> <input id="hei" type="number" placeholder="height" required>
<input type="submit"> <button>submit</button>
</form> </form>
<script> <script>
document.getElementById("form").addEventListener("submit", event => { document.getElementById("form").addEventListener("submit", event => {
event.preventDefault() event.preventDefault()
window.top.postMessage(`makewin ${document.getElementById("url").value} ${document.getElementById("titl").value} ${document.getElementById("wid").value} ${document.getElementById("hei").value}`) window.top.postMessage(`win ${document.getElementById("url").value} ${document.getElementById("titl").value} ${document.getElementById("wid").value} ${document.getElementById("hei").value}`)
}) })
</script> </script>
</body> </body>

2
commands.js
View file

@ -9,5 +9,7 @@ window.onmessage = function(e) {
window.location.href='/favicon.ico'; window.location.href='/favicon.ico';
} else if (dat[0] == "url") { } else if (dat[0] == "url") {
window.location.href = dat[1]; window.location.href = dat[1];
} else if (dat[0] == "wg") {
createWindow("/apps/windowgen.html", "WINDOWGEN™", "250px", "150px")
} }
} }

10
drag.js
View file

@ -19,9 +19,7 @@ function clampPos() {
if (sPosY < tPad) {selected.style.top = tPad + "px"}; if (sPosY < tPad) {selected.style.top = tPad + "px"};
if (sPosY > bPad) {selected.style.top = bPad + "px"}; if (sPosY > bPad) {selected.style.top = bPad + "px"};
if (selected) { document.querySelectorAll("iframe").forEach(item => { item.style.pointerEvents = "all"; })
selected.getElementsByTagName("iframe")[0].style.pointerEvents = "all";
}
selected = null; selected = null;
@ -46,7 +44,7 @@ addEventListener("mousedown", event => {
}; };
if (selected) { if (selected) {
selected.getElementsByTagName("iframe")[0].style.pointerEvents = "none"; document.querySelectorAll("iframe").forEach(item => { item.style.pointerEvents = "none"; })
zIndex ++; zIndex ++;
selected.style.zIndex = zIndex; selected.style.zIndex = zIndex;
} }
@ -54,7 +52,7 @@ addEventListener("mousedown", event => {
}); });
addEventListener("mousemove", event => { addEventListener("mousemove", event => {
if (selected && mouseDown > 0) { if (selected) {
let curL = selected.style.left.replace("px", ""); let curL = selected.style.left.replace("px", "");
let curT = selected.style.top.replace("px", ""); let curT = selected.style.top.replace("px", "");
@ -117,7 +115,7 @@ function createWindow(url, title, width, height) {
const head = document.createElement("div"); const head = document.createElement("div");
head.classList = "header drag"; head.classList = "header drag";
head.innerHTML = "<p>" + title + "</p><button onclick='this.parentNode.parentNode.remove()'>x</button>"; head.innerHTML = "<p>" + title + "</p><button onclick='clampPos(); this.parentNode.parentNode.remove()'>x</button>";
const frame = `<iframe class='content' src='${url}' width='${width}' height='${height}'></iframe>`; const frame = `<iframe class='content' src='${url}' width='${width}' height='${height}'></iframe>`;

BIN
images/icons/home.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 3.2 KiB

27
index.html
View file

@ -7,16 +7,35 @@
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style.css?v=2"> <link rel="stylesheet" href="style.css?v=3">
<script src="drag.js?v=3" defer></script> <script src="drag.js?v=4" defer></script>
<script src="commands.js" defer></script> <script src="commands.js?v=2" defer></script>
</head> </head>
<body> <body>
<div class="icons">
<div class="app" ondblclick="createWindow('apps/welcome.html', 'welcome', '300px', '235px')">
<p><img src="images/icons/home.png" width="48px" height="48px" /><sub>Welcome</sub></p>
</div>
<div class="app" ondblclick="createWindow('apps/notepad.html', 'notepad', '500px', '450px')">
<p><img src="images/icons/home.png" width="48px" height="48px" /><sub>notepad</sub></p>
</div>
<div class="app" ondblclick="createWindow('https://bandcamp.com/EmbeddedPlayer/album=3902721364/size=large/bgcol=181a1b/linkcol=056cc4/tracklist=false/artwork=small/track=3286219329/transparent=true', 'rock music', '400px', '120px')">
<p><img src="images/icons/home.png" width="48px" height="48px" /><sub>rock music</sub></p>
</div>
<div class="app" ondblclick="createWindow('apps/terminal.html', 'terminal', '800', '500')">
<p><img src="images/icons/home.png" width="48px" height="48px" /><sub>terminal</sub></p>
</div>
</div>
<div class="icons">
<div class="app" ondblclick="createWindow('https://www3.cbox.ws/box/?boxid=3540114&boxtag=qbEaqt', 'rockchat', '300', '450')">
<p><img src="images/icons/home.png" width="48px" height="48px" /><sub>chatroom</sub></p>
</div>
</div>
<script defer> <script defer>
addEventListener("DOMContentLoaded", e => { addEventListener("DOMContentLoaded", e => {
createWindow('apps/welcome.html', 'welcome', '300px', '335px'); createWindow('apps/welcome.html', 'welcome', '300px', '235px');
}) })
</script> </script>
</body> </body>

25
style.css
View file

@ -4,10 +4,15 @@
font-smooth: never; font-smooth: never;
} }
p, h1, button { p, h1, button, sub {
font-family: "PC", monospace; font-family: "PC", monospace;
} }
sub {
color: white;
font-size: x-small;
}
@keyframes appear { @keyframes appear {
0% { 0% {
transform: scale(0%); transform: scale(0%);
@ -111,3 +116,21 @@ body, html {
margin:0; margin:0;
min-height: 100vh; min-height: 100vh;
} }
.app {
margin:4px;
width:72px;
display: grid;
text-align: center;
}
.app:active {
margin:2px;
border: dotted 2px black;
transform: translate(2px, 2px);
}
.icons {
margin:4px;
display: flex;
}