Skip to content

Commit 7c7d102

Browse files
author
Vasyl Vavrychuk
committed
switched to jQuery UI based virtual keyboard
1 parent b032887 commit 7c7d102

File tree

4 files changed

+1886
-59
lines changed

4 files changed

+1886
-59
lines changed

‎web/WebDriverJsDemo.html

+24-57
Original file line numberDiff line numberDiff line change
@@ -8,19 +8,30 @@
88

99
.commandBlock {
1010
margin-top: 20px;
11-
border-style: solid;
12-
border-width: thin;
13-
border-color: gray;
14-
}
15-
16-
#keyboard input {
17-
min-width: 30px;
1811
}
1912

2013
#findElementPanel td {
2114
vertical-align: top;
2215
}
16+
17+
.ui-keyboard-keyset {
18+
width: 800px;
19+
}
20+
21+
.ui-keyboard-space {
22+
margin-top: -100px;
23+
}
2324
</style>
25+
26+
<!-- jQuery & jQuery UI + theme (required) -->
27+
<link href="http://code.jquery.com/ui/1.9.0/themes/smoothness/jquery-ui.css" rel="stylesheet">
28+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js"></script>
29+
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
30+
31+
<!-- keyboard widget css & script (required) -->
32+
<link href="keyboard.css" rel="stylesheet">
33+
<script src="jquery.keyboard.js"></script>
34+
2435
<script src="webdriver.js"></script>
2536
<script src="base64-arraybuffer.js"></script>
2637
<script src="FileSaver.js"></script>
@@ -51,10 +62,10 @@
5162
</tr>
5263
</table>
5364

54-
<div id="error" class="commandBlock" style="display: none; color: red;">
65+
<div id="error" class="commandBlock ui-widget-content ui-corner-all" style="display: none; color: red;">
5566
</div>
5667

57-
<div id="findElementPanel" class="commandBlock">
68+
<div id="findElementPanel" class="commandBlock ui-widget-content ui-corner-all">
5869
<table>
5970
<tr>
6071
<td>
@@ -99,69 +110,25 @@
99110
</div>
100111

101112
<div class="commandBlock">
102-
<div style="position: absolute;">Key down:</div>
103-
<div id="keyboard" style="margin-left: 80px;">
104-
<div>
105-
<input type="submit" value="ESC" onclick="wd.onSendKeys(webdriver.Key.ESCAPE)"/>
106-
<input type="submit" value="Q" onclick="wd.onSendKeys(this.value)"/>
107-
<input type="submit" value="W" onclick="wd.onSendKeys(this.value)"/>
108-
<input type="submit" value="E" onclick="wd.onSendKeys(this.value)"/>
109-
<input type="submit" value="R" onclick="wd.onSendKeys(this.value)"/>
110-
<input type="submit" value="T" onclick="wd.onSendKeys(this.value)"/>
111-
<input type="submit" value="Y" onclick="wd.onSendKeys(this.value)"/>
112-
<input type="submit" value="U" onclick="wd.onSendKeys(this.value)"/>
113-
<input type="submit" value="I" onclick="wd.onSendKeys(this.value)"/>
114-
<input type="submit" value="O" onclick="wd.onSendKeys(this.value)"/>
115-
<input type="submit" value="P" onclick="wd.onSendKeys(this.value)"/>
116-
<input type="submit" value="←" onclick="wd.onSendKeys(webdriver.Key.BACK_SPACE)"/>
117-
</div>
118-
<div>
119-
<input type="submit" value="A" onclick="wd.onSendKeys(this.value)" style="margin-left: 53px;"/>
120-
<input type="submit" value="S" onclick="wd.onSendKeys(this.value)"/>
121-
<input type="submit" value="D" onclick="wd.onSendKeys(this.value)"/>
122-
<input type="submit" value="F" onclick="wd.onSendKeys(this.value)"/>
123-
<input type="submit" value="G" onclick="wd.onSendKeys(this.value)"/>
124-
<input type="submit" value="H" onclick="wd.onSendKeys(this.value)"/>
125-
<input type="submit" value="J" onclick="wd.onSendKeys(this.value)"/>
126-
<input type="submit" value="K" onclick="wd.onSendKeys(this.value)"/>
127-
<input type="submit" value="L" onclick="wd.onSendKeys(this.value)"/>
128-
<input type="submit" value="Enter" onclick="wd.onSendKeys(webdriver.Key.ENTER)"/>
129-
</div>
130-
<div>
131-
<input type="submit" value="Z" onclick="wd.onSendKeys(this.value)" style="margin-left: 53px;"/>
132-
<input type="submit" value="X" onclick="wd.onSendKeys(this.value)"/>
133-
<input type="submit" value="C" onclick="wd.onSendKeys(this.value)"/>
134-
<input type="submit" value="V" onclick="wd.onSendKeys(this.value)"/>
135-
<input type="submit" value="B" onclick="wd.onSendKeys(this.value)"/>
136-
<input type="submit" value="N" onclick="wd.onSendKeys(this.value)"/>
137-
<input type="submit" value="M" onclick="wd.onSendKeys(this.value)"/>
138-
<input type="submit" value="&#8657;" onclick="wd.onSendKeys(webdriver.Key.UP)" style="margin-left: 45px;"/>
139-
</div>
140-
<div>
141-
<input type="submit" value=" " onclick="wd.onSendKeys(this.value)" style="width: 129px; margin-left: 100px;"/>
142-
<input type="submit" value="&#8656;" onclick="wd.onSendKeys(webdriver.Key.LEFT)" style="margin-left: 91px;"/>
143-
<input type="submit" value="&#8659;" onclick="wd.onSendKeys(webdriver.Key.DOWN)"/>
144-
<input type="submit" value="&#8658;" onclick="wd.onSendKeys(webdriver.Key.RIGHT)"/>
145-
</div>
146-
</div>
113+
<input id="keyboard" type="text" style="display: none;"/>
147114
</div>
148115

149-
<div class="commandBlock">
116+
<div class="commandBlock ui-widget-content ui-corner-all">
150117
<input id="listWindowButton" type="submit" value="List window handles" onclick="wd.onListWindowHandles()"/>
151118
<select id="windowList" style="visibility: hidden;">
152119
</select>
153120
<input id="chooseWindow" type="submit" value="Choose window" onclick="wd.onChooseWindow()" style="visibility: hidden;"/>
154121
</div>
155122

156-
<div class="commandBlock">
123+
<div class="commandBlock ui-widget-content ui-corner-all">
157124
<input type="submit" value="Set window size" onclick="wd.onSetWindowSize()"/>
158125
<input name="windowSizeWidth" type="text" style="width: 50px"/>
159126
<span class="unitLabel">px</span> width and
160127
<input name="windowSizeHeight" type="text" style="width: 50px"/>
161128
<span class="unitLabel">px</span> height.
162129
</div>
163130

164-
<div class="commandBlock">
131+
<div class="commandBlock ui-widget-content ui-corner-all">
165132
<input name="disableMouseEvents" type="checkbox" style="width: 50px">Disable click events</input>
166133
</div>
167134

0 commit comments

Comments
 (0)