Experimenting audioContext for Apple (Safari)
[sgc3.git] / SpeakGoodChinese3_SelectWords.xml
blobf621b44ef6ac0e75f7e01b867ab6851d047419ea
1 <?xml version="1.0" encoding="UTF-8"?>
2 <?xml-stylesheet href="xhtml-default.css" type="text/css" media="screen, aural, print" ?>
3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN"
4     "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">
5 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
6 <head>
7 <link rel="shortcut icon" href="sgc.png" />
8 <link rel="icon" sizes="192x192" href="sgc.png" />
9 <link rel="manifest" href="manifest.json" />
10 <meta name="viewport" content="width=device-width" />
11 <meta name="mobile-web-app-capable" content="yes" />
12 <meta http-equiv="Content-Language" content="en" />
13 <title lang="en" xml:lang="en" dir="ltr">Select Words - SpeakGoodChinese</title>
14 <style>
15 body {
16         background-image: url("Background.png");
17         background-color: rgb(250,250,250);
18     background-repeat: no-repeat;
19     background-position: center center;
20     background-size: 50%;
21     background-attachment: fixed;}
22 h1 {
23         text-align: center;
24         }
25 h2 {
26         text-align: center;
27         }
28 p {
29         text-align: left; 
30         margin-left: 20%; 
31         margin-right: 20%;
32         }
33 pre {
34         text-align: left; 
35         margin-left: 20%; 
36         margin-right: 20%;
37         }
38 </style>
40 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
42 <script type="text/javascript" src="internationalization_tables.js" ></script>   
43 <script type="text/javascript" src="wordlists.js" ></script>   
44 <script type="text/javascript" src="wordlists_plus.js" ></script>   
45 </head>
46 <body onfocus="load_SGC3_settings (); " onblur="store_SGC3_settings ();this.close();" onunload="store_SGC3_settings (); " >
47 <!--
48 SpeakGoodChinese 3
49 Copyright (C) 2016 R.J.J.H. van Son (r.j.j.h.vanson@gmail.com)
51 This program is free software; you can redistribute it and/or
52 modify it under the terms of the GNU General Public License
53 as published by the Free Software Foundation; either version 2
54 of the License, or (at your option) any later version.
56 This program is distributed in the hope that it will be useful,
57 but WITHOUT ANY WARRANTY; without even the implied warranty of
58 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
59 GNU General Public License for more details.
61 You can find a copy of the GNU General Public License at
62 http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
63 -->
64 <h1 style='text-align: center' id="SelectWords"><span id="SelectWordsCaption" title="" >Words</span>:
65 <a href="wordlists/README.xml"><span id="WordListName" style='text-align: center; color: blue;'>wordlist</span></a></h1>
66         <div style="position: fixed; color: black; bottom: 75%; left: 5%; height: 8%; width: 17%; font: 'Helvetica'; font-size: 3vmin; text-align: center " id="TonesCaption">---</div> 
67         <select id="Tones" style="position: fixed; color: black; bottom: 65%; left: 5%; height: 15%; width: 17%; font: 'Helvetica'; font-size: 3vmin ; background-color: rgb(220,220,220); " onchange="selectedTones(this.selectedOptions); store_SGC3_settings (); " size="5" multiple="multiple" >
68                 <option value="---" >---</option>
69                 <option value="0" >0</option>
70                 <option value="1" >1</option>
71                 <option value="2" >2</option>
72                 <option value="3" >3</option>
73                 <option value="4" >4</option>
74         </select> 
76         <div style="position: fixed; color: black; bottom: 75%; left: 25%; height: 8%; width: 17%; font: 'Helvetica'; font-size: 3vmin; text-align: center " id="PartCaption">---</div> 
77         <select id="Part" style="position: fixed; color: black; bottom: 65%; left: 25%; height: 15%; width: 17%; font: 'Helvetica'; font-size: 3vmin; background-color: rgb(220,220,220); " onchange="selectedLessons(this.selectedOptions); store_SGC3_settings (); " multiple="multiple" >
78                 <option value="---" ><span id="---" title="" >---</span></option>
79         </select> 
81    <script type="text/javascript">
82         //<![CDATA[
83         // Install the service worker for offline use
84         if ('serviceWorker' in navigator) {
85           navigator.serviceWorker.register('sw.js').then(function(registration) {
86             // Registration was successful
87             console.log('ServiceWorker registration successful with scope: ',    registration.scope);
88           }).catch(function(err) {
89             // registration failed :(
90             console.log('ServiceWorker registration failed: ', err);
91           });
92         }
93         
94         // DOM parameters
95         var mainWindow = localStorage.sgc3_mainWindow;
96         
97         var selectTones = document.getElementById('Tones');
98         var selectLessons = document.getElementById('Part');
99         var wordListName = document.getElementById('WordListName');
101         
102         // Global settings
103         var sgc3_settings = {
104                 settingsRead: false,
105                 recSecs: 3,
106                 ttsSpeed: 110,
107                 ttsVariant: "f3",
108                 shuffleLists: true,
109                 register: 249, // Must match Register_249 Id
110                 wordList: "20 basic tone combinations",
111                 language: "",
112                 synthesis_eSpeak: false,
113                 strict: 1,
114                 personalWordlists: [],
115                 displayNumbers: false,
116                 displayPinyin: true,
117                 displayChar: true,
118                 displayTrans: true,
119                 saveAudio: false,
120                 examplesDatabaseName: "SGC3 examples",
121                 audioDatabaseName: "SGC3 audio",
122                 currentCollection: "SGC3",
123                 selectedLessons: [],
124                 selectedTones: [],
125                 deselectedWords: []
126         };
127         
128         // Store settings
129         function store_SGC3_settings () {
130                 sgc3_settings.settingsRead = true;
132                 for (x in sgc3_settings) {
133                         localStorage["sgc3_"+x] = JSON.stringify(sgc3_settings[x]);
134                 };
135         };
136         
137         function load_SGC3_settings () {
138                 for (x in sgc3_settings) {
139                         // For some reason, parsing the language goes wrong
140                         if (localStorage["sgc3_"+x]) {
141                                 sgc3_settings[x] = JSON.parse(localStorage["sgc3_"+x]);
142                         };
143                 };
144                 examplesDatabaseName = sgc3_settings.examplesDatabaseName;
145                 audioDatabaseName = sgc3_settings.audioDatabaseName;
146                 
147                 wordlists = combineWordlistLists(global_wordlists, sgc3_settings.personalWordlists);
148                 get_wordlist (sgc3_settings.wordList);
150                 wordListName.textContent = sgc3_settings.wordList;
151                 set_selectWordsLanguage (sgc3_settings.language);
152                 add_lesson_names_to_select ();
153                 
154                 // Set selected tones
155                 if(sgc3_settings.selectedTones) {
156                         for (var i=0; i< selectTones.options.length; ++i) {
157                                 selectTones.options[i].selected = false;
158                         };
159                         for (var i=0; i< sgc3_settings.selectedTones.length; ++i) {
160                                 var tone = sgc3_settings.selectedTones[i];
161                                 selectTones.options[tone+1].selected = true;
162                         };
163                 };
164                 // Set selected lessons
165                 if(sgc3_settings.selectedLessons) {
166                         for (var i=0; i< selectLessons.options.length; ++i) {
167                                 selectLessons.options[i].selected = false;
168                         };
169                         for (var i=0; i< sgc3_settings.selectedLessons.length; ++i) {
170                                 var part = sgc3_settings.selectedLessons[i];
171                                 for (var j=0; j < selectLessons.options.length; ++ j) {
172                                         if(selectLessons.options[j].value == part) {
173                                                 selectLessons.options[j].selected = true;
174                                         };
175                                 };
176                         };
177                 };
178         };
179         
180         function selectedTones (selectedOptions) {
181                 sgc3_settings.selectedTones = [];
182                 var erase = false;
183                 for(var i=0; i < selectedOptions.length; ++i) {
184                         if (selectedOptions[i].value == "---") {
185                                 erase = true;
186                         } else {
187                                 sgc3_settings.selectedTones.push(Number(selectedOptions[i].value))
188                         };
189                 };
190                 // All is nothing
191                 if (erase || sgc3_settings.selectedTones.length >= selectTones.options.length - 1) sgc3_settings.selectedTones = [];
192                 store_SGC3_settings (); 
193         };
194         
195         function selectedLessons (selectedOptions) {
196                 sgc3_settings.selectedLessons = []; 
197                 for(var i=0; i < selectedOptions.length; ++i) {
198                         sgc3_settings.selectedLessons.push(selectedOptions[i].value + "")
199                 };
200                 // All is nothing
201                 if (sgc3_settings.selectedLessons.length >= selectLessons.options.length - 1 || sgc3_settings.selectedLessons.indexOf("---") > -1) sgc3_settings.selectedLessons = [];
202                 store_SGC3_settings (); 
203         };
204         
205         // Initialize to stored settings
206         load_SGC3_settings ();
207         
208         // Set language (make that selectable)
209         if (!sgc3_settings.language) {
210                 sgc3_settings.language = (userLanguage) ? userLanguage : "EN";
211         };
212         set_selectWordsLanguage (sgc3_settings.language);
215         function add_lesson_names_to_select () {
216                 var selector = document.getElementById('Part');
217                 var i = 0;
218                 // First, remove old entries
219                 var numOptions = selector.options.length
220                 for(var i = numOptions - 1; i > 0; --i) {
221                         selector.remove(i);
222                 };
223                 
224                 // Create a list with lesson names/numbers
225                 var lessons = [];
226                 for (var i=0; i < currentWordlist.length; ++ i) {
227                         var currentLesson = currentWordlist[i][4];
228                         if (currentLesson && currentLesson != "-" && lessons.indexOf(currentLesson) <= -1) {
229                                 lessons.push(currentLesson+"");
230                         };
231                 };
232                 
233                 // Add new entries
234                 for(i=0; i < lessons.length; ++i) {
235                         var lastOption = selector.options.length - 1;
236                         var lessonTitle = lessons[i];
237                         var newOption = selector.options[0].cloneNode(true);
238                         newOption.value = lessonTitle;
239                         newOption.text = lessonTitle;
240                         selector.add(newOption);
241                 };
242         };
245         //]]>   
246         </script>
247         
248 </body>
249 </html>