...
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
<!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/2048.js}"></script>
|
||||
<!-- <link th:href="@{/css/puzzle.css}" rel="stylesheet" />-->
|
||||
<link th:href="@{/css/2048.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>2048</h1>
|
||||
<p>화살표를 터치하거나 키보드 방향키를 이용해 타일을 합쳐보세요!</p>
|
||||
<div class="game-container">
|
||||
<div class="score-container">
|
||||
<strong>점수:</strong> <span id="score">0</span>
|
||||
</div>
|
||||
<div id="game-board"></div>
|
||||
|
||||
<div id="game-over-popup" class="popup-container" style="display:none;">
|
||||
<div class="popup">
|
||||
<h2>게임 오버!</h2>
|
||||
<p>최종 점수: <span id="final-score">0</span></p>
|
||||
<input type="text" id="player-name" placeholder="이름을 입력하세요">
|
||||
<button id="save-score">점수 저장</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ranking-container">
|
||||
<h3>🏆 랭킹</h3>
|
||||
<ol id="ranking-list"></ol>
|
||||
</div>
|
||||
</th:block>
|
||||
</html>
|
||||
@@ -21,10 +21,10 @@
|
||||
<div id="game-controls">
|
||||
<div id="mode-selector">
|
||||
<label>
|
||||
<input type="radio" name="play-mode" value="fill" checked> Fill
|
||||
<input type="radio" name="play-mode" value="fill" checked><span> Fill</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="play-mode" value="mark"> Mark (X)
|
||||
<input type="radio" name="play-mode" value="mark"><span> Mark (X)</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
<!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/sudoku.js}"></script>
|
||||
<!-- <link th:href="@{/css/puzzle.css}" rel="stylesheet" />-->
|
||||
<link th:href="@{/css/sudoku.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">
|
||||
<div id="sudoku-game-app">
|
||||
<div class="container">
|
||||
<h1>스도쿠를 즐겨보세요!</h1>
|
||||
|
||||
<div id="setup-container">
|
||||
<select id="difficulty-select">
|
||||
<option value="easy">쉬움</option>
|
||||
<option value="medium">중간</option>
|
||||
<option value="hard">어려움</option>
|
||||
</select>
|
||||
<button id="start-btn">게임 시작</button>
|
||||
</div>
|
||||
|
||||
<div id="game-container" class="hidden">
|
||||
<div class="game-info">
|
||||
<div id="score">SCORE: 5</div>
|
||||
<div id="timer">00:00</div>
|
||||
</div>
|
||||
<div id="sudoku-board"></div>
|
||||
<div id="number-input-buttons">
|
||||
<button class="num-btn" data-number="1">1</button>
|
||||
<button class="num-btn" data-number="2">2</button>
|
||||
<button class="num-btn" data-number="3">3</button>
|
||||
<button class="num-btn" data-number="4">4</button>
|
||||
<button class="num-btn" data-number="5">5</button>
|
||||
<button class="num-btn" data-number="6">6</button>
|
||||
<button class="num-btn" data-number="7">7</button>
|
||||
<button class="num-btn" data-number="8">8</button>
|
||||
<button class="num-btn" data-number="9">9</button>
|
||||
<button id="undo-btn" class="clear-btn">실행취소</button>
|
||||
</div>
|
||||
|
||||
<div class="action-buttons">
|
||||
<button id="hint-btn">힌트 사용 (-1점)</button>
|
||||
<button id="complete-btn">정답 확인</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="modal-overlay" class="hidden">
|
||||
<div id="modal-content">
|
||||
<h2>🎉 성공! 기록을 남겨주세요.</h2>
|
||||
<input type="text" id="username-input" placeholder="이름을 입력하세요" maxlength="10">
|
||||
<button id="submit-rank-btn">랭킹 등록</button>
|
||||
<hr>
|
||||
<h3>🏆 명예의 전당</h3>
|
||||
<ol id="ranking-list"></ol>
|
||||
<button id="close-modal-btn">닫기</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="game-over-modal" class="hidden">
|
||||
<div id="modal-content">
|
||||
<h2>GAME OVER</h2>
|
||||
<p>포인트를 모두 사용했습니다.</p>
|
||||
<button id="retry-btn">새 게임 시작</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</th:block>
|
||||
</html>
|
||||
@@ -0,0 +1,31 @@
|
||||
<!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/admin-sudoku.js}"></script>
|
||||
<!-- <link th:href="@{/css/puzzle.css}" rel="stylesheet" />-->
|
||||
<link th:href="@{/css/admin-sudoku.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">
|
||||
<div class="container">
|
||||
<h1>스도쿠 퍼즐 생성기</h1>
|
||||
<p>버튼을 누르면 새로운 스도쿠 퍼즐을 생성하여 DB에 저장하고 화면에 보여줍니다.</p>
|
||||
<button id="generate-btn">새 스도쿠 생성</button>
|
||||
<div id="status-message"></div>
|
||||
|
||||
<h2>생성된 퍼즐</h2>
|
||||
<div id="sudoku-board">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</th:block>
|
||||
</html>
|
||||
Reference in New Issue
Block a user