mirror of
https://github.com/keymanapp/keyman.git
synced 2026-08-06 00:45:32 +00:00
4599 lines
No EOL
165 KiB
TypeScript
4599 lines
No EOL
165 KiB
TypeScript
/// <reference path="kmwexthtml.ts" /> // Includes KMW-added property declaration extensions for HTML elements.
|
||
/// <reference path="kmwstring.ts" /> // Includes KMW string extension declarations.
|
||
|
||
namespace com.keyman {
|
||
export class OSKKeySpec {
|
||
id: string;
|
||
text?: string;
|
||
sp?: string;
|
||
width: string;
|
||
nextlayer?: string;
|
||
pad?: string;
|
||
|
||
constructor(id: string, text?: string, width?: string, sp?: string, nextlayer?: string, pad?: string) {
|
||
this.id = id;
|
||
this.text = text;
|
||
this.width = width ? width : "50";
|
||
this.sp = sp;
|
||
this.nextlayer = nextlayer;
|
||
this.pad = pad;
|
||
}
|
||
}
|
||
}
|
||
|
||
/***
|
||
KeymanWeb 10.0
|
||
Copyright 2017 SIL International
|
||
***/
|
||
|
||
// If KMW is already initialized, the KMW script has been loaded more than once. We wish to prevent resetting the
|
||
// KMW system, so we use the fact that 'initialized' is only 1 / true after all scripts are loaded for the initial
|
||
// load of KMW.
|
||
if(!window['keyman']['initialized']) {
|
||
/*****************************************/
|
||
/* */
|
||
/* On-Screen (Visual) Keyboard Code */
|
||
/* */
|
||
/*****************************************/
|
||
|
||
(function() {
|
||
// Declare KeymanWeb and member objects
|
||
var keymanweb=window['keyman'], osk=keymanweb['osk'], util=keymanweb['util'], device=util.device, dbg=keymanweb.debug;
|
||
var kbdInterface=keymanweb['interface'];
|
||
|
||
// Define Keyman Developer modifier bit-flags (exposed for use by other modules)
|
||
osk.modifierCodes = {
|
||
"LCTRL":0x0001,
|
||
"RCTRL":0x0002,
|
||
"LALT":0x0004,
|
||
"RALT":0x0008,
|
||
"SHIFT":0x0010,
|
||
"CTRL":0x0020,
|
||
"ALT":0x0040,
|
||
"CAPS":0x0100,
|
||
"NO_CAPS":0x0200,
|
||
"NUM_LOCK":0x0400,
|
||
"NO_NUM_LOCK":0x0800,
|
||
"SCROLL_LOCK":0x1000,
|
||
"NO_SCROLL_LOCK":0x2000,
|
||
"VIRTUAL_KEY":0x4000
|
||
};
|
||
|
||
osk.modifierBitmasks = {
|
||
"ALL":0x007F,
|
||
"ALT_GR_SIM": (osk.modifierCodes['LCTRL'] | osk.modifierCodes['LALT']),
|
||
"CHIRAL":0x001F, // The base bitmask for chiral keyboards. Includes SHIFT, which is non-chiral.
|
||
"IS_CHIRAL":0x000F, // Used to test if a bitmask uses a chiral modifier.
|
||
"NON_CHIRAL":0x0070 // The default bitmask, for non-chiral keyboards
|
||
};
|
||
|
||
osk.stateBitmasks = {
|
||
"ALL":0x3F00,
|
||
"CAPS":0x0300,
|
||
"NUM_LOCK":0x0C00,
|
||
"SCROLL_LOCK":0x3000
|
||
};
|
||
|
||
// Define standard keycode numbers (exposed for use by other modules)
|
||
osk.keyCodes={
|
||
"K_BKSP":8,"K_TAB":9,"K_ENTER":13,
|
||
"K_SHIFT":16,"K_CONTROL":17,"K_ALT":18,"K_PAUSE":19,"K_CAPS":20,
|
||
"K_ESC":27,"K_SPACE":32,"K_PGUP":33,
|
||
"K_PGDN":34,"K_END":35,"K_HOME":36,"K_LEFT":37,"K_UP":38,
|
||
"K_RIGHT":39,"K_DOWN":40,"K_SEL":41,"K_PRINT":42,"K_EXEC":43,
|
||
"K_INS":45,"K_DEL":46,"K_HELP":47,"K_0":48,
|
||
"K_1":49,"K_2":50,"K_3":51,"K_4":52,"K_5":53,"K_6":54,"K_7":55,
|
||
"K_8":56,"K_9":57,"K_A":65,"K_B":66,"K_C":67,"K_D":68,"K_E":69,
|
||
"K_F":70,"K_G":71,"K_H":72,"K_I":73,"K_J":74,"K_K":75,"K_L":76,
|
||
"K_M":77,"K_N":78,"K_O":79,"K_P":80,"K_Q":81,"K_R":82,"K_S":83,
|
||
"K_T":84,"K_U":85,"K_V":86,"K_W":87,"K_X":88,"K_Y":89,"K_Z":90,
|
||
"K_NP0":96,"K_NP1":97,"K_NP2":98,
|
||
"K_NP3":99,"K_NP4":100,"K_NP5":101,"K_NP6":102,
|
||
"K_NP7":103,"K_NP8":104,"K_NP9":105,"K_NPSTAR":106,
|
||
"K_NPPLUS":107,"K_SEPARATOR":108,"K_NPMINUS":109,"K_NPDOT":110,
|
||
"K_NPSLASH":111,"K_F1":112,"K_F2":113,"K_F3":114,"K_F4":115,
|
||
"K_F5":116,"K_F6":117,"K_F7":118,"K_F8":119,"K_F9":120,
|
||
"K_F10":121,"K_F11":122,"K_F12":123,"K_NUMLOCK":144,"K_SCROLL":145,
|
||
"K_LSHIFT":160,"K_RSHIFT":161,"K_LCONTROL":162,"K_RCONTROL":163,
|
||
"K_LALT":164,"K_RALT":165,
|
||
"K_COLON":186,"K_EQUAL":187,"K_COMMA":188,"K_HYPHEN":189,
|
||
"K_PERIOD":190,"K_SLASH":191,"K_BKQUOTE":192,
|
||
"K_LBRKT":219,"K_BKSLASH":220,"K_RBRKT":221,
|
||
"K_QUOTE":222,"K_oE2":226,
|
||
"K_LOPT":50001,"K_ROPT":50002,
|
||
"K_NUMERALS":50003,"K_SYMBOLS":50004,"K_CURRENCIES":50005,
|
||
"K_UPPER":50006,"K_LOWER":50007,"K_ALPHA":50008,
|
||
"K_SHIFTED":50009,"K_ALTGR":50010,
|
||
"K_TABBACK":50011,"K_TABFWD":50012
|
||
};
|
||
|
||
// Cross-reference with the ids in osk.setButtonClass.
|
||
osk.buttonClasses = {
|
||
'DEFAULT':'0',
|
||
'SHIFT':'1',
|
||
'SHIFT-ON':'2',
|
||
'SPECIAL':'3',
|
||
'SPECIAL-ON':'4',
|
||
'DEADKEY':'8',
|
||
'BLANK':'9',
|
||
'HIDDEN':'10'
|
||
};
|
||
|
||
// Defines the PUA code mapping for the various 'special' modifier/control keys on keyboards.
|
||
osk.specialCharacters = {
|
||
'*Shift*': 8,
|
||
'*Enter*': 5,
|
||
'*Tab*': 6,
|
||
'*BkSp*': 4,
|
||
'*Menu*': 11,
|
||
'*Hide*': 10,
|
||
'*Alt*': 25,
|
||
'*Ctrl*': 1,
|
||
'*Caps*': 3,
|
||
'*ABC*': 16,
|
||
'*abc*': 17,
|
||
'*123*': 19,
|
||
'*Symbol*': 21,
|
||
'*Currency*': 20,
|
||
'*Shifted*': 8, // set SHIFTED->9 for filled arrow icon
|
||
'*AltGr*': 2,
|
||
'*TabLeft*': 7,
|
||
'*LAlt*': 0x56,
|
||
'*RAlt*': 0x57,
|
||
'*LCtrl*': 0x58,
|
||
'*RCtrl*': 0x59,
|
||
'*LAltCtrl*': 0x60,
|
||
'*RAltCtrl*': 0x61,
|
||
'*LAltCtrlShift*': 0x62,
|
||
'*RAltCtrlShift*': 0x63,
|
||
'*AltShift*': 0x64,
|
||
'*CtrlShift*': 0x65,
|
||
'*AltCtrlShift*': 0x66,
|
||
'*LAltShift*': 0x67,
|
||
'*RAltShift*': 0x68,
|
||
'*LCtrlShift*': 0x69,
|
||
'*RCtrlShift*': 0x70
|
||
};
|
||
|
||
osk.modifierSpecials = {
|
||
'leftalt': '*LAlt*',
|
||
'rightalt': '*RAlt*',
|
||
'alt': '*Alt*',
|
||
'leftctrl': '*LCtrl*',
|
||
'rightctrl': '*RCtrl*',
|
||
'ctrl': '*Ctrl*',
|
||
'ctrl-alt': '*AltGr*',
|
||
'leftctrl-leftalt': '*LAltCtrl*',
|
||
'rightctrl-rightalt': '*RAltCtrl*',
|
||
'leftctrl-leftalt-shift': '*LAltCtrlShift*',
|
||
'rightctrl-rightalt-shift': '*RAltCtrlShift*',
|
||
'shift': '*Shift*',
|
||
'shift-alt': '*AltShift*',
|
||
'shift-ctrl': '*CtrlShift*',
|
||
'shift-ctrl-alt': '*AltCtrlShift*',
|
||
'leftalt-shift': '*LAltShift*',
|
||
'rightalt-shift': '*RAltShift*',
|
||
'leftctrl-shift': '*LCtrlShift*',
|
||
'rightctrl-shift': '*RCtrlShift*'
|
||
};
|
||
|
||
var codesUS=[['0123456789',';=,-./`','[\\]\''],[')!@#$%^&*(',':+<_>?~','{|}"']];
|
||
|
||
var dfltCodes=["K_BKQUOTE","K_1","K_2","K_3","K_4","K_5","K_6","K_7","K_8","K_9","K_0",
|
||
"K_HYPHEN","K_EQUAL","K_*","K_*","K_*","K_Q","K_W","K_E","K_R","K_T",
|
||
"K_Y","K_U","K_I","K_O","K_P","K_LBRKT","K_RBRKT","K_BKSLASH","K_*",
|
||
"K_*","K_*","K_A","K_S","K_D","K_F","K_G","K_H","K_J","K_K","K_L",
|
||
"K_COLON","K_QUOTE","K_*","K_*","K_*","K_*","K_*","K_oE2",
|
||
"K_Z","K_X","K_C","K_V","K_B","K_N","K_M","K_COMMA","K_PERIOD",
|
||
"K_SLASH","K_*","K_*","K_*","K_*","K_*","K_SPACE"];
|
||
|
||
var dfltText='`1234567890-=\xA7~~qwertyuiop[]\\~~~asdfghjkl;\'~~~~~?zxcvbnm,./~~~~~ '
|
||
+'~!@#$%^&*()_+\xA7~~QWERTYUIOP{}\\~~~ASDFGHJKL:"~~~~~?ZXCVBNM<>?~~~~~ ';
|
||
|
||
osk._Box = null; // Main DIV for OSK
|
||
osk._DivVKbd = null;
|
||
osk._DivVKbdHelp = null;
|
||
osk._Visible = 0; // Whether or not actually visible
|
||
osk._Enabled = 1; // Whether or not enabled by UI
|
||
osk._VShift = [];
|
||
osk._VKeySpans = [];
|
||
osk._VKeyDown = null;
|
||
osk._VKbdContainer = null;
|
||
osk._VOriginalWidth = 1; // Non-zero default value needed
|
||
osk._BaseLayout = 'us'; // default BaseLayout
|
||
osk._BaseLayoutEuro = {}; // I1299 (not currently exposed, but may need to be e.g. for external users)
|
||
osk._BaseLayoutEuro['se'] = '\u00a71234567890+´~~~QWERTYUIOP\u00c5\u00a8\'~~~ASDFGHJKL\u00d6\u00c4~~~~~<ZXCVBNM,.-~~~~~ '; // Swedish
|
||
osk._BaseLayoutEuro['uk'] = '`1234567890-=~~~QWERTYUIOP[]#~~~ASDFGHJKL;\'~~~~~\\ZXCVBNM,./~~~~~ '; // UK
|
||
|
||
// Tracks the OSK-based state of supported state keys.
|
||
// Using the exact keyCode name from above allows for certain optimizations elsewhere in the code.
|
||
osk._stateKeys = {
|
||
"K_CAPS":false,
|
||
"K_NUMLOCK":false,
|
||
"K_SCROLL":false
|
||
};
|
||
|
||
// Additional members (mainly for touch input devices)
|
||
osk.lgTimer = null; // language switching timer
|
||
osk.lgKey = null; // language menu key element
|
||
osk.hkKey = null; // OSK hide key element
|
||
osk.spaceBar = null; // space bar key element
|
||
osk.lgList = null; // language menu list
|
||
osk.frameColor = '#ad4a28'; // KeymanWeb standard frame color
|
||
osk.keyPending = null; // currently depressed key (if any)
|
||
osk.fontFamily = ''; // layout-specified font for keyboard
|
||
osk.fontSize = '1em'; // layout-specified fontsize for keyboard
|
||
osk.layout = null; // reference to complete layout
|
||
osk.layers = null; // reference to layout (layers array for this device)
|
||
osk.layerId = 'default'; // currently active OSK layer (if any)
|
||
osk.nextLayer = 'default'; // layer to be activated after pressing key in current layer
|
||
osk.layerIndex = 0; // currently displayed layer index
|
||
osk.currentKey = ''; // id of currently pressed key (desktop OSK only)
|
||
osk.subkeyDelayTimer = null; // id for touch-hold delay timer
|
||
osk.popupPending = false; // Device popup pending flag
|
||
osk.popupVisible = false; // Device popup displayed
|
||
osk.popupCallout = null; // OSK popup callout element
|
||
osk.styleSheet = null; // current OSK style sheet object, if any
|
||
osk.loadRetry = 0; // counter for delayed loading, if keyboard loading prevents OSK being ready at start
|
||
osk.popupDelay = 500; // Delay must be less than native touch-hold delay (build 352)
|
||
osk.currentTarget = null; // Keep track of currently touched key when moving over keyboard
|
||
osk.touchCount = 0; // Number of active (unreleased) touch points
|
||
osk.touchX = 0; // First touch point x (to check for sliding off screen)
|
||
osk.deleting = 0; // Backspace repeat timer
|
||
|
||
// Additional members for desktop OSK
|
||
osk.x = 99; // last visible offset left
|
||
osk.y = 0; // last visible offset top
|
||
osk.width = 1; // Saved width of OSK (since actual width only available if visible)
|
||
osk.height = 1; // Saved height of OSK
|
||
osk.rowHeight = 1; // Current row height in px
|
||
osk.nRows = 1; // Number of rows in each layer of current layout
|
||
osk.vpScale = 1; // Current viewport scale factor (not valid until initialized)
|
||
osk.closeButton = null; // icon to hide OSK
|
||
osk.resizeIcon = null; // resizing icon
|
||
osk.resizing = 0; // resizing flag
|
||
osk.pinImg = null; // icon to restore OSK to default position
|
||
osk.userPositioned = 0; // Set to true(<>0) if dragged by user
|
||
osk.dfltX = ''; // Left position set by page code
|
||
osk.dfltY = ''; // Top position set by page code
|
||
osk.noDrag = false; // allow page to override user OSK dragging
|
||
osk.keytip = null; // Key preview (phones)
|
||
osk.touchY = 0; // First y position of touched key
|
||
|
||
// Placeholder functions
|
||
osk.addCallout = function(e){};
|
||
|
||
osk.shutdown = function() {
|
||
// Remove the OSK's elements from the document, allowing them to be properly cleaned up.
|
||
// Necessary for clean engine testing.
|
||
var _box = osk._Box as HTMLDivElement;
|
||
if(_box.parentElement) {
|
||
_box.parentElement.removeChild(_box);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Function addEventListener
|
||
* Scope Public
|
||
* @param {string} event event name
|
||
* @param {function(Object)} func event handler
|
||
* @return {boolean}
|
||
* Description Wrapper function to add and identify OSK-specific event handlers
|
||
*/
|
||
osk['addEventListener'] = function(event, func)
|
||
{
|
||
return util.addEventListener('osk.'+event, func);
|
||
}
|
||
|
||
/**
|
||
* Function _TitleBarInterior
|
||
* Scope Private
|
||
* Description Title bar interior formatting and element event handling
|
||
*/
|
||
osk._TitleBarInterior = function()
|
||
{
|
||
var Ldiv = util._CreateElement('DIV');
|
||
var Ls = Ldiv.style;
|
||
Ls.paddingLeft='2px';
|
||
Ls.cursor='move';
|
||
Ls.background='#ad4a28';
|
||
Ls.font='8pt Tahoma,Arial,sans-serif'; //I2186
|
||
|
||
// Add container for buttons, handle mousedown event
|
||
var LdivButtons = util._CreateElement('DIV');
|
||
LdivButtons.className = 'kmw-title-bar-actions';
|
||
LdivButtons.onmousedown=osk._CancelMouse;
|
||
|
||
// Add close button, handle click and mousedown events
|
||
var Limg = util._CreateElement('DIV');
|
||
Limg.className='kmw-close-button';
|
||
Limg.onmousedown=osk._CancelMouse;
|
||
Limg.onclick=function () {osk._Hide(true);}
|
||
osk.closeButton = Limg;
|
||
LdivButtons.appendChild(Limg);
|
||
|
||
/**
|
||
* Move OSK back to default position
|
||
*/
|
||
osk.restorePosition = function()
|
||
{
|
||
if(osk._Visible)
|
||
{
|
||
keymanweb.domManager.focusLastActiveElement(); // I2036 - OSK does not unpin to correct location
|
||
osk.loadCookie(); osk.userPositioned=false; osk.saveCookie();
|
||
osk._Show();
|
||
osk.doResizeMove(); //allow the UI to respond to OSK movements
|
||
}
|
||
if(osk.pinImg) osk.pinImg.style.display='none';
|
||
if(window.event) window.event.returnValue=false;
|
||
}
|
||
|
||
// Add 'Unpin' button for restoring OSK to default location, handle mousedown and click events
|
||
Limg=osk.pinImg = util._CreateElement('DIV'); //I2186
|
||
Limg.className='kmw-pin-image';
|
||
Limg.title='Pin the On Screen Keyboard to its default location on the active text box';
|
||
Limg.onclick=osk.restorePosition;
|
||
Limg.onmousedown=osk._CancelMouse;
|
||
Limg.style.display='none';
|
||
|
||
// Do not use Unpin button on touch screens (OSK location fixed)
|
||
if(!device.touchable) LdivButtons.appendChild(Limg); // I3363 (Build 301)
|
||
|
||
// Attach button container to title bar
|
||
Ldiv.appendChild(LdivButtons);
|
||
|
||
// Add title bar caption
|
||
Limg=keymanweb._TitleElement=util._CreateElement('SPAN'); // I1972
|
||
Limg.className='kmw-title-bar-caption';
|
||
Limg.innerHTML='KeymanWeb';
|
||
Ldiv.appendChild(Limg);
|
||
|
||
return Ldiv;
|
||
}
|
||
|
||
// End of TitleBarInterior
|
||
|
||
/**
|
||
* Function enabled
|
||
* Scope Public
|
||
* @return {boolean|number} True if KMW OSK enabled
|
||
* Description Test if KMW OSK is enabled
|
||
*/
|
||
osk['isEnabled'] = osk.isEnabled = function()
|
||
{
|
||
return osk._Enabled;
|
||
}
|
||
|
||
/**
|
||
* Function isVisible
|
||
* Scope Public
|
||
* @return {boolean|number} True if KMW OSK visible
|
||
* Description Test if KMW OSK is actually visible
|
||
* Note that this will usually return false after any UI event that results in (temporary) loss of input focus
|
||
*/
|
||
osk['isVisible'] = osk.isVisible = function()
|
||
{
|
||
return osk._Visible;
|
||
}
|
||
|
||
/**
|
||
* Function getRect //TODO: This is probably not correct, anyway!!!!!
|
||
* Scope Public
|
||
* @return {Object.<string,number>} Array object with position and size of OSK container
|
||
* Description Get rectangle containing KMW Virtual Keyboard
|
||
*/
|
||
osk['getRect'] = osk.getRect = function() { // I2405
|
||
var p: any;
|
||
p = {};
|
||
|
||
if(osk._DivVKbd) {
|
||
p['left'] = p.left = util._GetAbsoluteX(osk._DivVKbd);
|
||
p['top'] = p.top = util._GetAbsoluteY(osk._DivVKbd);
|
||
p['width'] = p.width = util._GetAbsoluteX(osk._DivVKbdHelp) - util._GetAbsoluteX(osk._DivVKbd) + osk._DivVKbdHelp.offsetWidth;
|
||
p['height'] = p.height = util._GetAbsoluteY(osk._DivVKbdHelp) - util._GetAbsoluteY(osk._DivVKbd) + osk._DivVKbdHelp.offsetHeight;
|
||
} else {
|
||
p['left'] = p.left = util._GetAbsoluteX(osk._Box);
|
||
p['top'] = p.top = util._GetAbsoluteY(osk._Box);
|
||
p['width'] = p.width = util._GetAbsoluteX(osk._Box) + osk._Box.offsetWidth;
|
||
p['height'] = p.height = util._GetAbsoluteY(osk._Box) + osk._Box.offsetHeight;
|
||
}
|
||
return p;
|
||
}
|
||
|
||
/**
|
||
* Allow the UI or page to set the position and size of the OSK
|
||
* and (optionally) override user repositioning or sizing
|
||
*
|
||
* @param {Object.<string,number>} p Array object with position and size of OSK container
|
||
**/
|
||
osk['setRect'] = osk.setRect = function(p)
|
||
{
|
||
var q={};
|
||
|
||
if(osk._Box == null || device.formFactor != 'desktop') return;
|
||
|
||
var b=osk._Box,bs=b.style;
|
||
if('left' in p)
|
||
{
|
||
bs.left=(p['left']-util._GetAbsoluteX(b)+b.offsetLeft)+'px';
|
||
osk.dfltX=bs.left;
|
||
}
|
||
|
||
if('top' in p)
|
||
{
|
||
bs.top=(p['top']-util._GetAbsoluteY(b)+b.offsetTop)+'px';
|
||
osk.dfltY=bs.top;
|
||
}
|
||
|
||
//Do not allow user resizing for non-standard keyboards (e.g. EuroLatin)
|
||
if(osk._DivVKbd != null)
|
||
{
|
||
var d=osk._DivVKbd,ds=d.style;
|
||
|
||
// Set width, but limit to reasonable value
|
||
if('width' in p)
|
||
{
|
||
var w=(p['width']-(b.offsetWidth-d.offsetWidth));
|
||
if(w < 0.2*screen.width) w=0.2*screen.width;
|
||
if(w > 0.9*screen.width) w=0.9*screen.width;
|
||
ds.width=w+'px'; osk.width=w;
|
||
}
|
||
|
||
// Set height, but limit to reasonable value
|
||
// This sets the default font size for the OSK in px, but that
|
||
// can be modified at the key text level by setting
|
||
// the font size in em in the kmw-key-text class
|
||
if('height' in p)
|
||
{
|
||
var h=(p['height']-(b.offsetHeight-d.offsetHeight));
|
||
if(h < 0.1*screen.height) h=0.1*screen.height;
|
||
if(h > 0.5*screen.height) h=0.5*screen.height;
|
||
ds.height=h+'px'; ds.fontSize=(h/8)+'px'; osk.height=h;
|
||
}
|
||
|
||
// Fix or release user resizing
|
||
if('nosize' in p)
|
||
if(osk.resizeIcon) osk.resizeIcon.style.display=(p['nosize'] ? 'none' : 'block');
|
||
|
||
}
|
||
// Fix or release user dragging
|
||
if('nomove' in p)
|
||
{
|
||
osk.noDrag=p['nomove'];
|
||
if(osk.pinImg) osk.pinImg.style.display=(p['nomove'] || !osk.userPositioned) ? 'none' : 'block';
|
||
}
|
||
// Save the user-defined OSK size
|
||
osk.saveCookie();
|
||
}
|
||
|
||
|
||
/**
|
||
* Get position of OSK window
|
||
*
|
||
* @return {Object.<string,number>} Array object with OSK window position
|
||
**/
|
||
osk.getPos = function() {
|
||
var Lkbd=osk._Box, p={
|
||
left: osk._Visible ? Lkbd.offsetLeft : osk.x,
|
||
top:osk._Visible ? Lkbd.offsetTop : osk.y
|
||
};
|
||
|
||
return p;
|
||
}
|
||
|
||
/**
|
||
* Function setPos
|
||
* Scope Private
|
||
* @param {Object.<string,number>} p Array object with OSK left, top
|
||
* Description Set position of OSK window, but limit to screen, and ignore if a touch input device
|
||
*/
|
||
osk['setPos'] = osk.setPos = function(p)
|
||
{
|
||
if(typeof(osk._Box) == 'undefined' || device.touchable) return; // I3363 (Build 301)
|
||
if(osk.userPositioned)
|
||
{
|
||
var Px=p['left'],Py=p['top'];
|
||
if(typeof(Px) != 'undefined')
|
||
{
|
||
if(Px < -0.8*osk._Box.offsetWidth) Px = -0.8*osk._Box.offsetWidth;
|
||
if(osk.userPositioned) {osk._Box.style.left=Px+'px'; osk.x = Px;}
|
||
}
|
||
// May not be needed - vertical positioning is handled differently and defaults to input field if off screen
|
||
if(typeof(Py) != 'undefined')
|
||
{
|
||
if(Py < 0) Py = 0;
|
||
if(osk.userPositioned) {osk._Box.style.top=Py+'px'; osk.y = Py;}
|
||
}
|
||
}
|
||
|
||
if(osk.pinImg)
|
||
osk.pinImg.style.display=(osk.userPositioned ? 'block' : 'none');
|
||
}
|
||
|
||
/**
|
||
* Function _VKeyGetTarget
|
||
* Scope Private
|
||
* @param {Object} e OSK event
|
||
* @return {Object} Target element for key in OSK
|
||
* Description Identify the OSK key clicked
|
||
*/
|
||
osk._VKeyGetTarget = function(e) {
|
||
var Ltarg;
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
Ltarg = util.eventTarget(e);
|
||
if (Ltarg == null) {
|
||
return null;
|
||
}
|
||
if (Ltarg.nodeType == 3) { // defeat Safari bug
|
||
Ltarg = Ltarg.parentNode;
|
||
}
|
||
if (Ltarg.tagName == 'SPAN') {
|
||
Ltarg = Ltarg.parentNode;
|
||
}
|
||
return Ltarg;
|
||
}
|
||
|
||
/**
|
||
* Add or remove a class from a keyboard key (when touched or clicked)
|
||
* or add a key preview for phone devices
|
||
*
|
||
* @param {Object} key key affected
|
||
* @param {boolean} on add or remove highlighting
|
||
**/
|
||
osk.highlightKey = function(key,on)
|
||
{
|
||
// Do not change element class unless a key
|
||
if(!key || (key.className == '') || (key.className.indexOf('kmw-key-row') >= 0)) return;
|
||
|
||
var classes=key.className, cs = ' kmw-key-touched';
|
||
|
||
// For phones, use key preview rather than highlighting the key,
|
||
// except for space, bksp, enter, shift and popup keys
|
||
var usePreview = ((osk.keytip != null)
|
||
&& (classes.indexOf('kmw-key-shift') < 0)
|
||
&& (classes.indexOf('kmw-spacebar') < 0)
|
||
&& (key.id.indexOf('popup') < 0 ));
|
||
|
||
if(usePreview)
|
||
{
|
||
osk.showKeyTip(key,on);
|
||
}
|
||
else
|
||
{
|
||
if(on && classes.indexOf(cs) < 0)
|
||
{
|
||
key.className=classes+cs;
|
||
osk.showKeyTip(null,false); // Moved here by Serkan
|
||
}
|
||
else
|
||
{
|
||
key.className=classes.replace(cs,'');
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Display touch-hold array of 'sub-keys' above the currently touched key
|
||
* @param {Object} e primary key element
|
||
*/
|
||
osk.showSubKeys = function(e) {
|
||
// Do not show subkeys if key already released
|
||
if(osk.keyPending == null) {
|
||
return;
|
||
}
|
||
|
||
// Create holder DIV for subkey array, and set styles.
|
||
// A subkey array for Shift will only appear if extra layers exist
|
||
|
||
// The holder is position:fixed, but the keys do not need to be, as no scrolling
|
||
// is possible while the array is visible. So it is simplest to let the keys have
|
||
// position:static and display:inline-block
|
||
var subKeys=document.createElement('DIV'),i,sk,
|
||
t,ts,t1,ts1,kDiv,ks,btn,bs;
|
||
|
||
var tKey = osk.getDefaultKeyObject();
|
||
|
||
subKeys.id='kmw-popup-keys';
|
||
osk.popupBaseKey = e;
|
||
|
||
// Does the popup array include the base key? *** condition for phone only ***
|
||
if(device.formFactor == 'phone') {
|
||
osk.prependBaseKey(e);
|
||
}
|
||
var idx = e.id.split('-'), baseId = idx[idx.length-1];
|
||
|
||
// If not, insert at start
|
||
if(device.formFactor == 'phone' && e.subKeys[0].id != baseId) {
|
||
var eCopy={'id':baseId,'layer':''};
|
||
if(idx.length > 1) {
|
||
eCopy['layer'] = idx[0];
|
||
}
|
||
for(i=0; i<e.childNodes.length; i++) {
|
||
if(osk.hasClass(e.childNodes[i],'kmw-key-text')) {
|
||
break;
|
||
}
|
||
}
|
||
if(i < e.childNodes.length) {
|
||
eCopy['text'] = e.childNodes[i].textContent;
|
||
}
|
||
e.subKeys.splice(0,0,eCopy);
|
||
}
|
||
|
||
// Must set position dynamically, not in CSS
|
||
var ss=subKeys.style;
|
||
ss.bottom=(parseInt(e.style.bottom,10)+parseInt(e.style.height,10)+4)+'px';
|
||
|
||
// Set key font according to layout, or defaulting to OSK font
|
||
// (copied, not inherited, since OSK is not a parent of popup keys)
|
||
ss.fontFamily=osk.fontFamily;
|
||
|
||
// Copy the font size from the parent key, allowing for style inheritance
|
||
ss.fontSize=util.getStyleValue(e,'font-size');
|
||
ss.visibility='hidden';
|
||
|
||
var nKeys=e.subKeys.length,nRow,nRows,nCols;
|
||
nRows=Math.min(Math.ceil(nKeys/9),2);
|
||
nCols=Math.ceil(nKeys/nRows);
|
||
if(nRows > 1) {
|
||
ss.width=(nCols*e.offsetWidth+nCols*5)+'px';
|
||
}
|
||
|
||
// Add nested button elements for each sub-key
|
||
for(i=0; i<nKeys; i++) {
|
||
sk=e.subKeys[i];
|
||
kDiv=document.createElement('DIV');
|
||
|
||
for(var tp in tKey) {
|
||
if(typeof sk[tp] != 'string') {
|
||
sk[tp]=tKey[tp];
|
||
}
|
||
}
|
||
|
||
kDiv.className='kmw-key-square-ex';
|
||
kDiv.keyId=sk['id'];
|
||
ks=kDiv.style;
|
||
nRow=Math.floor(i/nCols);
|
||
if(nRows > 1 && nRow > 0) {
|
||
ks.marginTop='5px';
|
||
}
|
||
|
||
if(typeof sk['width'] != 'undefined') {
|
||
kDiv.width=ks.width=(parseInt(sk['width'],10)*e.offsetWidth/100)+'px';
|
||
} else {
|
||
kDiv.width=ks.width=e.offsetWidth+'px';
|
||
}
|
||
ks.height=e.offsetHeight+'px';
|
||
|
||
btn=document.createElement('DIV');
|
||
osk.setButtonClass(sk,btn);
|
||
|
||
// Create (temporarily) unique ID by prefixing 'popup-' to actual key ID
|
||
if(typeof(sk['layer']) == 'string' && sk['layer'] != '') {
|
||
btn.id='popup-'+sk['layer']+'-'+sk['id'];
|
||
} else {
|
||
btn.id='popup-' + osk.layerId + '-'+sk['id'];
|
||
}
|
||
|
||
btn.key = sk;
|
||
|
||
// Must set button size (in px) dynamically, not from CSS
|
||
bs=btn.style; bs.height=ks.height; bs.width=ks.width;
|
||
|
||
// Must set position explicitly, at least for Android
|
||
bs.position='absolute';
|
||
t=util._CreateElement('SPAN');
|
||
t.className='kmw-key-text';
|
||
if(sk['text'] == null || sk['text'] == '') {
|
||
t.innerHTML='\xa0';
|
||
if(typeof sk['id'] == 'string') {
|
||
if(/^U_[0-9A-F]{4}$/i.test(sk['id'])) {
|
||
t.innerHTML=String.fromCharCode(parseInt(sk['id'].substr(2),16));
|
||
}
|
||
}
|
||
} else {
|
||
t.innerHTML=sk['text'];
|
||
}
|
||
|
||
// Override the font name and size if set in the layout
|
||
ts=t.style;
|
||
ts.fontSize=osk.fontSize; //Build 344, KMEW-90
|
||
if(typeof sk['font'] == 'string' && sk['font'] != '') {
|
||
ts.fontFamily=sk['font'];
|
||
}
|
||
if(typeof sk['fontsize'] == 'string' && sk['fontsize'] != 0) {
|
||
ts.fontSize=sk['fontsize'];
|
||
}
|
||
|
||
btn.appendChild(t);
|
||
kDiv.appendChild(btn);
|
||
subKeys.appendChild(kDiv);
|
||
}
|
||
|
||
// Clear key preview if any
|
||
osk.showKeyTip(null,false);
|
||
|
||
// Otherwise append the touch-hold (subkey) array to the OSK
|
||
osk._Box.appendChild(subKeys);
|
||
|
||
// And correct its position with respect to that element
|
||
ss=subKeys.style;
|
||
var x=util._GetAbsoluteX(e)+0.5*(e.offsetWidth-subKeys.offsetWidth), y,
|
||
xMax=(util.landscapeView()?screen.height:screen.width)-subKeys.offsetWidth;
|
||
|
||
if(x > xMax) {
|
||
x=xMax;
|
||
}
|
||
if(x < 0) {
|
||
x=0;
|
||
}
|
||
ss.left=x+'px';
|
||
|
||
// Add the callout
|
||
osk.popupCallout = osk.addCallout(e);
|
||
|
||
// Make the popup keys visible
|
||
ss.visibility='visible';
|
||
|
||
// And add a filter to fade main keyboard
|
||
subKeys.shim = document.createElement('DIV');
|
||
subKeys.shim.id = 'kmw-popup-shim';
|
||
osk._Box.appendChild(subKeys.shim);
|
||
|
||
// Highlight the duplicated base key (if a phone)
|
||
if(device.formFactor == 'phone') {
|
||
var bk = subKeys.childNodes[0].firstChild;
|
||
osk.keyPending = bk;
|
||
osk.highlightKey(bk,true);//bk.className = bk.className+' kmw-key-touched';
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Prepend the base key to the touch-hold key array (for phones)
|
||
*
|
||
* @param {Object} e base key object
|
||
*/
|
||
osk.prependBaseKey = function(e)
|
||
{
|
||
if(e && typeof(e.id) != 'undefined')
|
||
{
|
||
var i,
|
||
idx = e.id.split('-'),
|
||
baseId = idx[idx.length-1],
|
||
layer = e['key'] && e['key']['layer'] ? e['key']['layer'] : (idx.length > 1 ? idx[0] : ''),
|
||
sp = e['key'] && e['key']['sp'];
|
||
if(typeof e.subKeys != 'undefined' && e.subKeys.length > 0 && (e.subKeys[0].id != baseId || e.subKeys[0].layer != layer))
|
||
{
|
||
var eCopy={'id':baseId,'layer':'','key':undefined};
|
||
if(layer != '') {
|
||
eCopy['layer'] = layer;
|
||
}
|
||
if(sp) {
|
||
eCopy['sp'] = sp;
|
||
}
|
||
for(i = 0; i < e.childNodes.length; i++) {
|
||
if(osk.hasClass(e.childNodes[i],'kmw-key-text')) break;
|
||
}
|
||
if(i < e.childNodes.length) eCopy['text'] = e.childNodes[i].textContent;
|
||
e.subKeys.splice(0,0,eCopy);
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* @summary Look up a custom virtual key code in the virtual key code dictionary KVKD. On first run, will build the dictionary.
|
||
*
|
||
* `VKDictionary` is constructed from the keyboard's `KVKD` member. This list is constructed
|
||
* at compile-time and is a list of 'additional' virtual key codes, starting at 256 (i.e.
|
||
* outside the range of standard virtual key codes). These additional codes are both
|
||
* `[T_xxx]` and `[U_xxxx]` custom key codes from the Keyman keyboard language. However,
|
||
* `[U_xxxx]` keys only generate an entry in `KVKD` if there is a corresponding rule that
|
||
* is associated with them in the keyboard rules. If the `[U_xxxx]` key code is only
|
||
* referenced as the id of a key in the touch layout, then it does not get an entry in
|
||
* the `KVKD` property.
|
||
*
|
||
* @private
|
||
* @param {string} keyName custom virtual key code to lookup in the dictionary
|
||
* @return {number} key code > 255 on success, or 0 if not found
|
||
*/
|
||
osk.getVKDictionaryCode = function(keyName)
|
||
{
|
||
var activeKeyboard = keymanweb.keyboardManager.activeKeyboard;
|
||
if(!activeKeyboard['VKDictionary'])
|
||
{
|
||
var a=[];
|
||
if(typeof activeKeyboard['KVKD'] == 'string')
|
||
{
|
||
// Build the VK dictionary
|
||
// TODO: Move the dictionary build into the compiler -- so compiler generates code such as following. Makes the VKDictionary member unnecessary
|
||
// this.KVKD={"K_ABC":256,"K_DEF":257,...};
|
||
var s=activeKeyboard['KVKD'].split(' ');
|
||
for(var i=0; i<s.length; i++) a[s[i]]=i+256;
|
||
}
|
||
activeKeyboard['VKDictionary']=a;
|
||
}
|
||
|
||
var res=activeKeyboard['VKDictionary'][keyName];
|
||
return res ? res : 0;
|
||
}
|
||
/**
|
||
* Select the next keyboard layer for layer switching keys
|
||
* The next layer will be determined from the key name unless otherwise specifed
|
||
*
|
||
* @param {string} keyName key identifier
|
||
* @param {number|string|undefined} nextLayerIn optional next layer identifier
|
||
* @return {boolean} return true if keyboard layer changed
|
||
*/
|
||
osk.selectLayer = function(keyName,nextLayerIn)
|
||
{
|
||
var nextLayer = arguments.length < 2 ? null : nextLayerIn;
|
||
var isChiral = keymanweb.keyboardManager.isChiral();
|
||
|
||
// Layer must be identified by name, not number (27/08/2015)
|
||
if(typeof nextLayer == 'number') nextLayer = osk.getLayerId(nextLayer * 0x10);
|
||
|
||
// Identify next layer, if required by key
|
||
if(!nextLayer) switch(keyName)
|
||
{
|
||
case 'K_LSHIFT':
|
||
case 'K_RSHIFT':
|
||
case 'K_SHIFT':
|
||
nextLayer = 'shift'; break;
|
||
case 'K_LCONTROL':
|
||
case 'K_LCTRL':
|
||
if(isChiral) {
|
||
nextLayer = 'leftctrl';
|
||
break;
|
||
}
|
||
case 'K_RCONTROL':
|
||
case 'K_RCTRL':
|
||
if(isChiral) {
|
||
nextLayer = 'rightctrl';
|
||
break;
|
||
}
|
||
case 'K_CTRL':
|
||
nextLayer = 'ctrl'; break;
|
||
case 'K_LMENU':
|
||
case 'K_LALT':
|
||
if(isChiral) {
|
||
nextLayer = 'leftalt';
|
||
break;
|
||
}
|
||
case 'K_RMENU':
|
||
case 'K_RALT':
|
||
if(isChiral) {
|
||
nextLayer = 'rightalt';
|
||
break;
|
||
}
|
||
case 'K_ALT':
|
||
nextLayer = 'alt'; break;
|
||
case 'K_ALTGR':
|
||
if(isChiral) {
|
||
nextLayer = 'leftctrl-rightalt';
|
||
} else {
|
||
nextLayer = 'ctrl-alt';
|
||
}
|
||
break;
|
||
case 'K_CURRENCIES':
|
||
case 'K_NUMERALS':
|
||
case 'K_SHIFTED':
|
||
case 'K_UPPER':
|
||
case 'K_LOWER':
|
||
case 'K_SYMBOLS':
|
||
nextLayer = 'default'; break;
|
||
}
|
||
|
||
if(!nextLayer) return false;
|
||
|
||
// Do not change layer unless needed (27/08/2015)
|
||
if(nextLayer == osk.layerId && device.formFactor != 'desktop') return false;
|
||
|
||
// Change layer and refresh OSK
|
||
osk.updateLayer(nextLayer);
|
||
osk._Show();
|
||
|
||
return true;
|
||
}
|
||
|
||
/**
|
||
* Get the default key string. If keyName is U_xxxxxx, use that Unicode codepoint.
|
||
* Otherwise, lookup the virtual key code (physical keyboard mapping)
|
||
*
|
||
* @param {string} keyName Name of the key
|
||
* @param {number} n
|
||
* @param {number} keyShiftState
|
||
* @param {boolean} usingOSK
|
||
* @param {Object=} Lelem
|
||
* @return {string}
|
||
*/
|
||
osk.defaultKeyOutput = function(keyName,n,keyShiftState,usingOSK,Lelem) {
|
||
var ch = '', checkCodes = false;
|
||
var touchAlias = (Lelem && typeof(Lelem.base) != 'undefined');
|
||
// check if exact match to SHIFT's code. Only the 'default' and 'shift' layers should have default key outputs.
|
||
if(keyShiftState == 0) {
|
||
checkCodes = true;
|
||
} else if (keyShiftState == osk.modifierCodes['SHIFT']) {
|
||
checkCodes = true;
|
||
keyShiftState = 1; // It's used as an index.
|
||
} else {
|
||
console.warn("KMW only defines default key output for the 'default' and 'shift' layers!");
|
||
}
|
||
|
||
// If this was triggered by the OSK -or- if it was triggered within a touch-aliased DIV element.
|
||
if(touchAlias || usingOSK) {
|
||
var code = osk.keyCodes[keyName];
|
||
if(!code) {
|
||
code = n;
|
||
}
|
||
|
||
switch(code) {
|
||
case osk.keyCodes['K_BKSP']: //Only desktop UI, not touch devices. TODO: add repeat while mouse down for desktop UI
|
||
kbdInterface.defaultBackspace();
|
||
break;
|
||
case osk.keyCodes['K_TAB']:
|
||
keymanweb.domManager.moveToNext(keyShiftState);
|
||
break;
|
||
case osk.keyCodes['K_TABBACK']:
|
||
keymanweb.domManager.moveToNext(true);
|
||
break;
|
||
case osk.keyCodes['K_TABFWD']:
|
||
keymanweb.domManager.moveToNext(false);
|
||
break;
|
||
case osk.keyCodes['K_ENTER']:
|
||
// Insert new line in text area fields
|
||
if(Lelem.nodeName == 'TEXTAREA' || (typeof Lelem.base != 'undefined' && Lelem.base.nodeName == 'TEXTAREA')) {
|
||
return '\n';
|
||
// Or move to next field from TEXT fields
|
||
} else if(usingOSK) {
|
||
if(Lelem.nodeName == 'INPUT' && (Lelem.type == 'search' || Lelem.type == 'submit')) {
|
||
Lelem.form.submit();
|
||
} else if(typeof(Lelem.base) != 'undefined' && (Lelem.base.type == 'search' || Lelem.base.type == 'submit')) {
|
||
Lelem.base.disabled=false;
|
||
Lelem.base.form.submit();
|
||
} else {
|
||
keymanweb.domManager.moveToNext(false);
|
||
}
|
||
}
|
||
break;
|
||
case osk.keyCodes['K_SPACE']:
|
||
return ' ';
|
||
// break;
|
||
//
|
||
// // Problem: clusters, and doing them right.
|
||
// // The commented-out code below should be a decent starting point, but clusters make it complex.
|
||
//
|
||
// case osk.keyCodes['K_LEFT']:
|
||
// if(touchAlias) {
|
||
// var caretPos = keymanweb.getTextCaret(Lelem);
|
||
// keymanweb.setTextCaret(Lelem, caretPos - 1 >= 0 ? caretPos - 1 : 0);
|
||
// }
|
||
// break;
|
||
// case osk.keyCodes['K_RIGHT']:
|
||
// if(touchAlias) {
|
||
// var caretPos = keymanweb.getTextCaret(Lelem);
|
||
// keymanweb.setTextCaret(Lelem, caretPos + 1);
|
||
// }
|
||
// if(code == osk.keyCodes['K_RIGHT']) {
|
||
// break;
|
||
// }
|
||
// // Should we include this? It could be tricky to do correctly...
|
||
// case osk.keyCodes['K_DEL']:
|
||
// // Move caret right one unit, then backspace.
|
||
// if(touchAlias) {
|
||
// var caretPos = keymanweb.getTextCaret(Lelem);
|
||
// keymanweb.setTextCaret(Lelem, caretPos + 1);
|
||
// if(caretPos == keymanweb.getTextCaret(Lelem)) {
|
||
// // Failed to move right - there's nothing to delete.
|
||
// break;
|
||
// }
|
||
// kbdInterface.defaultBackspace();
|
||
// }
|
||
}
|
||
}
|
||
|
||
// TODO: Refactor the overloading of the 'n' parameter here into separate methods.
|
||
|
||
// Test for fall back to U_xxxxxx key id
|
||
// For this first test, we ignore the keyCode and use the keyName
|
||
if((keyName.substr(0,2) == 'U_')) {
|
||
var codePoint = parseInt(keyName.substr(2,6), 16);
|
||
if (((0x0 <= codePoint) && (codePoint <= 0x1F)) || ((0x80 <= codePoint) && (codePoint <= 0x9F))) {
|
||
// Code points [U_0000 - U_001F] and [U_0080 - U_009F] refer to Unicode C0 and C1 control codes.
|
||
// Check the codePoint number and do not allow output of these codes via U_xxxxxx shortcuts.
|
||
console.log("Suppressing Unicode control code: U_00" + codePoint.toString(16));
|
||
return ch;
|
||
} else {
|
||
// String.fromCharCode() is inadequate to handle the entire range of Unicode
|
||
// Someday after upgrading to ES2015, can use String.fromCodePoint()
|
||
ch=String.kmwFromCharCode(codePoint);
|
||
}
|
||
// Hereafter, we refer to keyCodes.
|
||
} else if(checkCodes) { // keyShiftState can only be '1' or '2'.
|
||
try {
|
||
if(n >= osk.keyCodes['K_0'] && n <= osk.keyCodes['K_9']) { // The number keys.
|
||
ch = codesUS[keyShiftState][0][n-osk.keyCodes['K_0']];
|
||
} else if(n >=osk.keyCodes['K_A'] && n <= osk.keyCodes['K_Z']) { // The base letter keys
|
||
ch = String.fromCharCode(n+(keyShiftState?0:32)); // 32 is the offset from uppercase to lowercase.
|
||
} else if(n >= osk.keyCodes['K_COLON'] && n <= osk.keyCodes['K_BKQUOTE']) {
|
||
ch = codesUS[keyShiftState][1][n-osk.keyCodes['K_COLON']];
|
||
} else if(n >= osk.keyCodes['K_LBRKT'] && n <= osk.keyCodes['K_QUOTE']) {
|
||
ch = codesUS[keyShiftState][2][n-osk.keyCodes['K_LBRKT']];
|
||
}
|
||
} catch (e) {
|
||
console.error("Error detected with default mapping for key: code = " + n + ", shift state = " + (keyShiftState == 1 ? 'shift' : 'default'));
|
||
}
|
||
}
|
||
return ch;
|
||
}
|
||
|
||
/**
|
||
* Simulate a keystroke according to the touched keyboard button element
|
||
*
|
||
* Note that the test-case oriented 'recorder' stubs this method to facilitate OSK-based input
|
||
* recording for use in test cases. If changing this function, please ensure the recorder is
|
||
* not affected.
|
||
*
|
||
* @param {Object} e element touched (or clicked)
|
||
*/
|
||
osk.clickKey = function(e) {
|
||
var Lelem = keymanweb.domManager.getLastActiveElement(), Ls, Le, Lkc;
|
||
|
||
var activeKeyboard = keymanweb.keyboardManager.activeKeyboard;
|
||
|
||
// Each button id is of the form <layer>-<keyCode>, e.g. 'shift-ctrl-K_Q' or 'popup-shift-K_501', etc.
|
||
var t=e.id.split('-');
|
||
if(t.length < 2) return true; //shouldn't happen, but...
|
||
|
||
// Remove popup prefix before processing keystroke (KMEW-93)
|
||
if(t[0] == 'popup') t.splice(0,1);
|
||
|
||
if(Lelem != null) {
|
||
// Get key name and keyboard shift state (needed only for default layouts and physical keyboard handling)
|
||
var layer=t[0], keyName=t[t.length-1], keyShiftState=osk.getModifierState(osk.layerId),
|
||
nextLayer = keyShiftState;
|
||
|
||
// Make sure to get the full current layer, since layers are now kebab-case.
|
||
for(var i=1; i < t.length-1; i++) {
|
||
layer = layer + "-" + t[i];
|
||
}
|
||
|
||
if(typeof(e.key) != 'undefined') nextLayer=e.key['nextlayer'];
|
||
keymanweb.domManager.initActiveElement(Lelem);
|
||
|
||
// Exclude menu and OSK hide keys from normal click processing
|
||
if(keyName == 'K_LOPT' || keyName == 'K_ROPT') {
|
||
osk.optionKey(e,keyName,true);
|
||
return true;
|
||
}
|
||
|
||
// Turn off key highlighting (or preview)
|
||
osk.highlightKey(e,false);
|
||
|
||
// The default OSK layout for desktop devices does not include nextlayer info, relying on modifier detection here.
|
||
if(device.formFactor == 'desktop') {
|
||
if(osk.selectLayer(keyName, nextLayer)){
|
||
return true;
|
||
}
|
||
}
|
||
|
||
// Prevent any output from 'ghost' (unmapped) keys
|
||
if(keyName != 'K_SPACE')
|
||
{
|
||
var keyText=e.childNodes[0].innerHTML;
|
||
//// if(keyText == '' || keyText == ' ') return true; --> why?
|
||
}
|
||
|
||
Ls=Lelem._KeymanWebSelectionStart;
|
||
Le=Lelem._KeymanWebSelectionEnd;
|
||
keymanweb.uiManager.setActivatingUI(true);
|
||
com.keyman.DOMEventHandlers.states._IgnoreNextSelChange = 100;
|
||
keymanweb.domManager.focusLastActiveElement();
|
||
if(keymanweb.domManager._IsMozillaEditableIframe(Lelem,0)) Lelem = Lelem.documentElement;
|
||
Lelem._KeymanWebSelectionStart=Ls;
|
||
Lelem._KeymanWebSelectionEnd=Le;
|
||
com.keyman.DOMEventHandlers.states._IgnoreNextSelChange = 0;
|
||
// ...end I3363 (Build 301)
|
||
keymanweb._CachedSelectionStart = null; // I3319
|
||
// Deadkey matching continues to be troublesome.
|
||
// Deleting matched deadkeys here seems to correct some of the issues. (JD 6/6/14)
|
||
kbdInterface._DeadkeyDeleteMatched(); // Delete any matched deadkeys before continuing
|
||
//kbdInterface._DeadkeyResetMatched(); // I3318 (Not needed if deleted first?)
|
||
|
||
|
||
|
||
// First check the virtual key, and process shift, control, alt or function keys
|
||
Lkc = {Ltarg:Lelem,Lmodifiers:0,Lstates:0,Lcode:osk.keyCodes[keyName],LisVirtualKey:true};
|
||
|
||
// Set the flags for the state keys.
|
||
Lkc.Lstates |= osk._stateKeys['K_CAPS'] ? osk.modifierCodes['CAPS'] : osk.modifierCodes['NO_CAPS'];
|
||
Lkc.Lstates |= osk._stateKeys['K_NUMLOCK'] ? osk.modifierCodes['NUM_LOCK'] : osk.modifierCodes['NO_NUM_LOCK'];
|
||
Lkc.Lstates |= osk._stateKeys['K_SCROLL'] ? osk.modifierCodes['SCROLL_LOCK'] : osk.modifierCodes['NO_SCROLL_LOCK'];
|
||
|
||
// Set LisVirtualKey to false to ensure that nomatch rule does fire for U_xxxx keys
|
||
if(keyName.substr(0,2) == 'U_') Lkc.LisVirtualKey=false;
|
||
|
||
// Get code for non-physical keys (T_KOKAI, U_05AB etc)
|
||
if(typeof Lkc.Lcode == 'undefined')
|
||
{
|
||
Lkc.Lcode = osk.getVKDictionaryCode(keyName);// Updated for Build 347
|
||
if(!Lkc.Lcode)
|
||
{
|
||
// Special case for U_xxxx keys. This vk code will never be used
|
||
// in a keyboard, so we use this to ensure that keystroke processing
|
||
// occurs for the key.
|
||
Lkc.Lcode = 1;
|
||
}
|
||
}
|
||
|
||
// Override key shift state if specified for key in layout (corrected for popup keys KMEW-93)
|
||
var lx=(typeof e.key == 'undefined' ? null : e.key['layer']);
|
||
if(lx == null)
|
||
keyShiftState=osk.getModifierState(layer);
|
||
else
|
||
keyShiftState=osk.getModifierState(lx);
|
||
|
||
// Define modifiers value for sending to keyboard mapping function
|
||
Lkc.Lmodifiers = keyShiftState;
|
||
|
||
// Handles modifier states when the OSK is emulating rightalt through the leftctrl-leftalt layer.
|
||
if((Lkc.Lmodifiers & osk.modifierBitmasks['ALT_GR_SIM']) == osk.modifierBitmasks['ALT_GR_SIM'] && osk.emulatesAltGr()) {
|
||
Lkc.Lmodifiers &= ~osk.modifierBitmasks['ALT_GR_SIM'];
|
||
Lkc.Lmodifiers |= osk.modifierCodes['RALT'];
|
||
}
|
||
|
||
// Include *limited* support for mnemonic keyboards (Sept 2012)
|
||
if(activeKeyboard && (activeKeyboard['KM']))
|
||
{
|
||
var keyText=e.firstChild.firstChild.wholeText;
|
||
Lkc.LisVirtualKey=false; Lkc.LisVirtualKeyCode=false;
|
||
Lkc.vkCode=Lkc.Lcode;
|
||
if(Lkc.Lcode != osk.keyCodes['K_SPACE']) // exception required, March 2013
|
||
{
|
||
if(typeof keyText == 'string' && keyText != '')
|
||
Lkc.Lcode=keyText.charCodeAt(0);
|
||
else
|
||
Lkc.Lcode=0;
|
||
if(Lkc.Lcode == 160) Lkc.Lcode = 0;
|
||
}
|
||
Lkc.Lmodifiers=0;
|
||
}
|
||
else Lkc.vkCode=Lkc.Lcode;
|
||
|
||
// Support version 1.0 KeymanWeb keyboards that do not define positional vs mnemonic
|
||
if(typeof activeKeyboard['KM'] == 'undefined')
|
||
{
|
||
Lkc.Lcode=keymanweb.keyMapManager._USKeyCodeToCharCode(Lkc);
|
||
Lkc.LisVirtualKey=false;
|
||
}
|
||
|
||
// Pass this key code and state to the keyboard program
|
||
if(!activeKeyboard || (Lkc.Lcode != 0 && !kbdInterface.processKeystroke(util.device, Lelem, Lkc)))
|
||
{
|
||
// Restore the virtual key code if a mnemonic keyboard is being used
|
||
Lkc.Lcode=Lkc.vkCode;
|
||
|
||
// Handle unmapped keys, including special keys
|
||
switch(keyName)
|
||
{
|
||
case 'K_CAPS':
|
||
case 'K_NUMLOCK':
|
||
case 'K_SCROLL':
|
||
osk._stateKeys[keyName] = ! osk._stateKeys[keyName];
|
||
osk._Show();
|
||
break;
|
||
default:
|
||
// The following is physical layout dependent, so should be avoided if possible. All keys should be mapped.
|
||
var ch = osk.defaultKeyOutput(keyName,Lkc.Lcode,keyShiftState,true,Lelem);
|
||
if(ch) {
|
||
kbdInterface.output(0, Lelem, ch);
|
||
}
|
||
}
|
||
}
|
||
|
||
// Test if this key has a non-default next layer
|
||
if(typeof e.key != 'undefined' && e.key['nextlayer'] !== null) osk.nextLayer=e.key['nextlayer'];
|
||
|
||
// Swap layer as appropriate.
|
||
osk.selectLayer(keyName, nextLayer);
|
||
|
||
/* I732 END - 13/03/2007 MCD: End Positional Layout support in OSK */
|
||
Lelem._KeymanWebSelectionStart=null;
|
||
Lelem._KeymanWebSelectionEnd=null;
|
||
}
|
||
keymanweb.uiManager.setActivatingUI(false); // I2498 - KeymanWeb OSK does not accept clicks in FF when using automatic UI
|
||
return true;
|
||
}
|
||
|
||
/**
|
||
* Function getLayerId
|
||
* Scope Private
|
||
* @param {number} m shift modifier code
|
||
* @return {string} layer string from shift modifier code (desktop keyboards)
|
||
* Description Get name of layer from code, where the modifer order is determined by ascending bit-flag value.
|
||
*/
|
||
osk.getLayerId = function(m)
|
||
{
|
||
var s='';
|
||
if(m == 0) {
|
||
return 'default';
|
||
} else {
|
||
if(m & osk.modifierCodes['LCTRL']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'leftctrl';
|
||
}
|
||
if(m & osk.modifierCodes['RCTRL']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'rightctrl';
|
||
}
|
||
if(m & osk.modifierCodes['LALT']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'leftalt';
|
||
}
|
||
if(m & osk.modifierCodes['RALT']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'rightalt';
|
||
}
|
||
if(m & osk.modifierCodes['SHIFT']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'shift';
|
||
}
|
||
if(m & osk.modifierCodes['CTRL']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'ctrl';
|
||
}
|
||
if(m & osk.modifierCodes['ALT']) {
|
||
s = (s.length > 0 ? s + '-' : '') + 'alt';
|
||
}
|
||
return s;
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Get modifier key state from layer id
|
||
*
|
||
* @param {string} layerId layer id (e.g. ctrlshift)
|
||
* @return {number} modifier key state (desktop keyboards)
|
||
*/
|
||
osk.getModifierState = function(layerId)
|
||
{
|
||
var modifier=0;
|
||
if(layerId.indexOf('shift') >= 0) {
|
||
modifier |= osk.modifierCodes['SHIFT'];
|
||
}
|
||
|
||
// The chiral checks must not be directly exclusive due each other to visual OSK feedback.
|
||
var ctrlMatched=false;
|
||
if(layerId.indexOf('leftctrl') >= 0) {
|
||
modifier |= osk.modifierCodes['LCTRL'];
|
||
ctrlMatched=true;
|
||
}
|
||
if(layerId.indexOf('rightctrl') >= 0) {
|
||
modifier |= osk.modifierCodes['RCTRL'];
|
||
ctrlMatched=true;
|
||
}
|
||
if(layerId.indexOf('ctrl') >= 0 && !ctrlMatched) {
|
||
modifier |= osk.modifierCodes['CTRL'];
|
||
}
|
||
|
||
var altMatched=false;
|
||
if(layerId.indexOf('leftalt') >= 0) {
|
||
modifier |= osk.modifierCodes['LALT'];
|
||
altMatched=true;
|
||
}
|
||
if(layerId.indexOf('rightalt') >= 0) {
|
||
modifier |= osk.modifierCodes['RALT'];
|
||
altMatched=true;
|
||
}
|
||
if(layerId.indexOf('alt') >= 0 && !altMatched) {
|
||
modifier |= osk.modifierCodes['ALT'];
|
||
}
|
||
|
||
return modifier;
|
||
}
|
||
|
||
/**
|
||
* Sets the new layer id, allowing for toggling shift/ctrl/alt while preserving the remainder
|
||
* of the modifiers represented by the current layer id (where applicable)
|
||
*
|
||
* @param {string} id layer id (e.g. ctrlshift)
|
||
*/
|
||
osk.updateLayer = function(id)
|
||
{
|
||
var s=osk.layerId,idx=id;
|
||
var i;
|
||
|
||
// Need to test if target layer is a standard layer (based on the plain 'default')
|
||
var replacements= ['leftctrl', 'rightctrl', 'ctrl', 'leftalt', 'rightalt', 'alt', 'shift'];
|
||
|
||
for(i=0; i < replacements.length; i++) {
|
||
// Don't forget to remove the kebab-case hyphens!
|
||
idx=idx.replace(replacements[i] + '-', '');
|
||
idx=idx.replace(replacements[i],'');
|
||
}
|
||
|
||
// If we are presently on the default layer, drop the 'default' and go straight to the shifted mode.
|
||
// If on a common symbolic layer, drop out of symbolic mode and go straight to the shifted mode.
|
||
if(osk.layerId == 'default' || osk.layerId == 'numeric' || osk.layerId == 'symbol' || osk.layerId == 'currency' || idx != '') {
|
||
s = id;
|
||
}
|
||
// Otherwise, we are based upon the a layer that accepts modifier variations.
|
||
// Modify the layer according to the current state and key pressed.
|
||
//
|
||
// TODO: Consider: should this ever be allowed for a base layer other than 'default'? If not,
|
||
// if(idx == '') with accompanying if-else structural shift would be a far better test here.
|
||
else
|
||
{
|
||
// Save our current modifier state.
|
||
var modifier=osk.getModifierState(s);
|
||
|
||
// Strip down to the base modifiable layer.
|
||
for(i=0; i < replacements.length; i++) {
|
||
// Don't forget to remove the kebab-case hyphens!
|
||
s=s.replace(replacements[i] + '-', '');
|
||
s=s.replace(replacements[i],'');
|
||
}
|
||
|
||
// Toggle the modifier represented by our input argument.
|
||
switch(id)
|
||
{
|
||
case 'shift':
|
||
modifier ^= osk.modifierCodes['SHIFT'];
|
||
break;
|
||
case 'leftctrl':
|
||
modifier ^= osk.modifierCodes['LCTRL'];
|
||
break;
|
||
case 'rightctrl':
|
||
modifier ^= osk.modifierCodes['RCTRL'];
|
||
break;
|
||
case 'ctrl':
|
||
modifier ^= osk.modifierCodes['CTRL'];
|
||
break;
|
||
case 'leftalt':
|
||
modifier ^= osk.modifierCodes['LALT'];
|
||
break;
|
||
case 'rightalt':
|
||
modifier ^= osk.modifierCodes['RALT'];
|
||
break;
|
||
case 'alt':
|
||
modifier ^= osk.modifierCodes['ALT'];
|
||
break;
|
||
default:
|
||
s = id;
|
||
}
|
||
// Combine our base modifiable layer and attach the new modifier variation info to obtain our destination layer.
|
||
if(s != 'default') {
|
||
if(s == '') {
|
||
s = osk.getLayerId(modifier);
|
||
} else {
|
||
s = osk.getLayerId(modifier) + '-' + s;
|
||
}
|
||
}
|
||
}
|
||
|
||
if(s == '') {
|
||
s = 'default';
|
||
}
|
||
|
||
// Actually set the new layer id.
|
||
osk.layerId = s;
|
||
|
||
// Check that requested layer is defined (KMEA-1, but does not resolve issue)
|
||
for(i=0; i<osk.layers.length; i++)
|
||
if(osk.layerId == osk.layers[i].id) return;
|
||
|
||
// Show default layer if an undefined layer has been requested
|
||
osk.layerId='default';
|
||
}
|
||
|
||
/**
|
||
* Indicate the current language and keyboard on the space bar
|
||
**/
|
||
osk.showLanguage = function() {
|
||
var lgName='',kbdName='';
|
||
var activeStub = keymanweb.keyboardManager.activeStub;
|
||
|
||
if(activeStub) {
|
||
lgName=activeStub['KL'];
|
||
kbdName=activeStub['KN'];
|
||
} else if(keymanweb._ActiveLanguage) {
|
||
lgName=keymanweb._ActiveLanguage['KN'];
|
||
} else {
|
||
lgName='English';
|
||
}
|
||
|
||
try
|
||
{
|
||
var t=osk.spaceBar.firstChild.firstChild;
|
||
if(typeof(t.parentNode.className) == 'undefined' || t.parentNode.className == '')
|
||
t.parentNode.className='kmw-spacebar';
|
||
else
|
||
t.parentNode.className +=' kmw-spacebar';
|
||
|
||
t.className='kmw-spacebar-caption';
|
||
kbdName=kbdName.replace(/\s*keyboard\s*/i,'');
|
||
|
||
// We use a separate variable here to keep down on MutationObserver messages in keymanweb.js code.
|
||
var keyboardName = "";
|
||
if(kbdName == lgName) {
|
||
keyboardName=lgName;
|
||
} else {
|
||
keyboardName=lgName+' ('+kbdName+')';
|
||
}
|
||
// It sounds redundant, but this dramatically cuts down on browser DOM processing.
|
||
if(t.innerHTML != keyboardName) {
|
||
t.innerHTML = keyboardName;
|
||
}
|
||
}
|
||
catch(ex){}
|
||
}
|
||
|
||
/**
|
||
* Display list of installed keyboards in pop-up menu
|
||
**/
|
||
osk.showLanguageMenu = function()
|
||
{
|
||
var n=0,kbdList=keymanweb.keyboardManager.keyboardStubs,nKbds=kbdList.length;
|
||
if(nKbds < 1) return;
|
||
|
||
// Create the menu list container element
|
||
var menu=osk.lgList=util._CreateElement('DIV'),ss;
|
||
osk.lgList.id='kmw-language-menu';
|
||
|
||
// Insert a transparent overlay to prevent anything else happening during keyboard selection,
|
||
// but allow the menu to be closed if anywhere else on screen is touched
|
||
menu.shim=util._CreateElement('DIV');
|
||
menu.shim.id='kmw-language-menu-background';
|
||
menu.shim.addEventListener('touchstart',
|
||
function(e)
|
||
{
|
||
e.preventDefault(); osk.hideLanguageList();
|
||
|
||
// Display build only if touching menu, space *and* one other point on screen (build 369)
|
||
if(e.touches.length > 2)
|
||
{
|
||
var sX=e.touches[1].pageX,sY=e.touches[1].pageY;
|
||
if(sX > osk.spaceBar.offsetLeft && sX < osk.spaceBar.offsetLeft+osk.spaceBar.offsetWidth &&
|
||
sY > osk.spaceBar.offsetTop && sY < osk.spaceBar.offsetTop+osk.spaceBar.offsetHeight) osk.showBuild();
|
||
}
|
||
},false);
|
||
document.body.appendChild(menu.shim);
|
||
|
||
// Add two nested DIVs to properly support iOS scrolling with momentum
|
||
// c.f. https://github.com/joelambert/ScrollFix/issues/2
|
||
var m2=util._CreateElement('DIV'),s2=m2.style,
|
||
m3=util._CreateElement('DIV'),s3=m3.style;
|
||
m2.id='kmw-menu-scroll-container'; m3.id='kmw-menu-scroller';
|
||
|
||
// Support momentum scrolling on iOS
|
||
if('WebkitOverflowScrolling' in s2) s2.WebkitOverflowScrolling='touch';
|
||
|
||
m2.appendChild(m3);
|
||
menu.appendChild(m2);
|
||
|
||
// Add menu index strip
|
||
var i,x,mx=util._CreateElement('DIV');
|
||
mx.id='kmw-menu-index';
|
||
for(i=1; i<=26; i++)
|
||
{
|
||
x=util._CreateElement('P');
|
||
x.innerHTML=String.fromCharCode(i+64);
|
||
mx.appendChild(x);
|
||
}
|
||
|
||
// Add index selection (for a large menu)
|
||
mx.addEventListener('touchstart',function(e){osk.scrollToLanguage(e,m2,m3);},false);
|
||
mx.addEventListener('touchend',function(e){e.stopPropagation();e.preventDefault();},false);
|
||
menu.appendChild(mx);
|
||
|
||
//TODO: not sure if either of these two handlers ar actually needed. touchmove handler may be doing all that is necessary.
|
||
// Add scroll end event handling to override body scroll
|
||
menu.addEventListener('scroll',function(e){
|
||
osk.lgList.scrolling=true;
|
||
},false);
|
||
m2.addEventListener('scroll',function(e){
|
||
//osk.lgList.scrolling=true;
|
||
if(m2.scrollTop < 1)m2.scrollTop=1;
|
||
if(m2.scrollTop > m2.scrollHeight-m2.offsetHeight-1)m2.scrollTop=m2.scrollHeight-m2.offsetHeight-1;
|
||
},false);
|
||
|
||
// Add a list of keyboards to the innermost DIV
|
||
osk.lgList.activeLgNo=osk.addLanguagesToMenu(m3,kbdList);
|
||
|
||
// Get number of visible (language) selectors
|
||
var nLgs=m3.childNodes.length-1;
|
||
|
||
// Do not display until sizes have been calculated
|
||
osk.lgList.visibility='hidden';
|
||
|
||
// Append menu to document body, not to OSK
|
||
document.body.appendChild(osk.lgList);
|
||
|
||
// Adjust size for viewport scaling (probably not needed for iOS, but check!)
|
||
if(device.OS == 'Android' && 'devicePixelRatio' in window)
|
||
osk.lgList.style.fontSize=(2/window.devicePixelRatio)+'em';
|
||
|
||
|
||
// Adjust width for pixel scaling on Android tablets
|
||
if(device.OS == 'Android' && device.formFactor == 'tablet' && 'devicePixelRatio' in window)
|
||
{
|
||
var w=parseInt(util.getStyleValue(menu,'width'),10),ms=menu.style;
|
||
if(!isNaN(w)) ms.width=ms.maxWidth=(2*w/window.devicePixelRatio)+'px';
|
||
w=parseInt(util.getStyleValue(m2,'width'),10); ms=m2.style;
|
||
if(!isNaN(w)) ms.width=ms.maxWidth=(2*w/window.devicePixelRatio)+'px';
|
||
w=parseInt(util.getStyleValue(m3,'width'),10); ms=m3.style;
|
||
if(!isNaN(w)) ms.width=ms.maxWidth=(2*w/window.devicePixelRatio)+'px';
|
||
}
|
||
|
||
// Adjust initial top and height of menu
|
||
osk.adjustLanguageMenu(0);
|
||
|
||
// Adjust the index font size and line height
|
||
var dy=mx.childNodes[1].offsetTop-mx.childNodes[0].offsetTop,
|
||
lineHeight=Math.floor(menu.offsetHeight/26.0),
|
||
scale=Math.round(100.0*lineHeight/dy)/100.0,
|
||
factor=(scale > 0.6 ? 1 : 2);
|
||
|
||
if(scale > 1.25) scale=1.25;
|
||
|
||
for(i=0;i<26;i++)
|
||
{
|
||
var qs=mx.childNodes[i].style;
|
||
if(factor == 2 && (i%2) == 1)
|
||
{
|
||
qs.display='none';
|
||
}
|
||
else
|
||
{
|
||
qs.fontSize=(scale*factor)+'em';
|
||
qs.lineHeight=(lineHeight*factor)+'px';
|
||
}
|
||
}
|
||
|
||
// Increase width of outer menu DIV by index, else hide index
|
||
var menuWidth=m2.offsetWidth;
|
||
if(m2.scrollHeight > m2.offsetHeight+3)
|
||
menuWidth = menuWidth+mx.offsetWidth;
|
||
else
|
||
mx.style.display='none';
|
||
|
||
menu.style.width=menuWidth+'px';
|
||
|
||
// Now display the menu
|
||
osk.lgList.visibility='';
|
||
|
||
// Set initial scroll to show current language (but never less than 1, to avoid dragging body)
|
||
var top=m3.firstChild.offsetHeight*osk.lgList.activeLgNo+1;
|
||
m2.scrollTop=top;
|
||
|
||
// The scrollTop value is limited by the device, and must be limited to avoid dragging the document body
|
||
if(m2.scrollTop < top) m2.scrollTop=m2.scrollHeight-m2.offsetHeight;
|
||
if(m2.scrollTop > m2.scrollHeight-m2.offsetHeight-1)m2.scrollTop=m2.scrollHeight-m2.offsetHeight-1;
|
||
|
||
}
|
||
|
||
/**
|
||
* Adjust top and height of language menu
|
||
*
|
||
* @param {number} nKbds number of displayed keyboards to add to number of languages
|
||
**/
|
||
osk.adjustLanguageMenu = function(nKbds)
|
||
{
|
||
var menu=osk.lgList,m2=menu.firstChild,m3=m2.firstChild,
|
||
barWidth=0,s=menu.style,mx=menu.childNodes[1],
|
||
maxHeight=window.innerHeight-osk.lgKey.offsetHeight-16,
|
||
nItems=m3.childNodes.length+nKbds-1, // Number of (visible) keyboard selectors
|
||
itemHeight=m3.firstChild.firstChild.offsetHeight,
|
||
menuHeight=nItems*itemHeight;
|
||
|
||
// Correct maxheight for viewport scaling (iPhone/iPod only) and internal position corrections
|
||
if(device.OS == 'iOS')
|
||
{
|
||
if(device.formFactor == 'phone')
|
||
{
|
||
barWidth=(util.landscapeView() ? 36 : 0);
|
||
maxHeight=(window.innerHeight-barWidth-16)*util.getViewportScale();
|
||
}
|
||
else if(device.formFactor == 'tablet')
|
||
{
|
||
barWidth=(util.landscapeView() ? 16 : 0);
|
||
maxHeight=(maxHeight-barWidth);
|
||
}
|
||
}
|
||
|
||
// Explicitly set position and height
|
||
s.left=util._GetAbsoluteX(osk.lgKey)+'px';
|
||
if(menuHeight > maxHeight) menuHeight=maxHeight;
|
||
s.height=menuHeight+'px';
|
||
|
||
// Position menu at bottom of screen, but referred to top (works for both iOS and Firefox)
|
||
s.top=(util._GetAbsoluteY(osk._Box)+osk._Box.offsetHeight-menuHeight+window.pageYOffset-6)+'px';
|
||
s.bottom='auto';
|
||
|
||
// Explicitly set the scroller and index heights to the container height
|
||
mx.style.height=m2.style.height=s.height;
|
||
|
||
}
|
||
|
||
/**
|
||
* Add an index to the language menu
|
||
*
|
||
* @param {Object} e touch start event from index
|
||
* @param {Object} m2 menu scroller DIV
|
||
* @param {Object} menu DIV with list of languages
|
||
*/
|
||
osk.scrollToLanguage = function(e,m2,menu)
|
||
{
|
||
e.stopImmediatePropagation();e.stopPropagation();e.preventDefault();
|
||
if(e.touches[0].target.nodeName != 'P') return;
|
||
var i,t,top=0,initial=e.touches[0].target.innerHTML.charCodeAt(0),nn=menu.childNodes;
|
||
try {
|
||
for(i=0; i<nn.length-1; i++)
|
||
{
|
||
t=nn[i].firstChild.innerHTML.toUpperCase().charCodeAt(0);
|
||
if(t >= initial) break;
|
||
}
|
||
}
|
||
catch(ex){}
|
||
try
|
||
{
|
||
top=menu.firstChild.offsetHeight*i+1;
|
||
m2.scrollTop=top;
|
||
}
|
||
catch(ex){top=0;}
|
||
try
|
||
{
|
||
if(m2.scrollTop < top) m2.scrollTop=m2.scrollHeight-m2.offsetHeight;
|
||
if(m2.scrollTop > m2.scrollHeight-m2.offsetHeight-1) m2.scrollTop=m2.scrollHeight-m2.offsetHeight-1;
|
||
}
|
||
catch(ex){}
|
||
}
|
||
|
||
/**
|
||
* Display all languages for installed keyboards in scrollable list
|
||
*
|
||
* @param {Object} menu DIV to which language selectors will be added
|
||
* @param {Object} kbdList array of keyboard stub objects
|
||
* @return {number} index of currently active language
|
||
**/
|
||
osk.addLanguagesToMenu = function(menu,kbdList)
|
||
{
|
||
var nStubs=kbdList.length;
|
||
|
||
// Create and sort a list of languages
|
||
var k,n,lg,langs=[];
|
||
for(n=0; n<nStubs; n++)
|
||
{
|
||
lg=kbdList[n]['KL'];
|
||
if(langs.indexOf(lg) == -1) langs.push(lg);
|
||
}
|
||
langs.sort();
|
||
|
||
// Get current scale factor (reciprocal of viewport scale)
|
||
var scale=Math.round(100/util.getViewportScale())/100;
|
||
|
||
var dx,lgBar,kList,i,kb,activeLanguageIndex=-1;
|
||
for(k=0; k<langs.length; k++)
|
||
{
|
||
dx=util._CreateElement('DIV');dx.className='kbd-list-closed';
|
||
lgBar=util._CreateElement('P');
|
||
lgBar.kList=[];
|
||
|
||
for(n=0; n<nStubs; n++)
|
||
{
|
||
if(kbdList[n]['KL'] == langs[k]) lgBar.kList.push(kbdList[n]);
|
||
}
|
||
|
||
// Adjust bar size for current viewport scaling (iOS only!)
|
||
if(device.OS == 'iOS') lgBar.style.fontSize=scale+'em';
|
||
|
||
// Add to menu
|
||
dx.appendChild(lgBar);
|
||
menu.appendChild(dx);
|
||
|
||
if(langs[k] == (<KeymanBase>keymanweb).keyboardManager.activeStub['KL']) activeLanguageIndex=k;
|
||
|
||
// Several keyboards for this language
|
||
if(lgBar.kList.length > 1)
|
||
{
|
||
lgBar.className='kbd-list';
|
||
lgBar.innerHTML=langs[k]+'...';
|
||
lgBar.scrolled=false;
|
||
lgBar.ontouchend=function(e)
|
||
{
|
||
e.preventDefault();e.stopPropagation();
|
||
if(e.target.scrolled)
|
||
e.target.scrolled=false;
|
||
else
|
||
this.parentNode.className=(this.parentNode.className=='kbd-list-closed'?'kbd-list-open':'kbd-list-closed');
|
||
|
||
// Adjust top of menu to allow for expanded list
|
||
osk.adjustLanguageMenu(this.parentNode.className=='kbd-list-closed'?0:this.kList.length);
|
||
}
|
||
lgBar.addEventListener('touchstart',function(e){e.stopPropagation();},false);
|
||
lgBar.addEventListener('touchmove',function(e){e.target.scrolled=true;e.stopPropagation();},false);
|
||
|
||
for(i=0; i<lgBar.kList.length; i++)
|
||
{
|
||
kb=util._CreateElement('P');kb.className='kbd-list-entry';
|
||
if(device.OS == 'iOS') kb.style.fontSize=scale+'em';
|
||
osk.addKeyboardToMenu(lgBar.kList[i],kb,false);
|
||
dx.appendChild(kb);
|
||
}
|
||
}
|
||
|
||
// Only one keyboard for this language
|
||
else
|
||
{
|
||
lgBar.innerHTML=langs[k];
|
||
lgBar.className='kbd-single-entry';
|
||
osk.addKeyboardToMenu(lgBar.kList[0],lgBar,true);
|
||
}
|
||
if(k == activeLanguageIndex) lgBar.className=lgBar.className+' current';
|
||
}
|
||
|
||
// Add a non-selectable bottom bar so to allow scrolling to the last language
|
||
var padLast=util._CreateElement('DIV'); padLast.id='kmw-menu-footer';
|
||
var cancelTouch=function(e){e.preventDefault();e.stopPropagation();};
|
||
padLast.addEventListener('touchstart',cancelTouch,false);
|
||
padLast.addEventListener('touchmove',cancelTouch,false);
|
||
padLast.addEventListener('touchend',cancelTouch,false);
|
||
menu.appendChild(padLast);
|
||
|
||
return activeLanguageIndex;
|
||
}
|
||
|
||
/**
|
||
* Add a keyboard entry to the language menu *
|
||
*
|
||
* @param {Object} kbd keyboard object
|
||
* @param {Object} kb element being added and styled
|
||
* @param {boolean} unique is this the only keyboard for the language?
|
||
*/
|
||
osk.addKeyboardToMenu = function(kbd,kb,unique)
|
||
{
|
||
kb.kn=kbd['KI']; // InternalName;
|
||
kb.kc=kbd['KLC']; // LanguageCode;
|
||
kb.innerHTML=unique?kbd['KL']:kbd['KN'].replace(' Keyboard',''); // Name
|
||
|
||
// Touchstart (or mspointerdown) event highlights the touched list item
|
||
var touchStart=function(e)
|
||
{
|
||
e.stopPropagation();
|
||
if(this.className.indexOf('selected') <= 0) this.className=this.className+' selected';
|
||
osk.lgList.scrolling=false;
|
||
osk.lgList.y0=e.touches[0].pageY;//osk.lgList.childNodes[0].scrollTop;
|
||
return true;
|
||
},
|
||
//TODO: Still drags Android background sometimes (not consistently)
|
||
// Touchmove drags the list and prevents release from selecting the language
|
||
touchMove=function(e)
|
||
{
|
||
e.stopImmediatePropagation();
|
||
var scroller=osk.lgList.childNodes[0],
|
||
yMax=scroller.scrollHeight-scroller.offsetHeight,
|
||
y, dy;
|
||
|
||
if("undefined" != typeof e.pageY) y = e.pageY;
|
||
else if("undefined" != typeof e.touches) y = e.touches[0].pageY;
|
||
else return;
|
||
|
||
dy=y-osk.lgList.y0;
|
||
|
||
// Scroll up (show later listed languages)
|
||
if(dy < 0)
|
||
{
|
||
if(scroller.scrollTop >= yMax-1)
|
||
{
|
||
e.preventDefault(); osk.lgList.y0=y;
|
||
}
|
||
}
|
||
// Scroll down (show earlier listed languages)
|
||
else if(dy > 0)
|
||
{
|
||
if(scroller.scrollTop < 2)
|
||
{
|
||
e.preventDefault(); osk.lgList.y0=y;
|
||
}
|
||
}
|
||
// Dont' scroll - can happen if changing scroll direction
|
||
else
|
||
return;
|
||
|
||
// Disable selected language if drag more than 5px
|
||
if(dy < -5 || dy > 5)
|
||
{
|
||
osk.lgList.scrolling=true;
|
||
this.className=this.className.replace(/\s*selected/,'');
|
||
osk.lgList.y0=y;
|
||
}
|
||
return true;
|
||
},
|
||
|
||
// Touch release (click) event selects touched list item
|
||
touchEnd=function(e)
|
||
{
|
||
e.preventDefault();
|
||
if(typeof(e.stopImmediatePropagation) != 'undefined') e.stopImmediatePropagation();else e.stopPropagation();
|
||
|
||
if(osk.lgList.scrolling)
|
||
{
|
||
this.className=this.className.replace(/\s*selected/,'');
|
||
}
|
||
else
|
||
{
|
||
com.keyman.DOMEventHandlers.states.setFocusTimer();
|
||
|
||
osk.lgList.style.display='none'; //still allows blank menu momentarily on selection
|
||
keymanweb.keyboardManager._SetActiveKeyboard(this.kn,this.kc,true);
|
||
keymanweb.keyboardManager.doKeyboardChange(this.kn,this.kc);
|
||
keymanweb.domManager.focusLastActiveElement();
|
||
osk.hideLanguageList();
|
||
|
||
// Update the OSK with the new keyboard
|
||
osk._Show();
|
||
}
|
||
return true;
|
||
};
|
||
|
||
kb.onmspointerdown=touchStart;
|
||
kb.addEventListener('touchstart',touchStart,false);
|
||
kb.onmspointermove=touchMove;
|
||
kb.addEventListener('touchmove',touchMove,false);
|
||
kb.onmspointerout=touchEnd;
|
||
kb.addEventListener('touchend',touchEnd,false);
|
||
}
|
||
|
||
/**
|
||
* Remove the language menu again
|
||
**/
|
||
osk.hideLanguageList = function()
|
||
{
|
||
if(osk.lgList)
|
||
{
|
||
osk.highlightKey(osk.lgKey.firstChild,false);
|
||
osk.lgList.style.visibility='hidden';
|
||
window.setTimeout(function(){
|
||
if(osk.lgList != null && typeof osk.lgList != 'undefined') {
|
||
document.body.removeChild(osk.lgList.shim);
|
||
document.body.removeChild(osk.lgList);
|
||
}
|
||
osk.lgList=null;
|
||
},500);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Function _UpdateVKShift
|
||
* Scope Private
|
||
* @param {Object} e OSK event
|
||
* @param {number} v keyboard shift state
|
||
* @param {(boolean|number)} d set (1) or clear(0) shift state bits
|
||
* @return {boolean} Always true
|
||
* Description Update the current shift state within KMW
|
||
*/
|
||
osk._UpdateVKShift = function(e, v, d) {
|
||
var keyShiftState=0, lockStates=0, i;
|
||
|
||
var lockNames = ['CAPS', 'NUM_LOCK', 'SCROLL_LOCK'];
|
||
var lockKeys = ['K_CAPS', 'K_NUMLOCK', 'K_SCROLL'];
|
||
|
||
if(e) {
|
||
// read shift states from Pevent
|
||
keyShiftState = e.Lmodifiers;
|
||
lockStates = e.Lstates;
|
||
|
||
// Are we simulating AltGr? If it's a simulation and not real, time to un-simulate for the OSK.
|
||
if(keymanweb.keyboardManager.isChiral() && osk.emulatesAltGr() &&
|
||
(com.keyman.DOMEventHandlers.states.modStateFlags & osk.modifierBitmasks['ALT_GR_SIM']) == osk.modifierBitmasks['ALT_GR_SIM']) {
|
||
keyShiftState |= osk.modifierBitmasks['ALT_GR_SIM'];
|
||
keyShiftState &= ~osk.modifierCodes['RALT'];
|
||
}
|
||
|
||
for(i=0; i < lockNames.length; i++) {
|
||
if(lockStates & osk.stateBitmasks[lockNames[i]]) {
|
||
osk._stateKeys[lockKeys[i]] = lockStates & osk.modifierCodes[lockNames[i]];
|
||
}
|
||
}
|
||
} else if(d) {
|
||
keyShiftState |= v;
|
||
|
||
for(i=0; i < lockNames.length; i++) {
|
||
if(v & osk.stateBitmasks[lockNames[i]]) {
|
||
osk._stateKeys[lockKeys[i]] = true;
|
||
}
|
||
}
|
||
} else {
|
||
keyShiftState &= ~v;
|
||
|
||
for(i=0; i < lockNames.length; i++) {
|
||
if(v & osk.stateBitmasks[lockNames[i]]) {
|
||
osk._stateKeys[lockKeys[i]] = false;
|
||
}
|
||
}
|
||
}
|
||
|
||
// Find and display the selected OSK layer
|
||
osk.layerId=osk.getLayerId(keyShiftState);
|
||
|
||
// osk._UpdateVKShiftStyle will be called automatically upon the next _Show.
|
||
if(osk._Visible) {
|
||
osk._Show();
|
||
}
|
||
|
||
return true;
|
||
}
|
||
|
||
/**
|
||
* Function _UpdateVKShiftStyle
|
||
* Scope Private
|
||
* @param {string=} layerId
|
||
* Description Updates the OSK's visual style for any toggled state keys
|
||
*/
|
||
osk._UpdateVKShiftStyle = function(layerId) {
|
||
var i, n, layer=null, layerElement=null;
|
||
|
||
if(layerId) {
|
||
for(n=0; n<osk.layers.length; n++) {
|
||
if(osk.layers[n]['id'] == osk.layerId) {
|
||
break;
|
||
}
|
||
}
|
||
|
||
return; // Failed to find the requested layer.
|
||
} else {
|
||
n=osk.layerIndex;
|
||
layerId=osk.layers[n]['id'];
|
||
}
|
||
|
||
layer=osk.layers[n];
|
||
|
||
// Set the on/off state of any visible state keys.
|
||
var states =['K_CAPS', 'K_NUMLOCK', 'K_SCROLL'];
|
||
var keys =[layer.capsKey, layer.numKey, layer.scrollKey];
|
||
|
||
for(i=0; i < keys.length; i++) {
|
||
// Skip any keys not in the OSK!
|
||
if(keys[i] == null) {
|
||
continue;
|
||
}
|
||
|
||
keys[i]['sp'] = osk._stateKeys[states[i]] ? osk.buttonClasses['SHIFT-ON'] : osk.buttonClasses['SHIFT'];
|
||
var btn = document.getElementById(layerId+'-'+states[i]);
|
||
|
||
osk.setButtonClass(keys[i], btn, osk.layout);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Function _CancelMouse
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* @return {boolean} always false
|
||
* Description Closes mouse click event
|
||
*/
|
||
osk._CancelMouse=function(e)
|
||
{
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
if(e) { e.cancelBubble=true; e.returnValue=false; } // I2409 - Avoid focus loss for visual keyboard events
|
||
return false;
|
||
}
|
||
|
||
/**
|
||
* Function showLayer
|
||
* Scope Private
|
||
* @param {string} id ID of the layer to show
|
||
* @return {boolean} true if the layer is shown, or false if it cannot be found
|
||
* Description Shows the layer identified by 'id' in the on screen keyboard
|
||
*/
|
||
osk.showLayer = function(id)
|
||
{
|
||
if(keymanweb.keyboardManager.activeKeyboard)
|
||
{
|
||
for(var i=0; i<osk.layers.length; i++)
|
||
{
|
||
if(osk.layers[i].id == id)
|
||
{
|
||
osk.layerId=id;
|
||
osk._Show();
|
||
return true;
|
||
}
|
||
}
|
||
}
|
||
return false;
|
||
}
|
||
|
||
/**
|
||
* Get the wanted height of the OSK for touch devices
|
||
*
|
||
* @return {number} height in pixels
|
||
**/
|
||
osk.getHeight=function()
|
||
{
|
||
|
||
// KeymanTouch - get OSK height from device
|
||
if(typeof(keymanweb['getOskHeight']) == 'function') return keymanweb['getOskHeight']();
|
||
|
||
var oskHeightLandscapeView=Math.floor(Math.min(screen.availHeight,screen.availWidth)/2),
|
||
height=oskHeightLandscapeView;
|
||
|
||
if(device.formFactor == 'phone')
|
||
{
|
||
var sx=Math.min(screen.height,screen.width),
|
||
sy=Math.max(screen.height,screen.width);
|
||
|
||
if(util.portraitView())
|
||
height=Math.floor(Math.max(screen.availHeight,screen.availWidth)/3);
|
||
else
|
||
height=height*(sy/sx)/1.6; //adjust for aspect ratio, increase slightly for iPhone 5
|
||
}
|
||
|
||
// Correct for viewport scaling (iOS - Android 4.2 does not want this, at least on Galaxy Tab 3))
|
||
if(device.OS == 'iOS') {
|
||
height=height/util.getViewportScale();
|
||
}
|
||
|
||
// Correct for devicePixelratio - needed on Android 4.1.2 phones,
|
||
// for Opera, Chrome and Firefox, but not for native browser! Exclude native browser for Build 344.
|
||
if(device.OS == 'Android' && device.formFactor == 'phone' && 'devicePixelRatio' in window)
|
||
{
|
||
var bMatch=/Firefox|Chrome|OPR/;
|
||
if(bMatch.test(navigator.userAgent)) height = height*window.devicePixelRatio;
|
||
}
|
||
|
||
return height;
|
||
}
|
||
|
||
/**
|
||
* Get the wanted width of the OSK for touch devices
|
||
*
|
||
* @return {number} height in pixels
|
||
**/
|
||
osk.getWidth=function() {
|
||
// KeymanTouch - get OSK height from device
|
||
if(typeof(keymanweb['getOskWidth']) == 'function') {
|
||
return keymanweb['getOskWidth']();
|
||
}
|
||
|
||
var width: number;
|
||
if(util.device.OS == "iOS") {
|
||
// iOS does not interchange these values when the orientation changes!
|
||
//width = util.portraitView() ? screen.width : screen.height;
|
||
width = window.innerWidth;
|
||
} else if(device.OS == 'Android') {
|
||
try {
|
||
width=document.documentElement.clientWidth;
|
||
}
|
||
catch(ex) {
|
||
width=screen.availWidth;
|
||
}
|
||
} else {
|
||
width=screen.width;
|
||
}
|
||
|
||
return width;
|
||
}
|
||
|
||
/**
|
||
* Mouse down/mouse over event handler (desktop only)
|
||
*
|
||
* @param {Event} e mouse over/mouse down event object
|
||
*/
|
||
osk.mouseOverMouseDownHandler = function(e)
|
||
{
|
||
var t=util.eventTarget(e);
|
||
if(t === null || device.formFactor != 'desktop') return;
|
||
|
||
if(t.nodeName == 'SPAN') t=t.parentNode;
|
||
if(util.eventType(e) == 'mousedown')
|
||
{
|
||
osk.currentKey=t.id; osk._CancelMouse(e);
|
||
osk.highlightKey(t,true);
|
||
}
|
||
else if(t.id == osk.currentKey)
|
||
{
|
||
osk.highlightKey(t,true);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Mouse up/mouse out event handler (desktop only)
|
||
*
|
||
* @param {Event} e mouse up/out event object
|
||
*/
|
||
osk.mouseUpMouseOutHandler = function(e)
|
||
{
|
||
var t=util.eventTarget(e);
|
||
if(t === null || device.formFactor != 'desktop') return;
|
||
|
||
if(t.nodeName == 'SPAN') t=t.parentNode;
|
||
osk.highlightKey(t,false);
|
||
|
||
// Process as click if mouse button released anywhere over key
|
||
if(util.eventType(e) == 'mouseup')
|
||
{
|
||
if(t.id == osk.currentKey) osk.clickKey(t);
|
||
osk.currentKey='';
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Returns the default properties for a key object, used to construct
|
||
* both a base keyboard key and popup keys
|
||
*
|
||
* @return {Object} An object that contains default key properties
|
||
*/
|
||
osk.getDefaultKeyObject = function() {
|
||
return {
|
||
'text': '',
|
||
'width': '100',
|
||
'pad': '15',
|
||
'sp': '0',
|
||
'layer': null,
|
||
'nextlayer': null
|
||
};
|
||
};
|
||
|
||
/**
|
||
* Create the OSK for a particular keyboard and device
|
||
*
|
||
* @param {Object} layout OSK layout definition
|
||
* @param {string} formFactor layout form factor
|
||
* @return {Object} fully formatted OSK object
|
||
*/
|
||
osk.deviceDependentLayout=function(layout,formFactor)
|
||
{
|
||
var lDiv=util._CreateElement('DIV'),ls=lDiv.style,actualHeight=0;
|
||
|
||
// Set OSK box default style
|
||
lDiv.className='kmw-key-layer-group';
|
||
|
||
// Adjust OSK height for mobile and tablet devices TODO move outside this function???
|
||
switch(formFactor)
|
||
{
|
||
case 'phone':
|
||
case 'tablet':
|
||
actualHeight=osk.getHeight();
|
||
ls.height=actualHeight+'px';
|
||
break;
|
||
}
|
||
|
||
// Return empty DIV if no layout defined
|
||
if(layout == null) return lDiv;
|
||
|
||
// Set default OSK font size (Build 344, KMEW-90)
|
||
if(typeof(layout['fontsize']) == 'undefined' || layout['fontsize'] == null)
|
||
ls.fontSize='1em';
|
||
else
|
||
ls.fontSize=layout['fontsize'];
|
||
|
||
osk.fontSize=ls.fontSize; //TODO: move outside function*********
|
||
|
||
// Create a separate OSK div for each OSK layer, only one of which will ever be visible
|
||
var n,i,j,layers,layer,gDiv,rows,row,rowHeight,rDiv,keys,key,kDiv,pDiv,rs,ks,btn,bs,ps,gs;
|
||
|
||
layers=layout['layer'];
|
||
|
||
// Set key default attributes (must use exportable names!)
|
||
var tKey=osk.getDefaultKeyObject();
|
||
tKey['fontsize']=ls.fontSize;
|
||
|
||
// Identify key labels (e.g. *Shift*) that require the special OSK font
|
||
var specialLabel=/\*\w+\*/;
|
||
|
||
// ***Delete any empty rows at the end added by compiler bug...
|
||
for(n=0; n<layers.length; n++)
|
||
{
|
||
layer=layers[n]; rows=layer['row'];
|
||
for(i=rows.length; i>0; i--)
|
||
{
|
||
if(rows[i-1]['key'].length > 0) break;
|
||
}
|
||
if(i < rows.length) rows.splice(i-rows.length,rows.length-i);
|
||
}
|
||
// ...remove to here when compiler bug fixed ***
|
||
|
||
// Set the OSK row height, **assuming all layers have the same number of rows**
|
||
|
||
// Calculate default row height
|
||
rowHeight=100/rows.length;
|
||
|
||
// For desktop OSK, use a percentage of the OSK height
|
||
if(formFactor == 'desktop')
|
||
{
|
||
rowHeight=100/rows.length;
|
||
}
|
||
|
||
// Get the actual available document width and scale factor according to device type
|
||
var objectUnits, objectWidth;
|
||
if(formFactor == 'desktop') {
|
||
objectUnits = function(v) { return v + '%' };
|
||
objectWidth = 100;
|
||
} else {
|
||
objectUnits = function(v) { return Math.round(v)+'px' };
|
||
objectWidth = osk.getWidth();
|
||
}
|
||
|
||
if(device.touchable) // /*&& ('ontouchstart' in window)*/ // Except Chrome emulation doesn't set this.
|
||
{ // Not to mention, it's rather redundant.
|
||
lDiv.addEventListener('touchstart', osk.touch,true);
|
||
// The listener below fails to capture when performing automated testing checks in Chrome emulation unless 'true'.
|
||
lDiv.addEventListener('touchend', osk.release,true);
|
||
lDiv.addEventListener('touchmove', osk.moveOver,false);
|
||
//lDiv.addEventListener('touchcancel', osk.cancel,false); //event never generated by iOS
|
||
}
|
||
|
||
for(n=0; n<layers.length; n++)
|
||
{
|
||
layer=layers[n];
|
||
layer.aligned=false;
|
||
gDiv=util._CreateElement('DIV'),gs=gDiv.style;
|
||
gDiv.className='kmw-key-layer';
|
||
|
||
// Always make the first layer visible
|
||
gs.display=(n==0?'block':'none');
|
||
gs.height=ls.height;
|
||
|
||
// Set font for layer if defined in layout
|
||
if('font' in layout) gs.fontFamily=layout['font']; else gs.fontFamily='';
|
||
|
||
gDiv.layer=gDiv.nextLayer=layer['id'];
|
||
if(typeof layer['nextlayer'] == 'string') gDiv.nextLayer=layer['nextlayer'];
|
||
|
||
// Create a DIV for each row of the group
|
||
rows=layer['row'];
|
||
|
||
// Calculate the maximum row width (in layout units)
|
||
var totalWidth=0;
|
||
for(i=0; i<rows.length; i++)
|
||
{
|
||
var width=0;
|
||
row=rows[i]; keys=row['key'];
|
||
for(j=0; j<keys.length; j++)
|
||
{
|
||
key=keys[j];
|
||
|
||
// Test for a trailing comma included in spec, added as null object by IE
|
||
if(key == null)
|
||
{
|
||
keys.length = keys.length-1;
|
||
}
|
||
else
|
||
{
|
||
var kw, kp;
|
||
kw = (typeof key['width'] == 'string' && key['width'] != '') ? parseInt(key['width'],10) : 100;
|
||
if(isNaN(kw) || kw == 0) kw = 100;
|
||
key['width'] = kw.toString();
|
||
kp = (typeof key['pad'] == 'string' && key['pad'] != '') ? parseInt(key['pad'],10) : 15;
|
||
if(isNaN(kp) || kp == 0) kp = 15; // KMEW-119
|
||
key['pad'] = kp.toString();
|
||
width += kw + kp;
|
||
//if(typeof key['width'] == 'string' && key['width'] != '') width += parseInt(key['width'],10); else width += 100;
|
||
//if(typeof key['pad'] == 'string' && key['pad'] != '') width += parseInt(key['pad'],10); else width += 5;
|
||
}
|
||
}
|
||
if(width > totalWidth) totalWidth = width;
|
||
}
|
||
|
||
// Add default right margin
|
||
if(formFactor == 'desktop') {
|
||
totalWidth += 5; // KMEW-117
|
||
} else {
|
||
// TODO: Not entirely clear why this needs to be 15 instead of 5 on touch layouts. We probably have
|
||
// a miscalculation somewhere
|
||
totalWidth += 15;
|
||
}
|
||
|
||
for(i=0; i<rows.length; i++)
|
||
{
|
||
rDiv=util._CreateElement('DIV');
|
||
rDiv.className='kmw-key-row';
|
||
// The following event trap is needed to prevent loss of focus in IE9 when clicking on a key gap.
|
||
// Unclear why normal _CreateElement prevention of loss of focus does not seem to work here.
|
||
// Appending handler to event handler chain does not work (other event handling remains active).
|
||
rDiv.onmousedown=util.mouseDownPreventDefaultHandler; // Build 360
|
||
//util.attachDOMEvent(rDiv,'mousedown',function(e){if(e)e.preventDefault();
|
||
|
||
row=rows[i]; rs=rDiv.style;
|
||
|
||
// Set row height. (Phone and tablet heights are later recalculated
|
||
// and set in px, allowing for viewport scaling.)
|
||
rs.maxHeight=rs.height=rowHeight+'%';
|
||
|
||
// Apply defaults, setting the width and other undefined properties for each key
|
||
keys=row['key'];
|
||
for(j=0; j<keys.length; j++)
|
||
{
|
||
key=keys[j];
|
||
for(var tp in tKey)
|
||
{
|
||
if(typeof key[tp] != 'string') key[tp]=tKey[tp];
|
||
}
|
||
|
||
// Modify the key type for special keys with non-standard labels
|
||
// to allow the keyboard font to ovveride the SpecialOSK font.
|
||
// Blank keys are no longer reclassed - can use before/after CSS to add text
|
||
switch(key['sp'])
|
||
{
|
||
case '1':
|
||
if(!specialLabel.test(key['text']) && key['text'] != '') key['sp']='3';
|
||
break;
|
||
case '2':
|
||
if(!specialLabel.test(key['text']) && key['text'] != '') key['sp']='4';
|
||
break;
|
||
}
|
||
}
|
||
|
||
// Calculate actual key widths by summing defined widths and scaling each key to %,
|
||
// adjusting the width of the last key to make the total exactly 100%
|
||
// Save each percentage key width as a separate member (do *not* overwrite layout specified width!)
|
||
// NB: the 'percent' suffix is historical, units are percent on desktop devices, but pixels on touch devices
|
||
// All key widths and paddings are rounded for uniformity
|
||
var keyPercent,padPercent,totalPercent=0;
|
||
for(j=0; j<keys.length-1; j++)
|
||
{
|
||
keyPercent=Math.round(parseInt(keys[j]['width'],10)*objectWidth/totalWidth);
|
||
keys[j]['widthpc']=keyPercent;
|
||
padPercent=Math.round(parseInt(keys[j]['pad'],10)*objectWidth/totalWidth);
|
||
keys[j]['padpc']=padPercent;
|
||
totalPercent += padPercent+keyPercent;
|
||
}
|
||
|
||
// Allow for right OSK margin (15 layout units)
|
||
totalPercent += Math.round(15*objectWidth/totalWidth);
|
||
|
||
// If a single key, and padding is negative, add padding to right align the key
|
||
if(keys.length == 1 && parseInt(keys[0]['pad'],10) < 0)
|
||
{
|
||
keyPercent=Math.round(parseInt(keys[0]['width'],10)*objectWidth/totalWidth);
|
||
keys[0]['widthpc']=keyPercent;
|
||
totalPercent += keyPercent;
|
||
keys[0]['padpc']=(objectWidth-totalPercent);
|
||
}
|
||
else if(keys.length > 0)
|
||
{
|
||
j=keys.length-1;
|
||
padPercent=Math.round(parseInt(keys[j]['pad'],10)*objectWidth/totalWidth);
|
||
keys[j]['padpc']=padPercent;
|
||
totalPercent += padPercent;
|
||
keys[j]['widthpc']=(objectWidth-totalPercent);
|
||
}
|
||
|
||
//Create the key square (an outer DIV) for each key element with padding, and an inner DIV for the button (btn)
|
||
totalPercent=0;
|
||
for(j=0; j<keys.length; j++)
|
||
{
|
||
key=keys[j];
|
||
kDiv=util._CreateElement('DIV');
|
||
kDiv.keyId=key['id'];
|
||
kDiv.className='kmw-key-square';
|
||
ks=kDiv.style;
|
||
|
||
kDiv.width=ks.width=objectUnits(key['widthpc']);
|
||
|
||
if(formFactor != 'desktop')
|
||
{
|
||
// Regularize interkey spacing by rounding key width and padding (Build 390)
|
||
//keys[j]['padpc']=Math.round(keys[j]['padpc']);
|
||
//keys[j]['widthpc']=Math.round(keys[j]['widthpc']);
|
||
ks.left=objectUnits(totalPercent+keys[j]['padpc']);
|
||
ks.bottom=rs.bottom;
|
||
ks.height=rs.height; //must be specified in px for rest of layout to work correctly
|
||
}
|
||
else
|
||
{
|
||
ks.marginLeft=objectUnits(key['padpc']);
|
||
}
|
||
|
||
totalPercent=totalPercent+keys[j]['padpc']+keys[j]['widthpc'];
|
||
|
||
btn=util._CreateElement('DIV');
|
||
|
||
// Set button class
|
||
osk.setButtonClass(key,btn,layout);
|
||
|
||
// Set distinct phone and tablet button position properties
|
||
if(formFactor != 'desktop')
|
||
{
|
||
btn.style.left=ks.left;
|
||
btn.style.width=ks.width;
|
||
}
|
||
|
||
// Add the (US English) keycap label for desktop OSK or if KDU flag is non-zero
|
||
var q=null;
|
||
if(layout.keyLabels || (formFactor == 'desktop')) //desktop or KDU flag set
|
||
{
|
||
// Create the default key cap labels (letter keys, etc.)
|
||
var x=osk.keyCodes[key.id];
|
||
switch(x)
|
||
{
|
||
case 186: x=59; break;
|
||
case 187: x=61; break;
|
||
case 188: x=44; break;
|
||
case 189: x=45; break;
|
||
case 190: x=46; break;
|
||
case 191: x=47; break;
|
||
case 192: x=96; break;
|
||
case 219: x=91; break;
|
||
case 220: x=92; break;
|
||
case 221: x=93; break;
|
||
case 222: x=39; break;
|
||
default:
|
||
if(x < 48 || x > 90) x=0;
|
||
}
|
||
|
||
if(x > 0)
|
||
{
|
||
q=util._CreateElement('DIV');
|
||
q.className='kmw-key-label';
|
||
q.innerHTML=String.fromCharCode(x);
|
||
//kDiv.appendChild(q);
|
||
btn.appendChild(q);
|
||
}
|
||
}
|
||
|
||
// Define each key element id by layer id and key id (duplicate possible for SHIFT - does it matter?)
|
||
btn.id=layer['id']+'-'+key.id;
|
||
btn.key=key; //attach reference to key layout spec to element
|
||
|
||
// Add reference to subkey array if defined
|
||
if(typeof key['sk'] != 'undefined' && key['sk'] != null)
|
||
{
|
||
var bsn,bsk=btn.subKeys=key['sk'];
|
||
for(bsn=0; bsn<bsk.length; bsn++)
|
||
if(bsk[bsn]['sp'] == '1' || bsk[bsn]['sp'] == '2')
|
||
{
|
||
var oldText=bsk[bsn]['text'];
|
||
bsk[bsn]['text']=osk.renameSpecialKey(oldText);
|
||
}
|
||
}
|
||
else btn.subKeys=null;
|
||
|
||
// Define callbacks to handle key touches: iOS and Android tablets and phones
|
||
// TODO: replace inline function calls??
|
||
if(!device.touchable)
|
||
{
|
||
// Highlight key while mouse down or if moving back over originally selected key
|
||
btn.onmouseover=btn.onmousedown=osk.mouseOverMouseDownHandler; // Build 360
|
||
|
||
// Remove highlighting when key released or moving off selected element
|
||
btn.onmouseup=btn.onmouseout=osk.mouseUpMouseOutHandler; //Build 360
|
||
}
|
||
|
||
// Add OSK key labels
|
||
var t=util._CreateElement('SPAN'),ts=t.style;
|
||
if(key['text'] == null || key['text'] == '')
|
||
{
|
||
t.innerHTML='\xa0';
|
||
if(typeof key['id'] == 'string')
|
||
{
|
||
if(/^U_[0-9A-F]{4}$/i.test(key['id']))
|
||
t.innerHTML=String.fromCharCode(parseInt(key['id'].substr(2),16));
|
||
}
|
||
}
|
||
else t.innerHTML=key['text'];
|
||
t.className='kmw-key-text';
|
||
|
||
// Use special case lookup for modifier keys
|
||
if(key['sp'] == '1' || key['sp'] == '2')
|
||
{
|
||
var tId=((key['text'] == '*Tab*' && n == 1) ? '*TabLeft*' : key['text']);
|
||
t.innerHTML=osk.renameSpecialKey(tId);
|
||
}
|
||
|
||
//Override font spec if set for this key in the layout
|
||
if('font' in key) ts.fontFamily=key['font'];
|
||
if('fontsize' in key) ts.fontSize=key['fontsize'];
|
||
|
||
// Add text to button and button to placeholder div
|
||
btn.appendChild(t);
|
||
kDiv.appendChild(btn);
|
||
|
||
// Prevent user selection of key captions
|
||
//t.style.webkitUserSelect='none';
|
||
|
||
// If a subkey array is defined, add an icon
|
||
if(typeof(key['sk']) != 'undefined' && key['sk'] != null)
|
||
{
|
||
var skIcon=util._CreateElement('DIV');
|
||
skIcon.className='kmw-key-popup-icon';
|
||
//kDiv.appendChild(skIcon);
|
||
btn.appendChild(skIcon);
|
||
}
|
||
// Add key to row
|
||
rDiv.appendChild(kDiv);
|
||
}
|
||
// Add row to layer
|
||
gDiv.appendChild(rDiv);
|
||
}
|
||
// Add layer to group
|
||
lDiv.appendChild(gDiv);
|
||
}
|
||
return lDiv;
|
||
}
|
||
|
||
/**
|
||
* Replace default key names by special font codes for modifier keys
|
||
*
|
||
* @param {string} oldText
|
||
* @return {string}
|
||
**/
|
||
osk.renameSpecialKey = function(oldText) {
|
||
// If a 'special key' mapping exists for the text, replace it with its corresponding special OSK character.
|
||
return osk.specialCharacters[oldText] ? String.fromCharCode(0XE000 + osk.specialCharacters[oldText]) : oldText;
|
||
}
|
||
|
||
osk.clearPopup = function()
|
||
{
|
||
// Remove the displayed subkey array, if any, and cancel popup request
|
||
var sk=document.getElementById('kmw-popup-keys');
|
||
if(sk != null)
|
||
{
|
||
if(sk.shim) osk._Box.removeChild(sk.shim);
|
||
sk.parentNode.removeChild(sk);
|
||
}
|
||
|
||
if(osk.popupCallout) osk._Box.removeChild(osk.popupCallout);
|
||
osk.popupCallout = null;
|
||
|
||
if(osk.subkeyDelayTimer)
|
||
{
|
||
window.clearTimeout(osk.subkeyDelayTimer);
|
||
osk.subkeyDelayTimer = null;
|
||
}
|
||
osk.popupBaseKey = null;
|
||
}
|
||
|
||
/**
|
||
* OSK touch start event handler
|
||
*
|
||
* @param {Event} e touch start event object
|
||
*
|
||
*/
|
||
osk.touch = function(e)
|
||
{
|
||
// Identify the key touched
|
||
var t = e.changedTouches[0].target, key = osk.keyTarget(t);
|
||
|
||
// Save the touch point
|
||
osk.touchX = e.changedTouches[0].pageX;
|
||
|
||
// Set the key for the new touch point to be current target, if defined
|
||
osk.currentTarget = key;
|
||
|
||
// Prevent multi-touch if popup displayed
|
||
var sk = document.getElementById('kmw-popup-keys');
|
||
if((sk && sk.style.visibility == 'visible') || osk.popupVisible) return;
|
||
|
||
// Keep track of number of active (unreleased) touch points
|
||
osk.touchCount = e.touches.length;
|
||
|
||
// Get nearest key if touching a hidden key or the end of a key row
|
||
if((key && (key.className.indexOf('key-hidden') >= 0))
|
||
|| t.className.indexOf('kmw-key-row') >= 0) {
|
||
key = osk.findNearestKey(e,t);
|
||
}
|
||
// Do not do anything if no key identified!
|
||
if(key == null) {
|
||
return;
|
||
}
|
||
|
||
// Get key name (K_...) from element ID
|
||
var keyIdComponents = key.id.split('-');
|
||
var keyName=keyIdComponents[keyIdComponents.length-1];
|
||
|
||
// Highlight the touched key
|
||
osk.highlightKey(key,true);
|
||
|
||
// Special function keys need immediate action
|
||
if(keyName == 'K_LOPT' || keyName == 'K_ROPT')
|
||
{
|
||
window.setTimeout(function(){osk.clickKey(key);},0);
|
||
osk.keyPending = null;
|
||
}
|
||
// Also backspace, to allow delete to repeat while key held
|
||
else if(keyName == 'K_BKSP') {
|
||
// While we could inline the execution of the delete key here, we lose the ability to
|
||
// record the backspace key if we do so.
|
||
osk.clickKey(key);
|
||
osk.deleteKey = key;
|
||
osk.deleting = window.setTimeout(osk.repeatDelete,500);
|
||
osk.keyPending = null;
|
||
} else {
|
||
if(osk.keyPending) {
|
||
osk.highlightKey(osk.keyPending,false);
|
||
osk.clickKey(osk.keyPending);
|
||
osk.clearPopup();
|
||
// Decrement the number of unreleased touch points to prevent
|
||
// sending the keystroke again when the key is actually released
|
||
osk.touchCount--;
|
||
} else {
|
||
// If this key has subkey, start timer to display subkeys after delay, set up release
|
||
osk.touchHold(key);
|
||
//if(key.subKeys != null) osk.subkeyDelayTimer=window.setTimeout(function(){osk.showSubKeys(key);},osk.popupDelay);
|
||
}
|
||
osk.keyPending = key;
|
||
}
|
||
}
|
||
|
||
/**
|
||
* OSK touch release event handler
|
||
*
|
||
* @param {Event} e touch release event object
|
||
*
|
||
**/
|
||
osk.release = function(e)
|
||
{
|
||
// Prevent incorrect multi-touch behaviour if native or device popup visible
|
||
var sk = document.getElementById('kmw-popup-keys'), t = osk.currentTarget;
|
||
if((sk && sk.style.visibility == 'visible') || osk.popupVisible)
|
||
{
|
||
// Ignore release if a multiple touch
|
||
if(e.touches.length > 0) return;
|
||
|
||
// Cancel (but do not execute) pending key if neither a popup key or the base key
|
||
if((t == null) || ((t.id.indexOf('popup') < 0) && (t.id != osk.popupBaseKey.id)))
|
||
{
|
||
osk.highlightKey(osk.keyPending,false);
|
||
osk.clearPopup();
|
||
osk.keyPending = null;
|
||
}
|
||
}
|
||
|
||
// Handle menu key release event
|
||
if(t && t.id) osk.optionKey(e,t.id,false);
|
||
|
||
// Test if moved off screen (effective release point must be corrected for touch point horizontal speed)
|
||
// This is not completely effective and needs some tweaking, especially on Android
|
||
var x = e.changedTouches[0].pageX,
|
||
beyondEdge = ((x < 2 && osk.touchX > 5) ||
|
||
(x > window.innerWidth - 2 && osk.touchX < window.innerWidth - 5));
|
||
|
||
// Save then decrement current touch count
|
||
var tc=osk.touchCount;
|
||
if(osk.touchCount > 0) osk.touchCount--;
|
||
|
||
// Process and clear highlighting of pending target
|
||
if(osk.keyPending)
|
||
{
|
||
osk.highlightKey(osk.keyPending,false);
|
||
|
||
// Output character unless moved off key
|
||
if(osk.keyPending.className.indexOf('hidden') < 0 &&
|
||
tc > 0 && !beyondEdge) osk.clickKey(osk.keyPending);
|
||
osk.clearPopup();
|
||
osk.keyPending = null;
|
||
}
|
||
// Always clear highlighting of current target on release (multi-touch)
|
||
else
|
||
{
|
||
var tt = e.changedTouches[0];
|
||
t = osk.keyTarget(tt.target);
|
||
if(!t)
|
||
{
|
||
var t1 = document.elementFromPoint(tt.clientX,tt.clientY);
|
||
t = osk.findNearestKey(e,t1);
|
||
}
|
||
osk.highlightKey(t,false);
|
||
}
|
||
|
||
// Clear repeated backspace if active
|
||
if(osk.deleting) window.clearTimeout(osk.deleting);
|
||
osk.deleting = 0;
|
||
}
|
||
|
||
/**
|
||
* OSK touch move event handler
|
||
*
|
||
* @param {Event} e touch move event object
|
||
*
|
||
**/
|
||
osk.moveOver = function(e)
|
||
{
|
||
e.preventDefault(); e.cancelBubble=true;
|
||
if(typeof e.stopImmediatePropagation == 'function') e.stopImmediatePropagation();
|
||
else if(typeof e.stopPropagation == 'function') e.stopPropagation();
|
||
|
||
// Do not attempt to support reselection of target key for overlapped keystrokes
|
||
if(e.touches.length > 1 || osk.touchCount == 0) return;
|
||
|
||
// Get touch position
|
||
var x=typeof e.touches == 'object' ? e.touches[0].clientX : e.clientX,
|
||
y=typeof e.touches == 'object' ? e.touches[0].clientY : e.clientY;
|
||
|
||
// Move target key and highlighting
|
||
var t = e.changedTouches[0],
|
||
t1 = document.elementFromPoint(x,y),
|
||
key0 = osk.keyPending,
|
||
key1 = osk.keyTarget(t1);
|
||
|
||
// Find the nearest key to the touch point if not on a visible key
|
||
if((key1 && key1.className.indexOf('key-hidden') >= 0) ||
|
||
(t1 && (!key1) && t1.className.indexOf('key-row') >= 0))
|
||
{
|
||
key1 = osk.findNearestKey(e,t1);
|
||
}
|
||
|
||
// Stop repeat if no longer on BKSP key
|
||
if(key1 && (typeof key1.id == 'string') && (key1.id.indexOf('BKSP') < 0))
|
||
{
|
||
if(osk.deleting) window.clearTimeout(osk.deleting);
|
||
osk.deleting = 0;
|
||
}
|
||
|
||
// Do not move over keys if device popup visible
|
||
if(osk.popupVisible)
|
||
{
|
||
if(key1 == null)
|
||
{
|
||
if(key0) osk.highlightKey(key0,false);
|
||
osk.keyPending=null;
|
||
}
|
||
else
|
||
{
|
||
if(key1 == osk.popupBaseKey)
|
||
{
|
||
if(!osk.hasClass(key1,'kmw-key-touched')) osk.highlightKey(key1,true);
|
||
osk.keyPending = key1;
|
||
}
|
||
else
|
||
{
|
||
if(key0) osk.highlightKey(key0,false);
|
||
osk.keyPending = null;
|
||
}
|
||
}
|
||
return;
|
||
}
|
||
|
||
// Use the popup duplicate of the base key if a phone with a visible popup array
|
||
var sk=document.getElementById('kmw-popup-keys');
|
||
if(sk && sk.style.visibility == 'visible'
|
||
&& device.formFactor == 'phone' && key1 == osk.popupBaseKey)
|
||
{
|
||
key1 = sk.childNodes[0].firstChild;
|
||
}
|
||
|
||
// Identify current touch position (to manage off-key release)
|
||
osk.currentTarget = key1;
|
||
|
||
// Clear previous key highlighting
|
||
if(key0 && key1 && (key1.id != key0.id)) osk.highlightKey(key0,false);
|
||
|
||
// If popup is visible, need to move over popup, not over main keyboard
|
||
osk.highlightSubKeys(key1,x,y);
|
||
|
||
if(sk && sk.style.visibility == 'visible')
|
||
{
|
||
if(key1 && key1.id.indexOf('popup') < 0 && key1 != osk.popupBaseKey) return;
|
||
if(key1 && key1 == osk.popupBaseKey && key1.className.indexOf('kmw-key-touched') < 0) osk.highlightKey(key1,true);
|
||
}
|
||
// Cancel touch if moved up and off keyboard, unless popup keys visible
|
||
else
|
||
{
|
||
var yMin = Math.max(5,osk._Box.offsetTop - 0.25*osk._Box.offsetHeight);
|
||
if(key0 && e.touches[0].pageY < Math.max(5,osk._Box.offsetTop - 0.25*osk._Box.offsetHeight))
|
||
{
|
||
osk.highlightKey(key0,false); osk.showKeyTip(null,false); osk.keyPending = null;
|
||
}
|
||
}
|
||
|
||
// Replace the target key, if any, by the new target key
|
||
// Do not replace a null target, as that indicates the key has already been released
|
||
if(key1 && osk.keyPending) osk.keyPending = key1;
|
||
|
||
if(osk.keyPending)
|
||
{
|
||
if(key0 != key1 || key1.className.indexOf('kmw-key-touched') < 0) osk.highlightKey(key1,true);
|
||
}
|
||
|
||
if(key0 && key1 && (key1 != key0) && (key1.id != ''))
|
||
{
|
||
// Display the touch-hold keys (after a pause)
|
||
osk.touchHold(key1);
|
||
/*
|
||
// Clear and restart the popup timer
|
||
if(osk.subkeyDelayTimer)
|
||
{
|
||
window.clearTimeout(osk.subkeyDelayTimer);
|
||
osk.subkeyDelayTimer = null;
|
||
}
|
||
if(key1.subKeys != null)
|
||
{
|
||
osk.subkeyDelayTimer = window.setTimeout(
|
||
function()
|
||
{
|
||
osk.clearPopup();
|
||
osk.showSubKeys(key1);
|
||
},
|
||
osk.popupDelay);
|
||
}
|
||
*/
|
||
}
|
||
}
|
||
|
||
// osk.cancel = function(e) {} //cancel event is never generated by iOS
|
||
|
||
/**
|
||
* More reliable way of identifying element class
|
||
* @param {Object} e HTML element
|
||
* @param {string} name class name
|
||
* @return {boolean}
|
||
*/
|
||
osk.hasClass = function(e, name)
|
||
{
|
||
var className = " " + name + " ";
|
||
return (" " + e.className + " ").replace(/[\n\t\r\f]/g, " ").indexOf(className) >= 0;
|
||
}
|
||
|
||
/**
|
||
* Get the current key target from the touch point element within the key
|
||
*
|
||
* @param {Object} t element at touch point
|
||
* @return {Object} the key element (or null)
|
||
**/
|
||
osk.keyTarget = function(t)
|
||
{
|
||
try {
|
||
if(t)
|
||
{
|
||
if(osk.hasClass(t,'kmw-key')) return t;
|
||
if(t.parentNode && osk.hasClass(t.parentNode,'kmw-key')) return t.parentNode;
|
||
if(t.firstChild && osk.hasClass(t.firstChild,'kmw-key')) return t.firstChild;
|
||
}
|
||
} catch(ex){}
|
||
return null;
|
||
}
|
||
|
||
/**
|
||
* Identify the key nearest to the touch point if at the end of a key row,
|
||
* but return null more than about 0.6 key width from the nearest key.
|
||
*
|
||
* @param {Event} e touch event
|
||
* @param {Object} t HTML object at touch point
|
||
* @return {Object} nearest key to touch point
|
||
*
|
||
**/
|
||
osk.findNearestKey = function(e,t)
|
||
{
|
||
if((!e) || (typeof e.changedTouches == 'undefined')
|
||
|| (e.changedTouches.length == 0)) return null;
|
||
|
||
// Get touch point on screen
|
||
var x = e.changedTouches[0].pageX;
|
||
|
||
// Get key-row beneath touch point
|
||
while(t && t.className.indexOf('key-row') < 0) t = t.parentNode;
|
||
if(!t) return null;
|
||
|
||
// Find minimum distance from any key
|
||
var k, k0=0, dx, dxMax=24, dxMin=100000, x1, x2;
|
||
for(k = 0; k < t.childNodes.length; k++)
|
||
{
|
||
if(t.childNodes[k].firstChild.className.indexOf('key-hidden') >= 0) continue;
|
||
x1 = t.childNodes[k].firstChild.offsetLeft;
|
||
x2 = x1 + t.childNodes[k].firstChild.offsetWidth;
|
||
dx =x1 - x;
|
||
if(dx >= 0 && dx < dxMin)
|
||
{
|
||
k0 = k; dxMin = dx;
|
||
}
|
||
dx = x - x2;
|
||
if(dx >= 0 && dx < dxMin)
|
||
{
|
||
k0 = k; dxMin = dx;
|
||
}
|
||
}
|
||
if(dxMin < 100000)
|
||
{
|
||
t = t.childNodes[k0].firstChild;
|
||
x1 = t.offsetLeft;
|
||
x2 = x1 + t.offsetWidth;
|
||
|
||
// Limit extended touch area to the larger of 0.6 of key width and 24 px
|
||
if(t.offsetWidth > 40) dxMax = 0.6 * t.offsetWidth;
|
||
if(((x1 - x) >= 0 && (x1 - x) < dxMax) ||
|
||
((x - x2) >= 0 && (x - x2) < dxMax))
|
||
return t;
|
||
}
|
||
return null;
|
||
}
|
||
|
||
/**
|
||
* Repeat backspace as long as the backspace key is held down
|
||
**/
|
||
osk.repeatDelete = function() {
|
||
if(osk.deleting) {
|
||
osk.clickKey(osk.deleteKey);
|
||
osk.deleting = window.setTimeout(osk.repeatDelete,100);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Attach appropriate class to each key button, according to the layout
|
||
*
|
||
* @param {Object} key key object
|
||
* @param {Object} btn button object
|
||
* @param {Object=} layout source layout description (optional, sometimes)
|
||
*/
|
||
osk.setButtonClass = function(key,btn,layout) {
|
||
var n=0, keyTypes=['default','shift','shift-on','special','special-on','','','','deadkey','blank','hidden'];
|
||
if(typeof key['dk'] == 'string' && key['dk'] == '1') {
|
||
n=8;
|
||
}
|
||
|
||
if(typeof key['sp'] == 'string') {
|
||
n=parseInt(key['sp'],10);
|
||
}
|
||
|
||
if(n < 0 || n > 10) {
|
||
n=0;
|
||
}
|
||
|
||
layout=layout||osk.layout;
|
||
|
||
// Apply an overriding class for 5-row layouts
|
||
var nRows=layout['layer'][0]['row'].length;
|
||
if(nRows > 4 && util.device.formFactor == 'phone') {
|
||
btn.className='kmw-key kmw-5rows kmw-key-'+keyTypes[n];
|
||
} else {
|
||
btn.className='kmw-key kmw-key-'+keyTypes[n];
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Converts the legacy BK property from pre 10.0 into the KLS keyboard layer spec format,
|
||
* sparsifying it as possible to pre-emptively check invalid layers.
|
||
*
|
||
* @param {Array} BK keyboard object (as loaded)
|
||
* @return {Object}
|
||
*/
|
||
osk.processLegacyDefinitions = function(BK) {
|
||
//['default','shift','ctrl','shiftctrl','alt','shiftalt','ctrlalt','shiftctrlalt'];
|
||
var idList=osk.generateLayerIds(false); // Non-chiral.
|
||
|
||
var KLS = {};
|
||
|
||
// The old default: eight auto-managed layers...
|
||
for(var n=0; n<idList.length; n++) {
|
||
var id = idList[n], arr = [], valid = false;
|
||
|
||
// ... with keycode mappings in blocks of 65.
|
||
for(var k=0; k < 65; k++) {
|
||
var index = k + 65 * n;
|
||
arr.push(BK[index]);
|
||
|
||
// The entry for K_SPACE's keycode tends to hold ' ' instead of '', which causes
|
||
// the whole layer to be treated as 'valid' if not included in the conditional.
|
||
if(index < BK.length && BK[index] != '' && k != dfltCodes.indexOf('K_SPACE')) {
|
||
valid = true;
|
||
}
|
||
}
|
||
|
||
if(valid) {
|
||
KLS[id] = arr;
|
||
}
|
||
}
|
||
|
||
// There must always be at least a plain 'default' layer. Array(65).fill('') would be preferable but isn't supported on IE,
|
||
// but buildDefaultLayer will set the defaults for these layers if no entry exists for them in the array due to length.
|
||
if(typeof KLS['default'] == 'undefined' || ! KLS['default']) {
|
||
KLS['default'] = [''];
|
||
}
|
||
|
||
// There must always be at least a plain 'shift' layer.
|
||
if(typeof KLS['shift'] == 'undefined' || ! KLS['shift']) {
|
||
KLS['shift'] = [''];
|
||
}
|
||
|
||
return KLS;
|
||
}
|
||
|
||
/**
|
||
* Sets a formatting property for the modifier keys when constructing a default layout for a keyboard.
|
||
*
|
||
* @param {Object} layer // One layer specification
|
||
* @param {boolean} chiral // Whether or not the keyboard uses chiral modifier information.
|
||
* @param {string} formFactor // The form factor of the device the layout is being constructed for.
|
||
* @param {boolean} key102 // Whether or not the extended key 102 should be hidden.
|
||
*/
|
||
osk.formatDefaultLayer = function(layer, chiral, formFactor, key102) {
|
||
var layerId = layer['id'];
|
||
|
||
// Correct appearance of state-dependent modifier keys according to group
|
||
for(var i=0; i<layer['row'].length; i++) {
|
||
var row=layer['row'][i];
|
||
var keys=row['key'];
|
||
for(var j=0; j<keys.length; j++) {
|
||
var key=keys[j];
|
||
switch(key['id']) {
|
||
case 'K_SHIFT':
|
||
case 'K_LSHIFT':
|
||
case 'K_RSHIFT':
|
||
if(layerId.indexOf('shift') != -1) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
if((formFactor != 'desktop') && (layerId != 'default')) {
|
||
key['nextlayer']='default';
|
||
}
|
||
break;
|
||
case 'K_LCTRL':
|
||
case 'K_LCONTROL':
|
||
if(chiral) {
|
||
if(layerId.indexOf('leftctrl') != -1) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
break;
|
||
}
|
||
case 'K_RCTRL':
|
||
case 'K_RCONTROL':
|
||
if(chiral) {
|
||
if(layerId.indexOf('rightctrl') != -1) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
break;
|
||
}
|
||
case 'K_CONTROL':
|
||
if(layerId.indexOf('ctrl') != -1) {
|
||
if(!chiral || (layerId.indexOf('leftctrl') != -1 && layerId.indexOf('rightctrl') != -1)) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
}
|
||
break;
|
||
case 'K_LALT':
|
||
if(chiral) {
|
||
if(layerId.indexOf('leftalt') != -1) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
break;
|
||
}
|
||
case 'K_RALT':
|
||
if(chiral) {
|
||
if(layerId.indexOf('rightalt') != -1) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
break;
|
||
}
|
||
case 'K_ALT':
|
||
if(layerId.indexOf('alt') != -1) {
|
||
if(!chiral || (layerId.indexOf('leftalt') != -1 && layerId.indexOf('rightalt') != -1)) {
|
||
key['sp'] = osk.buttonClasses['SHIFT-ON'];
|
||
}
|
||
}
|
||
break;
|
||
case 'K_oE2':
|
||
if(typeof key102 == 'undefined' || !key102) {
|
||
if(formFactor == 'desktop') {
|
||
keys.splice(j--, 1);
|
||
keys[0]['width']='200';
|
||
} else {
|
||
keys[j]['sp']=osk.buttonClasses['HIDDEN'];
|
||
}
|
||
}
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Generates a list of potential layer ids for the specified chirality mode.
|
||
*
|
||
* @param {boolean|number} chiral // Does the keyboard use chiral modifiers or not?
|
||
*/
|
||
osk.generateLayerIds = function(chiral) {
|
||
var layerCnt, offset;
|
||
|
||
if(chiral) {
|
||
layerCnt=32;
|
||
offset=0x01;
|
||
} else {
|
||
layerCnt=8;
|
||
offset=0x10;
|
||
}
|
||
|
||
var layerIds = [];
|
||
|
||
for(var i=0; i < layerCnt; i++) {
|
||
layerIds.push(osk.getLayerId(i * offset));
|
||
}
|
||
|
||
return layerIds;
|
||
}
|
||
|
||
/**
|
||
* Signifies whether or not the OSK facilitates AltGr / Right-alt emulation for this keyboard.
|
||
* @param {Object=} keyLabels
|
||
* @return {boolean}
|
||
*/
|
||
osk.emulatesAltGr = function(keyLabels) {
|
||
var layers = keyLabels ? keyLabels : osk.layers;
|
||
|
||
return !(layers[osk.getLayerId(osk.modifierCodes['LCTRL'] | osk.modifierCodes['LALT'])] ||
|
||
layers[osk.getLayerId(osk.modifierCodes['SHIFT'] | osk.modifierCodes['LCTRL'] | osk.modifierCodes['LALT'])]);
|
||
}
|
||
|
||
/**
|
||
* Build a default layout for keyboards with no explicit layout
|
||
*
|
||
* @param {Object} PVK keyboard object (as loaded)
|
||
* @param {Number} kbdBitmask keyboard modifier bitmask
|
||
* @param {string} formFactor
|
||
* @return {Object}
|
||
*/
|
||
osk.buildDefaultLayout = function(PVK,kbdBitmask,formFactor)
|
||
{
|
||
var layout;
|
||
|
||
// Build a layout using the default for the device
|
||
var layoutType=formFactor, dfltLayout=keymanweb['dfltLayout'];
|
||
if(typeof dfltLayout[layoutType] != 'object') {
|
||
layoutType = 'desktop';
|
||
}
|
||
|
||
// Clone the default layout object for this device
|
||
layout=util.deepCopy(dfltLayout[layoutType]);
|
||
|
||
var n,layers=layout['layer'], keyLabels=PVK['KLS'], key102=PVK['K102'];
|
||
var i, j, k, m, row, rows, key, keys;
|
||
var chiral = (kbdBitmask & osk.modifierBitmasks.IS_CHIRAL);
|
||
|
||
var kmw10Plus = !(typeof keyLabels == 'undefined' || !keyLabels);
|
||
if(!kmw10Plus) {
|
||
keyLabels = osk.processLegacyDefinitions(PVK['BK']);
|
||
}
|
||
|
||
// Identify key labels (e.g. *Shift*) that require the special OSK font
|
||
var specialLabel=/\*\w+\*/;
|
||
|
||
// *** Step 1: instantiate the layer objects. ***
|
||
|
||
// Get the list of valid layers, enforcing that the 'default' layer must be the first one processed.
|
||
var validIdList = Object.getOwnPropertyNames(keyLabels), invalidIdList = [];
|
||
validIdList.splice(validIdList.indexOf('default'), 1);
|
||
validIdList = [ 'default' ].concat(validIdList);
|
||
|
||
// Automatic AltGr emulation if the 'leftctrl-leftalt' layer is otherwise undefined.
|
||
if(osk.emulatesAltGr(keyLabels) && validIdList.indexOf('rightalt') != -1) {
|
||
validIdList.push('leftctrl-leftalt');
|
||
keyLabels['leftctrl-leftalt'] = keyLabels['rightalt'];
|
||
}
|
||
|
||
// For desktop devices, we must create all layers, even if invalid.
|
||
if(formFactor == 'desktop') {
|
||
invalidIdList = osk.generateLayerIds(chiral);
|
||
|
||
// Filter out all ids considered valid. (We also don't want duplicates in the following list...)
|
||
for(n=0; n<invalidIdList.length; n++) {
|
||
if(validIdList.indexOf(invalidIdList[n]) != -1) {
|
||
invalidIdList.splice(n--, 1);
|
||
}
|
||
}
|
||
}
|
||
|
||
var idList = validIdList.concat(invalidIdList);
|
||
|
||
if(kmw10Plus && formFactor != 'desktop') { // KLS exists, so we know the exact layer set.
|
||
// Find the SHIFT key...
|
||
var shiftKey = null;
|
||
|
||
rows = layers[0]['row'];
|
||
for(var r=0; r < rows.length; r++) {
|
||
keys = rows[r]['key'];
|
||
for(var c=0; c < keys.length; c++) {
|
||
key = keys[c];
|
||
if(key['id'] == 'K_SHIFT') {
|
||
shiftKey = key;
|
||
}
|
||
}
|
||
}
|
||
|
||
if(shiftKey) {
|
||
// Erase the legacy shifted subkey array.
|
||
shiftKey['sk'] = [];
|
||
|
||
for(var layerID in keyLabels) {
|
||
if(layerID == 'default' || layerID == 'shift') {
|
||
// These two are accessible from the layer without subkeys.
|
||
continue;
|
||
}
|
||
|
||
// Create a new subkey for the specified layer so that it will be accessible via OSK.
|
||
var specialChar = osk.modifierSpecials[layerID];
|
||
shiftKey['sk'].push(new com.keyman.OSKKeySpec("K_" + specialChar, specialChar, null, "1", layerID));
|
||
}
|
||
} else {
|
||
// Seriously, this should never happen. It's here for the debugging log only.
|
||
console.warn("Error in default layout - cannot find default Shift key!");
|
||
}
|
||
}
|
||
|
||
for(n=0; n<idList.length; n++) {
|
||
// Populate non-default (shifted) keygroups
|
||
if(n > 0) {
|
||
layers[n]=util.deepCopy(layers[0]);
|
||
}
|
||
layers[n]['id']=idList[n];
|
||
layers[n]['nextlayer']=idList[n]; // This would only be different for a dynamic keyboard
|
||
|
||
// Extraced into a helper method to improve readability.
|
||
osk.formatDefaultLayer(layers[n], chiral != 0, formFactor, !!key102);
|
||
}
|
||
|
||
// *** Step 2: Layer objects now exist; time to fill them with the appropriate key labels and key styles ***
|
||
for(n=0; n<layers.length; n++)
|
||
{
|
||
var layer=layers[n], kx, shiftKey=null, nextKey=null, allText='';
|
||
var capsKey = null, numKey = null, scrollKey = null; // null if not in the OSK layout.
|
||
var layerSpec = keyLabels[layer['id']];
|
||
var isShift = layer['id'] == 'shift' ? 1 : 0;
|
||
var isDefault = layer['id'] == 'default' || isShift ? 1 : 0;
|
||
|
||
rows=layer['row'];
|
||
for(i=0; i<rows.length; i++)
|
||
{
|
||
keys=rows[i]['key'];
|
||
for(j=0; j<keys.length; j++)
|
||
{
|
||
key=keys[j];
|
||
kx=dfltCodes.indexOf(key['id']);
|
||
|
||
// Only create keys for defined layers. ('default' and 'shift' are always defined.)
|
||
if(layerSpec || isDefault) {
|
||
// Get keycap text from visual keyboard array, if defined in keyboard
|
||
if(layerSpec) {
|
||
if(kx >= 0 && kx < layerSpec.length) key['text']=layerSpec[kx];
|
||
}
|
||
|
||
// Fall back to US English keycap text as default for the base two layers if not otherwise defined.
|
||
// (Any 'ghost' keys must be explicitly defined in layout for these layers.)
|
||
if(isDefault) {
|
||
if((key['text'] == '' || typeof key['text'] == 'undefined') && key['id'] != 'K_SPACE' && kx+65 * isShift < dfltText.length) {
|
||
key['text']=dfltText[kx+65*isShift];
|
||
}
|
||
}
|
||
}
|
||
|
||
// Leave any unmarked key caps as null strings
|
||
if(typeof(key['text']) == 'undefined') {
|
||
key['text']='';
|
||
}
|
||
// Detect important tracking keys.
|
||
switch(key['id']) {
|
||
case "K_SHIFT":
|
||
shiftKey=key;
|
||
break;
|
||
case "K_TAB":
|
||
nextKey=key;
|
||
break;
|
||
case "K_CAPS":
|
||
capsKey=key;
|
||
break;
|
||
case "K_NUMLOCK":
|
||
numKey=key;
|
||
break;
|
||
case "K_SCROLL":
|
||
scrollKey=key;
|
||
break;
|
||
}
|
||
|
||
// Remove pop-up shift keys referencing invalid layers (Build 349)
|
||
if(key['sk'] != null) {
|
||
for(k=0; k<key['sk'].length; k++) {
|
||
if(validIdList.indexOf(key['sk'][k]['nextlayer']) == -1) {
|
||
key['sk'].splice(k--, 1);
|
||
}
|
||
}
|
||
|
||
if(key['sk'].length == 0) {
|
||
key['sk']=null;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// We're done with the layer keys initialization pass. Time to do post-analysis layer-level init where necessary.
|
||
layer.shiftKey=shiftKey;
|
||
layer.capsKey=capsKey;
|
||
layer.numKey=numKey;
|
||
layer.scrollKey=scrollKey;
|
||
|
||
// Set modifier key appearance and behaviour for non-desktop devices using the default layout
|
||
if(formFactor != 'desktop') {
|
||
if(n > 0 && shiftKey != null) {
|
||
shiftKey['sp']=osk.buttonClasses['SHIFT-ON'];
|
||
shiftKey['sk']=null;
|
||
shiftKey['text'] = osk.modifierSpecials[layers[n].id] ? osk.modifierSpecials[layers[n].id] : "*Shift*";
|
||
}
|
||
}
|
||
}
|
||
|
||
return layout;
|
||
}
|
||
|
||
/**
|
||
* Function _GenerateVisualKeyboard
|
||
* Scope Private
|
||
* @param {Object} PVK Visual keyboard name
|
||
* @param {Object} Lhelp true if OSK defined for this keyboard
|
||
* @param {Object} layout0
|
||
* @param {Number} kbdBitmask Keyboard modifier bitmask
|
||
* Description Generates the visual keyboard element and attaches it to KMW
|
||
*/
|
||
osk._GenerateVisualKeyboard = function(PVK,Lhelp,layout0,kbdBitmask)
|
||
{
|
||
var Ldiv,LdivC,layout=layout0;
|
||
var Lkbd=util._CreateElement('DIV'), oskWidth;//s=Lkbd.style,
|
||
var activeKeyboard = keymanweb.keyboardManager.activeKeyboard;
|
||
|
||
// Build a layout using the default for the device
|
||
if(typeof layout != 'object' || layout == null)
|
||
layout=osk.buildDefaultLayout(PVK,kbdBitmask,device.formFactor);
|
||
|
||
// Create the collection of HTML elements from the device-dependent layout object
|
||
osk.layout=layout;
|
||
osk.layers=layout['layer'];
|
||
|
||
// Override font if specified by keyboard
|
||
if('font' in layout) osk.fontFamily=layout['font']; else osk.fontFamily='';
|
||
|
||
// Set flag to add default (US English) key label if specified by keyboard
|
||
layout.keyLabels=activeKeyboard && ((typeof(activeKeyboard['KDU']) != 'undefined') && activeKeyboard['KDU']);
|
||
LdivC=osk.deviceDependentLayout(layout,device.formFactor);
|
||
|
||
osk.ddOSK = true;
|
||
|
||
// Append the OSK layer group container element to the containing element
|
||
osk.keyMap = LdivC; Lkbd.appendChild(LdivC);
|
||
|
||
// Set base class and box class - OS and keyboard added for Build 360
|
||
osk._DivVKbdHelp = osk._DivVKbd = Lkbd;
|
||
osk._Box.className=device.formFactor+' '+device.OS.toLowerCase()+' kmw-osk-frame';
|
||
Lkbd.className=device.formFactor+' kmw-osk-inner-frame';
|
||
|
||
// Add header element to OSK only for desktop browsers
|
||
if(device.formFactor == 'desktop')
|
||
osk._Box.appendChild(osk.controlBar());
|
||
|
||
// Add primary keyboard element to OSK
|
||
osk._Box.appendChild(Lkbd);
|
||
|
||
// Add footer element to OSK only for desktop browsers
|
||
if(device.formFactor == 'desktop')
|
||
osk._Box.appendChild(osk.resizeBar());
|
||
|
||
// For other devices, adjust the object heights, allowing for viewport scaling
|
||
else
|
||
osk.adjustHeights();
|
||
}
|
||
|
||
/**
|
||
* Create copy of the OSK that can be used for embedding in documentation or help
|
||
* The currently active keyboard will be returned if PInternalName is null
|
||
*
|
||
* @param {string} PInternalName internal name of keyboard, with or without Keyboard_ prefix
|
||
* @param {number} Pstatic static keyboard flag (unselectable elements)
|
||
* @param {string=} argFormFactor layout form factor, defaulting to 'desktop'
|
||
* @param {(string|number)=} argLayerId name or index of layer to show, defaulting to 'default'
|
||
* @return {Object} DIV object with filled keyboard layer content
|
||
*/
|
||
keymanweb['BuildVisualKeyboard'] = keymanweb.buildOSK = function(PInternalName,Pstatic,argFormFactor,argLayerId) // I777
|
||
{
|
||
var PKbd=keymanweb.keyboardManager.activeKeyboard,Ln,kbd=null,
|
||
formFactor=(typeof(argFormFactor) == 'undefined' ? 'desktop' : argFormFactor),
|
||
layerId=(typeof(argLayerId) == 'undefined' ? 'default' : argLayerId);
|
||
|
||
var keyboardsList = keymanweb.keyboardManager.keyboards;
|
||
|
||
if(PInternalName != null) {
|
||
var p=PInternalName.toLowerCase().replace('keyboard_','');
|
||
|
||
for(Ln=0; Ln<keyboardsList.length; Ln++) {
|
||
if(p == keyboardsList[Ln]['KI'].toLowerCase().replace('keyboard_','')) {
|
||
PKbd=keyboardsList[Ln]; break;
|
||
}
|
||
}
|
||
}
|
||
|
||
if(!PKbd) return null;
|
||
|
||
var layouts=PKbd['KVKL'],layout=null,PVK=PKbd['KV'];
|
||
|
||
// Get the layout defined in the keyboard, or its nearest equivalent
|
||
if(typeof layouts == 'object')
|
||
{
|
||
if(typeof(layouts[formFactor]) == 'object' && layouts[formFactor] != null)
|
||
layout=layouts[formFactor];
|
||
else if(formFactor == 'phone' && typeof(layouts['tablet']) == 'object' && layouts['tablet'] != null)
|
||
layout=layouts['tablet'];
|
||
else if(formFactor == 'tablet' && typeof(layouts['phone']) == 'object' && layouts['phone'] != null)
|
||
layout=layouts['phone'];
|
||
else if(typeof(layouts['desktop']) == 'object' && layouts['desktop'] != null)
|
||
layout=layouts['desktop'];
|
||
}
|
||
|
||
// Else get a default layout for the device for this keyboard
|
||
if(layout == null && PVK != null)
|
||
layout=osk.buildDefaultLayout(PVK,keymanweb.keyboardManager.getKeyboardModifierBitmask(PKbd),formFactor);
|
||
|
||
// Cannot create an OSK if no layout defined, just return empty DIV
|
||
if(layout != null)
|
||
layout.keyLabels=((typeof(PKbd['KDU']) != 'undefined') && PKbd['KDU']);
|
||
|
||
kbd=osk.deviceDependentLayout(layout,formFactor);
|
||
kbd.className=formFactor+'-static kmw-osk-inner-frame';
|
||
|
||
// Select the layer to display, and adjust sizes
|
||
if(layout != null)
|
||
{
|
||
var layer,row,key,Lr,Lk;
|
||
for(Ln=0; Ln<layout.layer.length; Ln++)
|
||
{
|
||
layer=kbd.childNodes[Ln];
|
||
for(Lr=0; Lr<layer.childNodes.length; Lr++)
|
||
{
|
||
row=layer.childNodes[Lr];
|
||
for(Lk=0; Lk<row.childNodes.length; Lk++)
|
||
{
|
||
key=row.childNodes[Lk];
|
||
key.style.height='100%';
|
||
}
|
||
}
|
||
if(typeof(layerId) == 'number')
|
||
layer.style.display=(Ln == layerId && layerId >= 0 ? 'block' : 'none');
|
||
else if(typeof(layerId) == 'string')
|
||
layer.style.display=(layout.layer[Ln].id == layerId ? 'block' : 'none');
|
||
else
|
||
layer.style.display=(Ln == 0 ? 'block' : 'none');
|
||
}
|
||
}
|
||
else
|
||
{
|
||
kbd.innerHTML="<p style='color:#c40; font-size:0.5em;margin:10px;'>No "+formFactor+" layout is defined for "+PKbd['KN']+".</p>";
|
||
}
|
||
// Add a faint border
|
||
kbd.style.border='1px solid #ccc';
|
||
return kbd;
|
||
}
|
||
|
||
/**
|
||
* Adjust the absolute height of each keyboard element after a rotation
|
||
*
|
||
**/
|
||
osk.adjustHeights=function()
|
||
{
|
||
if(!osk._Box || !osk._Box.firstChild || !osk._Box.firstChild.firstChild || !osk._Box.firstChild.firstChild.childNodes) return;
|
||
var layers=osk._Box.firstChild.firstChild.childNodes,
|
||
nRows=layers[0].childNodes.length,
|
||
oskHeight=osk.getHeight(),
|
||
rowHeight=Math.floor(oskHeight/(nRows == 0 ? 1 : nRows)),
|
||
nLayer,nRow,rs,keys,nKeys,nKey,key,ks,j,pad,fs=1.0;
|
||
|
||
if(device.OS == 'Android' && 'devicePixelRatio' in window)
|
||
rowHeight = rowHeight/window.devicePixelRatio;
|
||
|
||
oskHeight=nRows*rowHeight;
|
||
|
||
var b=osk._Box,bs=b.style;
|
||
bs.height=bs.maxHeight=(oskHeight+3)+'px';
|
||
b=b.firstChild.firstChild; bs=b.style;
|
||
bs.height=bs.maxHeight=(oskHeight+3)+'px';
|
||
if(device.formFactor == 'phone') fs=0.6;
|
||
|
||
// TODO: Logically, this should be needed for Android, too - may need to be changed for the next version!
|
||
if(device.OS == 'iOS')
|
||
fs=fs/util.getViewportScale();
|
||
|
||
bs.fontSize=fs+'em';
|
||
var resizeLabels=(device.OS == 'iOS' && device.formFactor == 'phone' && util.landscapeView());
|
||
|
||
for(nLayer=0;nLayer<layers.length; nLayer++)
|
||
{
|
||
// Check the heights of each row, in case different layers have different row counts.
|
||
nRows=layers[nLayer].childNodes.length;
|
||
rowHeight=Math.floor(oskHeight/(nRows == 0 ? 1 : nRows));
|
||
|
||
pad = Math.round(0.15*rowHeight);
|
||
layers[nLayer].style.height=(oskHeight+3)+'px';
|
||
for(nRow=0; nRow<nRows; nRow++)
|
||
{
|
||
rs=layers[nLayer].childNodes[nRow].style;
|
||
rs.bottom=(nRows-nRow-1)*rowHeight+1+'px';
|
||
rs.maxHeight=rs.height=rowHeight+'px';
|
||
keys=layers[nLayer].childNodes[nRow].childNodes;
|
||
nKeys=keys.length;
|
||
for(nKey=0;nKey<nKeys;nKey++)
|
||
{
|
||
key=keys[nKey];
|
||
//key.style.marginTop = (device.formFactor == 'phone' ? pad : 4)+'px';
|
||
//**no longer needed if base key label and popup icon are within btn, not container**
|
||
|
||
// Must set the height of the btn DIV, not the label (if any)
|
||
for(j=0; j<key.childNodes.length; j++)
|
||
if(osk.hasClass(key.childNodes[j],'kmw-key')) break;
|
||
ks=key.childNodes[j].style;
|
||
ks.bottom=rs.bottom;
|
||
ks.height=ks.minHeight=(rowHeight-pad)+'px';
|
||
|
||
// Rescale keycap labels on iPhone (iOS 7)
|
||
if(resizeLabels && (j > 0)) key.childNodes[0].style.fontSize='6px';
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Create a control bar with title and buttons for the desktop OSK
|
||
*/
|
||
osk.controlBar = function()
|
||
{
|
||
var bar=util._CreateElement('DIV'),title='';
|
||
bar.id='keymanweb_title_bar';
|
||
bar.className='kmw-title-bar';
|
||
bar.onmousedown=osk._VMoveMouseDown;
|
||
|
||
if(keymanweb.keyboardManager.activeKeyboard) {
|
||
title=keymanweb.keyboardManager.activeKeyboard['KN'];
|
||
}
|
||
var Ltitle=util._CreateElement('SPAN');
|
||
Ltitle.className='kmw-title-bar-caption';
|
||
Ltitle.innerHTML=title;
|
||
bar.appendChild(Ltitle);
|
||
|
||
var Limg=osk.closeButton=util._CreateElement('DIV');
|
||
Limg.id='kmw-close-button';
|
||
Limg.className='kmw-title-bar-image';
|
||
Limg.onmousedown=osk._CancelMouse;
|
||
Limg.onclick=function(){osk._Hide(true);}
|
||
bar.appendChild(Limg);
|
||
|
||
Limg=osk.helpImg=util._CreateElement('DIV');
|
||
Limg.id='kmw-help-image';
|
||
Limg.className='kmw-title-bar-image';
|
||
Limg.title='KeymanWeb Help';
|
||
Limg.onclick=function()
|
||
{
|
||
var p={}; util.callEvent('osk.helpclick',p);
|
||
if(window.event) window.event.returnValue=false;
|
||
return false;
|
||
}
|
||
Limg.onmousedown=osk._CancelMouse;
|
||
bar.appendChild(Limg);
|
||
|
||
Limg=osk.configImg=util._CreateElement('DIV');
|
||
Limg.id='kmw-config-image';
|
||
Limg.className='kmw-title-bar-image';
|
||
Limg.title='KeymanWeb Configuration Options';
|
||
Limg.onclick=function()
|
||
{
|
||
var p={}; util.callEvent('osk.configclick',p);
|
||
if(window.event) window.event.returnValue=false;
|
||
return false;
|
||
}
|
||
Limg.onmousedown=osk._CancelMouse;
|
||
bar.appendChild(Limg);
|
||
|
||
Limg=osk.pinImg=util._CreateElement('DIV'); //I2186
|
||
Limg.id='kmw-pin-image';
|
||
Limg.className='kmw-title-bar-image';
|
||
Limg.title='Pin the On Screen Keyboard to its default location on the active text box';
|
||
Limg.onclick=function()
|
||
{
|
||
osk.loadCookie(); osk.userPositioned=false; osk.saveCookie();
|
||
osk._Show();
|
||
osk.doResizeMove(); //allow the UI to respond to OSK movements
|
||
if(osk.pinImg) osk.pinImg.style.display='none';
|
||
if(window.event) window.event.returnValue=false;
|
||
return false;
|
||
}
|
||
Limg.onmousedown=osk._CancelMouse;
|
||
bar.appendChild(Limg);
|
||
|
||
return bar;
|
||
}
|
||
|
||
/**
|
||
* Display build number
|
||
*/
|
||
osk.showBuild = function()
|
||
{
|
||
util.alert('KeymanWeb Version '+keymanweb['version']+'.'+keymanweb['build']+'<br /><br />'
|
||
+'<span style="font-size:0.8em">Copyright © 2017 SIL International</span>');
|
||
}
|
||
|
||
/**
|
||
* Create a bottom bar with a resizing icon for the desktop OSK
|
||
*/
|
||
osk.resizeBar = function()
|
||
{
|
||
var bar=util._CreateElement('DIV');
|
||
bar.className='kmw-footer';
|
||
bar.onmousedown=osk._CancelMouse;
|
||
|
||
// Add caption
|
||
var Ltitle=util._CreateElement('DIV');
|
||
Ltitle.className='kmw-footer-caption';
|
||
Ltitle.innerHTML='<a href="https://keyman.com/developer/keymanweb/">KeymanWeb</a>';
|
||
Ltitle.id='keymanweb-osk-footer-caption';
|
||
|
||
// Display build number on shift+double click
|
||
util.attachDOMEvent(Ltitle,'dblclick',function(e){if(e && e.shiftKey)osk.showBuild();},false);
|
||
|
||
// Prevent selection of caption (IE - set by class for other browsers)
|
||
if('onselectstart' in Ltitle) Ltitle.onselectstart= util.selectStartHandler; //IE (Build 360)
|
||
|
||
bar.appendChild(Ltitle);
|
||
|
||
var Limg = util._CreateElement('DIV');
|
||
Limg.className='kmw-footer-resize';
|
||
Limg.onmousedown=osk._VResizeMouseDown;
|
||
Limg.onmouseover=Limg.onmouseout=osk._VResizeMouseOut;
|
||
bar.appendChild(Limg);
|
||
osk.resizeIcon=Limg;
|
||
//TODO: the image never appears in IE8, have no idea why!
|
||
return bar;
|
||
}
|
||
|
||
/**
|
||
* Function _VKbdMouseOver
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Activate the KMW UI on mouse over
|
||
*/
|
||
osk._VKbdMouseOver = function(e)
|
||
{
|
||
keymanweb.uiManager.setActivatingUI(true);
|
||
}
|
||
|
||
/**
|
||
* Function _VKbdMouseOut
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Cancel activation of KMW UI on mouse out
|
||
*/
|
||
osk._VKbdMouseOut = function(e)
|
||
{
|
||
keymanweb.uiManager.setActivatingUI(false);
|
||
}
|
||
|
||
/**
|
||
* Function _VResizeMouseOver, _VResizeMouseOut
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Process end of resizing of KMW UI
|
||
*/
|
||
osk._VResizeMouseOver = osk._VResizeMouseOut = function(e)
|
||
{
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(!e) return false;
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
var r=osk.getRect();
|
||
osk.width=r.width; osk.height=r.height;
|
||
e.cancelBubble = true;
|
||
return false;
|
||
}
|
||
|
||
/**
|
||
* Function _VResizeMouseDown
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Process resizing of KMW UI
|
||
*/
|
||
osk._VResizeMouseDown = function(e)
|
||
{
|
||
keymanweb.uiManager.justActivated = true;
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(!e) return true;
|
||
osk.resizing = 1;
|
||
var Lposx,Lposy;
|
||
if (e.pageX) {
|
||
Lposx = e.pageX; Lposy = e.pageY;
|
||
}
|
||
else if(e.clientX) {
|
||
Lposx = e.clientX + document.body.scrollLeft;
|
||
Lposy = e.clientY + document.body.scrollTop;
|
||
}
|
||
osk._ResizeMouseX = Lposx;
|
||
osk._ResizeMouseY = Lposy;
|
||
if(document.onmousemove != osk._VResizeMouseMove && document.onmousemove != osk._VMoveMouseMove) // I1472 - Dragging off edge of browser window causes muckup
|
||
{
|
||
osk._VPreviousMouseMove = document.onmousemove;
|
||
osk._VPreviousMouseUp = document.onmouseup;
|
||
}
|
||
osk._VPreviousCursor = document.body.style.cursor;
|
||
osk._VPreviousMouseButton = (typeof(e.which)=='undefined' ? e.button : e.which);
|
||
|
||
osk._VOriginalWidth = osk._DivVKbd.offsetWidth;
|
||
osk._VOriginalHeight = osk._DivVKbd.offsetHeight;
|
||
document.onmousemove = osk._VResizeMouseMove;
|
||
document.onmouseup = osk._VResizeMoveMouseUp;
|
||
|
||
if(document.body.style.cursor) document.body.style.cursor = 'se-resize';
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
e.cancelBubble = true;
|
||
return false;
|
||
}
|
||
|
||
/**
|
||
* Function _VResizeMouseMove
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Process mouse movement during resizing of OSK
|
||
*/
|
||
osk._VResizeMouseMove = function(e)
|
||
{
|
||
var Lposx,Lposy;
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(!e) return true;
|
||
osk.resizing = 1;
|
||
|
||
if(osk._VPreviousMouseButton != (typeof(e.which)=='undefined' ? e.button : e.which)) // I1472 - Dragging off edge of browser window causes muckup
|
||
{
|
||
return osk._VResizeMoveMouseUp(e);
|
||
}
|
||
else
|
||
{
|
||
if (e.pageX) {
|
||
Lposx = e.pageX; Lposy=e.pageY;
|
||
}
|
||
else if (e.clientX) {
|
||
Lposx = e.clientX + document.body.scrollLeft;
|
||
Lposy = e.clientY + document.body.scrollTop;
|
||
}
|
||
var newWidth=(osk._VOriginalWidth + Lposx - osk._ResizeMouseX),
|
||
newHeight=(osk._VOriginalHeight + Lposy - osk._ResizeMouseY);
|
||
|
||
// Set the smallest and largest OSK size
|
||
if(newWidth < 0.2*screen.width) newWidth = 0.2*screen.width;
|
||
if(newHeight < 0.1*screen.height) newHeight = 0.1*screen.height;
|
||
if(newWidth > 0.9*screen.width) newWidth=0.9*screen.width;
|
||
if(newHeight > 0.5*screen.height) newWidth=0.5*screen.height;
|
||
|
||
// Set OSK width
|
||
osk._DivVKbd.style.width=newWidth+'px';
|
||
|
||
// Explicitly change OSK height and font size - cannot safely rely on scaling from font
|
||
osk._DivVKbd.style.height=newHeight+'px';
|
||
osk._DivVKbd.style.fontSize=(newHeight/8)+'px';
|
||
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
e.cancelBubble = true;
|
||
return false;
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Function _VMoveMouseDown
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Process mouse down on OSK
|
||
*/
|
||
osk._VMoveMouseDown = function(e)
|
||
{
|
||
var Lposx, Lposy;
|
||
keymanweb.uiManager.justActivated = true;
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(!e) return true;
|
||
|
||
osk.resizing = 1;
|
||
if (e.pageX)
|
||
{ Lposx = e.pageX; Lposy = e.pageY; }
|
||
else if (e.clientX)
|
||
{ Lposx = e.clientX + document.body.scrollLeft; Lposy = e.clientY + document.body.scrollTop; }
|
||
|
||
if(document.onmousemove != osk._VResizeMouseMove && document.onmousemove != osk._VMoveMouseMove) // I1472 - Dragging off edge of browser window causes muckup
|
||
{
|
||
osk._VPreviousMouseMove = document.onmousemove;
|
||
osk._VPreviousMouseUp = document.onmouseup;
|
||
}
|
||
osk._VPreviousCursor = document.body.style.cursor;
|
||
osk._VPreviousMouseButton = (typeof(e.which)=='undefined' ? e.button : e.which);
|
||
|
||
osk._VMoveX = Lposx - osk._Box.offsetLeft;
|
||
osk._VMoveY = Lposy - osk._Box.offsetTop;
|
||
|
||
if(keymanweb.keyboardManager.isCJK()) osk.pinImg.style.left='15px';
|
||
|
||
document.onmousemove = osk._VMoveMouseMove;
|
||
document.onmouseup = osk._VResizeMoveMouseUp;
|
||
if(document.body.style.cursor) document.body.style.cursor = 'move';
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
e.cancelBubble = true;
|
||
return false;
|
||
}
|
||
|
||
/**
|
||
* Process mouse drag on OSK
|
||
*
|
||
* @param {Object} e event
|
||
*/
|
||
osk._VMoveMouseMove = function(e)
|
||
{
|
||
var Lposx, Lposy;
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(!e) return true;
|
||
|
||
if(osk.noDrag) return true;
|
||
|
||
osk.resizing = 1;
|
||
|
||
osk.userPositioned = true;
|
||
osk.pinImg.style.display='block';
|
||
|
||
if(osk._VPreviousMouseButton != (typeof(e.which)=='undefined' ? e.button : e.which)) // I1472 - Dragging off edge of browser window causes muckup
|
||
{
|
||
return osk._VResizeMoveMouseUp(e);
|
||
}
|
||
else
|
||
{
|
||
if (e.pageX)
|
||
{ Lposx = e.pageX; Lposy = e.pageY; }
|
||
else if (e.clientX)
|
||
{ Lposx = e.clientX + document.body.scrollLeft; Lposy = e.clientY + document.body.scrollTop; }
|
||
osk._Box.style.left = (Lposx-osk._VMoveX)+'px';
|
||
osk._Box.style.top = (Lposy-osk._VMoveY)+'px';
|
||
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
var r=osk.getRect();
|
||
osk.width=r.width;osk.height=r.height;
|
||
e.cancelBubble = true;
|
||
return false;
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Function _VResizeMoveMouseUp
|
||
* Scope Private
|
||
* @param {Object} e event
|
||
* Description Process mouse up during resizing of KMW UI
|
||
*/
|
||
osk._VResizeMoveMouseUp = function(e)
|
||
{
|
||
e = keymanweb._GetEventObject(e); // I2404 - Manage IE events in IFRAMEs
|
||
if(!e) return true;
|
||
osk.resizing = 0; osk.currentKey=null;
|
||
document.onmousemove = osk._VPreviousMouseMove;
|
||
document.onmouseup = osk._VPreviousMouseUp;
|
||
if(document.body.style.cursor) document.body.style.cursor = osk._VPreviousCursor;
|
||
keymanweb.domManager.focusLastActiveElement();
|
||
if(e && e.preventDefault) e.preventDefault();
|
||
keymanweb.uiManager.justActivated = false;
|
||
keymanweb.uiManager.setActivatingUI(false);
|
||
if(osk._DivVKbd) {
|
||
osk._VOriginalWidth = osk._DivVKbd.offsetWidth;
|
||
osk._VOriginalHeight = osk._DivVKbd.offsetHeight;
|
||
}
|
||
osk.doResizeMove();
|
||
e.cancelBubble = true;
|
||
osk.saveCookie();
|
||
return false;
|
||
}
|
||
|
||
/**
|
||
* Function userPositioned
|
||
* Scope Public
|
||
* @return {(boolean|number)} true if user located
|
||
* Description Test if OSK window has been repositioned by user
|
||
*/
|
||
osk['userLocated'] = function()
|
||
{
|
||
return osk.userPositioned;
|
||
}
|
||
|
||
/**
|
||
* Description Display KMW OSK (at position set in callback to UI)
|
||
* Function show
|
||
* Scope Public
|
||
* @param {(boolean|number)=} bShow True to display, False to hide, omitted to toggle
|
||
*/
|
||
osk['show'] = function(bShow)
|
||
{
|
||
if(arguments.length > 0)
|
||
{
|
||
osk._Enabled=bShow;
|
||
if(bShow) osk._Show(); else osk._Hide(true);
|
||
}
|
||
else
|
||
{
|
||
if(osk._Visible) osk._Hide(true); else osk._Show();
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Allow UI to respond to OSK being shown (passing position and properties)
|
||
*
|
||
* @param {Object=} p object with coordinates and userdefined flag
|
||
* @return {boolean}
|
||
*
|
||
*/
|
||
osk.doShow = function(p)
|
||
{
|
||
return util.callEvent('osk.show',p);
|
||
}
|
||
|
||
/**
|
||
* Allow UI to update respond to OSK being hidden
|
||
*
|
||
* @param {Object=} p object with coordinates and userdefined flag
|
||
* @return {boolean}
|
||
*
|
||
*/
|
||
osk.doHide = function(p)
|
||
{
|
||
return util.callEvent('osk.hide',p);
|
||
}
|
||
|
||
/**
|
||
* Allow UI to update OSK position and properties
|
||
*
|
||
* @param {Object=} p object with coordinates and userdefined flag
|
||
*
|
||
*/
|
||
osk.doResizeMove = function(p)
|
||
{
|
||
return util.callEvent('osk.resizemove',p);
|
||
}
|
||
|
||
|
||
/**
|
||
* Display KMW OSK at specified position (returns nothing)
|
||
*
|
||
* @param {number=} Px x-coordinate for OSK rectangle
|
||
* @param {number=} Py y-coordinate for OSK rectangle
|
||
*/
|
||
osk._Show = function(Px, Py)
|
||
{
|
||
// Do not try to display OSK if undefined, or no active element
|
||
if(osk._Box == null || keymanweb.domManager.getActiveElement() == null) return;
|
||
|
||
// Never display the OSK for desktop browsers unless KMW element is focused, and a keyboard selected
|
||
if((!device.touchable) && (keymanweb.keyboardManager.activeKeyboard == null || !osk._Enabled)) return;
|
||
|
||
var Ls = osk._Box.style;
|
||
|
||
// Do not display OSK until it has been positioned correctly
|
||
if(device.touchable && Ls.bottom == '') Ls.visibility='hidden';
|
||
|
||
// The following code will always be executed except for externally created OSK such as EuroLatin
|
||
if(osk.ddOSK)
|
||
{
|
||
// Enable the currently active keyboard layer and update the default nextLayer member
|
||
var n,nLayer=-1,b=osk._DivVKbd.childNodes[0].childNodes;
|
||
for(n=0; n<b.length; n++)
|
||
{
|
||
if(b[n].layer == osk.layerId)
|
||
{
|
||
b[n].style.display='block';
|
||
//b[n].style.visibility='visible';
|
||
osk.nextLayer=osk.layerId;
|
||
osk.layerIndex=nLayer=n;
|
||
if(typeof osk.layers[n]['nextlayer'] == 'string') osk.nextLayer=osk.layers[n]['nextlayer'];
|
||
|
||
// If osk._Show has been called, there's probably been a change in modifier or state key state. Keep it updated!
|
||
osk._UpdateVKShiftStyle();
|
||
}
|
||
else
|
||
{
|
||
b[n].style.display='none';
|
||
//b[n].style.visibility='hidden';
|
||
}
|
||
}
|
||
|
||
if(device.touchable)
|
||
{
|
||
Ls.position='fixed';
|
||
Ls.left=Ls.bottom='0px';
|
||
Ls.height=Ls.maxHeight=osk._Box.firstChild.firstChild.style.height;
|
||
Ls.border='none'; Ls.borderTop='1px solid gray';
|
||
osk._Enabled=1; osk._Visible=1; // I3363 (Build 301)
|
||
|
||
// Adjust keyboard font sizes
|
||
if(device.formFactor == 'phone') // I3363 (Build 301)
|
||
osk._DivVKbd.style.fontSize='120%'; //'1.875em';
|
||
else
|
||
{
|
||
// The following is a *temporary* fix for small format tablets, e.g. PendoPad
|
||
if(device.OS == 'Android' && device.formFactor == 'tablet' &&
|
||
parseInt(Ls.height,10) < 300)
|
||
osk._DivVKbd.style.fontSize='120%';
|
||
else
|
||
osk._DivVKbd.style.fontSize='200%'; //'2.5em';
|
||
}
|
||
// Identify and save references to the language key, hide keyboard key, and space bar
|
||
osk.lgKey=osk.getSpecialKey(nLayer,'K_LOPT'); //TODO: should be saved with layer
|
||
osk.hkKey=osk.getSpecialKey(nLayer,'K_ROPT');
|
||
|
||
// Always adjust screen height if iPhone or iPod, to take account of viewport changes
|
||
if(device.OS == 'iOS' && device.formFactor == 'phone') osk.adjustHeights();
|
||
}
|
||
|
||
// Define for both desktop and touchable OSK
|
||
osk.spaceBar=osk.getSpecialKey(nLayer,'K_SPACE'); //TODO: should be saved with layer
|
||
}
|
||
|
||
//TODO: may need to return here for touch devices??
|
||
Ls.display='block'; //Ls.visibility='visible';
|
||
osk.showLanguage();
|
||
|
||
if(device.formFactor == 'desktop')
|
||
{
|
||
Ls.position='absolute'; Ls.display='block'; //Ls.visibility='visible';
|
||
Ls.left='0px';
|
||
osk.loadCookie();
|
||
if(Px >= 0) //probably never happens, legacy support only
|
||
{
|
||
Ls.left = Px + 'px'; Ls.top = Py + 'px';
|
||
}
|
||
else
|
||
{
|
||
if(osk.userPositioned)
|
||
{
|
||
Ls.left=osk.x+'px'; Ls.top=osk.y+'px';
|
||
}
|
||
else
|
||
{
|
||
var el=keymanweb.domManager.getActiveElement();
|
||
if(osk.dfltX != '')
|
||
Ls.left=osk.dfltX;
|
||
else if(typeof el != 'undefined' && el != null)
|
||
Ls.left=util._GetAbsoluteX(el)+'px';
|
||
|
||
if(osk.dfltY != '')
|
||
Ls.top=osk.dfltY;
|
||
else if(typeof el != 'undefined' && el != null)
|
||
Ls.top=(util._GetAbsoluteY(el)+el.offsetHeight)+'px';
|
||
}
|
||
}
|
||
osk._Enabled=1; osk._Visible=1;
|
||
if(osk._DivVKbd)
|
||
{
|
||
osk.width=osk._DivVKbd.offsetWidth; osk.height=osk._DivVKbd.offsetHeight;
|
||
}
|
||
|
||
osk.saveCookie();
|
||
|
||
var pin=osk.pinImg;
|
||
if(typeof pin != 'undefined' && pin != null)
|
||
pin.style.display=osk.userPositioned?'block':'none';
|
||
}
|
||
|
||
// If OSK still hidden, make visible only after all calculation finished
|
||
if(Ls.visibility == 'hidden')
|
||
window.setTimeout(function(){osk._Box.style.visibility='visible';},0);
|
||
|
||
// Allow desktop UI to execute code when showing the OSK
|
||
if(!device.touchable)
|
||
{
|
||
var Lpos={};
|
||
Lpos['x']=osk._Box.offsetLeft;
|
||
Lpos['y']=osk._Box.offsetTop;
|
||
Lpos['userLocated']=osk.userPositioned;
|
||
osk.doShow(Lpos);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Adjust the width of the last cell in each row for length differences
|
||
* due to rounding percentage widths to nearest pixel.
|
||
*
|
||
* @param {number} nLayer Index of currently visible layer
|
||
*/
|
||
osk.adjustRowLengths = function(nLayer)
|
||
{
|
||
if(nLayer >= 0) return; //TODO: TEST ONLY - remove code if not needed
|
||
|
||
var maxWidth,layers=osk._DivVKbd.childNodes[0].childNodes;
|
||
|
||
if(nLayer < 0 || nLayer >= layers.length || layers[nLayer].aligned) return;
|
||
|
||
// Do not try and align if not visible!
|
||
if(layers[nLayer].style.display != 'block') return;
|
||
|
||
// Set max width to be 6 px less than OSK layer width (allow for inter-key spacing)
|
||
// TODO: Adjustment needs to be device and orientation specific
|
||
maxWidth=osk._DivVKbd.childNodes[0].offsetWidth-6;
|
||
|
||
if(device.OS == 'Windows')
|
||
{
|
||
maxWidth -= util.landscapeView() ? 4: 40;
|
||
}
|
||
var i,rows=layers[nLayer].childNodes,keys,nKeys,lastKey,xMax;
|
||
for(i=0; i<rows.length; i++)
|
||
{
|
||
keys=rows[i].childNodes;
|
||
nKeys=keys.length;
|
||
xMax=keys[nKeys-2].offsetLeft+keys[nKeys-2].offsetWidth;
|
||
lastKey=keys[nKeys-1];
|
||
lastKey.style.width=(maxWidth-xMax)+'px';
|
||
}
|
||
layers[nLayer].aligned=true;
|
||
}
|
||
|
||
/**
|
||
* Clear the row alignment flag for each layer
|
||
* @return {number} number of currently active layer
|
||
*
|
||
*/
|
||
osk.resetRowLengths = function()
|
||
{
|
||
var j,layers=osk._DivVKbd.childNodes[0].childNodes,nLayer=-1;
|
||
for(j=0; j<layers.length; j++)
|
||
{
|
||
if(layers[j].style.display == 'block') nLayer=j;
|
||
layers[j].aligned=false;
|
||
}
|
||
return nLayer;
|
||
}
|
||
|
||
/**
|
||
* Set the reference to a special function key for the
|
||
* currently visible OSK layer
|
||
*
|
||
* @param {number} nLayer Index of visible layer
|
||
* @param {string} keyId key identifier
|
||
* @return {Object} Reference to key
|
||
*/
|
||
osk.getSpecialKey = function(nLayer,keyId)
|
||
{
|
||
var k,layers,rows,keys;
|
||
layers=osk._DivVKbd.childNodes[0].childNodes;
|
||
if(nLayer >= 0 && nLayer < layers.length)
|
||
{
|
||
// Special function keys will always be in bottom row (must modify code if not)
|
||
rows=layers[nLayer].childNodes;
|
||
keys=rows[rows.length-1].childNodes;
|
||
for(k=0; k<keys.length; k++)
|
||
{
|
||
if(keys[k].keyId == keyId) return keys[k];
|
||
}
|
||
}
|
||
return null;
|
||
}
|
||
|
||
/**
|
||
* Function hide
|
||
* Scope Public
|
||
* Description Prevent display of OSK window on focus
|
||
*/
|
||
osk['hide'] = function()
|
||
{
|
||
osk._Enabled=0; osk._Hide(true);
|
||
}
|
||
|
||
/**
|
||
* Hide Keymanweb On Screen Keyboard
|
||
*
|
||
* @param {boolean} hiddenByUser Distinguish between hiding on loss of focus and explicit hiding by user
|
||
*/
|
||
osk._Hide = function(hiddenByUser)
|
||
{
|
||
// The test for CJK languages is necessary to prevent a picklist (displayed in the OSK) from being hidden by the user
|
||
// Once picklist functionality is separated out, this will no longer be needed.
|
||
// Logic is: execute always if hidden on lost focus, but if requested by user, only if not CJK
|
||
|
||
// Save current size if visible
|
||
if(osk._Box && osk._Box.style.display == 'block' && osk._DivVKbd)
|
||
{
|
||
osk.width=osk._DivVKbd.offsetWidth; osk.height=osk._DivVKbd.offsetHeight;
|
||
}
|
||
if(hiddenByUser)
|
||
{
|
||
//osk.loadCookie(); // preserve current offset and userlocated state
|
||
osk._Enabled = ((keymanweb.keyboardManager.isCJK() || device.touchable)?1:0); // I3363 (Build 301)
|
||
osk.saveCookie(); // Save current OSK state, size and position (desktop only)
|
||
}
|
||
else if(device.formFactor == 'desktop')
|
||
{
|
||
//Allow desktop OSK to remain visible on blur if body class set
|
||
if(document.body.className.indexOf('osk-always-visible') >= 0) return;
|
||
}
|
||
|
||
osk._Visible = 0;
|
||
if(osk._Box && device.touchable && osk._Box.offsetHeight > 0) // I3363 (Build 301)
|
||
{
|
||
var os=osk._Box.style,h=osk._Box.offsetHeight;
|
||
//Firefox doesn't transition opacity if start delay is explicitly set to 0!
|
||
if(typeof(os.MozBoxSizing) == 'string')
|
||
os.transition='opacity 0.8s linear';
|
||
else
|
||
os.transition=os.msTransition=os.WebkitTransition='opacity 0.5s linear 0';
|
||
|
||
// Cannot hide the OSK smoothly using a transitioned drop, since for
|
||
// position:fixed elements transitioning is incompatible with translate3d(),
|
||
// and also does not work with top, bottom or height styles.
|
||
// Opacity can be transitioned and is probably the simplest alternative.
|
||
// We must condition on osk._Visible in case focus has since been moved to another
|
||
// input (in which case osk._Visible will be non-zero)
|
||
window.setTimeout(function()
|
||
{
|
||
var os=osk._Box.style;
|
||
if(osk._Visible)
|
||
{
|
||
// Leave opacity alone and clear transition if another element activated
|
||
os.transition=os.msTransition=os.MozTransition=os.WebkitTransition='';
|
||
}
|
||
else
|
||
{
|
||
// Set opacity to zero, should decrease smoothly
|
||
os.opacity='0';
|
||
|
||
// Actually hide the OSK at the end of the transition
|
||
osk._Box.addEventListener('transitionend',osk.hideNow,false);
|
||
osk._Box.addEventListener('webkitTransitionEnd',osk.hideNow,false);
|
||
}
|
||
},200); // Wait a bit before starting, to allow for moving to another element
|
||
|
||
}
|
||
else
|
||
{
|
||
if(osk._Box) osk._Box.style.display = 'none';
|
||
}
|
||
|
||
// Allow UI to execute code when hiding the OSK
|
||
var p={}; p['HiddenByUser']=hiddenByUser;
|
||
osk.doHide(p);
|
||
|
||
// If hidden by the UI, be sure to restore the focus
|
||
if(hiddenByUser) keymanweb.domManager.focusLastActiveElement();
|
||
}
|
||
|
||
/**
|
||
* Function hideNow
|
||
* Scope Private
|
||
* Description Hide the OSK unconditionally and immediately, cancel any pending transition
|
||
*/
|
||
osk.hideNow = function() // I3363 (Build 301)
|
||
{
|
||
osk._Box.removeEventListener('transitionend',osk.hideNow,false);
|
||
osk._Box.removeEventListener('webkitTransitionEnd',osk.hideNow,false);
|
||
|
||
var os=osk._Box.style;
|
||
os.display='none';
|
||
os.opacity='1';
|
||
osk._Visible=0;
|
||
os.transition=os.msTransition=os.mozTransition=os.WebkitTransition='';
|
||
|
||
// Remove highlighting from hide keyboard key, if applied
|
||
if(osk.hkKey && typeof(osk.hkKey) != 'undefined') osk.highlightKey(osk.hkKey.firstChild,false);
|
||
|
||
}
|
||
|
||
// First time initialization of OSK
|
||
osk.prepare = function()
|
||
{
|
||
// Defer loading the OSK until KMW code initialization complete
|
||
if(!keymanweb['initialized'])
|
||
{
|
||
window.setTimeout(osk.prepare,200);
|
||
return;
|
||
}
|
||
// OSK initialization - create DIV and set default styles
|
||
if(!osk.ready)
|
||
{
|
||
osk._Box = util._CreateElement('DIV'); // Container for OSK (Help DIV, displayed when user clicks Help icon)
|
||
document.body.appendChild(osk._Box);
|
||
|
||
// Install the default OSK stylesheet
|
||
util.linkStyleSheet(keymanweb.getStyleSheetPath('kmwosk.css'));
|
||
|
||
// For mouse click to prevent loss of focus
|
||
util.attachDOMEvent(osk._Box,'mousedown', function(){keymanweb.uiManager.setActivatingUI(true);});
|
||
|
||
// And to prevent touch event default behaviour on mobile devices
|
||
// TODO: are these needed, or do they interfere with other OSK event handling ????
|
||
if(device.touchable) // I3363 (Build 301)
|
||
{
|
||
util.attachDOMEvent(osk._Box,'touchstart',function(e){keymanweb.uiManager.setActivatingUI(true); e.preventDefault();e.stopPropagation();});
|
||
util.attachDOMEvent(osk._Box,'touchend',function(e){e.preventDefault(); e.stopPropagation();});
|
||
util.attachDOMEvent(osk._Box,'touchmove',function(e){e.preventDefault();e.stopPropagation();});
|
||
util.attachDOMEvent(osk._Box,'touchcancel',function(e){e.preventDefault();e.stopPropagation();});
|
||
|
||
// Can only get (initial) viewport scale factor after page is fully loaded!
|
||
osk.vpScale=util.getViewportScale();
|
||
}
|
||
}
|
||
osk.loadCookie();
|
||
osk.ready=true;
|
||
}
|
||
/**
|
||
* Function _Load
|
||
* Scope Private
|
||
* Description OSK initialization when keyboard selected
|
||
*/
|
||
osk._Load = function() // Load Help
|
||
{
|
||
var activeKeyboard = keymanweb.keyboardManager.activeKeyboard;
|
||
|
||
// If _Load called before OSK is ready, must wait and call again
|
||
if(osk._Box == null)
|
||
{
|
||
if(osk.loadRetry >= 99) return; // fail silently, but should not happen
|
||
window.setTimeout(osk._Load,100);
|
||
osk.loadRetry++;
|
||
return;
|
||
}
|
||
|
||
osk.loadRetry = 0;
|
||
|
||
if(keymanweb._TitleElement) keymanweb._TitleElement.innerHTML = 'KeymanWeb'; // I1972
|
||
|
||
|
||
osk._Visible=0; // I3363 (Build 301)
|
||
osk.layerId='default';
|
||
var s=osk._Box.style;
|
||
s.zIndex='9999'; s.display='none'; s.width='auto';
|
||
s.position = (device.formFactor == 'desktop' ? 'absolute' : 'fixed');
|
||
|
||
// Use smaller base font size for mobile devices
|
||
//if(screen.availHeight < 500) s.fontSize='10pt';
|
||
//else if(screen.availHeight < 800) s.fontSize='11pt';
|
||
//else s.fontSize='12pt';
|
||
if(device.formFactor == 'phone') s.fontSize='1.6em';
|
||
|
||
osk._DivVKbd = osk._DivVKbdHelp = null; // I1476 - Handle SELECT overlapping
|
||
osk._Box.innerHTML = '';
|
||
osk._Box.onmouseover = osk._VKbdMouseOver;
|
||
osk._Box.onmouseout = osk._VKbdMouseOut;
|
||
|
||
// TODO: find out and document why this should not be done for touch devices!!
|
||
// (Probably to avoid having a null keyboard. But maybe that *is* an option, if there remains a way to get the language menu,
|
||
// such as a minimized menu button?)
|
||
if(activeKeyboard == null && !device.touchable)
|
||
{
|
||
var Ldiv=util._CreateElement('DIV');
|
||
Ldiv.className = "kmw-title-bar";
|
||
Ldiv.appendChild(osk._TitleBarInterior());
|
||
Ldiv.onmousedown = osk._VMoveMouseDown;
|
||
osk._Box.appendChild(Ldiv);
|
||
|
||
Ldiv = util._CreateElement('DIV');
|
||
Ldiv.className='kmw-osk-none';
|
||
osk._Box.appendChild(Ldiv);
|
||
}
|
||
else
|
||
{
|
||
var Lviskbd=null,layouts=null,layout=null,Lhelp='';
|
||
osk._Box.className = "";
|
||
if(activeKeyboard != null)
|
||
{
|
||
Lviskbd=activeKeyboard['KV']; Lhelp=activeKeyboard['KH'];
|
||
|
||
// Check if dynamic layout is defined within keyboard
|
||
layouts=activeKeyboard['KVKL'];
|
||
|
||
// If any keyboard layout file is provided, use that to override the generated layout
|
||
if(typeof layouts != 'undefined' && layouts != null)
|
||
{
|
||
layout=layouts[device.formFactor];
|
||
|
||
// Use the layout for the device, if defined, otherwise use the desktop (default) layout
|
||
if(typeof layout == 'undefined' || layout == null)
|
||
{
|
||
if(device.formFactor == 'phone') layout=layouts['tablet'];
|
||
else if(device.formFactor == 'tablet') layout=layouts['phone'];
|
||
if(typeof layout == 'undefined' || layout == null) layout=layouts['desktop'];
|
||
}
|
||
}
|
||
}
|
||
|
||
// Test if Visual keyboard is simply a place holder, set to null if so
|
||
if(Lviskbd != null && Lviskbd['BK'] != null)
|
||
{
|
||
var keyCaps=Lviskbd['BK'],noKeyCaps=true;
|
||
{
|
||
for(var i=0; i<keyCaps.length; i++)
|
||
{
|
||
if(keyCaps[i].length > 0)
|
||
{
|
||
noKeyCaps = false; break;
|
||
}
|
||
}
|
||
}
|
||
if(noKeyCaps) Lviskbd=null;
|
||
}
|
||
|
||
// Generate a visual keyboard from the layout (or layout default)
|
||
// TODO: this should probably be unconditional now
|
||
if(Lviskbd != null || Lhelp == '' || device.touchable) // I3363 (Build 301)
|
||
{
|
||
// TODO: May want to define a default BK array here as well
|
||
if(Lviskbd == null) Lviskbd={'F':'Tahoma','BK':dfltText}; //DDOSK
|
||
|
||
osk._GenerateVisualKeyboard(Lviskbd, Lhelp, layout, keymanweb.keyboardManager.getKeyboardModifierBitmask());
|
||
}
|
||
|
||
else //The following code applies only to preformatted 'help' such as European Latin
|
||
{
|
||
osk.ddOSK = false;
|
||
Ldiv=util._CreateElement('DIV');
|
||
Ldiv.className = "kmw-title-bar";
|
||
Ldiv.appendChild(osk._TitleBarInterior());
|
||
Ldiv.onmousedown = osk._VMoveMouseDown;
|
||
osk._Box.appendChild(Ldiv);
|
||
|
||
//Add content
|
||
var Ldiv = util._CreateElement('DIV');
|
||
Ldiv.className='kmw-osk-static';
|
||
Ldiv.innerHTML = Lhelp;
|
||
osk._Box.appendChild(Ldiv);
|
||
if(activeKeyboard['KHF']) activeKeyboard['KHF'](osk._Box);
|
||
}
|
||
if(keymanweb._TitleElement)
|
||
{
|
||
keymanweb._TitleElement.innerHTML = "<span style='font-weight:bold'>"
|
||
+ activeKeyboard['KN'] + '</span> - ' + keymanweb._TitleElement.innerHTML; // I1972 // I2186
|
||
keymanweb._TitleElement.className=''; keymanweb._TitleElement.style.color='#fff';
|
||
}
|
||
}
|
||
|
||
// Create the key preview (for phones)
|
||
osk.createKeyTip();
|
||
|
||
// Correct the classname for the (inner) OSK frame (Build 360)
|
||
var innerFrame=osk._Box.firstChild,
|
||
kbdClass=' kmw-keyboard-'+(activeKeyboard ? activeKeyboard['KI'].replace('Keyboard_','') : '');
|
||
if(innerFrame.id == 'keymanweb_title_bar') innerFrame=innerFrame.nextSibling;
|
||
innerFrame.className='kmw-osk-inner-frame'+kbdClass;
|
||
|
||
// Append a stylesheet for this keyboard for keyboard specific styles
|
||
// or if needed to specify an embedded font
|
||
osk.appendStyleSheet();
|
||
if(osk._Enabled) osk._Show();
|
||
}
|
||
|
||
/**
|
||
* Append a style sheet for the current keyboard if needed for specifying an embedded font
|
||
* or to re-apply the default element font
|
||
*
|
||
**/
|
||
osk.appendStyleSheet = function() {
|
||
var activeKeyboard = keymanweb.keyboardManager.activeKeyboard;
|
||
var activeStub: com.keyman.KeyboardStub = keymanweb.keyboardManager.activeStub;
|
||
|
||
// Do not do anything if a null stub
|
||
if(activeStub == null) {
|
||
return;
|
||
}
|
||
|
||
// First remove any existing keyboard style sheet
|
||
if(osk.styleSheet) {
|
||
util.removeStyleSheet(osk.styleSheet);
|
||
}
|
||
|
||
var i, kfd=activeStub['KFont'], ofd=activeStub['KOskFont'];
|
||
|
||
// Add style sheets for embedded fonts if necessary (each font-face style will only be added once)
|
||
util.addFontFaceStyleSheet(kfd); util.addFontFaceStyleSheet(ofd);
|
||
|
||
// Temporarily hide duplicated elements on non-desktop browsers
|
||
keymanweb.alignInputs(false);
|
||
|
||
// Build the style string and append (or replace) the font style sheet
|
||
// Note: Some browsers do not download the font-face font until it is applied,
|
||
// so must apply style before testing for font availability
|
||
// Extended to allow keyboard-specific custom styles for Build 360
|
||
var customStyle=osk.addFontStyle(kfd,ofd);
|
||
if( activeKeyboard != null && typeof(activeKeyboard['KCSS']) == 'string') // KMEW-129
|
||
customStyle=customStyle+activeKeyboard['KCSS'];
|
||
|
||
osk.styleSheet = util.addStyleSheet(customStyle); //Build 360
|
||
|
||
// Wait until font is loaded then align duplicated input elements with page elements
|
||
if(osk.waitForFonts(kfd,ofd)) keymanweb.alignInputs(true);
|
||
}
|
||
|
||
/**
|
||
* Add or replace the style sheet used to set the font for input elements and OSK
|
||
*
|
||
* @param {Object} kfd KFont font descriptor
|
||
* @param {Object} ofd OSK font descriptor (if any)
|
||
* @return {string}
|
||
*
|
||
**/
|
||
osk.addFontStyle = function(kfd,ofd)
|
||
{
|
||
// Get name of font to be applied
|
||
var fn=keymanweb.baseFont;
|
||
if(typeof(kfd) != 'undefined' && typeof(kfd['family']) != 'undefined') fn=kfd['family'];
|
||
|
||
// Unquote font name in base font (if quoted)
|
||
fn = fn.replace(/\u0022/g,'');
|
||
|
||
// Set font family chain for mapped elements and remove any double quotes
|
||
var rx=new RegExp('\\s?'+fn+',?'), ff=keymanweb.appliedFont.replace(/\u0022/g,'');
|
||
|
||
// Remove base font name from chain if present
|
||
ff = ff.replace(rx,''); ff = ff.replace(/,$/,'');
|
||
|
||
// Then replace it at the head of the chain
|
||
if(ff == '') ff=fn; else ff=fn+','+ff;
|
||
|
||
// Re-insert quotes around individual font names
|
||
ff = '"' + ff.replace(/\,\s?/g,'","') + '"';
|
||
|
||
// Add to the stylesheet, quoted, and with !important to override any explicit style
|
||
var s='.keymanweb-font{\nfont-family:' + ff + ' !important;\n}\n';
|
||
|
||
// Set font family for OSK text
|
||
if(typeof(ofd) != 'undefined')
|
||
s=s+'.kmw-key-text{\nfont-family:"'+ofd['family'].replace(/\u0022/g,'').replace(/,/g,'","')+'";\n}\n';
|
||
else if(typeof(kfd) != 'undefined')
|
||
s=s+'.kmw-key-text{\nfont-family:"'+kfd['family'].replace(/\u0022/g,'').replace(/,/g,'","')+'";\n}\n';
|
||
|
||
// Store the current font chain (with quote-delimited font names)
|
||
keymanweb.appliedFont = ff;
|
||
|
||
// Return the style string
|
||
return s;
|
||
}
|
||
|
||
/**
|
||
* Function _Unload
|
||
* Scope Private
|
||
* Description Clears OSK variables prior to exit (JMD 1.9.1 - relocation of local variables 3/9/10)
|
||
*/
|
||
osk._Unload = function()
|
||
{
|
||
osk._VShift = osk._DivVKbd = osk._VKeySpans = osk._Box = 0;
|
||
}
|
||
|
||
/**
|
||
* Save size, position, font size and visibility of OSK
|
||
*/
|
||
osk.saveCookie = function()
|
||
{
|
||
var c = util.loadCookie('KeymanWeb_OnScreenKeyboard');
|
||
var p=osk.getPos();
|
||
|
||
c['visible'] = osk._Enabled ? 1 : 0;
|
||
c['userSet'] = osk.userPositioned ? 1 : 0;
|
||
c['left'] = p.left; c['top'] = p.top;
|
||
if(osk._DivVKbd)
|
||
{
|
||
c['width'] = osk.width; c['height'] = osk.height;
|
||
}
|
||
util.saveCookie('KeymanWeb_OnScreenKeyboard',c);
|
||
}
|
||
|
||
/**
|
||
* Restore size, position, font size and visibility of desktop OSK
|
||
*
|
||
* @return {boolean}
|
||
*/
|
||
osk.loadCookie = function()
|
||
{
|
||
var c = util.loadCookie('KeymanWeb_OnScreenKeyboard');
|
||
if(typeof(c) == 'undefined' || c == null)
|
||
{
|
||
osk.userPositioned=false; return false;
|
||
}
|
||
osk._Enabled = util.toNumber(c['visible'],true);
|
||
osk.userPositioned = util.toNumber(c['userSet'],false);
|
||
osk.x = util.toNumber(c['left'],-1);
|
||
osk.y = util.toNumber(c['top'],-1);
|
||
|
||
// Restore OSK size - font size now fixed in relation to OSK height, unless overridden (in em) by keyboard
|
||
var dfltWidth=0.3*screen.width;
|
||
//if(util.toNumber(c['width'],0) == 0) dfltWidth=0.5*screen.width;
|
||
var newWidth=util.toNumber(c['width'],dfltWidth),
|
||
newHeight=util.toNumber(c['height'],0.15*screen.height);
|
||
|
||
// Limit the OSK dimensions to reasonable values
|
||
if(newWidth < 0.2*screen.width) newWidth = 0.2*screen.width;
|
||
if(newHeight < 0.1*screen.height) newHeight = 0.1*screen.height;
|
||
if(newWidth > 0.9*screen.width) newWidth=0.9*screen.width;
|
||
if(newHeight > 0.5*screen.height) newWidth=0.5*screen.height;
|
||
|
||
if(osk._DivVKbd)
|
||
{
|
||
osk._DivVKbd.style.width=newWidth+'px';
|
||
osk._DivVKbd.style.height=newHeight+'px';
|
||
osk._DivVKbd.style.fontSize=(newHeight/8)+'px';
|
||
}
|
||
|
||
// and OSK position if user located
|
||
if(osk.x == -1 || osk.y == -1 || (!osk._Box)) osk.userPositioned = false;
|
||
|
||
if(osk.x < window.pageXOffset-0.8*newWidth) osk.x=window.pageXOffset-0.8*newWidth;
|
||
if(osk.y < 0) {osk.x=-1; osk.y=-1; osk.userPositioned=false;}
|
||
|
||
if(osk.userPositioned && osk._Box) osk.setPos({'left':osk.x,'top':osk.y});
|
||
|
||
return true;
|
||
}
|
||
|
||
})();
|
||
|
||
} |