crosslanguagespotter 0.0.2-java
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/.gitignore +19 -0
- data/Gemfile +3 -0
- data/Rakefile +13 -0
- data/crosslanguagespotter.gemspec +36 -0
- data/examples/ex1.rb +13 -0
- data/examples/services_example.rb +13 -0
- data/lib/crosslanguagespotter/basic.rb +157 -0
- data/lib/crosslanguagespotter/context.rb +139 -0
- data/lib/crosslanguagespotter/figures_evaluator.rb +160 -0
- data/lib/crosslanguagespotter/jaccard.rb +114 -0
- data/lib/crosslanguagespotter/methods/context.rb +127 -0
- data/lib/crosslanguagespotter/methods/jaro.rb +118 -0
- data/lib/crosslanguagespotter/methods/tversky.rb +44 -0
- data/lib/crosslanguagespotter/model_loading.rb +333 -0
- data/lib/crosslanguagespotter/oracle.rb +261 -0
- data/lib/crosslanguagespotter/report.rb +88 -0
- data/lib/crosslanguagespotter/version.rb +5 -0
- data/lib/crosslanguagespotter/wekaintegration.rb +83 -0
- data/lib/crosslanguagespotter.rb +7 -0
- data/lib/jars/weka.jar +0 -0
- data/resources/css/bootstrap-theme.css +346 -0
- data/resources/css/bootstrap-theme.min.css +7 -0
- data/resources/css/bootstrap.css +5780 -0
- data/resources/css/bootstrap.min.css +7 -0
- data/resources/css/highlightstyles/arta.css +160 -0
- data/resources/css/highlightstyles/ascetic.css +50 -0
- data/resources/css/highlightstyles/atelier-dune.dark.css +93 -0
- data/resources/css/highlightstyles/atelier-dune.light.css +93 -0
- data/resources/css/highlightstyles/atelier-forest.dark.css +93 -0
- data/resources/css/highlightstyles/atelier-forest.light.css +93 -0
- data/resources/css/highlightstyles/atelier-heath.dark.css +93 -0
- data/resources/css/highlightstyles/atelier-heath.light.css +93 -0
- data/resources/css/highlightstyles/atelier-lakeside.dark.css +93 -0
- data/resources/css/highlightstyles/atelier-lakeside.light.css +93 -0
- data/resources/css/highlightstyles/atelier-seaside.dark.css +93 -0
- data/resources/css/highlightstyles/atelier-seaside.light.css +93 -0
- data/resources/css/highlightstyles/brown_paper.css +105 -0
- data/resources/css/highlightstyles/brown_papersq.png +0 -0
- data/resources/css/highlightstyles/dark.css +105 -0
- data/resources/css/highlightstyles/default.css +153 -0
- data/resources/css/highlightstyles/docco.css +132 -0
- data/resources/css/highlightstyles/far.css +113 -0
- data/resources/css/highlightstyles/foundation.css +133 -0
- data/resources/css/highlightstyles/github.css +125 -0
- data/resources/css/highlightstyles/googlecode.css +147 -0
- data/resources/css/highlightstyles/idea.css +122 -0
- data/resources/css/highlightstyles/ir_black.css +105 -0
- data/resources/css/highlightstyles/magula.css +123 -0
- data/resources/css/highlightstyles/mono-blue.css +62 -0
- data/resources/css/highlightstyles/monokai.css +127 -0
- data/resources/css/highlightstyles/monokai_sublime.css +149 -0
- data/resources/css/highlightstyles/obsidian.css +154 -0
- data/resources/css/highlightstyles/paraiso.dark.css +93 -0
- data/resources/css/highlightstyles/paraiso.light.css +93 -0
- data/resources/css/highlightstyles/pojoaque.css +106 -0
- data/resources/css/highlightstyles/pojoaque.jpg +0 -0
- data/resources/css/highlightstyles/railscasts.css +182 -0
- data/resources/css/highlightstyles/rainbow.css +112 -0
- data/resources/css/highlightstyles/school_book.css +113 -0
- data/resources/css/highlightstyles/school_book.png +0 -0
- data/resources/css/highlightstyles/solarized_dark.css +107 -0
- data/resources/css/highlightstyles/solarized_light.css +107 -0
- data/resources/css/highlightstyles/sunburst.css +160 -0
- data/resources/css/highlightstyles/tomorrow-night-blue.css +93 -0
- data/resources/css/highlightstyles/tomorrow-night-bright.css +92 -0
- data/resources/css/highlightstyles/tomorrow-night-eighties.css +92 -0
- data/resources/css/highlightstyles/tomorrow-night.css +93 -0
- data/resources/css/highlightstyles/tomorrow.css +90 -0
- data/resources/css/highlightstyles/vs.css +89 -0
- data/resources/css/highlightstyles/xcode.css +158 -0
- data/resources/css/highlightstyles/zenburn.css +117 -0
- data/resources/example.html +1501 -0
- data/resources/js/bootstrap.js +1943 -0
- data/resources/js/bootstrap.min.js +7 -0
- data/resources/js/highlight.pack.js +1 -0
- data/resources/services_example.html +141 -0
- data/resources/template.html +61 -0
- data/test/data/angular-puzzle.GS +111 -0
- data/test/data/angular_puzzle/app.js +66 -0
- data/test/data/angular_puzzle/index.html +67 -0
- data/test/data/angular_puzzle/slidingPuzzle.js +203 -0
- data/test/data/angular_puzzle/wordSearchPuzzle.js +270 -0
- data/test/data/example.html +5 -0
- data/test/data/example.js +4 -0
- data/test/data/services/index.html +33 -0
- data/test/data/services/script.js +15 -0
- data/test/test_helper.rb +9 -0
- data/test/test_parsing.rb +23 -0
- data/test/test_spotter.rb +42 -0
- data/test/test_wekaintegration.rb +43 -0
- metadata +328 -0
|
@@ -0,0 +1,1501 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7
|
+
<title>Cross Language Spotter - Debug Interface</title>
|
|
8
|
+
|
|
9
|
+
<!-- Bootstrap -->
|
|
10
|
+
<link href="css/bootstrap.min.css" rel="stylesheet">
|
|
11
|
+
<link rel="stylesheet" href="css/highlightstyles/default.css">
|
|
12
|
+
|
|
13
|
+
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
|
14
|
+
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
15
|
+
<!--[if lt IE 9]>
|
|
16
|
+
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
|
17
|
+
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
|
18
|
+
<![endif]-->
|
|
19
|
+
|
|
20
|
+
</head>
|
|
21
|
+
<body>
|
|
22
|
+
<div class="container">
|
|
23
|
+
<h1> Cross Language Relations - Console Log</h1>
|
|
24
|
+
|
|
25
|
+
<div class="row text-left">
|
|
26
|
+
<div class="col-md-6">
|
|
27
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
28
|
+
<pre>
|
|
29
|
+
<code class="language-html"}}>
|
|
30
|
+
<link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in types" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.id}}">{{t.<span style="background-color:yellow;padding:2px">title</span>}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
31
|
+
</code>
|
|
32
|
+
</pre>
|
|
33
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
34
|
+
</div>
|
|
35
|
+
<div class="col-md-6">
|
|
36
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
37
|
+
<pre>
|
|
38
|
+
<code class="language-javascript">
|
|
39
|
+
var app = angular.module('puzzleApp', ['slidingPuzzle', 'wordSearchPuzzle']); // puzzle types var types = [ { id: 'sliding-puzzle', <span style="background-color:yellow;padding:2px">title</span>: 'Sliding puzzle' }, { id: 'word-search-puzzle', title: 'Word search puzzle' } ]; /** * Config
|
|
40
|
+
</code>
|
|
41
|
+
</pre>
|
|
42
|
+
</div>
|
|
43
|
+
</div> <!-- end row -->
|
|
44
|
+
|
|
45
|
+
<div class="row text-left">
|
|
46
|
+
<div class="col-md-6">
|
|
47
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
48
|
+
<pre>
|
|
49
|
+
<code class="language-html"}}>
|
|
50
|
+
<link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in types" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.id}}">{{t.<span style="background-color:yellow;padding:2px">title</span>}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
51
|
+
</code>
|
|
52
|
+
</pre>
|
|
53
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
54
|
+
</div>
|
|
55
|
+
<div class="col-md-6">
|
|
56
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
57
|
+
<pre>
|
|
58
|
+
<code class="language-javascript">
|
|
59
|
+
var app = angular.module('puzzleApp', ['slidingPuzzle', 'wordSearchPuzzle']); // puzzle types var types = [ { id: 'sliding-puzzle', title: 'Sliding puzzle' }, { id: 'word-search-puzzle', <span style="background-color:yellow;padding:2px">title</span>: 'Word search puzzle' } ]; /** * Config */
|
|
60
|
+
</code>
|
|
61
|
+
</pre>
|
|
62
|
+
</div>
|
|
63
|
+
</div> <!-- end row -->
|
|
64
|
+
|
|
65
|
+
<div class="row text-left">
|
|
66
|
+
<div class="col-md-6">
|
|
67
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
68
|
+
<pre>
|
|
69
|
+
<code class="language-html"}}>
|
|
70
|
+
		</fieldset><br/> 		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.<span style="background-color:yellow;padding:2px">title</span>}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/>
|
|
71
|
+
</code>
|
|
72
|
+
</pre>
|
|
73
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
74
|
+
</div>
|
|
75
|
+
<div class="col-md-6">
|
|
76
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
77
|
+
<pre>
|
|
78
|
+
<code class="language-javascript">
|
|
79
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', <span style="background-color:yellow;padding:2px">title</span>: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
80
|
+
</code>
|
|
81
|
+
</pre>
|
|
82
|
+
</div>
|
|
83
|
+
</div> <!-- end row -->
|
|
84
|
+
|
|
85
|
+
<div class="row text-left">
|
|
86
|
+
<div class="col-md-6">
|
|
87
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
88
|
+
<pre>
|
|
89
|
+
<code class="language-html"}}>
|
|
90
|
+
		</fieldset><br/> 		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.<span style="background-color:yellow;padding:2px">title</span>}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/>
|
|
91
|
+
</code>
|
|
92
|
+
</pre>
|
|
93
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
94
|
+
</div>
|
|
95
|
+
<div class="col-md-6">
|
|
96
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
97
|
+
<pre>
|
|
98
|
+
<code class="language-javascript">
|
|
99
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', <span style="background-color:yellow;padding:2px">title</span>: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
100
|
+
</code>
|
|
101
|
+
</pre>
|
|
102
|
+
</div>
|
|
103
|
+
</div> <!-- end row -->
|
|
104
|
+
|
|
105
|
+
<div class="row text-left">
|
|
106
|
+
<div class="col-md-6">
|
|
107
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
108
|
+
<pre>
|
|
109
|
+
<code class="language-html"}}>
|
|
110
|
+
		</fieldset><br/> 		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.<span style="background-color:yellow;padding:2px">title</span>}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/>
|
|
111
|
+
</code>
|
|
112
|
+
</pre>
|
|
113
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
114
|
+
</div>
|
|
115
|
+
<div class="col-md-6">
|
|
116
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
117
|
+
<pre>
|
|
118
|
+
<code class="language-javascript">
|
|
119
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', <span style="background-color:yellow;padding:2px">title</span>: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /** * Word search puzzle controller
|
|
120
|
+
</code>
|
|
121
|
+
</pre>
|
|
122
|
+
</div>
|
|
123
|
+
</div> <!-- end row -->
|
|
124
|
+
|
|
125
|
+
<div class="row text-left">
|
|
126
|
+
<div class="col-md-6">
|
|
127
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
128
|
+
<pre>
|
|
129
|
+
<code class="language-html"}}>
|
|
130
|
+
		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">src</span>"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div>
|
|
131
|
+
</code>
|
|
132
|
+
</pre>
|
|
133
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
134
|
+
</div>
|
|
135
|
+
<div class="col-md-6">
|
|
136
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
137
|
+
<pre>
|
|
138
|
+
<code class="language-javascript">
|
|
139
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { <span style="background-color:yellow;padding:2px">src</span>: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
140
|
+
</code>
|
|
141
|
+
</pre>
|
|
142
|
+
</div>
|
|
143
|
+
</div> <!-- end row -->
|
|
144
|
+
|
|
145
|
+
<div class="row text-left">
|
|
146
|
+
<div class="col-md-6">
|
|
147
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
148
|
+
<pre>
|
|
149
|
+
<code class="language-html"}}>
|
|
150
|
+
		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">src</span>"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div>
|
|
151
|
+
</code>
|
|
152
|
+
</pre>
|
|
153
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
154
|
+
</div>
|
|
155
|
+
<div class="col-md-6">
|
|
156
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
157
|
+
<pre>
|
|
158
|
+
<code class="language-javascript">
|
|
159
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { <span style="background-color:yellow;padding:2px">src</span>: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
160
|
+
</code>
|
|
161
|
+
</pre>
|
|
162
|
+
</div>
|
|
163
|
+
</div> <!-- end row -->
|
|
164
|
+
|
|
165
|
+
<div class="row text-left">
|
|
166
|
+
<div class="col-md-6">
|
|
167
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
168
|
+
<pre>
|
|
169
|
+
<code class="language-html"}}>
|
|
170
|
+
		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">src</span>"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div>
|
|
171
|
+
</code>
|
|
172
|
+
</pre>
|
|
173
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
174
|
+
</div>
|
|
175
|
+
<div class="col-md-6">
|
|
176
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
177
|
+
<pre>
|
|
178
|
+
<code class="language-javascript">
|
|
179
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { <span style="background-color:yellow;padding:2px">src</span>: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /** * Word search puzzle controller
|
|
180
|
+
</code>
|
|
181
|
+
</pre>
|
|
182
|
+
</div>
|
|
183
|
+
</div> <!-- end row -->
|
|
184
|
+
|
|
185
|
+
<div class="row text-left">
|
|
186
|
+
<div class="col-md-6">
|
|
187
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
188
|
+
<pre>
|
|
189
|
+
<code class="language-html"}}>
|
|
190
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" <span style="background-color:yellow;padding:2px">src="{{puzzle.src}}"></span></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
191
|
+
</code>
|
|
192
|
+
</pre>
|
|
193
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
194
|
+
</div>
|
|
195
|
+
<div class="col-md-6">
|
|
196
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
197
|
+
<pre>
|
|
198
|
+
<code class="language-javascript">
|
|
199
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { <span style="background-color:yellow;padding:2px">src</span>: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
200
|
+
</code>
|
|
201
|
+
</pre>
|
|
202
|
+
</div>
|
|
203
|
+
</div> <!-- end row -->
|
|
204
|
+
|
|
205
|
+
<div class="row text-left">
|
|
206
|
+
<div class="col-md-6">
|
|
207
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
208
|
+
<pre>
|
|
209
|
+
<code class="language-html"}}>
|
|
210
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" <span style="background-color:yellow;padding:2px">src="{{puzzle.src}}"></span></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
211
|
+
</code>
|
|
212
|
+
</pre>
|
|
213
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
214
|
+
</div>
|
|
215
|
+
<div class="col-md-6">
|
|
216
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
217
|
+
<pre>
|
|
218
|
+
<code class="language-javascript">
|
|
219
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { <span style="background-color:yellow;padding:2px">src</span>: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
220
|
+
</code>
|
|
221
|
+
</pre>
|
|
222
|
+
</div>
|
|
223
|
+
</div> <!-- end row -->
|
|
224
|
+
|
|
225
|
+
<div class="row text-left">
|
|
226
|
+
<div class="col-md-6">
|
|
227
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
228
|
+
<pre>
|
|
229
|
+
<code class="language-html"}}>
|
|
230
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" <span style="background-color:yellow;padding:2px">src="{{puzzle.src}}"></span></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
231
|
+
</code>
|
|
232
|
+
</pre>
|
|
233
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
234
|
+
</div>
|
|
235
|
+
<div class="col-md-6">
|
|
236
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
237
|
+
<pre>
|
|
238
|
+
<code class="language-javascript">
|
|
239
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { <span style="background-color:yellow;padding:2px">src</span>: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /** * Word search puzzle controller
|
|
240
|
+
</code>
|
|
241
|
+
</pre>
|
|
242
|
+
</div>
|
|
243
|
+
</div> <!-- end row -->
|
|
244
|
+
|
|
245
|
+
<div class="row text-left">
|
|
246
|
+
<div class="col-md-6">
|
|
247
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
248
|
+
<pre>
|
|
249
|
+
<code class="language-html"}}>
|
|
250
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.<span style="background-color:yellow;padding:2px">src</span>}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
251
|
+
</code>
|
|
252
|
+
</pre>
|
|
253
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
254
|
+
</div>
|
|
255
|
+
<div class="col-md-6">
|
|
256
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
257
|
+
<pre>
|
|
258
|
+
<code class="language-javascript">
|
|
259
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { <span style="background-color:yellow;padding:2px">src</span>: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
260
|
+
</code>
|
|
261
|
+
</pre>
|
|
262
|
+
</div>
|
|
263
|
+
</div> <!-- end row -->
|
|
264
|
+
|
|
265
|
+
<div class="row text-left">
|
|
266
|
+
<div class="col-md-6">
|
|
267
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
268
|
+
<pre>
|
|
269
|
+
<code class="language-html"}}>
|
|
270
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.<span style="background-color:yellow;padding:2px">src</span>}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
271
|
+
</code>
|
|
272
|
+
</pre>
|
|
273
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
274
|
+
</div>
|
|
275
|
+
<div class="col-md-6">
|
|
276
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
277
|
+
<pre>
|
|
278
|
+
<code class="language-javascript">
|
|
279
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { <span style="background-color:yellow;padding:2px">src</span>: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
280
|
+
</code>
|
|
281
|
+
</pre>
|
|
282
|
+
</div>
|
|
283
|
+
</div> <!-- end row -->
|
|
284
|
+
|
|
285
|
+
<div class="row text-left">
|
|
286
|
+
<div class="col-md-6">
|
|
287
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
288
|
+
<pre>
|
|
289
|
+
<code class="language-html"}}>
|
|
290
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.<span style="background-color:yellow;padding:2px">src</span>}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
291
|
+
</code>
|
|
292
|
+
</pre>
|
|
293
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
294
|
+
</div>
|
|
295
|
+
<div class="col-md-6">
|
|
296
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
297
|
+
<pre>
|
|
298
|
+
<code class="language-javascript">
|
|
299
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { <span style="background-color:yellow;padding:2px">src</span>: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /** * Word search puzzle controller
|
|
300
|
+
</code>
|
|
301
|
+
</pre>
|
|
302
|
+
</div>
|
|
303
|
+
</div> <!-- end row -->
|
|
304
|
+
|
|
305
|
+
<div class="row text-left">
|
|
306
|
+
<div class="col-md-6">
|
|
307
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
308
|
+
<pre>
|
|
309
|
+
<code class="language-html"}}>
|
|
310
|
+
<script type="text/javascript" src="js/puzzle/slidingPuzzle.js"></script> 	<script type="text/javascript" src="js/puzzle/wordSearchPuzzle.js"></script> 	<script type="text/javascript" src="js/app.js"></script> <link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body <span style="background-color:yellow;padding:2px">ng-app="puzzleApp"></span> 	<ul id="types"> 		<li ng-repeat="t in types" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.id}}">{{t.title}}</a> 		</li> 	</ul>
|
|
311
|
+
</code>
|
|
312
|
+
</pre>
|
|
313
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
314
|
+
</div>
|
|
315
|
+
<div class="col-md-6">
|
|
316
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
317
|
+
<pre>
|
|
318
|
+
<code class="language-javascript">
|
|
319
|
+
(function(angular) { 'use strict'; var app = angular.module(<span style="background-color:yellow;padding:2px">'puzzleApp'</span>, ['slidingPuzzle', 'wordSearchPuzzle']); // puzzle types var types = [ { id: 'sliding-puzzle', title: 'Sliding puzzle' }, { id: 'word-search-puzzle', title: 'Word search puzzle' }
|
|
320
|
+
</code>
|
|
321
|
+
</pre>
|
|
322
|
+
</div>
|
|
323
|
+
</div> <!-- end row -->
|
|
324
|
+
|
|
325
|
+
<div class="row text-left">
|
|
326
|
+
<div class="col-md-6">
|
|
327
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
328
|
+
<pre>
|
|
329
|
+
<code class="language-html"}}>
|
|
330
|
+
<link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in types" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.<span style="background-color:yellow;padding:2px">id</span>}}">{{t.title}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
331
|
+
</code>
|
|
332
|
+
</pre>
|
|
333
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
334
|
+
</div>
|
|
335
|
+
<div class="col-md-6">
|
|
336
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
337
|
+
<pre>
|
|
338
|
+
<code class="language-javascript">
|
|
339
|
+
var app = angular.module('puzzleApp', ['slidingPuzzle', 'wordSearchPuzzle']); // puzzle types var types = [ { <span style="background-color:yellow;padding:2px">id</span>: 'sliding-puzzle', title: 'Sliding puzzle' }, { id: 'word-search-puzzle', title: 'Word search puzzle' } ]; /** * Config
|
|
340
|
+
</code>
|
|
341
|
+
</pre>
|
|
342
|
+
</div>
|
|
343
|
+
</div> <!-- end row -->
|
|
344
|
+
|
|
345
|
+
<div class="row text-left">
|
|
346
|
+
<div class="col-md-6">
|
|
347
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
348
|
+
<pre>
|
|
349
|
+
<code class="language-html"}}>
|
|
350
|
+
<link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in types" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.<span style="background-color:yellow;padding:2px">id</span>}}">{{t.title}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
351
|
+
</code>
|
|
352
|
+
</pre>
|
|
353
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
354
|
+
</div>
|
|
355
|
+
<div class="col-md-6">
|
|
356
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
357
|
+
<pre>
|
|
358
|
+
<code class="language-javascript">
|
|
359
|
+
var app = angular.module('puzzleApp', ['slidingPuzzle', 'wordSearchPuzzle']); // puzzle types var types = [ { id: 'sliding-puzzle', title: 'Sliding puzzle' }, { <span style="background-color:yellow;padding:2px">id</span>: 'word-search-puzzle', title: 'Word search puzzle' } ]; /** * Config */
|
|
360
|
+
</code>
|
|
361
|
+
</pre>
|
|
362
|
+
</div>
|
|
363
|
+
</div> <!-- end row -->
|
|
364
|
+
|
|
365
|
+
<div class="row text-left">
|
|
366
|
+
<div class="col-md-6">
|
|
367
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
368
|
+
<pre>
|
|
369
|
+
<code class="language-html"}}>
|
|
370
|
+
	<script type="text/javascript" src="js/app.js"></script> <link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in <span style="background-color:yellow;padding:2px">types</span>" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.id}}">{{t.title}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
371
|
+
</code>
|
|
372
|
+
</pre>
|
|
373
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
374
|
+
</div>
|
|
375
|
+
<div class="col-md-6">
|
|
376
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
377
|
+
<pre>
|
|
378
|
+
<code class="language-javascript">
|
|
379
|
+
'use strict'; var app = angular.module('puzzleApp', ['slidingPuzzle', 'wordSearchPuzzle']); // puzzle types var <span style="background-color:yellow;padding:2px">types</span> = [ { id: 'sliding-puzzle', title: 'Sliding puzzle' }, { id: 'word-search-puzzle', title: 'Word search puzzle' } ]; /**
|
|
380
|
+
</code>
|
|
381
|
+
</pre>
|
|
382
|
+
</div>
|
|
383
|
+
</div> <!-- end row -->
|
|
384
|
+
|
|
385
|
+
<div class="row text-left">
|
|
386
|
+
<div class="col-md-6">
|
|
387
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
388
|
+
<pre>
|
|
389
|
+
<code class="language-html"}}>
|
|
390
|
+
	<script type="text/javascript" src="js/app.js"></script> <link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in <span style="background-color:yellow;padding:2px">types</span>" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.id}}">{{t.title}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
391
|
+
</code>
|
|
392
|
+
</pre>
|
|
393
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
394
|
+
</div>
|
|
395
|
+
<div class="col-md-6">
|
|
396
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
397
|
+
<pre>
|
|
398
|
+
<code class="language-javascript">
|
|
399
|
+
/** * Startup */ app.run(function($rootScope, $route, $filter) { $rootScope.<span style="background-color:yellow;padding:2px">types</span> = types; $rootScope.type = types[0].id; // set type on route change $rootScope.$on('$routeChangeSuccess', function(event, route) { $rootScope.type = ($filter('filter')(types, { id: route.params.type }).length ? route.params.type : types[0].id);
|
|
400
|
+
</code>
|
|
401
|
+
</pre>
|
|
402
|
+
</div>
|
|
403
|
+
</div> <!-- end row -->
|
|
404
|
+
|
|
405
|
+
<div class="row text-left">
|
|
406
|
+
<div class="col-md-6">
|
|
407
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
408
|
+
<pre>
|
|
409
|
+
<code class="language-html"}}>
|
|
410
|
+
	<script type="text/javascript" src="js/app.js"></script> <link rel="stylesheet" type="text/css" href="css/styles.css"/> </head> <body ng-app="puzzleApp"> 	<ul id="types"> 		<li ng-repeat="t in <span style="background-color:yellow;padding:2px">types</span>" ng-class="{'selected': t.id == type}"> 			<a ng-href="#/{{t.id}}">{{t.title}}</a> 		</li> 	</ul> 	<div ng-include="type"></div>
|
|
411
|
+
</code>
|
|
412
|
+
</pre>
|
|
413
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
414
|
+
</div>
|
|
415
|
+
<div class="col-md-6">
|
|
416
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
417
|
+
<pre>
|
|
418
|
+
<code class="language-javascript">
|
|
419
|
+
/** * Startup */ app.run(function($rootScope, $route, $filter) { $rootScope.types = <span style="background-color:yellow;padding:2px">types</span>; $rootScope.type = types[0].id; // set type on route change $rootScope.$on('$routeChangeSuccess', function(event, route) { $rootScope.type = ($filter('filter')(types, { id: route.params.type }).length ? route.params.type : types[0].id);
|
|
420
|
+
</code>
|
|
421
|
+
</pre>
|
|
422
|
+
</div>
|
|
423
|
+
</div> <!-- end row -->
|
|
424
|
+
|
|
425
|
+
<div class="row text-left">
|
|
426
|
+
<div class="col-md-6">
|
|
427
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
428
|
+
<pre>
|
|
429
|
+
<code class="language-html"}}>
|
|
430
|
+
				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div <span style="background-color:yellow;padding:2px">class="size"></span> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div>
|
|
431
|
+
</code>
|
|
432
|
+
</pre>
|
|
433
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
434
|
+
</div>
|
|
435
|
+
<div class="col-md-6">
|
|
436
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
437
|
+
<pre>
|
|
438
|
+
<code class="language-javascript">
|
|
439
|
+
'<tr ng-repeat="($row, row) in puzzle.grid">' + '<td ng-repeat="($col, tile) in row" ng-click="puzzle.move($row, $col)" ng-style="tile.style" ng-class="{\'puzzle-empty\': tile.empty}" title="{{tile.id}}"></td>' + '</tr>' + '</table>', scope: { <span style="background-color:yellow;padding:2px">size</span>: '@', src: '@', api: '=' }, link: function(scope, element, attrs) { var rows, cols,
|
|
440
|
+
</code>
|
|
441
|
+
</pre>
|
|
442
|
+
</div>
|
|
443
|
+
</div> <!-- end row -->
|
|
444
|
+
|
|
445
|
+
<div class="row text-left">
|
|
446
|
+
<div class="col-md-6">
|
|
447
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
448
|
+
<pre>
|
|
449
|
+
<code class="language-html"}}>
|
|
450
|
+
		<fieldset id="sliding-simple"> 			<legend>Basic</legend> 			<sliding-puzzle size="3x3" src="img/angular.png"></sliding-puzzle> 		</fieldset><br/> 		<fieldset id="sliding-advanced" <span style="background-color:yellow;padding:2px">ng-controller="slidingAdvancedCtrl"></span> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in puzzles"> 				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/>
|
|
451
|
+
</code>
|
|
452
|
+
</pre>
|
|
453
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
454
|
+
</div>
|
|
455
|
+
<div class="col-md-6">
|
|
456
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
457
|
+
<pre>
|
|
458
|
+
<code class="language-javascript">
|
|
459
|
+
}); /** * Advanced sliding puzzle controller */ app.controller(<span style="background-color:yellow;padding:2px">'slidingAdvancedCtrl'</span>, function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ];
|
|
460
|
+
</code>
|
|
461
|
+
</pre>
|
|
462
|
+
</div>
|
|
463
|
+
</div> <!-- end row -->
|
|
464
|
+
|
|
465
|
+
<div class="row text-left">
|
|
466
|
+
<div class="col-md-6">
|
|
467
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
468
|
+
<pre>
|
|
469
|
+
<code class="language-html"}}>
|
|
470
|
+
			<sliding-puzzle size="3x3" src="img/angular.png"></sliding-puzzle> 		</fieldset><br/> 		<fieldset id="sliding-advanced" ng-controller="slidingAdvancedCtrl"> 			<legend>Advanced</legend> 			<div ng-repeat="puzzle in <span style="background-color:yellow;padding:2px">puzzles</span>"> 				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status">
|
|
471
|
+
</code>
|
|
472
|
+
</pre>
|
|
473
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
474
|
+
</div>
|
|
475
|
+
<div class="col-md-6">
|
|
476
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
477
|
+
<pre>
|
|
478
|
+
<code class="language-javascript">
|
|
479
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.<span style="background-color:yellow;padding:2px">puzzles</span> = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
480
|
+
</code>
|
|
481
|
+
</pre>
|
|
482
|
+
</div>
|
|
483
|
+
</div> <!-- end row -->
|
|
484
|
+
|
|
485
|
+
<div class="row text-left">
|
|
486
|
+
<div class="col-md-6">
|
|
487
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
488
|
+
<pre>
|
|
489
|
+
<code class="language-html"}}>
|
|
490
|
+
				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.<span style="background-color:yellow;padding:2px">api</span>.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/>
|
|
491
|
+
</code>
|
|
492
|
+
</pre>
|
|
493
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
494
|
+
</div>
|
|
495
|
+
<div class="col-md-6">
|
|
496
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
497
|
+
<pre>
|
|
498
|
+
<code class="language-javascript">
|
|
499
|
+
image = new Image(); function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.<span style="background-color:yellow;padding:2px">api</span>) { scope.api = scope.puzzle; } tile(); }
|
|
500
|
+
</code>
|
|
501
|
+
</pre>
|
|
502
|
+
</div>
|
|
503
|
+
</div> <!-- end row -->
|
|
504
|
+
|
|
505
|
+
<div class="row text-left">
|
|
506
|
+
<div class="col-md-6">
|
|
507
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
508
|
+
<pre>
|
|
509
|
+
<code class="language-html"}}>
|
|
510
|
+
				<h2>{{puzzle.title}}</h2> 				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.<span style="background-color:yellow;padding:2px">api</span>.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/>
|
|
511
|
+
</code>
|
|
512
|
+
</pre>
|
|
513
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
514
|
+
</div>
|
|
515
|
+
<div class="col-md-6">
|
|
516
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
517
|
+
<pre>
|
|
518
|
+
<code class="language-javascript">
|
|
519
|
+
function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.api) { scope.<span style="background-color:yellow;padding:2px">api</span> = scope.puzzle; } tile(); }
|
|
520
|
+
</code>
|
|
521
|
+
</pre>
|
|
522
|
+
</div>
|
|
523
|
+
</div> <!-- end row -->
|
|
524
|
+
|
|
525
|
+
<div class="row text-left">
|
|
526
|
+
<div class="col-md-6">
|
|
527
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
528
|
+
<pre>
|
|
529
|
+
<code class="language-html"}}>
|
|
530
|
+
				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.<span style="background-color:yellow;padding:2px">api</span>.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button>
|
|
531
|
+
</code>
|
|
532
|
+
</pre>
|
|
533
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
534
|
+
</div>
|
|
535
|
+
<div class="col-md-6">
|
|
536
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
537
|
+
<pre>
|
|
538
|
+
<code class="language-javascript">
|
|
539
|
+
image = new Image(); function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.<span style="background-color:yellow;padding:2px">api</span>) { scope.api = scope.puzzle; } tile(); }
|
|
540
|
+
</code>
|
|
541
|
+
</pre>
|
|
542
|
+
</div>
|
|
543
|
+
</div> <!-- end row -->
|
|
544
|
+
|
|
545
|
+
<div class="row text-left">
|
|
546
|
+
<div class="col-md-6">
|
|
547
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
548
|
+
<pre>
|
|
549
|
+
<code class="language-html"}}>
|
|
550
|
+
				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.<span style="background-color:yellow;padding:2px">api</span>.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button>
|
|
551
|
+
</code>
|
|
552
|
+
</pre>
|
|
553
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
554
|
+
</div>
|
|
555
|
+
<div class="col-md-6">
|
|
556
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
557
|
+
<pre>
|
|
558
|
+
<code class="language-javascript">
|
|
559
|
+
function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.api) { scope.<span style="background-color:yellow;padding:2px">api</span> = scope.puzzle; } tile(); }
|
|
560
|
+
</code>
|
|
561
|
+
</pre>
|
|
562
|
+
</div>
|
|
563
|
+
</div> <!-- end row -->
|
|
564
|
+
|
|
565
|
+
<div class="row text-left">
|
|
566
|
+
<div class="col-md-6">
|
|
567
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
568
|
+
<pre>
|
|
569
|
+
<code class="language-html"}}>
|
|
570
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.<span style="background-color:yellow;padding:2px">api</span>.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
571
|
+
</code>
|
|
572
|
+
</pre>
|
|
573
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
574
|
+
</div>
|
|
575
|
+
<div class="col-md-6">
|
|
576
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
577
|
+
<pre>
|
|
578
|
+
<code class="language-javascript">
|
|
579
|
+
image = new Image(); function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.<span style="background-color:yellow;padding:2px">api</span>) { scope.api = scope.puzzle; } tile(); }
|
|
580
|
+
</code>
|
|
581
|
+
</pre>
|
|
582
|
+
</div>
|
|
583
|
+
</div> <!-- end row -->
|
|
584
|
+
|
|
585
|
+
<div class="row text-left">
|
|
586
|
+
<div class="col-md-6">
|
|
587
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
588
|
+
<pre>
|
|
589
|
+
<code class="language-html"}}>
|
|
590
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.<span style="background-color:yellow;padding:2px">api</span>.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
591
|
+
</code>
|
|
592
|
+
</pre>
|
|
593
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
594
|
+
</div>
|
|
595
|
+
<div class="col-md-6">
|
|
596
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
597
|
+
<pre>
|
|
598
|
+
<code class="language-javascript">
|
|
599
|
+
function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.api) { scope.<span style="background-color:yellow;padding:2px">api</span> = scope.puzzle; } tile(); }
|
|
600
|
+
</code>
|
|
601
|
+
</pre>
|
|
602
|
+
</div>
|
|
603
|
+
</div> <!-- end row -->
|
|
604
|
+
|
|
605
|
+
<div class="row text-left">
|
|
606
|
+
<div class="col-md-6">
|
|
607
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
608
|
+
<pre>
|
|
609
|
+
<code class="language-html"}}>
|
|
610
|
+
				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.<span style="background-color:yellow;padding:2px">api</span>.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script>
|
|
611
|
+
</code>
|
|
612
|
+
</pre>
|
|
613
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
614
|
+
</div>
|
|
615
|
+
<div class="col-md-6">
|
|
616
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
617
|
+
<pre>
|
|
618
|
+
<code class="language-javascript">
|
|
619
|
+
image = new Image(); function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.<span style="background-color:yellow;padding:2px">api</span>) { scope.api = scope.puzzle; } tile(); }
|
|
620
|
+
</code>
|
|
621
|
+
</pre>
|
|
622
|
+
</div>
|
|
623
|
+
</div> <!-- end row -->
|
|
624
|
+
|
|
625
|
+
<div class="row text-left">
|
|
626
|
+
<div class="col-md-6">
|
|
627
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
628
|
+
<pre>
|
|
629
|
+
<code class="language-html"}}>
|
|
630
|
+
				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.<span style="background-color:yellow;padding:2px">api</span>.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script>
|
|
631
|
+
</code>
|
|
632
|
+
</pre>
|
|
633
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
634
|
+
</div>
|
|
635
|
+
<div class="col-md-6">
|
|
636
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
637
|
+
<pre>
|
|
638
|
+
<code class="language-javascript">
|
|
639
|
+
function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.api) { scope.<span style="background-color:yellow;padding:2px">api</span> = scope.puzzle; } tile(); }
|
|
640
|
+
</code>
|
|
641
|
+
</pre>
|
|
642
|
+
</div>
|
|
643
|
+
</div> <!-- end row -->
|
|
644
|
+
|
|
645
|
+
<div class="row text-left">
|
|
646
|
+
<div class="col-md-6">
|
|
647
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
648
|
+
<pre>
|
|
649
|
+
<code class="language-html"}}>
|
|
650
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle <span style="background-color:yellow;padding:2px">api="puzzle.api" </span>size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
651
|
+
</code>
|
|
652
|
+
</pre>
|
|
653
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
654
|
+
</div>
|
|
655
|
+
<div class="col-md-6">
|
|
656
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
657
|
+
<pre>
|
|
658
|
+
<code class="language-javascript">
|
|
659
|
+
image = new Image(); function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.<span style="background-color:yellow;padding:2px">api</span>) { scope.api = scope.puzzle; } tile(); }
|
|
660
|
+
</code>
|
|
661
|
+
</pre>
|
|
662
|
+
</div>
|
|
663
|
+
</div> <!-- end row -->
|
|
664
|
+
|
|
665
|
+
<div class="row text-left">
|
|
666
|
+
<div class="col-md-6">
|
|
667
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
668
|
+
<pre>
|
|
669
|
+
<code class="language-html"}}>
|
|
670
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle <span style="background-color:yellow;padding:2px">api="puzzle.api" </span>size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
671
|
+
</code>
|
|
672
|
+
</pre>
|
|
673
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
674
|
+
</div>
|
|
675
|
+
<div class="col-md-6">
|
|
676
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
677
|
+
<pre>
|
|
678
|
+
<code class="language-javascript">
|
|
679
|
+
function create() { scope.puzzle = slidingPuzzle(rows, cols); if (attrs.api) { scope.<span style="background-color:yellow;padding:2px">api</span> = scope.puzzle; } tile(); }
|
|
680
|
+
</code>
|
|
681
|
+
</pre>
|
|
682
|
+
</div>
|
|
683
|
+
</div> <!-- end row -->
|
|
684
|
+
|
|
685
|
+
<div class="row text-left">
|
|
686
|
+
<div class="col-md-6">
|
|
687
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
688
|
+
<pre>
|
|
689
|
+
<code class="language-html"}}>
|
|
690
|
+
			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" <span style="background-color:yellow;padding:2px">api="puzzle"></span></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.solved" class="solve">solve</button> 				<strong ng-show="puzzle.solved" ng-show="puzzle.solved">Solved!</strong> 			</div> 		</div>
|
|
691
|
+
</code>
|
|
692
|
+
</pre>
|
|
693
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
694
|
+
</div>
|
|
695
|
+
<div class="col-md-6">
|
|
696
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
697
|
+
<pre>
|
|
698
|
+
<code class="language-javascript">
|
|
699
|
+
// setup puzzle scope.$watch('matrix', function(matrix) { scope.puzzle = wordSearchPuzzle(matrix, scope.words); // link service if (attrs.<span style="background-color:yellow;padding:2px">api</span>) { scope.api = scope.puzzle; } }); /**
|
|
700
|
+
</code>
|
|
701
|
+
</pre>
|
|
702
|
+
</div>
|
|
703
|
+
</div> <!-- end row -->
|
|
704
|
+
|
|
705
|
+
<div class="row text-left">
|
|
706
|
+
<div class="col-md-6">
|
|
707
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
708
|
+
<pre>
|
|
709
|
+
<code class="language-html"}}>
|
|
710
|
+
			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" <span style="background-color:yellow;padding:2px">api="puzzle"></span></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.solved" class="solve">solve</button> 				<strong ng-show="puzzle.solved" ng-show="puzzle.solved">Solved!</strong> 			</div> 		</div>
|
|
711
|
+
</code>
|
|
712
|
+
</pre>
|
|
713
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
714
|
+
</div>
|
|
715
|
+
<div class="col-md-6">
|
|
716
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
717
|
+
<pre>
|
|
718
|
+
<code class="language-javascript">
|
|
719
|
+
scope.$watch('matrix', function(matrix) { scope.puzzle = wordSearchPuzzle(matrix, scope.words); // link service if (attrs.api) { scope.<span style="background-color:yellow;padding:2px">api</span> = scope.puzzle; } }); /** * Selected items
|
|
720
|
+
</code>
|
|
721
|
+
</pre>
|
|
722
|
+
</div>
|
|
723
|
+
</div> <!-- end row -->
|
|
724
|
+
|
|
725
|
+
<div class="row text-left">
|
|
726
|
+
<div class="col-md-6">
|
|
727
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
728
|
+
<pre>
|
|
729
|
+
<code class="language-html"}}>
|
|
730
|
+
				<div class="src"> 					<input type="text" ng-model="puzzle.src"/> 				</div> 				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.<span style="background-color:yellow;padding:2px">isSolved</span>()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button>
|
|
731
|
+
</code>
|
|
732
|
+
</pre>
|
|
733
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
734
|
+
</div>
|
|
735
|
+
<div class="col-md-6">
|
|
736
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
737
|
+
<pre>
|
|
738
|
+
<code class="language-javascript">
|
|
739
|
+
/** * Is solved? * @type {Boolean} */ this.<span style="background-color:yellow;padding:2px">isSolved</span> = function() { var id = 1; for (var row = 0; row < rows; row++) { for (var col = 0; col < cols; col++) { if (this.grid[row][col].id !== id++) { return false;
|
|
740
|
+
</code>
|
|
741
|
+
</pre>
|
|
742
|
+
</div>
|
|
743
|
+
</div> <!-- end row -->
|
|
744
|
+
|
|
745
|
+
<div class="row text-left">
|
|
746
|
+
<div class="col-md-6">
|
|
747
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
748
|
+
<pre>
|
|
749
|
+
<code class="language-html"}}>
|
|
750
|
+
				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">rows</span>" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle>
|
|
751
|
+
</code>
|
|
752
|
+
</pre>
|
|
753
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
754
|
+
</div>
|
|
755
|
+
<div class="col-md-6">
|
|
756
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
757
|
+
<pre>
|
|
758
|
+
<code class="language-javascript">
|
|
759
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', <span style="background-color:yellow;padding:2px">rows</span>: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
760
|
+
</code>
|
|
761
|
+
</pre>
|
|
762
|
+
</div>
|
|
763
|
+
</div> <!-- end row -->
|
|
764
|
+
|
|
765
|
+
<div class="row text-left">
|
|
766
|
+
<div class="col-md-6">
|
|
767
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
768
|
+
<pre>
|
|
769
|
+
<code class="language-html"}}>
|
|
770
|
+
				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">rows</span>" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle>
|
|
771
|
+
</code>
|
|
772
|
+
</pre>
|
|
773
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
774
|
+
</div>
|
|
775
|
+
<div class="col-md-6">
|
|
776
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
777
|
+
<pre>
|
|
778
|
+
<code class="language-javascript">
|
|
779
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', <span style="background-color:yellow;padding:2px">rows</span>: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
780
|
+
</code>
|
|
781
|
+
</pre>
|
|
782
|
+
</div>
|
|
783
|
+
</div> <!-- end row -->
|
|
784
|
+
|
|
785
|
+
<div class="row text-left">
|
|
786
|
+
<div class="col-md-6">
|
|
787
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
788
|
+
<pre>
|
|
789
|
+
<code class="language-html"}}>
|
|
790
|
+
				<div class="status"> 					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">rows</span>" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle>
|
|
791
|
+
</code>
|
|
792
|
+
</pre>
|
|
793
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
794
|
+
</div>
|
|
795
|
+
<div class="col-md-6">
|
|
796
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
797
|
+
<pre>
|
|
798
|
+
<code class="language-javascript">
|
|
799
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', <span style="background-color:yellow;padding:2px">rows</span>: 4, cols: 3 } ]; }); /** * Word search puzzle controller
|
|
800
|
+
</code>
|
|
801
|
+
</pre>
|
|
802
|
+
</div>
|
|
803
|
+
</div> <!-- end row -->
|
|
804
|
+
|
|
805
|
+
<div class="row text-left">
|
|
806
|
+
<div class="col-md-6">
|
|
807
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
808
|
+
<pre>
|
|
809
|
+
<code class="language-html"}}>
|
|
810
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.<span style="background-color:yellow;padding:2px">rows</span>}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
811
|
+
</code>
|
|
812
|
+
</pre>
|
|
813
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
814
|
+
</div>
|
|
815
|
+
<div class="col-md-6">
|
|
816
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
817
|
+
<pre>
|
|
818
|
+
<code class="language-javascript">
|
|
819
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', <span style="background-color:yellow;padding:2px">rows</span>: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
820
|
+
</code>
|
|
821
|
+
</pre>
|
|
822
|
+
</div>
|
|
823
|
+
</div> <!-- end row -->
|
|
824
|
+
|
|
825
|
+
<div class="row text-left">
|
|
826
|
+
<div class="col-md-6">
|
|
827
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
828
|
+
<pre>
|
|
829
|
+
<code class="language-html"}}>
|
|
830
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.<span style="background-color:yellow;padding:2px">rows</span>}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
831
|
+
</code>
|
|
832
|
+
</pre>
|
|
833
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
834
|
+
</div>
|
|
835
|
+
<div class="col-md-6">
|
|
836
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
837
|
+
<pre>
|
|
838
|
+
<code class="language-javascript">
|
|
839
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', <span style="background-color:yellow;padding:2px">rows</span>: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
840
|
+
</code>
|
|
841
|
+
</pre>
|
|
842
|
+
</div>
|
|
843
|
+
</div> <!-- end row -->
|
|
844
|
+
|
|
845
|
+
<div class="row text-left">
|
|
846
|
+
<div class="col-md-6">
|
|
847
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
848
|
+
<pre>
|
|
849
|
+
<code class="language-html"}}>
|
|
850
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.<span style="background-color:yellow;padding:2px">rows</span>}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
851
|
+
</code>
|
|
852
|
+
</pre>
|
|
853
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
854
|
+
</div>
|
|
855
|
+
<div class="col-md-6">
|
|
856
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
857
|
+
<pre>
|
|
858
|
+
<code class="language-javascript">
|
|
859
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', <span style="background-color:yellow;padding:2px">rows</span>: 4, cols: 3 } ]; }); /** * Word search puzzle controller
|
|
860
|
+
</code>
|
|
861
|
+
</pre>
|
|
862
|
+
</div>
|
|
863
|
+
</div> <!-- end row -->
|
|
864
|
+
|
|
865
|
+
<div class="row text-left">
|
|
866
|
+
<div class="col-md-6">
|
|
867
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
868
|
+
<pre>
|
|
869
|
+
<code class="language-html"}}>
|
|
870
|
+
					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">cols</span>" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div>
|
|
871
|
+
</code>
|
|
872
|
+
</pre>
|
|
873
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
874
|
+
</div>
|
|
875
|
+
<div class="col-md-6">
|
|
876
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
877
|
+
<pre>
|
|
878
|
+
<code class="language-javascript">
|
|
879
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, <span style="background-color:yellow;padding:2px">cols</span>: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
880
|
+
</code>
|
|
881
|
+
</pre>
|
|
882
|
+
</div>
|
|
883
|
+
</div> <!-- end row -->
|
|
884
|
+
|
|
885
|
+
<div class="row text-left">
|
|
886
|
+
<div class="col-md-6">
|
|
887
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
888
|
+
<pre>
|
|
889
|
+
<code class="language-html"}}>
|
|
890
|
+
					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">cols</span>" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div>
|
|
891
|
+
</code>
|
|
892
|
+
</pre>
|
|
893
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
894
|
+
</div>
|
|
895
|
+
<div class="col-md-6">
|
|
896
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
897
|
+
<pre>
|
|
898
|
+
<code class="language-javascript">
|
|
899
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, <span style="background-color:yellow;padding:2px">cols</span>: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
900
|
+
</code>
|
|
901
|
+
</pre>
|
|
902
|
+
</div>
|
|
903
|
+
</div> <!-- end row -->
|
|
904
|
+
|
|
905
|
+
<div class="row text-left">
|
|
906
|
+
<div class="col-md-6">
|
|
907
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
908
|
+
<pre>
|
|
909
|
+
<code class="language-html"}}>
|
|
910
|
+
					moves: <strong>{{puzzle.api.moves}}</strong><br/> 					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.<span style="background-color:yellow;padding:2px">cols</span>" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div>
|
|
911
|
+
</code>
|
|
912
|
+
</pre>
|
|
913
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
914
|
+
</div>
|
|
915
|
+
<div class="col-md-6">
|
|
916
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
917
|
+
<pre>
|
|
918
|
+
<code class="language-javascript">
|
|
919
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, <span style="background-color:yellow;padding:2px">cols</span>: 3 } ]; }); /** * Word search puzzle controller
|
|
920
|
+
</code>
|
|
921
|
+
</pre>
|
|
922
|
+
</div>
|
|
923
|
+
</div> <!-- end row -->
|
|
924
|
+
|
|
925
|
+
<div class="row text-left">
|
|
926
|
+
<div class="col-md-6">
|
|
927
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
928
|
+
<pre>
|
|
929
|
+
<code class="language-html"}}>
|
|
930
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.<span style="background-color:yellow;padding:2px">cols</span>}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
931
|
+
</code>
|
|
932
|
+
</pre>
|
|
933
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
934
|
+
</div>
|
|
935
|
+
<div class="col-md-6">
|
|
936
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
937
|
+
<pre>
|
|
938
|
+
<code class="language-javascript">
|
|
939
|
+
/** * Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, <span style="background-color:yellow;padding:2px">cols</span>: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; });
|
|
940
|
+
</code>
|
|
941
|
+
</pre>
|
|
942
|
+
</div>
|
|
943
|
+
</div> <!-- end row -->
|
|
944
|
+
|
|
945
|
+
<div class="row text-left">
|
|
946
|
+
<div class="col-md-6">
|
|
947
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
948
|
+
<pre>
|
|
949
|
+
<code class="language-html"}}>
|
|
950
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.<span style="background-color:yellow;padding:2px">cols</span>}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
951
|
+
</code>
|
|
952
|
+
</pre>
|
|
953
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
954
|
+
</div>
|
|
955
|
+
<div class="col-md-6">
|
|
956
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
957
|
+
<pre>
|
|
958
|
+
<code class="language-javascript">
|
|
959
|
+
* Advanced sliding puzzle controller */ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, <span style="background-color:yellow;padding:2px">cols</span>: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, cols: 3 } ]; }); /**
|
|
960
|
+
</code>
|
|
961
|
+
</pre>
|
|
962
|
+
</div>
|
|
963
|
+
</div> <!-- end row -->
|
|
964
|
+
|
|
965
|
+
<div class="row text-left">
|
|
966
|
+
<div class="col-md-6">
|
|
967
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
968
|
+
<pre>
|
|
969
|
+
<code class="language-html"}}>
|
|
970
|
+
					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.<span style="background-color:yellow;padding:2px">cols</span>}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle">
|
|
971
|
+
</code>
|
|
972
|
+
</pre>
|
|
973
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
974
|
+
</div>
|
|
975
|
+
<div class="col-md-6">
|
|
976
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
977
|
+
<pre>
|
|
978
|
+
<code class="language-javascript">
|
|
979
|
+
*/ app.controller('slidingAdvancedCtrl', function($scope) { $scope.puzzles = [ { src: './img/misko.jpg', title: 'Misko Hevery', rows: 4, cols: 4 }, { src: './img/igor.jpg', title: 'Igor Minar', rows: 3, cols: 3 }, { src: './img/vojta.jpg', title: 'Vojta Jina', rows: 4, <span style="background-color:yellow;padding:2px">cols</span>: 3 } ]; }); /** * Word search puzzle controller
|
|
980
|
+
</code>
|
|
981
|
+
</pre>
|
|
982
|
+
</div>
|
|
983
|
+
</div> <!-- end row -->
|
|
984
|
+
|
|
985
|
+
<div class="row text-left">
|
|
986
|
+
<div class="col-md-6">
|
|
987
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
988
|
+
<pre>
|
|
989
|
+
<code class="language-html"}}>
|
|
990
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.<span style="background-color:yellow;padding:2px">shuffle</span>()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
991
|
+
</code>
|
|
992
|
+
</pre>
|
|
993
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
994
|
+
</div>
|
|
995
|
+
<div class="col-md-6">
|
|
996
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
997
|
+
<pre>
|
|
998
|
+
<code class="language-javascript">
|
|
999
|
+
}; /** * Shuffles grid */ this.<span style="background-color:yellow;padding:2px">shuffle</span> = function() { var tiles = []; this.traverse(function(tile) { tiles.push(tile); }); shuffle(tiles);
|
|
1000
|
+
</code>
|
|
1001
|
+
</pre>
|
|
1002
|
+
</div>
|
|
1003
|
+
</div> <!-- end row -->
|
|
1004
|
+
|
|
1005
|
+
<div class="row text-left">
|
|
1006
|
+
<div class="col-md-6">
|
|
1007
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1008
|
+
<pre>
|
|
1009
|
+
<code class="language-html"}}>
|
|
1010
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.<span style="background-color:yellow;padding:2px">shuffle</span>()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
1011
|
+
</code>
|
|
1012
|
+
</pre>
|
|
1013
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1014
|
+
</div>
|
|
1015
|
+
<div class="col-md-6">
|
|
1016
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1017
|
+
<pre>
|
|
1018
|
+
<code class="language-javascript">
|
|
1019
|
+
this.shuffle = function() { var tiles = []; this.traverse(function(tile) { tiles.push(tile); }); <span style="background-color:yellow;padding:2px">shuffle</span>(tiles); this.traverse(function(tile, row, col) { this.grid[row][col] = tiles.shift(); }); this.moves = 0; };
|
|
1020
|
+
</code>
|
|
1021
|
+
</pre>
|
|
1022
|
+
</div>
|
|
1023
|
+
</div> <!-- end row -->
|
|
1024
|
+
|
|
1025
|
+
<div class="row text-left">
|
|
1026
|
+
<div class="col-md-6">
|
|
1027
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1028
|
+
<pre>
|
|
1029
|
+
<code class="language-html"}}>
|
|
1030
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.<span style="background-color:yellow;padding:2px">shuffle</span>()">shuffle</button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
1031
|
+
</code>
|
|
1032
|
+
</pre>
|
|
1033
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1034
|
+
</div>
|
|
1035
|
+
<div class="col-md-6">
|
|
1036
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1037
|
+
<pre>
|
|
1038
|
+
<code class="language-javascript">
|
|
1039
|
+
height: height + 'px', background: (tile.empty ? 'none' : "url('" + scope.src + "') no-repeat -" + (col * width) + 'px -' + (row * height) + 'px') }; }); scope.puzzle.<span style="background-color:yellow;padding:2px">shuffle</span>(); } attrs.$observe('size', function(size) { size = size.split('x'); if (size[0] >= 2 && size[1] >= 2) {
|
|
1040
|
+
</code>
|
|
1041
|
+
</pre>
|
|
1042
|
+
</div>
|
|
1043
|
+
</div> <!-- end row -->
|
|
1044
|
+
|
|
1045
|
+
<div class="row text-left">
|
|
1046
|
+
<div class="col-md-6">
|
|
1047
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1048
|
+
<pre>
|
|
1049
|
+
<code class="language-html"}}>
|
|
1050
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()"><span style="background-color:yellow;padding:2px">shuffle</span></button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
1051
|
+
</code>
|
|
1052
|
+
</pre>
|
|
1053
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1054
|
+
</div>
|
|
1055
|
+
<div class="col-md-6">
|
|
1056
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1057
|
+
<pre>
|
|
1058
|
+
<code class="language-javascript">
|
|
1059
|
+
}; /** * Shuffles grid */ this.<span style="background-color:yellow;padding:2px">shuffle</span> = function() { var tiles = []; this.traverse(function(tile) { tiles.push(tile); }); shuffle(tiles);
|
|
1060
|
+
</code>
|
|
1061
|
+
</pre>
|
|
1062
|
+
</div>
|
|
1063
|
+
</div> <!-- end row -->
|
|
1064
|
+
|
|
1065
|
+
<div class="row text-left">
|
|
1066
|
+
<div class="col-md-6">
|
|
1067
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1068
|
+
<pre>
|
|
1069
|
+
<code class="language-html"}}>
|
|
1070
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()"><span style="background-color:yellow;padding:2px">shuffle</span></button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
1071
|
+
</code>
|
|
1072
|
+
</pre>
|
|
1073
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1074
|
+
</div>
|
|
1075
|
+
<div class="col-md-6">
|
|
1076
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1077
|
+
<pre>
|
|
1078
|
+
<code class="language-javascript">
|
|
1079
|
+
this.shuffle = function() { var tiles = []; this.traverse(function(tile) { tiles.push(tile); }); <span style="background-color:yellow;padding:2px">shuffle</span>(tiles); this.traverse(function(tile, row, col) { this.grid[row][col] = tiles.shift(); }); this.moves = 0; };
|
|
1080
|
+
</code>
|
|
1081
|
+
</pre>
|
|
1082
|
+
</div>
|
|
1083
|
+
</div> <!-- end row -->
|
|
1084
|
+
|
|
1085
|
+
<div class="row text-left">
|
|
1086
|
+
<div class="col-md-6">
|
|
1087
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1088
|
+
<pre>
|
|
1089
|
+
<code class="language-html"}}>
|
|
1090
|
+
					solved: <strong>{{puzzle.api.isSolved()}}</strong> 				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()"><span style="background-color:yellow;padding:2px">shuffle</span></button> 					<button ng-click="puzzle.api.solve()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset>
|
|
1091
|
+
</code>
|
|
1092
|
+
</pre>
|
|
1093
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1094
|
+
</div>
|
|
1095
|
+
<div class="col-md-6">
|
|
1096
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1097
|
+
<pre>
|
|
1098
|
+
<code class="language-javascript">
|
|
1099
|
+
height: height + 'px', background: (tile.empty ? 'none' : "url('" + scope.src + "') no-repeat -" + (col * width) + 'px -' + (row * height) + 'px') }; }); scope.puzzle.<span style="background-color:yellow;padding:2px">shuffle</span>(); } attrs.$observe('size', function(size) { size = size.split('x'); if (size[0] >= 2 && size[1] >= 2) {
|
|
1100
|
+
</code>
|
|
1101
|
+
</pre>
|
|
1102
|
+
</div>
|
|
1103
|
+
</div> <!-- end row -->
|
|
1104
|
+
|
|
1105
|
+
<div class="row text-left">
|
|
1106
|
+
<div class="col-md-6">
|
|
1107
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1108
|
+
<pre>
|
|
1109
|
+
<code class="language-html"}}>
|
|
1110
|
+
				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.<span style="background-color:yellow;padding:2px">solve</span>()">solve</button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script>
|
|
1111
|
+
</code>
|
|
1112
|
+
</pre>
|
|
1113
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1114
|
+
</div>
|
|
1115
|
+
<div class="col-md-6">
|
|
1116
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1117
|
+
<pre>
|
|
1118
|
+
<code class="language-javascript">
|
|
1119
|
+
}; /** * Solves puzzle */ this.<span style="background-color:yellow;padding:2px">solve</span> = function() { var tiles = []; this.traverse(function(tile) { tiles.push(tile); }); tiles.sort(function(x, y) {
|
|
1120
|
+
</code>
|
|
1121
|
+
</pre>
|
|
1122
|
+
</div>
|
|
1123
|
+
</div> <!-- end row -->
|
|
1124
|
+
|
|
1125
|
+
<div class="row text-left">
|
|
1126
|
+
<div class="col-md-6">
|
|
1127
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1128
|
+
<pre>
|
|
1129
|
+
<code class="language-html"}}>
|
|
1130
|
+
				</div> 				<div class="size"> 					rows: <input type="text" ng-model="puzzle.rows" size="2"/> 					cols: <input type="text" ng-model="puzzle.cols" size="2"/><br/> 					<button ng-click="puzzle.api.shuffle()">shuffle</button> 					<button ng-click="puzzle.api.solve()"><span style="background-color:yellow;padding:2px">solve</span></button> 				</div> 				<sliding-puzzle api="puzzle.api" size="{{puzzle.rows}}x{{puzzle.cols}}" src="{{puzzle.src}}"></sliding-puzzle> 			</div> 		</fieldset> 	</script>
|
|
1131
|
+
</code>
|
|
1132
|
+
</pre>
|
|
1133
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1134
|
+
</div>
|
|
1135
|
+
<div class="col-md-6">
|
|
1136
|
+
<h2> ./test/data/angular_puzzle/slidingPuzzle.js</h2>
|
|
1137
|
+
<pre>
|
|
1138
|
+
<code class="language-javascript">
|
|
1139
|
+
}; /** * Solves puzzle */ this.<span style="background-color:yellow;padding:2px">solve</span> = function() { var tiles = []; this.traverse(function(tile) { tiles.push(tile); }); tiles.sort(function(x, y) {
|
|
1140
|
+
</code>
|
|
1141
|
+
</pre>
|
|
1142
|
+
</div>
|
|
1143
|
+
</div> <!-- end row -->
|
|
1144
|
+
|
|
1145
|
+
<div class="row text-left">
|
|
1146
|
+
<div class="col-md-6">
|
|
1147
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1148
|
+
<pre>
|
|
1149
|
+
<code class="language-html"}}>
|
|
1150
|
+
			</div> 		</fieldset> 	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" <span style="background-color:yellow;padding:2px">ng-controller="wordSearchCtrl"></span> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul>
|
|
1151
|
+
</code>
|
|
1152
|
+
</pre>
|
|
1153
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1154
|
+
</div>
|
|
1155
|
+
<div class="col-md-6">
|
|
1156
|
+
<h2> ./test/data/angular_puzzle/app.js</h2>
|
|
1157
|
+
<pre>
|
|
1158
|
+
<code class="language-javascript">
|
|
1159
|
+
}); /** * Word search puzzle controller */ app.controller(<span style="background-color:yellow;padding:2px">'wordSearchCtrl'</span>, function($scope) { $scope.matrix = [ ['N', 'I', 'G', 'O', 'R', 'Y', 'G', 'S', 'T', 'T', 'A', 'N'], ['O', 'G', 'G', 'U', 'L', 'C', 'O', 'E', 'P', 'E', 'A', 'S'], ['I', 'N', 'N', 'R', 'M', 'N', 'O', 'R', 'I', 'M', 'E', 'C'], ['T', 'I', 'A', 'I', 'O', 'E', 'G', 'V', 'R', 'P', 'V', 'E'],
|
|
1160
|
+
</code>
|
|
1161
|
+
</pre>
|
|
1162
|
+
</div>
|
|
1163
|
+
</div> <!-- end row -->
|
|
1164
|
+
|
|
1165
|
+
<div class="row text-left">
|
|
1166
|
+
<div class="col-md-6">
|
|
1167
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1168
|
+
<pre>
|
|
1169
|
+
<code class="language-html"}}>
|
|
1170
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.<span style="background-color:yellow;padding:2px">words</span>" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1171
|
+
</code>
|
|
1172
|
+
</pre>
|
|
1173
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1174
|
+
</div>
|
|
1175
|
+
<div class="col-md-6">
|
|
1176
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1177
|
+
<pre>
|
|
1178
|
+
<code class="language-javascript">
|
|
1179
|
+
/** * Words * @type {Array} */ this.<span style="background-color:yellow;padding:2px">words</span> = []; /** * Is solved? * @type {Boolean} */
|
|
1180
|
+
</code>
|
|
1181
|
+
</pre>
|
|
1182
|
+
</div>
|
|
1183
|
+
</div> <!-- end row -->
|
|
1184
|
+
|
|
1185
|
+
<div class="row text-left">
|
|
1186
|
+
<div class="col-md-6">
|
|
1187
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1188
|
+
<pre>
|
|
1189
|
+
<code class="language-html"}}>
|
|
1190
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.<span style="background-color:yellow;padding:2px">words</span>" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1191
|
+
</code>
|
|
1192
|
+
</pre>
|
|
1193
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1194
|
+
</div>
|
|
1195
|
+
<div class="col-md-6">
|
|
1196
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1197
|
+
<pre>
|
|
1198
|
+
<code class="language-javascript">
|
|
1199
|
+
maxCol = col; }, this); maxRow = row; }, this); angular.forEach(words, function(word) { this.<span style="background-color:yellow;padding:2px">words</span>.push({ name: word }); }, this); /**
|
|
1200
|
+
</code>
|
|
1201
|
+
</pre>
|
|
1202
|
+
</div>
|
|
1203
|
+
</div> <!-- end row -->
|
|
1204
|
+
|
|
1205
|
+
<div class="row text-left">
|
|
1206
|
+
<div class="col-md-6">
|
|
1207
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1208
|
+
<pre>
|
|
1209
|
+
<code class="language-html"}}>
|
|
1210
|
+
			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" <span style="background-color:yellow;padding:2px">words="words" </span>api="puzzle"></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.solved" class="solve">solve</button> 				<strong ng-show="puzzle.solved" ng-show="puzzle.solved">Solved!</strong> 			</div> 		</div>
|
|
1211
|
+
</code>
|
|
1212
|
+
</pre>
|
|
1213
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1214
|
+
</div>
|
|
1215
|
+
<div class="col-md-6">
|
|
1216
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1217
|
+
<pre>
|
|
1218
|
+
<code class="language-javascript">
|
|
1219
|
+
maxCol = col; }, this); maxRow = row; }, this); angular.forEach(words, function(word) { this.<span style="background-color:yellow;padding:2px">words</span>.push({ name: word }); }, this); /**
|
|
1220
|
+
</code>
|
|
1221
|
+
</pre>
|
|
1222
|
+
</div>
|
|
1223
|
+
</div> <!-- end row -->
|
|
1224
|
+
|
|
1225
|
+
<div class="row text-left">
|
|
1226
|
+
<div class="col-md-6">
|
|
1227
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1228
|
+
<pre>
|
|
1229
|
+
<code class="language-html"}}>
|
|
1230
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="<span style="background-color:yellow;padding:2px">word</span> in puzzle.words" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1231
|
+
</code>
|
|
1232
|
+
</pre>
|
|
1233
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1234
|
+
</div>
|
|
1235
|
+
<div class="col-md-6">
|
|
1236
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1237
|
+
<pre>
|
|
1238
|
+
<code class="language-javascript">
|
|
1239
|
+
this.matrix[row].push(item); maxCol = col; }, this); maxRow = row; }, this); angular.forEach(words, function(<span style="background-color:yellow;padding:2px">word</span>) { this.words.push({ name: word }); }, this);
|
|
1240
|
+
</code>
|
|
1241
|
+
</pre>
|
|
1242
|
+
</div>
|
|
1243
|
+
</div> <!-- end row -->
|
|
1244
|
+
|
|
1245
|
+
<div class="row text-left">
|
|
1246
|
+
<div class="col-md-6">
|
|
1247
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1248
|
+
<pre>
|
|
1249
|
+
<code class="language-html"}}>
|
|
1250
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{<span style="background-color:yellow;padding:2px">'found'</span>: word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1251
|
+
</code>
|
|
1252
|
+
</pre>
|
|
1253
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1254
|
+
</div>
|
|
1255
|
+
<div class="col-md-6">
|
|
1256
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1257
|
+
<pre>
|
|
1258
|
+
<code class="language-javascript">
|
|
1259
|
+
words.push(words[0].split('').reverse().join(''));	// word in reverse order (when selecting) // check words this.solved = true; angular.forEach(this.words, function(word) { if (word.<span style="background-color:yellow;padding:2px">found</span>) { return; } angular.forEach(words, function(itemWord) { if (word.name === itemWord) { word.found = true;
|
|
1260
|
+
</code>
|
|
1261
|
+
</pre>
|
|
1262
|
+
</div>
|
|
1263
|
+
</div> <!-- end row -->
|
|
1264
|
+
|
|
1265
|
+
<div class="row text-left">
|
|
1266
|
+
<div class="col-md-6">
|
|
1267
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1268
|
+
<pre>
|
|
1269
|
+
<code class="language-html"}}>
|
|
1270
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{<span style="background-color:yellow;padding:2px">'found'</span>: word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1271
|
+
</code>
|
|
1272
|
+
</pre>
|
|
1273
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1274
|
+
</div>
|
|
1275
|
+
<div class="col-md-6">
|
|
1276
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1277
|
+
<pre>
|
|
1278
|
+
<code class="language-javascript">
|
|
1279
|
+
if (word.found) { return; } angular.forEach(words, function(itemWord) { if (word.name === itemWord) { word.<span style="background-color:yellow;padding:2px">found</span> = true; angular.forEach(items, function(item) { item.found = true; }); } });
|
|
1280
|
+
</code>
|
|
1281
|
+
</pre>
|
|
1282
|
+
</div>
|
|
1283
|
+
</div> <!-- end row -->
|
|
1284
|
+
|
|
1285
|
+
<div class="row text-left">
|
|
1286
|
+
<div class="col-md-6">
|
|
1287
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1288
|
+
<pre>
|
|
1289
|
+
<code class="language-html"}}>
|
|
1290
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{<span style="background-color:yellow;padding:2px">'found'</span>: word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1291
|
+
</code>
|
|
1292
|
+
</pre>
|
|
1293
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1294
|
+
</div>
|
|
1295
|
+
<div class="col-md-6">
|
|
1296
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1297
|
+
<pre>
|
|
1298
|
+
<code class="language-javascript">
|
|
1299
|
+
} angular.forEach(words, function(itemWord) { if (word.name === itemWord) { word.found = true; angular.forEach(items, function(item) { item.<span style="background-color:yellow;padding:2px">found</span> = true; }); } }); if (!word.found) { this.solved = false;
|
|
1300
|
+
</code>
|
|
1301
|
+
</pre>
|
|
1302
|
+
</div>
|
|
1303
|
+
</div> <!-- end row -->
|
|
1304
|
+
|
|
1305
|
+
<div class="row text-left">
|
|
1306
|
+
<div class="col-md-6">
|
|
1307
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1308
|
+
<pre>
|
|
1309
|
+
<code class="language-html"}}>
|
|
1310
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{<span style="background-color:yellow;padding:2px">'found'</span>: word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1311
|
+
</code>
|
|
1312
|
+
</pre>
|
|
1313
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1314
|
+
</div>
|
|
1315
|
+
<div class="col-md-6">
|
|
1316
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1317
|
+
<pre>
|
|
1318
|
+
<code class="language-javascript">
|
|
1319
|
+
angular.forEach(items, function(item) { item.found = true; }); } }); if (!word.<span style="background-color:yellow;padding:2px">found</span>) { this.solved = false; } }, this); };
|
|
1320
|
+
</code>
|
|
1321
|
+
</pre>
|
|
1322
|
+
</div>
|
|
1323
|
+
</div> <!-- end row -->
|
|
1324
|
+
|
|
1325
|
+
<div class="row text-left">
|
|
1326
|
+
<div class="col-md-6">
|
|
1327
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1328
|
+
<pre>
|
|
1329
|
+
<code class="language-html"}}>
|
|
1330
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.<span style="background-color:yellow;padding:2px">found</span>}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1331
|
+
</code>
|
|
1332
|
+
</pre>
|
|
1333
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1334
|
+
</div>
|
|
1335
|
+
<div class="col-md-6">
|
|
1336
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1337
|
+
<pre>
|
|
1338
|
+
<code class="language-javascript">
|
|
1339
|
+
words.push(words[0].split('').reverse().join(''));	// word in reverse order (when selecting) // check words this.solved = true; angular.forEach(this.words, function(word) { if (word.<span style="background-color:yellow;padding:2px">found</span>) { return; } angular.forEach(words, function(itemWord) { if (word.name === itemWord) { word.found = true;
|
|
1340
|
+
</code>
|
|
1341
|
+
</pre>
|
|
1342
|
+
</div>
|
|
1343
|
+
</div> <!-- end row -->
|
|
1344
|
+
|
|
1345
|
+
<div class="row text-left">
|
|
1346
|
+
<div class="col-md-6">
|
|
1347
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1348
|
+
<pre>
|
|
1349
|
+
<code class="language-html"}}>
|
|
1350
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.<span style="background-color:yellow;padding:2px">found</span>}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1351
|
+
</code>
|
|
1352
|
+
</pre>
|
|
1353
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1354
|
+
</div>
|
|
1355
|
+
<div class="col-md-6">
|
|
1356
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1357
|
+
<pre>
|
|
1358
|
+
<code class="language-javascript">
|
|
1359
|
+
if (word.found) { return; } angular.forEach(words, function(itemWord) { if (word.name === itemWord) { word.<span style="background-color:yellow;padding:2px">found</span> = true; angular.forEach(items, function(item) { item.found = true; }); } });
|
|
1360
|
+
</code>
|
|
1361
|
+
</pre>
|
|
1362
|
+
</div>
|
|
1363
|
+
</div> <!-- end row -->
|
|
1364
|
+
|
|
1365
|
+
<div class="row text-left">
|
|
1366
|
+
<div class="col-md-6">
|
|
1367
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1368
|
+
<pre>
|
|
1369
|
+
<code class="language-html"}}>
|
|
1370
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.<span style="background-color:yellow;padding:2px">found</span>}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1371
|
+
</code>
|
|
1372
|
+
</pre>
|
|
1373
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1374
|
+
</div>
|
|
1375
|
+
<div class="col-md-6">
|
|
1376
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1377
|
+
<pre>
|
|
1378
|
+
<code class="language-javascript">
|
|
1379
|
+
} angular.forEach(words, function(itemWord) { if (word.name === itemWord) { word.found = true; angular.forEach(items, function(item) { item.<span style="background-color:yellow;padding:2px">found</span> = true; }); } }); if (!word.found) { this.solved = false;
|
|
1380
|
+
</code>
|
|
1381
|
+
</pre>
|
|
1382
|
+
</div>
|
|
1383
|
+
</div> <!-- end row -->
|
|
1384
|
+
|
|
1385
|
+
<div class="row text-left">
|
|
1386
|
+
<div class="col-md-6">
|
|
1387
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1388
|
+
<pre>
|
|
1389
|
+
<code class="language-html"}}>
|
|
1390
|
+
	</script> 	<script type="text/ng-template" id="word-search-puzzle"> 		<div id="word-search" ng-controller="wordSearchCtrl"> 			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.<span style="background-color:yellow;padding:2px">found</span>}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status">
|
|
1391
|
+
</code>
|
|
1392
|
+
</pre>
|
|
1393
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1394
|
+
</div>
|
|
1395
|
+
<div class="col-md-6">
|
|
1396
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1397
|
+
<pre>
|
|
1398
|
+
<code class="language-javascript">
|
|
1399
|
+
angular.forEach(items, function(item) { item.found = true; }); } }); if (!word.<span style="background-color:yellow;padding:2px">found</span>) { this.solved = false; } }, this); };
|
|
1400
|
+
</code>
|
|
1401
|
+
</pre>
|
|
1402
|
+
</div>
|
|
1403
|
+
</div> <!-- end row -->
|
|
1404
|
+
|
|
1405
|
+
<div class="row text-left">
|
|
1406
|
+
<div class="col-md-6">
|
|
1407
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1408
|
+
<pre>
|
|
1409
|
+
<code class="language-html"}}>
|
|
1410
|
+
			<ul class="words"> 				<li ng-repeat="word in puzzle.words" ng-class="{'found': word.found}"> 					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle <span style="background-color:yellow;padding:2px">matrix="matrix" </span>words="words" api="puzzle"></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.solved" class="solve">solve</button> 				<strong ng-show="puzzle.solved" ng-show="puzzle.solved">Solved!</strong> 			</div> 		</div>
|
|
1411
|
+
</code>
|
|
1412
|
+
</pre>
|
|
1413
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1414
|
+
</div>
|
|
1415
|
+
<div class="col-md-6">
|
|
1416
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1417
|
+
<pre>
|
|
1418
|
+
<code class="language-javascript">
|
|
1419
|
+
}, link: function(scope, element, attrs) { var selectFrom; // setup puzzle scope.$watch('matrix', function(<span style="background-color:yellow;padding:2px">matrix</span>) { scope.puzzle = wordSearchPuzzle(matrix, scope.words); // link service if (attrs.api) { scope.api = scope.puzzle;
|
|
1420
|
+
</code>
|
|
1421
|
+
</pre>
|
|
1422
|
+
</div>
|
|
1423
|
+
</div> <!-- end row -->
|
|
1424
|
+
|
|
1425
|
+
<div class="row text-left">
|
|
1426
|
+
<div class="col-md-6">
|
|
1427
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1428
|
+
<pre>
|
|
1429
|
+
<code class="language-html"}}>
|
|
1430
|
+
					{{word.name}} 				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.<span style="background-color:yellow;padding:2px">solved</span>" class="solve">solve</button> 				<strong ng-show="puzzle.solved" ng-show="puzzle.solved">Solved!</strong> 			</div> 		</div> 	</script> </body>
|
|
1431
|
+
</code>
|
|
1432
|
+
</pre>
|
|
1433
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1434
|
+
</div>
|
|
1435
|
+
<div class="col-md-6">
|
|
1436
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1437
|
+
<pre>
|
|
1438
|
+
<code class="language-javascript">
|
|
1439
|
+
item.found = true; }); } }); if (!word.found) { this.<span style="background-color:yellow;padding:2px">solved</span> = false; } }, this); }; /**
|
|
1440
|
+
</code>
|
|
1441
|
+
</pre>
|
|
1442
|
+
</div>
|
|
1443
|
+
</div> <!-- end row -->
|
|
1444
|
+
|
|
1445
|
+
<div class="row text-left">
|
|
1446
|
+
<div class="col-md-6">
|
|
1447
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1448
|
+
<pre>
|
|
1449
|
+
<code class="language-html"}}>
|
|
1450
|
+
				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.solved" class="solve">solve</button> 				<strong ng-show="puzzle.<span style="background-color:yellow;padding:2px">solved</span>" ng-show="puzzle.solved">Solved!</strong> 			</div> 		</div> 	</script> </body> </html>
|
|
1451
|
+
</code>
|
|
1452
|
+
</pre>
|
|
1453
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1454
|
+
</div>
|
|
1455
|
+
<div class="col-md-6">
|
|
1456
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1457
|
+
<pre>
|
|
1458
|
+
<code class="language-javascript">
|
|
1459
|
+
item.found = true; }); } }); if (!word.found) { this.<span style="background-color:yellow;padding:2px">solved</span> = false; } }, this); }; /**
|
|
1460
|
+
</code>
|
|
1461
|
+
</pre>
|
|
1462
|
+
</div>
|
|
1463
|
+
</div> <!-- end row -->
|
|
1464
|
+
|
|
1465
|
+
<div class="row text-left">
|
|
1466
|
+
<div class="col-md-6">
|
|
1467
|
+
<h2> ./test/data/angular_puzzle/index.html</h2>
|
|
1468
|
+
<pre>
|
|
1469
|
+
<code class="language-html"}}>
|
|
1470
|
+
				</li> 			</ul> 			<word-search-puzzle matrix="matrix" words="words" api="puzzle"></word-search-puzzle> 			<div class="status"> 				<button ng-click="puzzle.solve()" ng-show="!puzzle.solved" class="solve">solve</button> 				<strong ng-show="puzzle.solved" ng-show="puzzle.<span style="background-color:yellow;padding:2px">solved</span>">Solved!</strong> 			</div> 		</div> 	</script> </body> </html>
|
|
1471
|
+
</code>
|
|
1472
|
+
</pre>
|
|
1473
|
+
<!-- <p><span style="color:red">TEST</span></p> -->
|
|
1474
|
+
</div>
|
|
1475
|
+
<div class="col-md-6">
|
|
1476
|
+
<h2> ./test/data/angular_puzzle/wordSearchPuzzle.js</h2>
|
|
1477
|
+
<pre>
|
|
1478
|
+
<code class="language-javascript">
|
|
1479
|
+
item.found = true; }); } }); if (!word.found) { this.<span style="background-color:yellow;padding:2px">solved</span> = false; } }, this); }; /**
|
|
1480
|
+
</code>
|
|
1481
|
+
</pre>
|
|
1482
|
+
</div>
|
|
1483
|
+
</div> <!-- end row -->
|
|
1484
|
+
|
|
1485
|
+
</div>
|
|
1486
|
+
|
|
1487
|
+
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
|
1488
|
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
|
1489
|
+
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
|
1490
|
+
<script src="js/bootstrap.min.js"></script>
|
|
1491
|
+
<script src="js/highlight.pack.js"></script>
|
|
1492
|
+
<script type="text/javascript">
|
|
1493
|
+
$(document).ready(function() {
|
|
1494
|
+
$('pre code').each(function(i, e) {
|
|
1495
|
+
console.log(e)
|
|
1496
|
+
hljs.highlightBlock(e);
|
|
1497
|
+
});
|
|
1498
|
+
});
|
|
1499
|
+
</script>
|
|
1500
|
+
</body>
|
|
1501
|
+
</html>
|