*
* ***** END LICENSE BLOCK ***** */
-// Guacamole namespace
+/**
+ * Namespace for all Guacamole JavaScript objects.
+ * @namespace
+ */
var Guacamole = Guacamole || {};
/**
var on_screen_keyboard = this;
+ /**
+ * State of all modifiers. This is the bitwise OR of all active modifier
+ * values.
+ *
+ * @private
+ */
+ var modifiers = 0;
+
var scaledElements = [];
var modifiers = {};
var currentModifier = 1;
- // Function for adding a class to an element
+ /**
+ * Adds a class to an element.
+ *
+ * @private
+ * @function
+ * @param {Element} element The element to add a class to.
+ * @param {String} classname The name of the class to add.
+ */
var addClass;
- // Function for removing a class from an element
+ /**
+ * Removes a class from an element.
+ *
+ * @private
+ * @function
+ * @param {Element} element The element to remove a class from.
+ * @param {String} classname The name of the class to remove.
+ */
var removeClass;
// If Node.classList is supported, implement addClass/removeClass using that
if (Node.classList) {
+ /** @ignore */
addClass = function(element, classname) {
element.classList.add(classname);
};
+ /** @ignore */
removeClass = function(element, classname) {
element.classList.remove(classname);
};
// Otherwise, implement own
else {
+ /** @ignore */
addClass = function(element, classname) {
// Simply add new class
};
+ /** @ignore */
removeClass = function(element, classname) {
// Filter out classes with given name
"gap": function parse_gap(e) {
- // Get attributes
- var gap_size = e.attributes["size"];
-
// Create element
var gap = document.createElement("div");
gap.className = "guac-keyboard-gap";
// Set gap size
var gap_units = 1;
- if (gap_size)
- gap_units = parseFloat(gap_size.value);
+ if (e.getAttribute("size"))
+ gap_units = parseFloat(e.getAttribute("size"));
scaledElements.push(new ScaledElement(gap, gap_units, gap_units));
row.appendChild(gap);
"key": function parse_key(e) {
- // Get attributes
- var key_size = e.attributes["size"];
- var key_class = e.attributes["class"];
-
// Create element
var key_element = document.createElement("div");
key_element.className = "guac-keyboard-key";
// Append class if specified
- if (key_class)
- key_element.className += " " + key_class.value;
+ if (e.getAttribute("class"))
+ key_element.className += " " + e.getAttribute("class");
// Position keys using container div
var key_container_element = document.createElement("div");
// Set key size
var key_units = 1;
- if (key_size)
- key_units = parseFloat(key_size.value);
+ if (e.getAttribute("size"))
+ key_units = parseFloat(e.getAttribute("size"));
key.size = key_units;
parseChildren(e, {
"cap": function parse_cap(e) {
- // Get attributes
- var required = e.attributes["if"];
- var modifier = e.attributes["modifier"];
- var keysym = e.attributes["keysym"];
- var sticky = e.attributes["sticky"];
- var cap_class = e.attributes["class"];
+ // TODO: Handle "sticky" attribute
// Get content of key cap
- var content = e.textContent;
+ var content = e.textContent || e.text;
+
+ // If read as blank, assume cap is a single space.
+ if (content.length == 0)
+ content = " ";
// Get keysym
var real_keysym = null;
- if (keysym)
- real_keysym = parseInt(keysym.value);
+ if (e.getAttribute("keysym"))
+ real_keysym = parseInt(e.getAttribute("keysym"));
// If no keysym specified, try to get from key content
else if (content.length == 1) {
// Create cap
var cap = new Guacamole.OnScreenKeyboard.Cap(content, real_keysym);
- if (modifier)
- cap.modifier = modifier.value;
+ if (e.getAttribute("modifier"))
+ cap.modifier = e.getAttribute("modifier");
// Create cap element
var cap_element = document.createElement("div");
key_element.appendChild(cap_element);
// Append class if specified
- if (cap_class)
- cap_element.className += " " + cap_class.value;
+ if (e.getAttribute("class"))
+ cap_element.className += " " + e.getAttribute("class");
// Get modifier value
var modifierValue = 0;
- if (required) {
+ if (e.getAttribute("if")) {
// Get modifier value for specified comma-delimited
// list of required modifiers.
- var requirements = required.value.split(",");
+ var requirements = e.getAttribute("if").split(",");
for (var i=0; i<requirements.length; i++) {
modifierValue |= getModifier(requirements[i]);
addClass(cap_element, "guac-keyboard-requires-" + requirements[i]);
addClass(key_element, "guac-keyboard-pressed");
// Get current cap based on modifier state
- var cap = key.getCap(on_screen_keyboard.modifiers);
+ var cap = key.getCap(modifiers);
// Update modifier state
if (cap.modifier) {
var modifierFlag = getModifier(cap.modifier);
// Toggle modifier state
- on_screen_keyboard.modifiers ^= modifierFlag;
+ modifiers ^= modifierFlag;
// Activate modifier if pressed
- if (on_screen_keyboard.modifiers & modifierFlag)
+ if (modifiers & modifierFlag) {
+
addClass(keyboard, modifierClass);
+
+ // Send key event
+ if (on_screen_keyboard.onkeydown && cap.keysym)
+ on_screen_keyboard.onkeydown(cap.keysym);
+
+ }
// Deactivate if not pressed
- else
+ else {
+
removeClass(keyboard, modifierClass);
+
+ // Send key event
+ if (on_screen_keyboard.onkeyup && cap.keysym)
+ on_screen_keyboard.onkeyup(cap.keysym);
+
+ }
}
- // Send key event
- if (on_screen_keyboard.onkeydown && cap.keysym)
+ // If not modifier, send key event now
+ else if (on_screen_keyboard.onkeydown && cap.keysym)
on_screen_keyboard.onkeydown(cap.keysym);
// Mark key as pressed
};
- key_element.addEventListener("mousedown", press, true);
- key_element.addEventListener("touchstart", press, true);
-
function release(e) {
// Release key if currently pressed
if (key.pressed) {
// Get current cap based on modifier state
- var cap = key.getCap(on_screen_keyboard.modifiers);
+ var cap = key.getCap(modifiers);
removeClass(key_element, "guac-keyboard-pressed");
- // Send key event
- if (on_screen_keyboard.onkeyup && cap.keysym)
+ // Send key event if not a modifier key
+ if (!cap.modifier && on_screen_keyboard.onkeyup && cap.keysym)
on_screen_keyboard.onkeyup(cap.keysym);
// Mark key as released
};
+ key_element.addEventListener("mousedown", press, true);
+ key_element.addEventListener("touchstart", press, true);
+
key_element.addEventListener("mouseup", release, true);
key_element.addEventListener("mouseout", release, true);
key_element.addEventListener("touchend", release, true);
var col = document.createElement("div");
col.className = "guac-keyboard-column";
- var align = col.attributes["align"];
-
- if (align)
- col.style.textAlign = align.value;
+ if (col.getAttribute("align"))
+ col.style.textAlign = col.getAttribute("align");
// Columns can only contain rows
parseChildren(e, {
throw new Error("Root element must be keyboard");
// Get attributes
- if (!keyboard_element.attributes["size"])
+ if (!keyboard_element.getAttribute("size"))
throw new Error("size attribute is required for keyboard");
- var keyboard_size = parseFloat(keyboard_element.attributes["size"].value);
+ var keyboard_size = parseFloat(keyboard_element.getAttribute("size"));
parseChildren(keyboard_element, {
};
/**
- * State of all modifiers.
+ * Fired whenever the user presses a key on this Guacamole.OnScreenKeyboard.
+ *
+ * @event
+ * @param {Number} keysym The keysym of the key being pressed.
*/
- this.modifiers = 0;
-
this.onkeydown = null;
+
+ /**
+ * Fired whenever the user releases a key on this Guacamole.OnScreenKeyboard.
+ *
+ * @event
+ * @param {Number} keysym The keysym of the key being released.
+ */
this.onkeyup = null;
+ /**
+ * Returns the element containing the entire on-screen keyboard.
+ * @returns {Element} The element containing the entire on-screen keyboard.
+ */
this.getElement = function() {
return keyboard;
};
+ /**
+ * Resizes all elements within this Guacamole.OnScreenKeyboard such that
+ * the width is close to but does not exceed the specified width. The
+ * height of the keyboard is determined based on the width.
+ *
+ * @param {Number} width The width to resize this Guacamole.OnScreenKeyboard
+ * to, in pixels.
+ */
this.resize = function(width) {
// Get pixel size of a unit
};
+
+/**
+ * Basic representation of a single key of a keyboard. Each key has a set of
+ * caps associated with tuples of modifiers. The cap determins what happens
+ * when a key is pressed, while it is the state of modifier keys that determines
+ * what cap is in effect on any particular key.
+ *
+ * @constructor
+ */
Guacamole.OnScreenKeyboard.Key = function() {
var key = this;
return key.caps[modifier & key.modifierMask];
};
-}
+};
+/**
+ * Basic representation of a cap of a key. The cap is the visible part of a key
+ * and determines the active behavior of a key when pressed. The state of all
+ * modifiers on the keyboard determines the active cap for all keys, thus
+ * each cap is associated with a set of modifiers.
+ *
+ * @constructor
+ * @param {String} text The text to be displayed within this cap.
+ * @param {Number} keysym The keysym this cap sends when its associated key is
+ * pressed or released.
+ * @param {String} modifier The modifier represented by this cap.
+ */
Guacamole.OnScreenKeyboard.Cap = function(text, keysym, modifier) {
/**
// Set modifier if provided
if (modifier) this.modifier = modifier;
-}
+};
projects / guacamole-common-js.git / blobdiff