selenite/frontend
1
0
Fork 0
mirror of https://gitlab.com/skysthelimit.dev/selenite.git synced 2025-06-16 02:22:07 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

search bar

Browse Source
This commit is contained in:
Sky 2023-07-22 20:46:43 -04:00
parent fae4582e46
commit e5fd028a18
6 changed files with 82 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
games.json
View File

@ -1,12 +1,37 @@
[ [
{ {
"name": "Testing 1", "name": "this is a new name",
"directory": "adofai",
"image": "icon.png"
},
{
"name": "Online Minecraft",
"directory": "resent-client",
"image": "logo.png"
},
{
"name": "lorem ipsum",
"directory": "vex2",
"image": "icon.png"
},
{
"name": "unique name",
"directory": "vex2",
"image": "icon.png"
},
{
"name": "new name",
"directory": "vex2",
"image": "icon.png"
},
{
"name": "name 38",
"directory": "vex", "directory": "vex",
"image": "icon.png" "image": "icon.png"
}, },
{ {
"name": "Testing 2", "name": "amshduijasdhuihasd",
"directory": "vex2", "directory": "vex",
"image": "icon.png" "image": "icon.png"
} }
] ]

1
img/search.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 -960 960 960" width="48"><path d="M796-121 533-384q-30 26-69.959 40.5T378-329q-108.162 0-183.081-75Q120-479 120-585t75-181q75-75 181.5-75t181 75Q632-691 632-584.85 632-542 618-502q-14 40-42 75l264 262-44 44ZM377-389q81.25 0 138.125-57.5T572-585q0-81-56.875-138.5T377-781q-82.083 0-139.542 57.5Q180-666 180-585t57.458 138.5Q294.917-389 377-389Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 415 B

14
index.html
View File

@ -25,9 +25,10 @@
<meta name="author" content="Website Creator" /> <meta name="author" content="Website Creator" />
<meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width,initial-scale=1">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script src="/js/cookie.js"></script> <script src="./js/cookie.js"></script>
<script src="/js/games.js"></script> <script src="./js/games.js"></script>
<script src="./js/search.js"></script>
</head> </head>
<body> <body>
<div class="content"> <div class="content">
@ -35,12 +36,13 @@
<input class="hiddenUpload" type="file" accept=".save" hidden> <input class="hiddenUpload" type="file" accept=".save" hidden>
<div class="title"><img src="/favicon.png" style="width:4%;"><h2 style="font-size:50px">e-gamepass</h2></div> <div class="title"><img src="./favicon.png" style="width:4%;"><h2 style="font-size:50px">e-gamepass</h2></div>
<p><a href="/bookmarklets.html">Click here for bookmarklets that you can use even if we get blocked!</a> - <a href="https://forms.gle/iBAbXvEDaYTLuEcdA">Want a game to be added? Suggest here!</a> - <a href="https://github.com/skysthelimitt/e-gamepass">Want to help me develop the website? Click here!</a></p> <p><a href="./bookmarklets.html">Click here for bookmarklets that you can use even if we get blocked!</a> - <a href="https://forms.gle/iBAbXvEDaYTLuEcdA">Want a game to be added? Suggest here!</a> - <a href="https://github.com/skysthelimitt/e-gamepass">Want to help me develop the website? Click here!</a></p>
<p><a href="javascript:downloadMainSave()">Download Save</a> - <a href="javascript:uploadMainSave()">Upload Save</a></p><br> <p><a href="javascript:downloadMainSave()">Download Save</a> - <a href="javascript:uploadMainSave()">Upload Save</a></p><br>
<p>Welcome to the new and updated e-gamepass!</p> <input type="text" id="gamesearch" placeholder="Type here to search..">
<p class="uploadResult" style="font-size:20px"></p> <p class="uploadResult" style="font-size:20px"></p>
<br> <br>
<div id="games"></div> <div id="games"></div>
</div> </div>
</body> </body>

17
js/games.js
View File

@ -3,7 +3,8 @@ $.getJSON("/games.json", function (data) {
$('#games').append( $('#games').append(
$('<div>').prop({ $('<div>').prop({
id: 'game', id: 'game',
style: 'cursor: pointer;' style: 'cursor: pointer;',
dir: data[i].directory
}).append( }).append(
$('<img>').prop({ $('<img>').prop({
src: data[i].directory + "/" + data[i].image src: data[i].directory + "/" + data[i].image
@ -12,5 +13,15 @@ $.getJSON("/games.json", function (data) {
$('<h1>').text(data[i].name) $('<h1>').text(data[i].name)
) )
); );
} }
}) });
$(document).ready(function() {
$(document).on("click", "#game", function(event) {
redirectGame($(this).attr("dir"));
});
});
function redirectGame(dir) {
window.location.href = window.location.origin + "/" + dir + "/index.html";
}

11
js/search.js Normal file
View File

@ -0,0 +1,11 @@
$(document).ready(function() {
$('#gamesearch').on('input propertychange paste', function() {
$('#games #game').hide();
var txt = $('#gamesearch').val();
$('#games #game').each(function(){
if($(this).text().toUpperCase().indexOf(txt.toUpperCase()) != -1){
$(this).show();
}
});
});
});

21
style.css
View File

@ -112,4 +112,23 @@ body {
background-position: 15% 100% background-position: 15% 100%
} }
} }
input[type=text] {
width: 50%;
box-sizing: border-box;
font-size: 25px;
background-color: rgba(89, 110, 177, 0.274);
padding: 0.8% 0.8%;
text-align: center;
color: white;
border: 2px solid #527ac4aa;
border-radius: 5px;
outline: none;
opacity: 50%;
transition: opacity .75s ease-in-out;
}
input[type=text]:focus {
opacity: 100%;
}