sudokumaster.net/index.html at master · sudokukit/sudokumaster.net · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html ng-app="Sudoku">
<head>
    <title>Sudoku | Play Sudoku!</title>

    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" >
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <link rel="stylesheet" type="text/css" href="css/hotkeys.min.css">

    <script type="text/javascript" src="js/angular.min.js"></script>
    <script type="text/javascript" src="js/hotkeys.min.js"></script>
    <script type="text/javascript" src="js/sudoku.js"></script>
</head>
<body>
<div ng-controller="sudokuController" class="wrapper">
    <h1>Sudoku</h1>

    <div class="difficulty">
        <div class="stars">
            <i ng-repeat="star in difficulty.stars" class="glyphicon glyphicon-star star"></i>
        </div>
        <div class="description">
            <h4>Difficulty: {{difficulty.name}} ({{difficulty.level}} star{{difficulty.level == 1 ? "" : "s"}})</h4>
        </div>
    </div>

    <div class="puzzle" >
        <table>
            <tr ng-repeat="row in puzzle">
                <td ng-repeat="item in row track by $index" ng-class=" $index == selected.cell && $parent.$index == selected.row ? 'selected' : '' " ng-click="selectCell($parent.$index,$index)">
						<span ng-if="item.given == true" class="given">
						{{item.value == 0 ? ' ' : item.value }}
						</span>
                    <span ng-if="item.given == false">
						{{item.value == 0 ? ' ' : item.value }}
						</span>
                </td>
            </tr>
        </table>
    </div>

    <div class="buttons">
        <h4>{{result}}</h4>

        <button type="button" class="btn btn-danger btn-lg" ng-click="reset()">
            <i class="glyphicon glyphicon-remove"></i>
            Reset
        </button>
        <button type="button" class="btn btn-primary btn-lg" ng-click="validate()">
            <i class="glyphicon glyphicon-ok"></i>
            Check Sudoku
        </button>
        <button type="button" class="btn btn-success btn-lg" ng-click="newGame()">
            <i class="glyphicon glyphicon-play"></i>
            New Game
        </button>
        <button type="button" class="btn btn-warning btn-lg" ng-click="getHelp()">
            <i class="glyphicon glyphicon-eye-open"></i>
            Solve
        </button>
    </div>
    <div class="difficultyButtons">
        <h4>Preferred Difficulty: {{preferredDifficulty.name}}
            <i ng-repeat="star in preferredDifficulty.stars" class="glyphicon glyphicon-star star"></i>
        </h4>
        <div class="btn-group">
            <button type="button" class="btn btn-lg" ng-repeat="difficultyButton in difficulties" ng-click="setPreferredDifficulty(difficultyButton.level)" ng-class="preferredDifficulty == difficultyButton ? 'btn-primary' : 'btn-default'">{{difficultyButton.name}}</button>
        </div>
    </div>
</div>
</body>
</html>