From c34e53111cd8833f75b228c47ae84ca3bd4b0eea Mon Sep 17 00:00:00 2001 From: sky Date: Sun, 22 Jun 2025 11:46:39 -0400 Subject: [PATCH] first dev commit --- .gitignore | 1 + .prettierrc | 4 + 404.html | 38 +++ css/games.css | 48 +++ css/loader.css | 32 ++ css/main.css | 70 ++++ css/oldstyle.css | 673 +++++++++++++++++++++++++++++++++++++ css/pages.css | 107 ++++++ css/sidebar.css | 58 ++++ css/themes.css | 12 + home.html | 88 +++++ img/apps.svg | 1 + img/bookmarklets.svg | 1 + img/games.svg | 6 +- img/home.svg | 1 + img/open.svg | 1 + img/settings.svg | 1 + index.html | 57 ++++ js/games.js | 56 +++ js/main.js | 217 +++++++++++- js/particlesjs-config.json | 105 ++++++ loader.html | 38 +++ projects.html | 37 ++ 23 files changed, 1650 insertions(+), 2 deletions(-) create mode 100644 .prettierrc create mode 100755 css/games.css create mode 100644 css/loader.css create mode 100755 css/main.css create mode 100755 css/oldstyle.css create mode 100755 css/pages.css create mode 100755 css/sidebar.css create mode 100755 home.html create mode 100644 img/apps.svg create mode 100644 img/bookmarklets.svg create mode 100644 img/home.svg create mode 100644 img/open.svg create mode 100644 img/settings.svg create mode 100755 js/particlesjs-config.json diff --git a/.gitignore b/.gitignore index e69de29..cb76b31 100644 --- a/.gitignore +++ b/.gitignore @@ -0,0 +1 @@ +resources/ diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..12caa8b --- /dev/null +++ b/.prettierrc @@ -0,0 +1,4 @@ +{ + "tabWidth": 4, + "printWidth": 10000 +} \ No newline at end of file diff --git a/404.html b/404.html index 16975b7..ef64c88 100644 --- a/404.html +++ b/404.html @@ -32,9 +32,22 @@ @@ -57,8 +70,33 @@

Trying to access a page such as login, register, or a user page? Those are only available on official links.

Join the Discord to find official links.

+<<<<<<< HEAD +======= + + + + + +>>>>>>> c2041b6 (first dev commit)
diff --git a/css/games.css b/css/games.css new file mode 100755 index 0000000..9e70986 --- /dev/null +++ b/css/games.css @@ -0,0 +1,48 @@ +game { + width: 20vw; + height: 10vh; + background-color: color-mix(in srgb, var(--color-2) 40%, #00000000 60%); + display: flex; + justify-content: center; + align-items: center; + cursor: pointer; + border-radius: 20px; + margin: 15px; + transition-duration: 0.25s; + backdrop-filter: blur(2px); + box-shadow: 0 0 10px var(--color-2); +} +game:hover { + transform: scale(1.1); + filter:brightness(1.15); +} +game img { + height: 80%; + border-radius: 15px; + aspect-ratio: 1 / 1; + margin: 10px; + justify-self: left; + margin-right: auto; +} +game h1 { + font-size: 14px; + margin: 15px; + max-width: 50%; +} +#games { + width: 90vw; + height: 100%; + display: flex; + flex-direction: row; + justify-content: center; + flex-wrap: wrap; + min-height: calc(100vh - (18px * 2 + 5px * 2 + 20px * 2)); + gap: 0px; +} + +#noResults { + display: none; + font-size: 28px; + color: var(--color-1); + text-shadow: var(--color-1) 0 0 10px; +} \ No newline at end of file diff --git a/css/loader.css b/css/loader.css new file mode 100644 index 0000000..838443f --- /dev/null +++ b/css/loader.css @@ -0,0 +1,32 @@ +#gamecontainer { + width: 90vw; + height: auto; + border-radius: 15px; + background-color: color-mix(in srgb, var(--color-2) 50%, #00000000 50%); + box-shadow: 0 0 10px var(--color-2); + backdrop-filter: blur(6px); +} +#gameFrame { + width: 99%; + height: 75vh; + margin: 0.5%; + margin-bottom: 0; + border-radius: 10px; +} +#infobox { + height: 8vh; + width: 100%; + margin: 1% 0; + display: flex; + justify-content: center; + align-items: center; +} +#infobox img { + height: 100%; + margin: 1.5%; + aspect-ratio: 1 / 1; + border-radius: 8px; +} +#infobox h2 { + margin-right: auto; +} \ No newline at end of file diff --git a/css/main.css b/css/main.css new file mode 100755 index 0000000..e5afa66 --- /dev/null +++ b/css/main.css @@ -0,0 +1,70 @@ +@import url("/css/themes.css"); +@import url('https://fonts.googleapis.com/css2?family=Mulish&display=swap'); +:root { + --text-color: #fff; + --bg-1: #5a189a; + --bg-2: #10002b; + --color-1: #E0AAFF; + --color-2: #7B2CBF; + --color-3: #3C096C; + --color-4: #240046; +} +html, +body { + /* height: 100vh; */ + width: 100vw; + color: white; + background-color: black; +} + +* { + padding: 0; + margin: 0; + border: none; + font-family: "Mulish", serif; +} +body { + animation: 1s ease-out loadIn; +} +@keyframes loadIn { + from {opacity: 0;transform: translateY(-32px);} + to {opacity: 1;transform: translateY(0px);} +} + +body { + display: flex; + filter: drop-shadow(0px 0px 4px #ffffff99); +} + +.samerow { + display: flex; + justify-content: center; + gap: 0; + flex-wrap: wrap; + align-items: center; + justify-content: center; +} +.samerow img { + width: 80px; + aspect-ratio: 1 / 1; + padding: 5px; + margin: 10px; + user-select: none; +} + +h1 { + font-size: 48px; + margin: 10px; +} +h2 { + font-size: 32px; + margin: 8px; +} +h3 { + font-size: 24px; + margin: 4px; +} +p { + font-size: 16px; + margin: 2px; +} \ No newline at end of file diff --git a/css/oldstyle.css b/css/oldstyle.css new file mode 100755 index 0000000..6a0502b --- /dev/null +++ b/css/oldstyle.css @@ -0,0 +1,673 @@ +@import url("https://fonts.googleapis.com/css2?family=Prompt:wght@300&display=swap"); + +@keyframes loadInAnimation { + 0% { + opacity: 0; + } + 100% { + opacity: 100; + } +} + +:root { + --inputbg: #3c096c; + --inputborder: #5a189a; + --uibg: #240046; + --textcolor: #fff; + --bg: #10002b; + --margin: 4rem; +} +.hiddenUpload { + display: none; + visibility: hidden; +} +* { + transition-duration: 0.5s; + outline: none; + border: none; + box-sizing: border-box; + align-content: center; + text-align: center; + font-family: "Prompt", sans-serif; + color: var(--textcolor); +} +body { + margin: 0; + padding: 0; + background: var(--bg); + color: var(--textcolor); + background-position: center; + background-repeat: no-repeat; + background-size: cover; + background-attachment: fixed; +} + +header, +footer { + background-color: var(--uibg); + display: flex; + border-bottom: none; + font-weight:700; + padding: 0.7rem; + width: 100%; + z-index: 1; + justify-content: center; + text-align: center; + text-decoration: none; +} + +#time { +font-weight:100; +} +header { + top: 0; + border-radius: 0 0 20px 20px; + position: fixed; + box-shadow: 0 5px 10px var(--uibg); +} + +footer.noscroll { + position: fixed; + overflow: hidden; +} + +footer { + bottom: 0; + border-radius: 20px 20px 0 0; + box-shadow: 0 -5px 10px var(--uibg); +} + +footer a, +footer a:visited, +header a, +header a:visited { + margin-right: 1.5rem; + margin-left: 1.5rem; + text-decoration: none; +} + +footer a:hover, +header a:hover { + text-shadow: 2px 2px 6px var(--textcolor); +} + + +@media only screen and (max-width: 768px) { + header, + footer { + flex-direction: column; + align-items: center; + } + + header { + border-radius: 0; + } + + footer { + border-radius: 0; + } + * { + --margin: 12rem; + } +} + +main { + animation: 1.25s ease-in-out 0s 1 loadInAnimation; + align-items: center; + flex-direction: column; + display: flex; + min-height: calc(100vh - (2 * 0.7rem)); + gap: 0; + flex-wrap: wrap; + margin: auto; + margin-top: var(--margin); + width: 90%; + height:auto; +} +main#main.noscroll { + justify-content: center; +} +h1, +h2, +h3, +p, +a, +label { + margin: 0; + padding: 0; + text-shadow: var(--shadow); +} +.samerow { + display: flex; + justify-content: center; + gap: 0; + flex-wrap: wrap; + align-items: center; + justify-content: center +} +h1 { + font-size: 60px; +} + +h2 { + font-size: 40px; +} +h3 { + font-size: 20px; +} +p, +a { + font-size: 16px; +} + +button, +input#websubmit.submit, +input[type="submit"] { + cursor: pointer; + background-color: var(--inputbg); + border-color: var(--inputborder); + border-width: 2px; + border-radius: 10px; + border-style: solid; + padding: 7px; + margin-left: 20px; + margin-right: 20px; + margin: 10px; +} + +button:hover, +input#websubmit.submit:hover, +input[type="submit"]:hover { + filter: brightness(80%); + transform: scale(1.07); +} + +img { + width: 100%; + aspect-ratio: auto; + user-select: none; + filter: drop-shadow(var(--shadow)); + image-rendering: pixelated; +} + +.img-container a { + width: 100%; +} + +.img-container { + display: flex; + justify-content: center; + align-items: center; + flex-direction: row; + gap: 0; + flex-wrap: wrap; + width: 6%; + aspect-ratio: 1 / 1; + margin: 2%; +} + +.game, +.suggest { + width: 15%; + border-radius: 20px; + display: inline-block; + background-color: var(--uibg); + margin: 15px; + cursor: pointer; + box-shadow: 0px 0px 5px 5px var(--uibg); +} + +.game:hover, +.suggest:hover { + transform: scale(1.1); + filter: brightness(85%); + box-shadow: 0px 0px 5px 5px var(--uibg); +} + +.game h1, +.suggest h1 { + font-size: 12px; + float: right; + margin-right: 10px; + margin-top: 3px; + margin-bottom: 3px; +} + +.game img, +.suggest img { + width: 100%; + border-radius: 20px; + aspect-ratio: 1 / 1; +} + +img.star { + float: left; + width: 10%; + margin-top: 3px; + margin-bottom: 3px; + margin-left: 10px; +} + +#noscroll { + overflow-y: hidden; + justify-content: center; +} + +#games, +#pinned { + width: 100%; + justify-content: center; +} + +input[type="text"], +input[type="password"] { + width: 50%; + background-color: var(--inputbg); + box-sizing: border-box; + font-size: 20px; + padding: 0.8% 0.8%; + text-align: center; + border-radius: 5px; + outline: none; + margin: 10px; + border: 2px solid var(--inputborder); + border-radius: 5px; + transition: opacity 0.25s ease-in-out; + opacity: 100%; +} +input[type="text"]:hover, +input[type="password"]:hover { + opacity: 80%; +} +::placeholder { + color: var(--textcolor); + opacity: 0.4; /* Firefox */ +} + +.bookmarkletdiv { + width: 30%; + background-color: var(--uibg); + box-shadow: 0px 0px 5px 5px var(--uibg); + padding: 5px; + margin: 15px; + border-radius: 10px; + display: inline-block; +} + +.bookmarkletdiv a { + font-size: 30px; +} + +form { + width: 100%; +} +.samerow.themebtns { + width: 70%; +} + +select { + border-radius: 5px; + background-color: var(--inputbg); + border-color: var(--inputborder); + border-width: 5px; + border-radius: 10px; + border-style: solid; + padding: 0.5% 0.5%; + margin: 0.25%; +} + +thumb.png .img-credits { + height: 40vh; + width: auto; + box-shadow: 0px 0px 20px rgba(255, 255, 255, 0.555); +} + +label { + font-size: 20px; + padding-left: 5px; +} +.avatar { + margin: 5px; +} +#bgimg { + width: 30vw; + font-size: 16px; +} +.usericon { + width: 24px; + height: 24px; + align-self: right; + /* display: none; */ +} +#toast { + position: fixed; + top: 0; + right: 0; + margin: 10px; + padding: 10px; + background-color: var(--inputbg); + border-radius: 10px; + border-width: 10px; + border-color: var(--inputborder); + border-style: solid; + z-index: 10000; + text-align: center; + opacity: 0; + transition-duration: 1s; + max-width: 30%; +} +#toast h1 { + font-size: 20px; + text-align: center; +} +#toast p { + font-size: 16px; + text-align: center; +} +#discord { + position: fixed; + bottom: 10px; + right: 10px; + width: 56px; + height: 56px; + z-index: 199975; + border-radius: 100%; + background-image: url("/img/discord.svg"); + background-size: 60%; + background-position: center; + background-repeat: no-repeat; + border-width: 0; +} + +div.profile.top { + width: 90%; + height: 20vh; + background-color: var(--uibg); + border-radius: 10px; + display: flex; + justify-content: left; + align-items: center; + box-shadow: 0px 0px 5px 5px var(--uibg); +} +div.profile.top.text { + position: relative; + display: flex; + flex-direction: column; + width: auto; + justify-self: center; + height: auto; + margin: 30px; + max-width: 40%; +} + +div.profile.top.text.right { + margin-left: auto; + margin-right: 80px; +} + +div.profile.top.text h1 { + font-size: 2vw; +} +div.profile.top.text h2 { + font-size: 1.25vw; +} +div.profile.top.text a { + font-size: 1.25vw; +} + +img.pfp { + height: 80%; + object-fit: contain; + width: auto; + margin: 30px; + border-radius: 20px; + aspect-ratio: 1 / 1; +} +div.profile.top.text .about { + height: auto; + max-width: 100%; +} + +#edit { + cursor: pointer; + position: relative; + height: 2vw; + margin-left: 5px; + width: auto; +} +#counter { + position: absolute; + bottom: 0; + right: 0; +} +#popup { + width: 50%; + height: 40%; + z-index: 99999999; + position: absolute; + position: absolute; + top: 50%; + left: 50vw; + transform: translate(-50%, -50%); + display: flex; + flex-direction: column; + background-color: var(--inputbg); + border-color: var(--inputborder); + border-width: 5px; + border-radius: 10px; + border-style: solid; + justify-content: center; + align-items: center; + box-shadow: 0px 0px 5px 5px var(--uibg); +} +#popup input { + width: 90%; + height: 30%; +} +#popup input[type=file] { + height: auto; + text-align-last: center; + display: block; + margin: 30px; +} +#popup h1 { + font-size: 32px; +} + +#popup #close { + position: absolute; + right: 10px; + top: 10px; + +} +img.badges { + position: relative; + height: 2vw; + margin-left: 5px; + width: auto; +} + +p#counter { + bottom: 38%; + right: 7%; +} + + +.users { + text-decoration: none; + width: 30%; + height: 10vh; + background-color: var(--uibg); + border-radius: 10px; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0px 0px 5px 5px var(--uibg); + margin: 1.5%; +} +.users h1, .users p { + position: relative; + display: flex; + flex-direction: column; + width: 100%; + justify-self: center; + height: auto; + max-width: 100%; + margin: auto; +} +.user_info { + width: 100%; +} + +.users h1 { + font-size: 1vw; +} +.users p { + font-size: 0.75vw; +} +.users a { + font-size: 0.75vw; + text-decoration: underline; +} + +.users p { + height: auto; + max-width: 100%; +} +#users { + width: 95%; + display: flex; + align-items: center; + flex-wrap: wrap; + flex-direction: row; + display: flex; + align-items: center; + justify-content: center; +} + +.pages-btn { + margin: 10px; +} +#ai { + position: absolute; + right: 10px; + bottom: 10px; +} + +div.profile.played { + margin: 40px; + width: 90%; + height: auto; + padding: 30px; + background-color: var(--uibg); + border-radius: 10px; + display: flex; + justify-content: left; + align-items: center; + box-shadow: 0px 0px 5px 5px var(--uibg); + justify-content: center; + flex-wrap: wrap; + +} +#played-games { + width: 100%; + display: flex; + flex-wrap: wrap; + justify-content: center; +} +div.played-game { + width: 13%; + height: auto; + margin: 2%; + padding: 0; +} +div.played-game img { + aspect-ratio: 1 / 1; + border-radius: 20px; +} +.friend-icon { + width: 5%; + position: absolute; + left: 2%; +} +#chat { + width: 90%; + background-color: var(--uibg); + height: calc(100vh - (var(--margin) * 2) - 60px - 24px - 12px - 30px - 80px); +} +#messages { + align-items: end; + flex-direction: column; + overflow-y: scroll; + overflow-x: hidden; + height: 88%; + display: flex; +} +message { + width: calc(100% - 20px); + padding: 20px; + margin: 10px; + background-color: var(--inputbg); + border-radius: 10px; +} +message h1 { + font-size: 40px; +} +message h2 { + font-size: 32px; +} +message.user { + background-color: var(--inputborder); +} +message.bot { + justify-self: right; +} +#chatbox { + width: calc(100% - 20px); +} +.messagebox { + width: 100%; + height: 12%; +} +.evensmaller { + font-size: 12px; +} +#gamecontainer { + width: 80vw; + height: calc(100vh - (var(--margin) * 2)); + padding: 10px; + border-radius: 10px; + background-color: var(--uibg); +} +#gameFrame { + width: 100%; + height: 90%; + border-radius: 10px; + margin: 0; + padding: 0; +} +#infobox { + width: 100%; + height: 10%; + display: flex; +} +#infobox img { + height: 90%; + width: auto; + margin-right: 20px; + border-radius: 10px; +} +@keyframes toastFade { + 0% { + opacity: 0; + } + 15% { + opacity: 1; + } + 85% { + opacity: 1; + } + 100% { + opacity: 0; + } +} \ No newline at end of file diff --git a/css/pages.css b/css/pages.css new file mode 100755 index 0000000..cabf5b3 --- /dev/null +++ b/css/pages.css @@ -0,0 +1,107 @@ +@property --gradient-x { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --gradient-y { + syntax: ""; + inherits: false; + initial-value: 0%; +} +body { + background: rgb(16, 0, 43); + background: radial-gradient( + circle at var(--gradient-x) var(--gradient-y), + var(--bg-1) 0%, + var(--bg-2) 100% + ); + background-size: 100vw 100vh; + background-repeat: no-repeat; + background-attachment: fixed; + transition: --gradient-x 30s ease-in-out, + --gradient-y 30s ease-in-out; + overflow-x: hidden; +} + +body { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; + width: 100vw; + min-height: 100vh; + position: relative; +} +#particles-js { + width: 100vw; + height: 100vh; + position: absolute; + z-index: -1000; + border: none; + overflow-y: hidden; + top: 0; + transition-duration: 0.05s; + transition-timing-function: ease-out; +} +input[type=text] { + width: 70%; + border-style: solid; + border-width: 2px; + padding: 18px; + margin: 5px; + text-align: center; + border-radius: 10px; + background-color: var(--color-2); + border-color: var(--color-3); + color: var(--text-color); + outline: none; + transition-duration: 0.25s; + font-size: 20px; + text-shadow: var(--color-1) 0 0 10px; +} +input[type=text]:focus { + filter:brightness(1.25) !important; +} +input[type=text]:hover { + filter:brightness(1.1); +} +input[type=text]::placeholder { + color: color-mix(in srgb, var(--text-color) 20%, #00000000 80%); + text-shadow: color-mix(in srgb, var(--text-color) 40%, #00000000 60%) 0 0 10px; +} +/* Chrome, Edge and Safari */ +*::-webkit-scrollbar { + height: 10px; + width: 8px; +} +*::-webkit-scrollbar-track { + border-radius: 5px; + background-color: var(--color-4); +} + +*::-webkit-scrollbar-track:hover { + filter:brightness(1.1); +} + +*::-webkit-scrollbar-track:active { + filter:brightness(1.25); +} + +*::-webkit-scrollbar-thumb { + border-radius: 5px; + background-color: var(--color-2); +} + +*::-webkit-scrollbar-thumb:hover { + filter:brightness(1.1); +} + +*::-webkit-scrollbar-thumb:active { + filter:brightness(1.25); +} + +.title { + color: var(--color-1); + text-shadow: var(--color-1) 0 0 24px; +} \ No newline at end of file diff --git a/css/sidebar.css b/css/sidebar.css new file mode 100755 index 0000000..fff123b --- /dev/null +++ b/css/sidebar.css @@ -0,0 +1,58 @@ +body { + overflow: hidden; +} +sidebar { + background-color: linear-gradient(19deg,rgba(87, 199, 133, 1) 0%, rgba(237, 221, 83, 1) 100%);; + height: 100%; + width: 50px; + display: flex; + flex-direction: column; + align-items: center; +} +.sidebar-item { + margin: 6px; + padding: 6px; + height: 26px; + width: 26px; + transition-duration: 0.5s; + transition-timing-function: ease-in-out; +} + +iframe { + width: calc(100% - 50px - 10px); + height: calc(100vh - 20px); + margin: 10px; + margin-right: 0px; + border-radius: 8px; +} + +.sidebar-divider { + height: 2px; + border-radius: 20px; + width: 80%; + background-color: #ffffff22; + /* auto is being stupid + 100vh minus height of 1 object 7 times minus the margin and padding of 7 objects (multiplied twice bc margin and padding on top and bottom) */ + margin-bottom: calc(100vh - 26px * 7 - ((6px + 6px) * 2) * 7); +} + +.sidebar-item-descriptor { + position: fixed; + right: 25px; + opacity: 0; + transform: translateY(-32px); + text-align: left; + background-color: black; + border-radius: 10px; + padding: 8px; + color: white; + font-size: 12px; + user-select: none; + pointer-events: none; + transition: opacity 0.5s 0.2s, right 0.5s 0.2s; + font-family: "Mulish", serif; +} +.sidebar-item:hover .sidebar-item-descriptor { + opacity: 1; + right: 55px; +} \ No newline at end of file diff --git a/css/themes.css b/css/themes.css index 61db16e..1ce53e8 100644 --- a/css/themes.css +++ b/css/themes.css @@ -1,3 +1,4 @@ +<<<<<<< HEAD :root { --inputbg: #3c096c; --inputborder: #5a189a; @@ -293,3 +294,14 @@ body[theme=nighttime] { --shadow: 0px 0px 4px #fff; } +======= +body { + --text-color: #fff; + --bg-1: #5a189a; + --bg-2: #10002b; + --color-1: #E0AAFF; + --color-2: #7B2CBF; + --color-3: #3C096C; + --color-4: #240046; +} +>>>>>>> c2041b6 (first dev commit) diff --git a/home.html b/home.html new file mode 100755 index 0000000..f3ee942 --- /dev/null +++ b/home.html @@ -0,0 +1,88 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Selenite + + + + + +

selenite.

+ +

better thank me for this unblocked website

+
+
+ +
+
+ +
+
+ +
+
+ + diff --git a/img/apps.svg b/img/apps.svg new file mode 100644 index 0000000..0174a7e --- /dev/null +++ b/img/apps.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/bookmarklets.svg b/img/bookmarklets.svg new file mode 100644 index 0000000..ffaa74f --- /dev/null +++ b/img/bookmarklets.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/games.svg b/img/games.svg index 89ba271..64fa48d 100644 --- a/img/games.svg +++ b/img/games.svg @@ -1,3 +1,7 @@ +<<<<<<< HEAD - \ No newline at end of file + +======= + +>>>>>>> c2041b6 (first dev commit) diff --git a/img/home.svg b/img/home.svg new file mode 100644 index 0000000..f572a65 --- /dev/null +++ b/img/home.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/open.svg b/img/open.svg new file mode 100644 index 0000000..c82800a --- /dev/null +++ b/img/open.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/settings.svg b/img/settings.svg new file mode 100644 index 0000000..d871081 --- /dev/null +++ b/img/settings.svg @@ -0,0 +1 @@ + diff --git a/index.html b/index.html index 64e6d57..de9958d 100644 --- a/index.html +++ b/index.html @@ -32,6 +32,7 @@ ] } +<<<<<<< HEAD @@ -60,12 +61,21 @@ +======= + + + + + + +>>>>>>> c2041b6 (first dev commit) Selenite +<<<<<<< HEAD @@ -102,5 +112,52 @@ Donate About
+======= + + + + + + +
home
+
games
+
apps
+
bookmarklets
+
open blank
+
+
user profile
+
settings
+ +>>>>>>> c2041b6 (first dev commit) diff --git a/js/games.js b/js/games.js index c8cee27..0c0ede6 100644 --- a/js/games.js +++ b/js/games.js @@ -1,3 +1,4 @@ +<<<<<<< HEAD $.getJSON("/data/games.json", function (data) { if (document.readyState === "complete") { loadGames(data); @@ -197,3 +198,58 @@ function recommendedGames() { $("#recommend").text("Click to view recommended games!"); } } +======= +document.addEventListener("DOMContentLoaded", loadGames); +let elements = []; +async function loadGames() { + // taken from mdn + // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort + let data = await (await fetch("/data/games.json")).json(); + sorted = data.sort((a, b) => { + const n1 = a.name.toUpperCase(); + const n2 = b.name.toUpperCase(); + if (n1 < n2) { + return -1; + } + if (n1 > n2) { + return 1; + } + // shouldnt happen but just incase + return 0; + }); + let gamesElement = document.getElementById("games"); + sorted.forEach(element => { + let newElement = document.createElement("game"); + newElement.setAttribute("data-target", element.directory); + let image = document.createElement("img"); + image.src = `/semag/${element.directory}/${element.image}` + let title = document.createElement("h1"); + title.innerText = element.name; + newElement.appendChild(image); + newElement.appendChild(title); + gamesElement.appendChild(newElement); + newElement.addEventListener("click", ()=>{ + location.href=`/loader.html?title=${encodeURIComponent(element.name)}&dir=${element.directory}&img=${element.image}` + }) + elements.push(newElement); + }); +} +document.addEventListener("DOMContentLoaded", ()=>{ + document.getElementById("gamesearch").addEventListener("input", ()=>{ + let input = document.getElementById("gamesearch").value.toUpperCase(); + let total = 0; + if(elements.length > 0) { + elements.forEach((element) => { + let title = element.childNodes[1].innerText.toUpperCase(); + if(title.includes(input)) { + element.style.display = "flex"; + } else { + element.style.display = "none"; + total++; + } + }) + } + document.getElementById("noResults").style.display = total >= elements.length ? "flex" : "none" + }) +}) +>>>>>>> c2041b6 (first dev commit) diff --git a/js/main.js b/js/main.js index 49862cd..fd50c0f 100644 --- a/js/main.js +++ b/js/main.js @@ -1,3 +1,4 @@ +<<<<<<< HEAD var interval; document.addEventListener("DOMContentLoaded", function () { if (localStorage.getItem("theme")) { @@ -161,4 +162,218 @@ document.head.appendChild(cookieConsentScript); let cookieConsentStyle = document.createElement("link"); cookieConsentStyle.href = "/js/cookieConsent.css"; cookieConsentStyle.rel = "stylesheet"; -document.head.appendChild(cookieConsentStyle); \ No newline at end of file +document.head.appendChild(cookieConsentStyle); +======= +function setBackground() { + let randomNumbers = [100-Math.abs(Math.floor(Math.random() * 200) - 99), 100-Math.abs(Math.floor(Math.random() * 200) - 99)]; + document.body.style.setProperty("--gradient-x", randomNumbers[0] + "%"); + document.body.style.setProperty("--gradient-y", randomNumbers[1] + "%"); + setTimeout(setBackground, 30000) +} +function loadPJS() { + let div = document.createElement("div"); + div.id = "particles-js"; + document.body.appendChild(div); + let script = document.createElement("script"); + script.src = "https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"; + document.head.appendChild(script); + script.addEventListener("load", ()=>{ + particlesJS.load('particles-js', "js/particlesjs-config.json", ()=>{}); + }); +} + +function cursor() { + let cursor = document.createElement("div"); + cursor.style.width = "30px"; + cursor.style.height = "30px"; + cursor.style.backgroundColor = "var(--color-1)"; + cursor.style.position = "absolute"; + cursor.style.borderRadius = "100%"; + // cursor.style.filter = "blur(40px)"; + cursor.style.pointerEvents = "none"; + document.body.appendChild(cursor); + document.addEventListener("mousemove", (e) => { + cursor.style.top = `${e.clientY - 15}px`; + cursor.style.left = `${e.clientX - 15}px`; + }) +} + +document.addEventListener("DOMContentLoaded", ()=>{ + setBackground(); + loadPJS(); + cursor(); +}) + +document.addEventListener("scroll", ()=>{ + console.log("scroll"); + document.getElementById("particles-js").style.top = window.scrollY + "px"; +}) + + + + +// var interval; +// document.addEventListener("DOMContentLoaded", function () { +// if (localStorage.getItem("theme")) { +// localStorage.setItem("selenite.theme", localStorage.getItem("theme")); +// localStorage.removeItem("theme"); +// } +// if (localStorage.getItem("selenite.theme")) { +// document.body.setAttribute("theme", localStorage.getItem("selenite.theme")); +// } else { +// document.body.setAttribute("theme", "main"); +// } +// if (document.querySelectorAll("[id=adcontainer]")) { +// for (let i = 0; i < document.querySelectorAll("[id=adcontainer]").length; i++) { +// if (Math.random() < 0.5 || localStorage.getItem("selenite.adblock") == "true") document.querySelectorAll("[id=adcontainer]")[i].innerHTML = ""; +// } +// } +// const iconSetting = document.querySelector("input#discordIcon"); +// const blockClose = document.querySelector("input#blockClose"); +// const openBlank = document.getElementById("blank"); +// const bgTheme = document.querySelector("input#bgTheme"); +// // if (document.querySelector("widgetbot-crate")) { +// // if (localStorage.getItem("selenite.discordIcon") == "true") { +// // const widget = document.querySelector("widgetbot-crate"); +// // widget.setAttribute("style", "display:none"); +// // } +// // } +// if (document.querySelector("input#discordIcon")) { +// if (localStorage.getItem("selenite.discordIcon") == "true") { +// iconSetting.checked = true; +// } +// iconSetting.addEventListener("click", () => { +// localStorage.setItem("selenite.discordIcon", iconSetting.checked); +// }); +// } +// if (document.querySelector("input#blockClose")) { +// if (localStorage.getItem("selenite.blockClose") == "true") { +// blockClose.checked = true; +// } +// blockClose.addEventListener("click", () => { +// localStorage.setItem("selenite.blockClose", blockClose.checked); +// }); +// } +// if (document.querySelector("input#tabDisguise")) { +// if (localStorage.getItem("selenite.tabDisguise") == "true") { +// tabDisguise.checked = true; +// } +// tabDisguise.addEventListener("click", () => { +// localStorage.setItem("selenite.tabDisguise", tabDisguise.checked); +// }); +// } +// if (document.querySelector("input#bgTheme")) { +// bgTheme.checked = true; +// } +// document.getElementById("blank").addEventListener("click", () => { +// win = window.open(); +// win.document.body.style.margin = "0"; +// win.document.body.style.height = "100vh"; +// html = ` +//
`; +// win.document.querySelector("html").innerHTML = html; +// win.eval(`let selenite = document.getElementById("selenite");console.log(selenite);selenite.setAttribute("src", "${location.origin}");console.log(selenite);document.getElementById("goBack").addEventListener("click", function () {selenite.contentDocument.location.href = selenite.contentDocument.location.origin;});document.getElementById("reload").addEventListener("click", function () {selenite.contentDocument.location.href = selenite.contentDocument.location.href;})`); +// location.href = "https://google.com"; +// close(); +// }); +// if ($("#panicmode").length > 0) { +// $("#panicmode").prop({ href: panicurl }); +// } +// if ($(".seleniteminified").length > 0) { +// $.get("https://raw.githubusercontent.com/skysthelimitt/selenite-optimized/main/build/bookmark.txt", function (data) { +// $(".seleniteminified").prop({ href: data }); +// }); +// $.get("https://raw.githubusercontent.com/car-axle-client/car-axle-client/v10/dist/build.js", function (data) { +// $(".caraxle").prop({ href: `javascript:${encodeURI(data)}` }); +// }); +// } +// }); +// function setPanicMode() { +// if (!$("#panic").val().startsWith("https")) { +// document.cookie = "panicurl=https://" + $("#panic").val(); +// return; +// } + +// document.cookie = "panicurl=" + $("#panic").val(); +// } +// function copyToClipboard(text) { +// navigator.clipboard.writeText(text); +// alert("Copied text!"); +// } +// function setTheme(theme) { +// localStorage.setItem("selenite.theme", theme); +// document.body.setAttribute("theme", theme); +// if (theme != "custom") { +// document.getElementById("customMenu").style.display = "none"; +// document.body.style = ""; +// } +// } +// function setPanicMode() { +// if (!$("#panic").val().startsWith("https")) { +// document.cookie = "panicurl=https://" + $("#panic").val(); +// return; +// } +// document.cookie = "panicurl=" + $("#panic").val(); +// } +// function setPassword() { +// localStorage.setItem("selenite.password", enc.encode(document.getElementById("pass").value)); +// } +// function delPassword() { +// location.hash = ""; +// localStorage.removeItem("selenite.passwordAtt"); +// localStorage.removeItem("selenite.password"); +// } + +// $(document).ready(function () { +// if (!window.location.href.startsWith("about:")) { +// $("#webicon").attr("placeholder", window.location.href.replace(/\/[^\/]*$/, "/")); +// } +// }); +// function loadScript(a, b) { +// var c = document.createElement("script"); +// (c.type = "text/javascript"), (c.src = a), (c.onload = b), document.head.appendChild(c); +// } +// function toast(message, onclick) { +// const toast = document.createElement("div"); +// toast.setAttribute("id", "toast"); +// console.log(message.time); +// toast.innerHTML = `

${message.title}${message.time ? ` - ${timeAgo(new Date(message.time * 1000))}` : ""}

${message.message}

`; +// toast.style.animation = "toastFade 6s"; +// document.body.appendChild(toast); +// if (onclick) { +// toast.addEventListener("click", onclick); +// toast.style.cursor = "pointer"; +// } +// setTimeout(() => { +// toast.remove(); +// }, 6000); +// } +// function timeAgo(input) { +// const date = input instanceof Date ? input : new Date(input); +// const formatter = new Intl.RelativeTimeFormat("en"); +// const ranges = { +// years: 3600 * 24 * 365, +// months: 3600 * 24 * 30, +// weeks: 3600 * 24 * 7, +// days: 3600 * 24, +// hours: 3600, +// minutes: 60, +// seconds: 1, +// }; +// const secondsElapsed = (date.getTime() - Date.now()) / 1000; +// for (let key in ranges) { +// if (ranges[key] < Math.abs(secondsElapsed)) { +// const delta = secondsElapsed / ranges[key]; +// return formatter.format(Math.round(delta), key); +// } +// } +// } +// let cookieConsentScript = document.createElement("script"); +// cookieConsentScript.src = "/js/cookieConsent.js"; +// document.head.appendChild(cookieConsentScript); +// let cookieConsentStyle = document.createElement("link"); +// cookieConsentStyle.href = "/js/cookieConsent.css"; +// cookieConsentStyle.rel = "stylesheet"; +// document.head.appendChild(cookieConsentStyle); +>>>>>>> c2041b6 (first dev commit) diff --git a/js/particlesjs-config.json b/js/particlesjs-config.json new file mode 100755 index 0000000..afa918c --- /dev/null +++ b/js/particlesjs-config.json @@ -0,0 +1,105 @@ +{ + "particles": { + "number": { + "value": 100, + "density": { + "enable": true, + "value_area": 800 + } + }, + "color": { + "value": "#ffffff" + }, + "shape": { + "type": "circle", + "stroke": { + "width": 0, + "color": "#000000" + }, + "polygon": { + "nb_sides": 1 + } + }, + "opacity": { + "value": 1, + "random": true, + "anim": { + "enable": true, + "speed": 1, + "opacity_min": 0, + "sync": false + } + }, + "size": { + "value": 5, + "random": true, + "anim": { + "enable": true, + "speed": 1, + "size_min": 0.3, + "sync": false + } + }, + "line_linked": { + "enable": false, + "distance": 150, + "color": "#ffffff", + "opacity": 0.4, + "width": 1 + }, + "move": { + "enable": true, + "speed": 0.4, + "direction": "bottom", + "random": true, + "straight": false, + "out_mode": "out", + "bounce": false, + "attract": { + "enable": true, + "rotateX": 5000, + "rotateY": 5000 + } + } + }, + "interactivity": { + "detect_on": "window", + "events": { + "onhover": { + "enable": true, + "mode": "grab" + }, + "onclick": { + "enable": false, + "mode": "repulse" + }, + "resize": true + }, + "modes": { + "grab": { + "distance": 200, + "line_linked": { + "opacity": 0.3 + } + }, + "bubble": { + "distance": 250, + "size": 0, + "duration": 2, + "opacity": 0, + "speed": 3 + }, + "repulse": { + "distance": 50, + "duration": 1 + }, + "push": { + "particles_nb": 4 + }, + "remove": { + "particles_nb": 2 + } + } + }, + "retina_detect": true +} \ No newline at end of file diff --git a/loader.html b/loader.html index a84c4ad..b8ad011 100644 --- a/loader.html +++ b/loader.html @@ -16,6 +16,7 @@ + + + + +>>>>>>> c2041b6 (first dev commit) Selenite +<<<<<<< HEAD
@@ -73,5 +98,18 @@ Donate About +======= + +
+ +
+ +

Selenite

+
+ +
+
+
+>>>>>>> c2041b6 (first dev commit) diff --git a/projects.html b/projects.html index ce7eb50..65d9df8 100644 --- a/projects.html +++ b/projects.html @@ -17,7 +17,13 @@ +<<<<<<< HEAD +======= + + + +>>>>>>> c2041b6 (first dev commit) @@ -31,6 +37,7 @@ crossorigin="anonymous"> +<<<<<<< HEAD
+======= + +
+ + + + + + + + + + + + + + + + +
+ + +

nothing was found! try a new search query.

+
+>>>>>>> c2041b6 (first dev commit)