-
Notifications
You must be signed in to change notification settings - Fork 10
/
Copy pathindex.html
135 lines (127 loc) · 6.55 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1"/>
<title>Find Words</title>
<link rel="stylesheet" media="not screen and (device-width: 1200px) and (device-height: 900px)"
href="lib/sugar-web/graphics/css/sugar-96dpi.css">
<link rel="stylesheet" media="screen and (device-width: 1200px) and (device-height: 900px)"
href="lib/sugar-web/graphics/css/sugar-200dpi.css">
<link rel="stylesheet" type="text/css" href="css/activity.css">
<link rel="stylesheet" media="not screen and (device-width: 1200px) and (device-height: 900px)"
href="css/activity-96dpi.css">
<link rel="stylesheet" media="screen and (device-width: 1200px) and (device-height: 900px)"
href="css/activity-200dpi.css">
<link rel="stylesheet" media="(max-height: 600px)"
href="css/activity-small-screen.css">
<link rel="stylesheet" media="(max-width: 700px)"
href="css/activity-small-screen.css">
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script data-main="js/loader" src="lib/require.js"></script>
<link rel="prefetch" type="application/l10n" href="./localization.ini" />
</head>
<body>
<div id="main-toolbar" class="toolbar" style="display:none">
<button class="toolbutton" id="activity-button" title="Find Words">
</button>
<hr/>
<button class="toolbutton" id="back-button"
title="Back">
</button>
<button class="toolbutton" id="upperlower-button"
title="Upercase/Lowercase">
</button>
<button class="toolbutton" id="audio-button"
title="Audio">
</button>
<button class="toolbutton pull-right" id="stop-button" title="Stop">
</button>
</div>
<div id="canvas">
<div id="validation-error" style="display:none"></div>
<div id="intro">
<canvas id="introCanvas">
</canvas>
</div>
<div id="game" style="display:none;width=100%">
<div id="help-button">
</div>
<div id="help-display" style="display:none">
<div id="help-content">
<h1>Ayuda</h1>
<p>Juega a encontrar las palabras que se muestran a la izquierda.</p>
<p>Puedes crear tu propia lista de palabras, agregándolas con el botón
<img src="icons/plus.svg" class="help-icons"/></p>
<p>o usar una lista seleccionada al azar presionando
<img src="images/dice-random.svg" class="help-icons"/></p>
<p>También puedes seleccionar los distintos niveles de dificultad:
fácil <img src="icons/easy.svg" class="help-icons"/>,
intermedio <img src="icons/medium.svg" class="help-icons"/>
(con palabras en diagonal) o difícil <img src="icons/hard.svg" class="help-icons"/>
(con palabras en diagonal, o escritas hacia atrás)</p>
<p>Si quieres quitar palabras de la lista, selecciónala, y aparecerá un botón <img src="icons/minus.svg" class="help-icons"/> para borrarla.</p>
<p>Si quieres saber más acerca de quienes hicieron esta aplicación, presiona aqui: <img id="about-button" src="icons/programmer.svg" class="developers-icon"/></p>
</div>
<div id="about-content" style="display:none">
<h1>Acerca de esta aplicación</h1>
<ul>
<li><b>Diseño gráfico:</b> Paul Cotton, excepto ícono 'User'de TukTuk Design, https://thenounproject.com</li>
<li><b>Sonido:</b> Efectos de gotas de agua y lluvia de http://freeSFX.co.uk</li>
<li><b>Música:</b> Interpretación de Jon Sayles de una obra de John Dowland, quien vivió entre los años 1563 y 1626.
Si quieres escuchar más de este tipo de música, puedes ir a http://www.jsayles.com/familypages/earlymusic.htm</li>
<li><b>Programación:</b> Gonzalo Odiard de http://www.trinom.io/educacion, para OLPC Inc.</li>
</ul>
</div>
</div>
<table width="100%">
<tr>
<td id="wordList">
<canvas id="wordListCanvas">
</canvas>
</td>
<td align="center" id="rightPanel" width="80%">
<div id="firstPage">
<table class="loadData">
<tr><td>
<span data-l10n-id="AddWord">Add Word</span>
</td></tr>
<tr><td>
<input type="text" id="word-input" maxlength="12">
<button id="add-word-button"></button>
<button id="random-words-button"></button>
</td></tr>
<tr><td>
<span data-l10n-id="SelectDifficulty">
Select Difficulty
</span>
</td></tr><tr><td style="text-align:center">
<button class="level-button" id="easy-button">
</button>
<button class="level-button" id="medium-button">
</button>
<button class="level-button" id="hard-button">
</button>
</td></tr>
<tr><td style="text-align:center">
<button class="blueButton" id="start-game-button"
data-l10n-id="Start" disabled>Start
<img src="./icons/loupe.svg"/>
</button>
</td></tr>
</table>
</div>
<canvas id="gameCanvas" style="display:none">
</canvas>
</td>
</tr>
<table>
</div>
<div style="display:none">
<audio autoplay loop id="background-music">
<source src="./music/Dowland-Can-she-excuse-my-wrongs.mp3" type="audio/mpeg">
</audio>
</div>
</div>
</body>
</html>