clockwerk-guacamole – Blame information for rev 1

Subversion Repositories:
Rev:
Rev Author Line No. Line
1 eva 1  
2 /* ***** BEGIN LICENSE BLOCK *****
3 * Version: MPL 1.1/GPL 2.0/LGPL 2.1
4 *
5 * The contents of this file are subject to the Mozilla Public License Version
6 * 1.1 (the "License"); you may not use this file except in compliance with
7 * the License. You may obtain a copy of the License at
8 * http://www.mozilla.org/MPL/
9 *
10 * Software distributed under the License is distributed on an "AS IS" basis,
11 * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
12 * for the specific language governing rights and limitations under the
13 * License.
14 *
15 * The Original Code is guac-common-js.
16 *
17 * The Initial Developer of the Original Code is
18 * Michael Jumper.
19 * Portions created by the Initial Developer are Copyright (C) 2010
20 * the Initial Developer. All Rights Reserved.
21 *
22 * Contributor(s):
23 *
24 * Alternatively, the contents of this file may be used under the terms of
25 * either the GNU General Public License Version 2 or later (the "GPL"), or
26 * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
27 * in which case the provisions of the GPL or the LGPL are applicable instead
28 * of those above. If you wish to allow use of your version of this file only
29 * under the terms of either the GPL or the LGPL, and not to allow others to
30 * use your version of this file under the terms of the MPL, indicate your
31 * decision by deleting the provisions above and replace them with the notice
32 * and other provisions required by the GPL or the LGPL. If you do not delete
33 * the provisions above, a recipient may use your version of this file under
34 * the terms of any one of the MPL, the GPL or the LGPL.
35 *
36 * ***** END LICENSE BLOCK ***** */
37  
38 // Guacamole namespace
39 var Guacamole = Guacamole || {};
40  
41 /**
42 * Dynamic on-screen keyboard. Given the URL to an XML keyboard layout file,
43 * this object will download and use the XML to construct a clickable on-screen
44 * keyboard with its own key events.
45 *
46 * @constructor
47 * @param {String} url The URL of an XML keyboard layout file.
48 */
49 Guacamole.OnScreenKeyboard = function(url) {
50  
51 var on_screen_keyboard = this;
52  
53 var scaledElements = [];
54  
55 var modifiers = {};
56 var currentModifier = 1;
57  
58 // Function for adding a class to an element
59 var addClass;
60  
61 // Function for removing a class from an element
62 var removeClass;
63  
64 // If Node.classList is supported, implement addClass/removeClass using that
65 if (Node.classList) {
66  
67 addClass = function(element, classname) {
68 element.classList.add(classname);
69 };
70  
71 removeClass = function(element, classname) {
72 element.classList.remove(classname);
73 };
74  
75 }
76  
77 // Otherwise, implement own
78 else {
79  
80 addClass = function(element, classname) {
81  
82 // Simply add new class
83 element.className += " " + classname;
84  
85 };
86  
87 removeClass = function(element, classname) {
88  
89 // Filter out classes with given name
90 element.className = element.className.replace(/([^ ]+)[ ]*/g,
91 function(match, testClassname, spaces, offset, string) {
92  
93 // If same class, remove
94 if (testClassname == classname)
95 return "";
96  
97 // Otherwise, allow
98 return match;
99  
100 }
101 );
102  
103 };
104  
105 }
106  
107 // Returns a unique power-of-two value for the modifier with the
108 // given name. The same value will be returned for the same modifier.
109 function getModifier(name) {
110  
111 var value = modifiers[name];
112 if (!value) {
113  
114 // Get current modifier, advance to next
115 value = currentModifier;
116 currentModifier <<= 1;
117  
118 // Store value of this modifier
119 modifiers[name] = value;
120  
121 }
122  
123 return value;
124  
125 }
126  
127 function ScaledElement(element, width, height, scaleFont) {
128  
129 this.width = width;
130 this.height = height;
131  
132 this.scale = function(pixels) {
133 element.style.width = (width * pixels) + "px";
134 element.style.height = (height * pixels) + "px";
135  
136 if (scaleFont) {
137 element.style.lineHeight = (height * pixels) + "px";
138 element.style.fontSize = pixels + "px";
139 }
140 }
141  
142 }
143  
144 // For each child of element, call handler defined in next
145 function parseChildren(element, next) {
146  
147 var children = element.childNodes;
148 for (var i=0; i<children.length; i++) {
149  
150 // Get child node
151 var child = children[i];
152  
153 // Do not parse text nodes
154 if (!child.tagName)
155 continue;
156  
157 // Get handler for node
158 var handler = next[child.tagName];
159  
160 // Call handler if defined
161 if (handler)
162 handler(child);
163  
164 // Throw exception if no handler
165 else
166 throw new Error(
167 "Unexpected " + child.tagName
168 + " within " + element.tagName
169 );
170  
171 }
172  
173 }
174  
175 // Create keyboard
176 var keyboard = document.createElement("div");
177 keyboard.className = "guac-keyboard";
178  
179 // Retrieve keyboard XML
180 var xmlhttprequest = new XMLHttpRequest();
181 xmlhttprequest.open("GET", url, false);
182 xmlhttprequest.send(null);
183  
184 var xml = xmlhttprequest.responseXML;
185  
186 if (xml) {
187  
188 function parse_row(e) {
189  
190 var row = document.createElement("div");
191 row.className = "guac-keyboard-row";
192  
193 parseChildren(e, {
194  
195 "column": function(e) {
196 row.appendChild(parse_column(e));
197 },
198  
199 "gap": function parse_gap(e) {
200  
201 // Create element
202 var gap = document.createElement("div");
203 gap.className = "guac-keyboard-gap";
204  
205 // Set gap size
206 var gap_units = 1;
207 if (e.getAttribute("size"))
208 gap_units = parseFloat(e.getAttribute("size"));
209  
210 scaledElements.push(new ScaledElement(gap, gap_units, gap_units));
211 row.appendChild(gap);
212  
213 },
214  
215 "key": function parse_key(e) {
216  
217 // Create element
218 var key_element = document.createElement("div");
219 key_element.className = "guac-keyboard-key";
220  
221 // Append class if specified
222 if (e.getAttribute("class"))
223 key_element.className += " " + e.getAttribute("class");
224  
225 // Position keys using container div
226 var key_container_element = document.createElement("div");
227 key_container_element.className = "guac-keyboard-key-container";
228 key_container_element.appendChild(key_element);
229  
230 // Create key
231 var key = new Guacamole.OnScreenKeyboard.Key();
232  
233 // Set key size
234 var key_units = 1;
235 if (e.getAttribute("size"))
236 key_units = parseFloat(e.getAttribute("size"));
237  
238 key.size = key_units;
239  
240 parseChildren(e, {
241 "cap": function parse_cap(e) {
242  
243 // TODO: Handle "sticky" attribute
244  
245 // Get content of key cap
246 var content = e.textContent || e.text;
247  
248 // If read as blank, assume cap is a single space.
249 if (content.length == 0)
250 content = " ";
251  
252 // Get keysym
253 var real_keysym = null;
254 if (e.getAttribute("keysym"))
255 real_keysym = parseInt(e.getAttribute("keysym"));
256  
257 // If no keysym specified, try to get from key content
258 else if (content.length == 1) {
259  
260 var charCode = content.charCodeAt(0);
261 if (charCode >= 0x0000 && charCode <= 0x00FF)
262 real_keysym = charCode;
263 else if (charCode >= 0x0100 && charCode <= 0x10FFFF)
264 real_keysym = 0x01000000 | charCode;
265  
266 }
267  
268 // Create cap
269 var cap = new Guacamole.OnScreenKeyboard.Cap(content, real_keysym);
270  
271 if (e.getAttribute("modifier"))
272 cap.modifier = e.getAttribute("modifier");
273  
274 // Create cap element
275 var cap_element = document.createElement("div");
276 cap_element.className = "guac-keyboard-cap";
277 cap_element.textContent = content;
278 key_element.appendChild(cap_element);
279  
280 // Append class if specified
281 if (e.getAttribute("class"))
282 cap_element.className += " " + e.getAttribute("class");
283  
284 // Get modifier value
285 var modifierValue = 0;
286 if (e.getAttribute("if")) {
287  
288 // Get modifier value for specified comma-delimited
289 // list of required modifiers.
290 var requirements = e.getAttribute("if").split(",");
291 for (var i=0; i<requirements.length; i++) {
292 modifierValue |= getModifier(requirements[i]);
293 addClass(cap_element, "guac-keyboard-requires-" + requirements[i]);
294 addClass(key_element, "guac-keyboard-uses-" + requirements[i]);
295 }
296  
297 }
298  
299 // Store cap
300 key.modifierMask |= modifierValue;
301 key.caps[modifierValue] = cap;
302  
303 }
304 });
305  
306 scaledElements.push(new ScaledElement(key_container_element, key_units, 1, true));
307 row.appendChild(key_container_element);
308  
309 // Set up click handler for key
310 function press(e) {
311  
312 // Press key if not yet pressed
313 if (!key.pressed) {
314  
315 addClass(key_element, "guac-keyboard-pressed");
316  
317 // Get current cap based on modifier state
318 var cap = key.getCap(on_screen_keyboard.modifiers);
319  
320 // Update modifier state
321 if (cap.modifier) {
322  
323 // Construct classname for modifier
324 var modifierClass = "guac-keyboard-modifier-" + cap.modifier;
325 var modifierFlag = getModifier(cap.modifier);
326  
327 // Toggle modifier state
328 on_screen_keyboard.modifiers ^= modifierFlag;
329  
330 // Activate modifier if pressed
331 if (on_screen_keyboard.modifiers & modifierFlag) {
332  
333 addClass(keyboard, modifierClass);
334  
335 // Send key event
336 if (on_screen_keyboard.onkeydown && cap.keysym)
337 on_screen_keyboard.onkeydown(cap.keysym);
338  
339 }
340  
341 // Deactivate if not pressed
342 else {
343  
344 removeClass(keyboard, modifierClass);
345  
346 // Send key event
347 if (on_screen_keyboard.onkeyup && cap.keysym)
348 on_screen_keyboard.onkeyup(cap.keysym);
349  
350 }
351  
352 }
353  
354 // If not modifier, send key event now
355 else if (on_screen_keyboard.onkeydown && cap.keysym)
356 on_screen_keyboard.onkeydown(cap.keysym);
357  
358 // Mark key as pressed
359 key.pressed = true;
360  
361 }
362  
363 e.preventDefault();
364  
365 };
366  
367 function release(e) {
368  
369 // Release key if currently pressed
370 if (key.pressed) {
371  
372 // Get current cap based on modifier state
373 var cap = key.getCap(on_screen_keyboard.modifiers);
374  
375 removeClass(key_element, "guac-keyboard-pressed");
376  
377 // Send key event if not a modifier key
378 if (!cap.modifier && on_screen_keyboard.onkeyup && cap.keysym)
379 on_screen_keyboard.onkeyup(cap.keysym);
380  
381 // Mark key as released
382 key.pressed = false;
383  
384 }
385  
386 e.preventDefault();
387  
388 };
389  
390 key_element.addEventListener("mousedown", press, true);
391 key_element.addEventListener("touchstart", press, true);
392  
393 key_element.addEventListener("mouseup", release, true);
394 key_element.addEventListener("mouseout", release, true);
395 key_element.addEventListener("touchend", release, true);
396  
397 }
398  
399 });
400  
401 return row;
402  
403 }
404  
405 function parse_column(e) {
406  
407 var col = document.createElement("div");
408 col.className = "guac-keyboard-column";
409  
410 if (col.getAttribute("align"))
411 col.style.textAlign = col.getAttribute("align");
412  
413 // Columns can only contain rows
414 parseChildren(e, {
415 "row": function(e) {
416 col.appendChild(parse_row(e));
417 }
418 });
419  
420 return col;
421  
422 }
423  
424  
425 // Parse document
426 var keyboard_element = xml.documentElement;
427 if (keyboard_element.tagName != "keyboard")
428 throw new Error("Root element must be keyboard");
429  
430 // Get attributes
431 if (!keyboard_element.getAttribute("size"))
432 throw new Error("size attribute is required for keyboard");
433  
434 var keyboard_size = parseFloat(keyboard_element.getAttribute("size"));
435  
436 parseChildren(keyboard_element, {
437  
438 "row": function(e) {
439 keyboard.appendChild(parse_row(e));
440 },
441  
442 "column": function(e) {
443 keyboard.appendChild(parse_column(e));
444 }
445  
446 });
447  
448 }
449  
450 // Do not allow selection or mouse movement to propagate/register.
451 keyboard.onselectstart =
452 keyboard.onmousemove =
453 keyboard.onmouseup =
454 keyboard.onmousedown =
455 function(e) {
456 e.stopPropagation();
457 return false;
458 };
459  
460 /**
461 * State of all modifiers.
462 */
463 this.modifiers = 0;
464  
465 this.onkeydown = null;
466 this.onkeyup = null;
467  
468 this.getElement = function() {
469 return keyboard;
470 };
471  
472 this.resize = function(width) {
473  
474 // Get pixel size of a unit
475 var unit = Math.floor(width * 10 / keyboard_size) / 10;
476  
477 // Resize all scaled elements
478 for (var i=0; i<scaledElements.length; i++) {
479 var scaledElement = scaledElements[i];
480 scaledElement.scale(unit)
481 }
482  
483 };
484  
485 };
486  
487 Guacamole.OnScreenKeyboard.Key = function() {
488  
489 var key = this;
490  
491 /**
492 * Whether this key is currently pressed.
493 */
494 this.pressed = false;
495  
496 /**
497 * Width of the key, relative to the size of the keyboard.
498 */
499 this.size = 1;
500  
501 /**
502 * An associative map of all caps by modifier.
503 */
504 this.caps = {};
505  
506 /**
507 * Bit mask with all modifiers that affect this key set.
508 */
509 this.modifierMask = 0;
510  
511 /**
512 * Given the bitwise OR of all active modifiers, returns the key cap
513 * which applies.
514 */
515 this.getCap = function(modifier) {
516 return key.caps[modifier & key.modifierMask];
517 };
518  
519 }
520  
521 Guacamole.OnScreenKeyboard.Cap = function(text, keysym, modifier) {
522  
523 /**
524 * Modifier represented by this keycap
525 */
526 this.modifier = null;
527  
528 /**
529 * The text to be displayed within this keycap
530 */
531 this.text = text;
532  
533 /**
534 * The keysym this cap sends when its associated key is pressed/released
535 */
536 this.keysym = keysym;
537  
538 // Set modifier if provided
539 if (modifier) this.modifier = modifier;
540  
541 }