....

2025-09-01 17:23:40 +09:00
parent 373964146c
commit 90f0ef1cce
11 changed files with 901 additions and 13 deletions
@@ -0,0 +1,49 @@
+<!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>