OLD | NEW |
| (Empty) |
1 var _testing = false; | |
2 | |
3 // The index into _keyTable of the key currently being tested. | |
4 var _currKey = 0; | |
5 | |
6 var _keysTotal = 0; | |
7 var _keysGood = 0; | |
8 var _keysBad = 0; | |
9 var _keysSkipped = 0; | |
10 | |
11 var _modifierMode = "None"; | |
12 | |
13 var _keydownCapture = []; | |
14 var _keyupCapture = []; | |
15 | |
16 var CAPTURE_KEYCODE = 0; | |
17 var CAPTURE_CODE = 1; | |
18 var CAPTURE_KEY = 2; | |
19 var CAPTURE_SHIFTKEY = 3; | |
20 var CAPTURE_CONTROLKEY = 4; | |
21 var CAPTURE_ALTKEY = 5; | |
22 var CAPTURE_METAKEY = 6; | |
23 | |
24 // An array of KeyInfo for each key to be tested. | |
25 var _keyTable = []; | |
26 | |
27 // KeyInfo fields. | |
28 var KEYINFO_CODE = 0; // |code| for this key | |
29 var KEYINFO_ROW = 1; // Keyboard row | |
30 var KEYINFO_TYPE = 2; // Key type (see below) | |
31 var KEYINFO_WIDTH = 3; // Width of key: 0=normal | |
32 var KEYINFO_KEYCAP = 4; // Keycap string to display | |
33 var KEYINFO_KEY = 5; // Unmodified key value | |
34 var KEYINFO_KEY_SHIFT = 6; // Shifted key value | |
35 | |
36 var KEYTYPE_NORMAL = 0; | |
37 var KEYTYPE_DISABLED = 1; // Key cannot be tested: e.g., CapsLock | |
38 var KEYTYPE_END = 2; // Used to mark end of KeyTable | |
39 var KEYTYPE_MODIFIER = 3; // Modifer key | |
40 | |
41 function clearChildren(e) { | |
42 while (e.firstChild !== null) { | |
43 e.removeChild(e.firstChild); | |
44 } | |
45 } | |
46 | |
47 function setText(e, text) { | |
48 clearChildren(e); | |
49 e.appendChild(document.createTextNode(text)); | |
50 } | |
51 | |
52 function setUserAgent() { | |
53 var userAgent = navigator.userAgent; | |
54 uaDiv = document.getElementById("useragent"); | |
55 setText(uaDiv, userAgent); | |
56 } | |
57 | |
58 function addEventListener(obj, etype, handler) { | |
59 if (obj.addEventListener) { | |
60 obj.addEventListener(etype, handler, false); | |
61 } else if (obj.attachEvent) { | |
62 obj.attachEvent("on"+etype, handler); | |
63 } else { | |
64 obj["on"+etype] = handler; | |
65 } | |
66 } | |
67 | |
68 function addClass(obj, className) { | |
69 obj.classList.add(className); | |
70 } | |
71 | |
72 function removeClass(obj, className) { | |
73 obj.classList.remove(className); | |
74 } | |
75 | |
76 function addInnerText(obj, text) { | |
77 obj.appendChild(document.createTextNode(text)); | |
78 } | |
79 | |
80 function calcLocation(loc) { | |
81 if (loc == 1) return "LEFT"; | |
82 if (loc == 2) return "RIGHT"; | |
83 if (loc == 3) return "NUMPAD"; | |
84 return loc; | |
85 } | |
86 | |
87 function isModifierKey(e) { | |
88 // Shift, Control, Alt | |
89 if (e.keyCode >= 16 && e.keyCode <= 18) { | |
90 return true; | |
91 } | |
92 // Windows, Command or Meta key. | |
93 if (e.keyCode == 224 // Right/Left: Gecko | |
94 || e.keyCode == 91 // Left: WebKit/Blink | |
95 || e.keyCode == 93 // Right: WebKit/Blink | |
96 ) { | |
97 return true; | |
98 } | |
99 return false; | |
100 } | |
101 | |
102 function init(title, keytable) { | |
103 _keyTable = keytable; | |
104 | |
105 createBody(title, keytable); | |
106 | |
107 setUserAgent(); | |
108 | |
109 var input = document.getElementById("input"); | |
110 input.disabled = true; | |
111 addEventListener(input, "keydown", onKeyDown); | |
112 addEventListener(input, "keyup", onKeyUp); | |
113 //addEventListener(input, "beforeInput", onBeforeInput); | |
114 //addEventListener(input, "input", onInput); | |
115 } | |
116 | |
117 function onKeyDown(e) { | |
118 // Ignore modifier keys when checking modifier combinations. | |
119 if (_modifierMode != "None" && isModifierKey(e)) { | |
120 return; | |
121 } | |
122 | |
123 _keydownInfo = [e.keyCode, e.code, e.key, e.shiftKey, e.ctrlKey, e.altKey, e
.metaKey]; | |
124 if (e.keyCode == 9 || e.code == "Tab") { | |
125 e.preventDefault(); | |
126 } | |
127 } | |
128 | |
129 function onKeyUp(e) { | |
130 // Ignore modifier keys when checking modifier combinations. | |
131 if (_modifierMode != "None" && isModifierKey(e)) { | |
132 return; | |
133 } | |
134 | |
135 _keyupInfo = [e.keyCode, e.code, e.key, e.shiftKey, e.ctrlKey, e.altKey, e.m
etaKey]; | |
136 | |
137 if (_testing) { | |
138 verifyKey(); | |
139 nextKey(); | |
140 } | |
141 } | |
142 | |
143 function onBeforeInput(e) { | |
144 } | |
145 | |
146 function onInput(e) { | |
147 } | |
148 | |
149 function addError(elem, str) { | |
150 var p = document.createElement('p'); | |
151 p.classList.add("error2"); | |
152 p.textContent = str; | |
153 elem.appendChild(p); | |
154 } | |
155 | |
156 function addErrorIncorrect(elem, eventName, attrName, keyEventInfo, attr, expect
ed) { | |
157 addError(elem, "Incorrect " + eventName | |
158 + " |" + attrName + "| = " + keyEventInfo[attr] | |
159 + " - Expected " + expected); | |
160 } | |
161 | |
162 function verifyKeyEventFields(eventName, keyEventInfo, code, key, error) { | |
163 var verifyCode = document.getElementById("opt_attr_code").checked; | |
164 var verifyKey = document.getElementById("opt_attr_key").checked; | |
165 var verifyModifiers = document.getElementById("opt_attr_modifiers").checked; | |
166 var good = true; | |
167 | |
168 if (!verifyCode && !verifyKey && !verifyModifiers) { | |
169 good = false; | |
170 addError(error, "Invalid test: At least one attribute must be selected f
or testing."); | |
171 } | |
172 if (verifyCode && keyEventInfo[CAPTURE_CODE] != code) { | |
173 good = false; | |
174 addErrorIncorrect(error, eventName, "code", keyEventInfo, CAPTURE_CODE,
code); | |
175 } | |
176 if (verifyKey && keyEventInfo[CAPTURE_KEY] != key) { | |
177 good = false; | |
178 addErrorIncorrect(error, eventName, "key", keyEventInfo, CAPTURE_KEY, ke
y); | |
179 } | |
180 if (verifyModifiers) { | |
181 if (keyEventInfo[CAPTURE_SHIFTKEY] != (_modifierMode == "Shift")) { | |
182 good = false; | |
183 addErrorIncorrect(error, eventName, "shiftKey", keyEventInfo, CAPTUR
E_SHIFTKEY, false); | |
184 } | |
185 if (keyEventInfo[CAPTURE_CONTROLKEY]) { | |
186 good = false; | |
187 addErrorIncorrect(error, eventName, "controlKey", keyEventInfo, CAPT
URE_CONTROLKEY, false); | |
188 } | |
189 if (keyEventInfo[CAPTURE_ALTKEY]) { | |
190 good = false; | |
191 addErrorIncorrect(error, eventName, "altKey", keyEventInfo, CAPTURE_
ALTKEY, false); | |
192 } | |
193 if (keyEventInfo[CAPTURE_METAKEY]) { | |
194 good = false; | |
195 addErrorIncorrect(error, eventName, "metaKey", keyEventInfo, CAPTURE
_METAKEY, false); | |
196 } | |
197 } | |
198 | |
199 return good; | |
200 } | |
201 | |
202 function verifyKey() { | |
203 _keysTotal++; | |
204 | |
205 var keyInfo = _keyTable[_currKey]; | |
206 var code = keyInfo[KEYINFO_CODE]; | |
207 var key = keyInfo[KEYINFO_KEY]; | |
208 var keyShift = keyInfo[KEYINFO_KEY_SHIFT]; | |
209 | |
210 var keyCheck = key; | |
211 if (_modifierMode == "Shift") { | |
212 keyCheck = keyShift; | |
213 } | |
214 | |
215 var verifyKeydown = document.getElementById("opt_event_keydown").checked; | |
216 var verifyKeyup = document.getElementById("opt_event_keyup").checked; | |
217 | |
218 var error = document.createElement('div'); | |
219 error.classList.add("error"); | |
220 var good = true; | |
221 | |
222 if (verifyKeydown) { | |
223 good = verifyKeyEventFields("keydown", _keydownInfo, code, keyCheck, err
or); | |
224 } | |
225 if (verifyKeyup) { | |
226 good = verifyKeyEventFields("keyup", _keyupInfo, code, keyCheck, error); | |
227 } | |
228 | |
229 if (!verifyKeydown && !verifyKeyup) { | |
230 good = false; | |
231 addError(error, "Invalid test: At least one event must be selected for t
esting."); | |
232 } | |
233 | |
234 // Allow Escape key to skip the current key. | |
235 var skipped = false; | |
236 if (_keydownInfo[CAPTURE_KEYCODE] == 27 || _keydownInfo[CAPTURE_CODE] == "Es
cape") { | |
237 good = true; | |
238 skipped = true; | |
239 } | |
240 | |
241 if (!good) { | |
242 var p = document.createElement('p'); | |
243 p.classList.add("error1"); | |
244 p.textContent = "Error : " + code; | |
245 error.insertBefore(p, error.firstChild); | |
246 } | |
247 | |
248 removeNextKeyHilight(); | |
249 if (skipped) { | |
250 _keysSkipped++; | |
251 document.getElementById(code).classList.add("skippedKey") | |
252 } else if (good) { | |
253 _keysGood++; | |
254 document.getElementById(code).classList.add("goodKey") | |
255 } else { | |
256 _keysBad++; | |
257 document.getElementById(code).classList.add("badKey") | |
258 } | |
259 updateTestSummary(good ? null : error); | |
260 } | |
261 | |
262 function updateTestSummary(error) { | |
263 document.getElementById("keys-total").textContent = _keysTotal; | |
264 document.getElementById("keys-good").textContent = _keysGood; | |
265 document.getElementById("keys-bad").textContent = _keysBad; | |
266 document.getElementById("keys-skipped").textContent = _keysSkipped; | |
267 | |
268 if (error) { | |
269 var errors = document.getElementById("errors"); | |
270 errors.insertBefore(error, errors.firstChild); | |
271 } | |
272 } | |
273 | |
274 function resetTest() { | |
275 _keysTotal = 0; | |
276 _keysGood = 0; | |
277 _keysBad = 0; | |
278 | |
279 _currKey = -1; | |
280 nextKey(); | |
281 | |
282 updateTestSummary(); | |
283 | |
284 // Remove previous test results. | |
285 clearChildren(document.getElementById("errors")); | |
286 | |
287 // Remove highlighting from keys. | |
288 for (var i = 0; i < _keyTable.length; i++) { | |
289 var code = _keyTable[i][KEYINFO_CODE]; | |
290 var type = _keyTable[i][KEYINFO_TYPE]; | |
291 if (type != KEYTYPE_END) { | |
292 var key = document.getElementById(code); | |
293 key.classList.remove("goodKey"); | |
294 key.classList.remove("badKey"); | |
295 key.classList.remove("skippedKey"); | |
296 } | |
297 } | |
298 } | |
299 | |
300 function startTest() { | |
301 if (_testing) { | |
302 // Cancel the currently running test. | |
303 endTest(); | |
304 return; | |
305 } | |
306 | |
307 resetTest(); | |
308 _testing = true; | |
309 document.getElementById("start").value = "Stop Test" | |
310 | |
311 var input = document.getElementById("input"); | |
312 input.value = ""; | |
313 input.disabled = false; | |
314 input.focus(); | |
315 | |
316 // Show test instructions and info. | |
317 document.getElementById("test-info").style.display = 'block'; | |
318 document.getElementById("instructions").style.display = 'block'; | |
319 document.getElementById("test-done").style.display = 'none'; | |
320 } | |
321 | |
322 function endTest() { | |
323 _testing = false; | |
324 removeNextKeyHilight(); | |
325 document.getElementById("start").value = "Restart Test" | |
326 document.getElementById("input").disabled = true; | |
327 document.getElementById("instructions").style.display = 'none'; | |
328 document.getElementById("test-done").style.display = 'block'; | |
329 } | |
330 | |
331 function removeNextKeyHilight() { | |
332 var curr = document.getElementById(_keyTable[_currKey][KEYINFO_CODE]); | |
333 if (curr) { | |
334 removeClass(curr, "nextKey") | |
335 } | |
336 } | |
337 | |
338 function addNextKeyHilight() { | |
339 var curr = document.getElementById(_keyTable[_currKey][KEYINFO_CODE]); | |
340 if (curr) { | |
341 addClass(curr, "nextKey") | |
342 } | |
343 } | |
344 | |
345 function nextKey() { | |
346 var keyInfo; | |
347 var keepLooking = true; | |
348 do { | |
349 _currKey++; | |
350 keyInfo = _keyTable[_currKey]; | |
351 var type = keyInfo[KEYINFO_TYPE]; | |
352 | |
353 // Skip over disabled keys. | |
354 keepLooking = (type == KEYTYPE_DISABLED); | |
355 | |
356 // Skip over modifier keys if we're testing modifier combinations. | |
357 if (_modifierMode != "None" && type == KEYTYPE_MODIFIER) { | |
358 keepLooking = true; | |
359 } | |
360 | |
361 // Skip over keys in disabled rows. | |
362 if (type != KEYTYPE_END) { | |
363 var row = keyInfo[KEYINFO_ROW]; | |
364 var rowEnabled = document.getElementById("opt_row_" + row).checked; | |
365 keepLooking = keepLooking || !rowEnabled; | |
366 } | |
367 } while (keepLooking); | |
368 | |
369 if (keyInfo[KEYINFO_TYPE] == KEYTYPE_END) { | |
370 endTest(); | |
371 } else { | |
372 addNextKeyHilight(); | |
373 } | |
374 } | |
375 | |
376 function toggleOptions() { | |
377 var link = document.getElementById("optionstoggle"); | |
378 var options = document.getElementById("options"); | |
379 clearChildren(link); | |
380 if (options.style.display == "block") { | |
381 options.style.display = "none"; | |
382 addInnerText(link, "Show Options"); | |
383 } | |
384 else { | |
385 options.style.display = "block"; | |
386 addInnerText(link, "Hide Options"); | |
387 } | |
388 } | |
389 | |
390 function toggleHelp() { | |
391 var link = document.getElementById("helptoggle"); | |
392 var help = document.getElementById("help"); | |
393 clearChildren(link); | |
394 if (help.style.display == "block") { | |
395 help.style.display = "none"; | |
396 addInnerText(link, "Show Help"); | |
397 } | |
398 else { | |
399 help.style.display = "block"; | |
400 addInnerText(link, "Hide Help"); | |
401 } | |
402 } | |
403 | |
404 function createBody(title, keytable) { | |
405 var body = document.getElementsByTagName("body")[0]; | |
406 var p; | |
407 var span; | |
408 | |
409 var h1 = document.createElement('h1'); | |
410 h1.textContent = "Keyboard Event Manual Test - " + title; | |
411 body.appendChild(h1); | |
412 | |
413 // Display useragent. | |
414 p = document.createElement('p'); | |
415 p.textContent = "UserAgent: "; | |
416 var useragent = document.createElement('span'); | |
417 useragent.id = "useragent"; | |
418 p.appendChild(useragent); | |
419 body.appendChild(p); | |
420 | |
421 // Display input textedit. | |
422 p = document.createElement('p'); | |
423 p.textContent = "Test Input: "; | |
424 var input1 = document.createElement('input'); | |
425 input1.id = "input"; | |
426 input1.type = "text"; | |
427 input1.size = 80; | |
428 p.appendChild(input1); | |
429 p.appendChild(document.createTextNode(" ")); | |
430 var input2 = document.createElement('input'); | |
431 input2.id = "start"; | |
432 input2.type = "button"; | |
433 input2.onclick = function() { startTest(); return false; } | |
434 input2.value = "Start Test"; | |
435 p.appendChild(input2); | |
436 p.appendChild(document.createTextNode(" ")); | |
437 var optionsToggle = document.createElement('a'); | |
438 optionsToggle.id = "optionstoggle"; | |
439 optionsToggle.href = "javascript:toggleOptions()"; | |
440 optionsToggle.textContent = "Show Options"; | |
441 p.appendChild(optionsToggle); | |
442 p.appendChild(document.createTextNode(" ")); | |
443 var helpToggle = document.createElement('a'); | |
444 helpToggle.id = "helptoggle"; | |
445 helpToggle.href = "javascript:toggleHelp()"; | |
446 helpToggle.textContent = "Show Help"; | |
447 p.appendChild(helpToggle); | |
448 body.appendChild(p); | |
449 | |
450 createOptions(body); | |
451 | |
452 createHelp(body); | |
453 | |
454 createKeyboard(body, keytable); | |
455 | |
456 // Test info and summary. | |
457 var test_info = document.createElement('div'); | |
458 test_info.id = "test-info"; | |
459 test_info.style.display = "none"; | |
460 | |
461 var instructions = document.createElement('div'); | |
462 instructions.id = "instructions"; | |
463 p = document.createElement('p'); | |
464 p.textContent = "Press the highlighted key."; | |
465 instructions.appendChild(p); | |
466 test_info.appendChild(instructions); | |
467 | |
468 var test_done = document.createElement('div'); | |
469 test_done.id = "test-done"; | |
470 p = document.createElement('p'); | |
471 p.textContent = "Test complete!"; | |
472 test_done.appendChild(p); | |
473 test_info.appendChild(test_done); | |
474 | |
475 var summary = document.createElement('div'); | |
476 summary.id = "summary"; | |
477 p = document.createElement('p'); | |
478 summary.appendChild(document.createTextNode("Keys Tested: ")); | |
479 span = document.createElement('span'); | |
480 span.id = "keys-total"; | |
481 span.textContent = 0; | |
482 summary.appendChild(span); | |
483 summary.appendChild(document.createTextNode("; Passed ")); | |
484 span = document.createElement('span'); | |
485 span.id = "keys-good"; | |
486 span.textContent = 0; | |
487 summary.appendChild(span); | |
488 summary.appendChild(document.createTextNode("; Failed ")); | |
489 span = document.createElement('span'); | |
490 span.id = "keys-bad"; | |
491 span.textContent = 0; | |
492 summary.appendChild(span); | |
493 summary.appendChild(document.createTextNode("; Skipped ")); | |
494 span = document.createElement('span'); | |
495 span.id = "keys-skipped"; | |
496 span.textContent = 0; | |
497 summary.appendChild(span); | |
498 test_info.appendChild(summary); | |
499 | |
500 var errors = document.createElement('div'); | |
501 errors.id = "errors"; | |
502 test_info.appendChild(errors); | |
503 | |
504 body.appendChild(test_info); | |
505 } | |
506 | |
507 function addOptionTitle(cell, title) { | |
508 var span = document.createElement('span'); | |
509 span.classList.add("opttitle"); | |
510 span.textContent = title; | |
511 cell.appendChild(span); | |
512 cell.appendChild(document.createElement("br")); | |
513 } | |
514 | |
515 function addOptionCheckbox(cell, id, text) { | |
516 var label = document.createElement("label"); | |
517 | |
518 var input = document.createElement("input"); | |
519 input.type = "checkbox"; | |
520 input.id = id; | |
521 input.checked = true; | |
522 label.appendChild(input); | |
523 | |
524 label.appendChild(document.createTextNode(" " + text)); | |
525 cell.appendChild(label); | |
526 | |
527 cell.appendChild(document.createElement("br")); | |
528 } | |
529 | |
530 function addOptionRadio(cell, group, text, handler, checked) { | |
531 var label = document.createElement("label"); | |
532 | |
533 var input = document.createElement("input"); | |
534 input.type = "radio"; | |
535 input.name = group; | |
536 input.value = text; | |
537 input.onclick = handler; | |
538 input.checked = checked; | |
539 label.appendChild(input); | |
540 | |
541 label.appendChild(document.createTextNode(" " + text)); | |
542 cell.appendChild(label); | |
543 | |
544 cell.appendChild(document.createElement("br")); | |
545 } | |
546 | |
547 function handleModifierGroup() { | |
548 var radio = document.querySelector("input[name=opt_modifier]:checked"); | |
549 var oldMode = _modifierMode; | |
550 _modifierMode = radio.value; | |
551 | |
552 if (oldMode == "Shift") { | |
553 document.getElementById("ShiftLeft").classList.remove("activeModifierKey
"); | |
554 document.getElementById("ShiftRight").classList.remove("activeModifierKe
y"); | |
555 } | |
556 | |
557 if (_modifierMode == "Shift") { | |
558 document.getElementById("ShiftLeft").classList.add("activeModifierKey"); | |
559 document.getElementById("ShiftRight").classList.add("activeModifierKey")
; | |
560 } | |
561 } | |
562 | |
563 function createOptions(body) { | |
564 var options = document.createElement('div'); | |
565 options.id = "options"; | |
566 options.style.display = "none"; | |
567 | |
568 var table = document.createElement('table'); | |
569 table.classList.add("opttable"); | |
570 var row = document.createElement('tr'); | |
571 var cell; | |
572 | |
573 cell = document.createElement('td'); | |
574 cell.classList.add("optcell"); | |
575 addOptionTitle(cell, "Keyboard Rows"); | |
576 addOptionCheckbox(cell, "opt_row_0", "Row E (top)"); | |
577 addOptionCheckbox(cell, "opt_row_1", "Row D"); | |
578 addOptionCheckbox(cell, "opt_row_2", "Row C"); | |
579 addOptionCheckbox(cell, "opt_row_3", "Row B"); | |
580 addOptionCheckbox(cell, "opt_row_4", "Row A (bottom)"); | |
581 row.appendChild(cell); | |
582 | |
583 cell = document.createElement('td'); | |
584 cell.classList.add("optcell"); | |
585 addOptionTitle(cell, "Events"); | |
586 addOptionCheckbox(cell, "opt_event_keydown", "keydown"); | |
587 addOptionCheckbox(cell, "opt_event_keyup", "keyup"); | |
588 row.appendChild(cell); | |
589 | |
590 cell = document.createElement('td'); | |
591 cell.classList.add("optcell"); | |
592 addOptionTitle(cell, "Attributes"); | |
593 addOptionCheckbox(cell, "opt_attr_code", "code"); | |
594 addOptionCheckbox(cell, "opt_attr_key", "key"); | |
595 addOptionCheckbox(cell, "opt_attr_modifiers", "modifiers"); | |
596 row.appendChild(cell); | |
597 | |
598 cell = document.createElement('td'); | |
599 cell.classList.add("optcell"); | |
600 addOptionTitle(cell, "Modifiers"); | |
601 addOptionRadio(cell, "opt_modifier", "None", handleModifierGroup, true); | |
602 addOptionRadio(cell, "opt_modifier", "Shift", handleModifierGroup, false); | |
603 row.appendChild(cell); | |
604 | |
605 table.appendChild(row); | |
606 options.appendChild(table); | |
607 | |
608 body.appendChild(options); | |
609 } | |
610 | |
611 function addHelpText(div, text) { | |
612 var p = document.createElement('p'); | |
613 p.classList.add("help"); | |
614 p.textContent = text; | |
615 div.appendChild(p); | |
616 } | |
617 | |
618 function createHelp(body) { | |
619 var help = document.createElement('div'); | |
620 help.id = "help"; | |
621 help.style.display = "none"; | |
622 | |
623 addHelpText(help, "Click on the \"Start Test\" button to begin testing."); | |
624 addHelpText(help, "Press the hilighted key to test it."); | |
625 addHelpText(help, "Clicking anywhere outside the \"Test Input\" editbox will
pause testing. To resume, click back inside the editbox."); | |
626 addHelpText(help, "To skip a key while testing, press Escape."); | |
627 addHelpText(help, "When testing with modifier keys, the modifier must be pre
ssed before the keydown and released after the keyup of the key being tested."); | |
628 | |
629 body.appendChild(help); | |
630 } | |
631 | |
632 function createKeyboard(body, keytable) { | |
633 var keyboard = document.createElement('div'); | |
634 keyboard.classList.add("keyboard"); | |
635 | |
636 var currRow = 0; | |
637 var row = document.createElement('div'); | |
638 row.classList.add("key-row"); | |
639 | |
640 for (var i = 0; i < keytable.length; i++) { | |
641 var code = keytable[i][KEYINFO_CODE]; | |
642 var rowId = keytable[i][KEYINFO_ROW]; | |
643 var type = keytable[i][KEYINFO_TYPE]; | |
644 var width = keytable[i][KEYINFO_WIDTH]; | |
645 var keyCap = keytable[i][KEYINFO_KEYCAP]; | |
646 | |
647 if (type == KEYTYPE_END) { | |
648 continue; | |
649 } | |
650 | |
651 if (rowId != currRow) { | |
652 keyboard.appendChild(row); | |
653 row = document.createElement('div'); | |
654 row.classList.add("key-row"); | |
655 currRow = rowId; | |
656 } | |
657 | |
658 var key = document.createElement('div'); | |
659 key.id = code; | |
660 key.classList.add("key"); | |
661 if (width != 0) { | |
662 key.classList.add("wide" + width); | |
663 } | |
664 key.textContent = keyCap; | |
665 | |
666 row.appendChild(key); | |
667 } | |
668 | |
669 keyboard.appendChild(row); | |
670 body.appendChild(keyboard); | |
671 } | |
OLD | NEW |