188 lines
7.0 KiB
HTML
188 lines
7.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Interweb Cafe</title>
|
|
<link rel="icon" type="image/gif" href="/favicon.gif">
|
|
|
|
<link rel="stylesheet" href="/css/custom98.css">
|
|
<!-- <link rel="stylesheet" href="https://unpkg.com/98.css"> -->
|
|
<link rel="stylesheet" href="/css/style.css">
|
|
<link rel="stylesheet" href="/css/scanlines.css">
|
|
|
|
|
|
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/fetch/1.0.0/fetch.min.js"></script>
|
|
<script type="text/javascript" src="/figlet.js"></script>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
|
|
|
|
<div id="container">
|
|
<div class="headerContainer">
|
|
<div class="scanlines">
|
|
<div class="screen">
|
|
<!-- <div class="asciiArt">Görkem's Webspace</div> -->
|
|
<div class="asciiArt">CyberCafe # *</div>
|
|
<script>
|
|
figlet.defaults({ fontPath: "/css" });
|
|
ascii = document.getElementsByClassName("asciiArt");
|
|
|
|
figlet(ascii[0].innerText, "big", function (err, text) {
|
|
if (err) {
|
|
console.log("something went wrong...");
|
|
console.dir(err);
|
|
return;
|
|
}
|
|
console.log(text);
|
|
ascii = document.getElementsByClassName("asciiArt");
|
|
console.log(ascii);
|
|
ascii[0].innerText = text;
|
|
});
|
|
|
|
</script>
|
|
|
|
<!-- <div class="asciiArt"> _____ _ _ _ _ __ __ _
|
|
/ ____(_) (_) | | ( ) \ \ / / | |
|
|
| | __ ___ _ __| | _____ _ __ ___ |/ ___ \ \ /\ / /__| |__ ___ _ __ __ _ ___ ___
|
|
| | |_ |/ _ \| '__| |/ / _ \ '_ ` _ \ / __| \ \/ \/ / _ \ '_ \/ __| '_ \ / _` |/ __/ _ \
|
|
| |__| | (_) | | | < __/ | | | | | \__ \ \ /\ / __/ |_) \__ \ |_) | (_| | (_| __/
|
|
\_____|\___/|_| |_|\_\___|_| |_| |_| |___/ \/ \/ \___|_.__/|___/ .__/ \__,_|\___\___|
|
|
| | v1.2.1
|
|
</div> -->
|
|
</div>
|
|
|
|
<!-- <div id="header" style=" height: 130px; background-position: center center;"></div> -->
|
|
<div id="headerArea">
|
|
|
|
<nav id="navbar" style="">
|
|
<ul>
|
|
|
|
<li><button onclick="location.href='https://gorkem.cc';" class=""><img class="icon"
|
|
style="vertical-align: middle;" src="/images/icons/address_book_home.png"></img>
|
|
<h4>Home</h4>
|
|
</button></li>
|
|
<li><button onclick="location.href='https://gorkem.cc/projects';" class=""><img
|
|
class="icon" style="vertical-align: middle;" src="/images/icons/defragment-0.png"></img>
|
|
<h4>Projects</h4>
|
|
</button></li>
|
|
<li><button onclick="location.href='https://gorkem.cc/blog';" class=""><img class="icon"
|
|
style="vertical-align: middle;"
|
|
src="/images/icons/newspaper.png"></img>
|
|
<h4>Blog</h4>
|
|
</button></li>
|
|
<li><button onclick="javascript:location.href='http://cafe.gorkem.cc'" class="active"><img class="icon"
|
|
style="vertical-align: middle;" src="/images/icons/network_cool_two_pcs-5.png"></img>
|
|
<h4>Café</h4>
|
|
</button></a></li>
|
|
<!-- <li><a href="#"><button><img class="icon" style="vertical-align: middle;" src="./icons/tools_gear-0.png"></img><h4>DIY</h4></button></a></li> -->
|
|
<li><button onclick="location.href='https://gorkem.cc/about';" class=""><img
|
|
class="icon" style="vertical-align: middle;" src="/images/icons/help_sheet-0.png"></img>
|
|
<h4>About</h4>
|
|
</button></li>
|
|
<li><button disabled><img class="icon" style="vertical-align: middle; filter: grayscale(100%);"
|
|
src="/images/icons/internet_connection_wiz-0.png"></img>
|
|
<h4>Library</h4>
|
|
</button></li>
|
|
|
|
<li><button onclick="location.href='https://gorkem.cc/guestbook';" class="" ><img class="icon" style="vertical-align: middle;"
|
|
src="/images/icons/address_book_pad_users.png"></img>
|
|
<h4>Guestbook</h4>
|
|
</button></li>
|
|
|
|
|
|
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<link rel="stylesheet" href="/css/prism-atom-dark.css"/>
|
|
<link rel="stylesheet" href="/css/cafe.css">
|
|
<div class="tooltip" role="tooltip">
|
|
<emoji-picker></emoji-picker>
|
|
</div>
|
|
<div id="flex">
|
|
<div class="loungeContainer">
|
|
<div class="window main-left">
|
|
<div class="title-bar">
|
|
<div class="title-bar-text">Lounge.exe</div>
|
|
<div class="title-bar-controls">
|
|
<!-- <button aria-label="Help"></button> -->
|
|
<button disabled aria-label="Close"></button>
|
|
</div>
|
|
</div>
|
|
<div class="window-body">
|
|
|
|
<main>
|
|
<canvas id="canvas"></canvas>
|
|
|
|
<!-- <canvas id="canvas"></canvas> -->
|
|
|
|
<form id="textInput" action="" >
|
|
<div class="inputWrapper">
|
|
<input placeholder="Say something" maxlength="20" required="required" id="input" autocomplete="off"/><button type="button" id="emojiButton">🙂</button>
|
|
</div>
|
|
<button id="messageButton">Send</button>
|
|
</form>
|
|
|
|
</main>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="loungeText">
|
|
<div class="window main-right">
|
|
<div class="title-bar inactive">
|
|
<div class="title-bar-text">Instructions.txt</div>
|
|
<div class="title-bar-controls">
|
|
<button aria-label="Help"></button>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="window-body">
|
|
<aside id="rightSidebar">
|
|
<ul>
|
|
<li>Click anywhere in the box to <strong>move</strong></li>
|
|
<li>Write <code>/name</code> followed by your name in the text box to <strong>change your name</strong></li>
|
|
<li>You can change your character with <code>/dino</code> followed by <code>1,2,3,4</code> eg. <code>/dino 2</code> </li>
|
|
<li>Use the textbox to <strong>chat</strong> and the emoji button to send <strong>emojis</strong></li>
|
|
<li>Be nice & Have fun!</li>
|
|
<div class="credits">
|
|
Dino sprites by <a href="https://arks.itch.io/dino-characters" target="_blank">@ScissorMarks</a>
|
|
Interior sprites by <a href="https://shubibubi.itch.io/cozy-interior" target="_blank">@shubibubi</a></div>
|
|
|
|
</ul>
|
|
|
|
</aside>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script src="https://cdn.socket.io/4.6.1/socket.io.min.js"></script>
|
|
<script src="./classes/Sprite.js"></script>
|
|
<script src="./classes/Player.js"></script>
|
|
<script type="module" src="https://cdn.jsdelivr.net/npm/emoji-picker-element@^1/index.js"></script>
|
|
<script type="module" src="popup.js"></script>
|
|
<script src="index.js"></script>
|
|
|
|
<footer id="footer"><img src="/images/icons/www.gif"></img></footer>
|
|
|
|
|
|
</div>
|
|
<!-- THIS IS THE CSS !-->
|
|
|
|
|
|
|
|
</body>
|
|
<script data-goatcounter="https://cafe.goatcounter.com/count"
|
|
async src="//gc.zgo.at/count.js"></script>
|
|
</html> |