Subversion-Projekte lars-tiefland.prado

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
1 lars 1
Prado.WebUI.TKeyboard = Class.create();
2
Prado.WebUI.TKeyboard.prototype =
3
{
4
	initialize : function(options)
5
	{
6
		this.element = $(options.ID);
7
		this.onInit(options);
8
	},
9
 
10
	onInit : function(options)
11
    {
12
		this.cssClass = options['CssClass'];
13
        this.forControl = document.getElementById(options['ForControl']);
14
        this.autoHide = options['AutoHide'];
15
 
16
        this.flagShift = false;
17
        this.flagCaps = false;
18
        this.flagHover = false;
19
        this.flagFocus = false;
20
 
21
        this.keys = new Array
22
        (
23
            new Array('` ~ D', '1 ! D', '2 @ D', '3 # D', '4 $ D', '5 % D', '6 ^ D', '7 & D', '8 * D', '9 ( D', '0 ) D', '- _ D', '= + D', 'Bksp Bksp Bksp'),
24
            new Array('Del Del Del', 'q Q L', 'w W L', 'e E L', 'r R L', 't T L', 'y Y L', 'u U L', 'i I L', 'o O L', 'p P L', '[ { D', '] } D', '\\ | \\'),
25
            new Array('Caps Caps Caps', 'a A L', 's S L', 'd D L', 'f F L', 'g G L', 'h H L', 'j J L', 'k K L', 'l L L', '; : D', '\' " D', 'Exit Exit Exit'),
26
            new Array('Shift Shift Shift', 'z Z L', 'x X L', 'c C L', 'v V L', 'b B L', 'n N L', 'm M L', ', < D', '. > D', '/ ? D', 'Shift Shift Shift')
27
        );
28
 
29
        if (this.isObject(this.forControl))
30
        {
31
            this.forControl.keyboard = this;
32
            this.forControl.onfocus = function() {this.keyboard.show(); };
33
            this.forControl.onblur = function() {if (this.keyboard.flagHover == false) this.keyboard.hide();};
34
            this.forControl.onkeydown = function(e) {if (!e) e = window.event; var key = (e.keyCode)?e.keyCode:e.which; if(key == 9)  this.keyboard.hide();;};
35
            this.forControl.onselect = this.saveSelection;
36
            this.forControl.onclick = this.saveSelection;
37
            this.forControl.onkeyup = this.saveSelection;
38
        }
39
 
40
        this.render();
41
 
42
        this.tagKeyboard.onmouseover = function() {this.keyboard.flagHover = true;};
43
        this.tagKeyboard.onmouseout = function() {this.keyboard.flagHover = false;};
44
 
45
        if (!this.autoHide) this.show();
46
    },
47
 
48
	isObject : function(a)
49
	{
50
		return (typeof a == 'object' && !!a) || typeof a == 'function';
51
	},
52
 
53
	createElement : function(tagName, attributes, parent)
54
    {
55
        var tagElement = document.createElement(tagName);
56
        if (this.isObject(attributes)) for (attribute in attributes) tagElement[attribute] = attributes[attribute];
57
        if (this.isObject(parent)) parent.appendChild(tagElement);
58
        return tagElement;
59
    },
60
 
61
	onmouseover : function()
62
	{
63
		this.className += ' Hover';
64
	},
65
 
66
	onmouseout : function()
67
	{
68
		this.className = this.className.replace(/( Hover| Active)/ig, '');
69
	},
70
 
71
    onmousedown : function()
72
    {
73
    	this.className += ' Active';
74
	},
75
 
76
    onmouseup : function()
77
    {
78
    	this.className = this.className.replace(/( Active)/ig, '');
79
    	this.keyboard.type(this.innerHTML);
80
	},
81
 
82
	render : function()
83
    {
84
        this.tagKeyboard = this.createElement('div', {className: this.cssClass, onselectstart: function() {return false;}}, this.element);
85
        this.tagKeyboard.keyboard = this;
86
 
87
        for (var line = 0; line < this.keys.length; line++)
88
        {
89
            var tagLine = this.createElement('div', {className: 'Line'}, this.tagKeyboard);
90
            for (var key = 0; key < this.keys[line].length; key++)
91
            {
92
                var split = this.keys[line][key].split(' ');
93
                var tagKey = this.createElement('div', {className: 'Key ' + split[2]}, tagLine);
94
                var tagKey1 = this.createElement('div', {className: 'Key1', innerHTML: split[0], keyboard: this, onmouseover: this.onmouseover, onmouseout: this.onmouseout, onmousedown: this.onmousedown, onmouseup: this.onmouseup}, tagKey);
95
                var tagKey2 = this.createElement('div', {className: 'Key2', innerHTML: split[1], keyboard: this, onmouseover: this.onmouseover, onmouseout: this.onmouseout, onmousedown: this.onmousedown, onmouseup: this.onmouseup}, tagKey);
96
            }
97
        }
98
    },
99
 
100
    isShown : function()
101
    {
102
        return (this.tagKeyboard.style.visibility.toLowerCase() == 'visible');
103
    },
104
 
105
    show : function()
106
    {
107
        if (this.isShown() == false) this.tagKeyboard.style.visibility = 'visible';
108
    },
109
 
110
    hide : function()
111
    {
112
        if (this.isShown() == true && this.autoHide) {this.tagKeyboard.style.visibility = 'hidden'; }
113
    },
114
 
115
    type : function(key)
116
    {
117
        var input = this.forControl;
118
        var command = key.toLowerCase();
119
 
120
        if (command == 'exit') {this.hide();}
121
        else if (input != 'undefined' && input != null && command == 'bksp') {this.insert(input, 'bksp');}
122
        else if (input != 'undefined' && input != null && command == 'del') {this.insert(input, 'del');}
123
        else if (command == 'shift') {this.tagKeyboard.className = this.flagShift?'Keyboard Off':'Keyboard Shift';this.flagShift = this.flagShift?false:true;}
124
        else if (command == 'caps') {this.tagKeyboard.className = this.caps?'Keyboard Off':'Keyboard Caps';this.caps = this.caps?false:true;}
125
        else if (input != 'undefined' && input != null)
126
        {
127
            if (this.flagShift == true) {this.flagShift = false; this.tagKeyboard.className = 'Keyboard Off';}
128
            key = key.replace(/&gt;/, '>'); key = key.replace(/&lt;/, '<'); key = key.replace(/&amp;/, '&');
129
            this.insert(input, key);
130
        }
131
 
132
        if (command != 'exit') input.focus();
133
    },
134
 
135
    saveSelection : function()
136
    {
137
        if (this.keyboard.forControl.createTextRange)
138
        {
139
            this.keyboard.selection = document.selection.createRange().duplicate();
140
            return;
141
        }
142
    },
143
 
144
    insert : function(field, value)
145
    {
146
        if (this.forControl.createTextRange && this.selection)
147
        {
148
            if (value == 'bksp') {this.selection.moveStart("character", -1); this.selection.text = '';}
149
            else if (value == 'del') {this.selection.moveEnd("character", 1); this.selection.text = '';}
150
            else {this.selection.text = value;}
151
            this.selection.select();
152
        }
153
        else
154
        {
155
            var selectStart = this.forControl.selectionStart;
156
            var selectEnd = this.forControl.selectionEnd;
157
            var start = (this.forControl.value).substring(0, selectStart);
158
            var end = (this.forControl.value).substring(selectEnd, this.forControl.textLength);
159
 
160
            if (value == 'bksp') {start = start.substring(0, start.length - 1); selectStart -= 1; value = '';}
161
            if (value == 'del') {end = end.substring(1, end.length); value = '';}
162
 
163
            this.forControl.value = start + value + end;
164
            this.forControl.selectionStart = selectEnd + value.length;
165
            this.forControl.selectionEnd = selectStart + value.length;
166
        }
167
    }
168
};