243 lines
7.3 KiB
HTML
243 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>Elo Worldle</title>
|
|
<script>
|
|
var exports = {};
|
|
</script>
|
|
<!-- <script defer src="chess.js"></script> -->
|
|
<!-- You can still access the unminified files! Just go to,
|
|
e.g, https://elo-worldle.pyrope.net/main.js -->
|
|
<script type="module" src="main.min.js"></script>
|
|
<script type="module" src="gchessboard.min.js"></script>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta content="Elo Worldle" property="og:title" />
|
|
<meta
|
|
content="A game where you guess what bad chess algorithm you are playing against."
|
|
property="og:description"
|
|
/>
|
|
<meta content="https://elo-worldle.pyrope.net/" property="og:url" />
|
|
<meta
|
|
content="https://elo-worldle.pyrope.net/favicon.png"
|
|
property="og:image"
|
|
/>
|
|
<meta content="#538d4e" data-react-helmet="true" name="theme-color" />
|
|
|
|
<meta
|
|
name="description"
|
|
content="A Wordle-like game where you guess what bad chess algorithm you are playing against."
|
|
/>
|
|
|
|
<!-- <link rel="stylesheet" href="./main.css"></link> -->
|
|
<style>
|
|
html {
|
|
background-color: #002121;
|
|
width: 100%;
|
|
height: 100%;
|
|
color: white;
|
|
}
|
|
#board {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: calc(min(90vw, 90vh));
|
|
height: calc(min(90vw, 90vh));
|
|
}
|
|
#game-over,
|
|
#stats,
|
|
#copy-stats,
|
|
#play-again,
|
|
#win-count {
|
|
display: none;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
#game-over,
|
|
#win-count {
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
#stats {
|
|
width: fit-content;
|
|
font-size: x-large;
|
|
font-weight: bold;
|
|
outline: 2px solid white;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
#copy-stats,
|
|
#play-again {
|
|
color: black;
|
|
}
|
|
|
|
#finish {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
:host {
|
|
--square-color-dark: #86a666;
|
|
--square-color-light: #ffffdd;
|
|
}
|
|
|
|
h1,
|
|
pre {
|
|
font-family: "Courier New", Courier, monospace;
|
|
}
|
|
|
|
h1 {
|
|
text-align: center;
|
|
}
|
|
|
|
p {
|
|
font-family: "Times New Roman", Times, serif;
|
|
}
|
|
|
|
#players,
|
|
.player {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
text-align: center;
|
|
}
|
|
|
|
.strikethrough {
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.player {
|
|
width: fit-content;
|
|
}
|
|
.player-name {
|
|
cursor: pointer;
|
|
user-select: none;
|
|
}
|
|
|
|
.correct {
|
|
color: #538d4e;
|
|
}
|
|
|
|
.wrong {
|
|
color: #3a3a3c;
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
footer {
|
|
width: 100%;
|
|
font-size: large;
|
|
text-align: center;
|
|
color: white;
|
|
}
|
|
|
|
a {
|
|
color: white;
|
|
}
|
|
|
|
g-chess-board::part(piece-wb) {
|
|
background-image: url("./piece-wb.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-wr) {
|
|
background-image: url("./piece-wr.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-wp) {
|
|
background-image: url("./piece-wp.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-wn) {
|
|
background-image: url("./piece-wn.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-wk) {
|
|
background-image: url("./piece-wk.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-wq) {
|
|
background-image: url("./piece-wq.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
|
|
g-chess-board::part(piece-bb) {
|
|
background-image: url("./piece-bb.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-br) {
|
|
background-image: url("./piece-br.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-bp) {
|
|
background-image: url("./piece-bp.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-bn) {
|
|
background-image: url("./piece-bn.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-bk) {
|
|
background-image: url("./piece-bk.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
g-chess-board::part(piece-bq) {
|
|
background-image: url("./piece-bq.png");
|
|
image-rendering: pixelated;
|
|
}
|
|
|
|
#dummy-board {
|
|
width: calc(min(90vw, 90vh));
|
|
height: calc(min(90vw, 90vh));
|
|
}
|
|
|
|
.much-tall {
|
|
height: 4130px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="dummy-board"></div>
|
|
<g-chess-board
|
|
id="board"
|
|
fen="start"
|
|
interactive
|
|
turn="white"
|
|
></g-chess-board>
|
|
<button style="display: none" id="finish">
|
|
show me the answer please i toootally guessed already
|
|
</button>
|
|
<h1 id="game-over"></h1>
|
|
<button title="or press `r`" id="play-again">
|
|
> play again <
|
|
</button>
|
|
<pre id="stats"></pre>
|
|
<button title="or press `c`" id="copy-stats">^ copy ^</button>
|
|
<br />
|
|
<h1>Players: (click name to toggle strikethrough)</h1>
|
|
<div id="players" class="much-tall"></div>
|
|
<footer>
|
|
<a href="https://www.youtube.com/watch?v=DpXy041BIlA">Tutorial</a
|
|
><br />
|
|
<a href="http://tom7.org/chess"
|
|
>Piece sprites, board colors, algorithms, etc.</a
|
|
>
|
|
&
|
|
<a
|
|
href="https://sourceforge.net/p/tom7misc/svn/HEAD/tree/trunk/chess/"
|
|
>Original implementations</a
|
|
>
|
|
&
|
|
<a href="http://tom7.org/chess/weak.pdf">Original paper</a>
|
|
by
|
|
<a href="http://tom7.org">tom7</a>
|
|
<br />
|
|
<a href="https://git.pyrope.net/mbk/elo-worldle">Code</a>
|
|
&
|
|
<a href="https://elo-worldle.pyrope.net/paper.pdf">Paper</a>
|
|
by
|
|
<a href="https://pl.pyrope.net/terezi">me</a>
|
|
<div id="win-count"></div>
|
|
</footer>
|
|
</body>
|
|
</html>
|