50 lines
1.4 KiB
HTML
50 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<html
|
|
xmlns:th="http://www.thymeleaf.org"
|
|
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
|
|
xmlns:sec="http://www.thymeleaf.org/extras/spring-security"
|
|
layout:decorate="~{layout/default_layout}"
|
|
>
|
|
<th:block layout:fragment="head" id="head">
|
|
<script type="text/javascript" th:src="@{/js/play.js}"></script>
|
|
<!-- <link th:href="@{/css/puzzle.css}" rel="stylesheet" />-->
|
|
<link th:href="@{/css/play.css}" rel="stylesheet" />
|
|
|
|
<script th:inline="javascript">
|
|
|
|
</script>
|
|
<script type="text/javascript" th:src="@{/js/user.js}"></script>
|
|
</th:block >
|
|
<th:block layout:fragment="content">
|
|
<h1>Solve the Puzzle! 🧩</h1>
|
|
|
|
<div id="game-controls">
|
|
<div id="points-info">
|
|
❤️ Points: <span id="points-display">5</span>
|
|
</div>
|
|
<button id="hint-btn">Hint (-1 Point)</button>
|
|
</div>
|
|
|
|
<div id="board-viewport">
|
|
<div id="game-board">
|
|
</div>
|
|
<img id="grayscale-reveal" class="reveal-img" src="" alt="Grayscale version">
|
|
<img id="original-reveal" class="reveal-img" src="" alt="Original version">
|
|
|
|
<div id="result-overlay" class="hidden">
|
|
<div id="result-modal">
|
|
<h2 id="modal-title"></h2>
|
|
<p id="modal-message"></p>
|
|
<div id="modal-buttons">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script th:inline="javascript">
|
|
/*<![CDATA[*/
|
|
const puzzleData = /*[[${puzzle}]]*/ null;
|
|
/*]]>*/
|
|
</script>
|
|
</th:block>
|
|
</html>
|