Skip to content

Commit 0531706

Browse files
Merge commit 'f3bc0a29204dfabdf724b34018a210c038197bf4'
2 parents 04fba8e + f3bc0a2 commit 0531706

File tree

5 files changed

+142
-49
lines changed

5 files changed

+142
-49
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,4 @@ tmp/*
77
logs/*
88
conf/*.conf
99
conf/*.apache2-config
10+
courses.dist/*
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
##Usage Guide
2+
3+
You should really just be able to drop in ``keys.js`` and ``keys.css``
4+
5+
To create a keyboard just add
6+
7+
```javascript
8+
var testKeyboard = new Keys(['a','b','c']);
9+
testKeyboard.build();
10+
```
11+
12+
and everything else should be taken care of
13+
14+
At the moment multiple keyboards will overlap…I'll work on a solution to that o_0

htdocs/js/lib/vendor/keys/keys.css

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
2+
div#keyboard{
3+
position:fixed;
4+
top:-60px;
5+
height:60px;
6+
width:100%;
7+
z-index: 2000;
8+
overflow-x:scroll;
9+
-webkit-overflow-scrolling: touch;
10+
-webkit-transition: top 0.25s ease-in-out;
11+
-moz-transition: top 0.25s ease-in-out;
12+
-o-transition: top 0.25s ease-in-out;
13+
}
14+
15+
div#keyboard.visible{
16+
position:absolute;
17+
top:0px;
18+
}
19+
20+
div#keyboard .key {
21+
top: 18px;
22+
position: relative;
23+
opacity: 0.90;
24+
background: #ffff00;
25+
#padding: 18px 27px;
26+
padding: 18px 20px;
27+
-webkit-border-radius: 4px;
28+
-moz-border-radius: 4px;
29+
border-radius: 4px;
30+
color: #000000;
31+
font-size: 13px;
32+
font-family: Georgia, serif;
33+
text-decoration: none;
34+
vertical-align: middle;
35+
cursor:pointer;
36+
white-space: nowrap;
37+
}
38+
/*screws up iOS
39+
div#keyboard .key:hover {
40+
background: #1fa5ff;
41+
color: #ffffff;
42+
}*/
43+
div#keyboard .key:active {
44+
background: #1f1dff;
45+
}
Lines changed: 53 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
*
77
* @constructor
88
* @this {keys}
9-
* @param {Array} syms An array of characters that you want the new keyboard to containt (this can be added to later).
9+
* @param {Array} syms An array of characters that you want the new keyboard to contain (this can be added to later).
1010
* @param {Object} options An object containing options for the new keys, this is optional
1111
*/
1212
var Keys = function (syms, opt) {
@@ -66,44 +66,42 @@
6666
}
6767
if (!document.getElementById(self.board.id)) {
6868
document.body.appendChild(self.board);
69+
self.board.addEventListener('selectstart', function(event){event.preventDefault(); return false;}, false);
70+
self.board.addEventListener('select', function(event){event.preventDefault(); return false;}, false);
6971
}
7072

7173
self.symbols.forEach(function (key) {
7274
var button = document.createElement('a');
73-
button.value = key;
74-
button.innerHTML = key;
75-
button.className = "key";
76-
button.hidefocus = "true";
7775

78-
/*button.addEventListener('touchstart', function(event){
79-
event.preventDefault();
80-
}, false);*/
76+
if(!key.value && !key.display){
77+
button.value = key;
78+
button.innerHTML = key;
79+
} else {
80+
button.value = key.value;
81+
button.innerHTML = key.display;
82+
}
8183

82-
/*button.addEventListener('mouseup', function(event){
83-
event.preventDefault();
84-
}, false);*/
84+
button.className = "key";
8585

86-
var insertAtCaret = function(el,text) {
87-
var txtarea = el;
88-
var scrollPos = txtarea.scrollTop;
89-
var strPos = 0;
90-
strPos = txtarea.selectionStart;
91-
92-
var front = (txtarea.value).substring(0,strPos);
93-
var back = (txtarea.value).substring(strPos,txtarea.value.length);
94-
txtarea.value=front+text+back;
95-
strPos = strPos + text.length;
86+
var insertAtCaret = function(el,text) {
87+
var txtarea = el;
88+
var scrollPos = txtarea.scrollTop;
89+
var strPos = 0;
90+
strPos = txtarea.selectionStart;
91+
92+
var front = (txtarea.value).substring(0,strPos);
93+
var back = (txtarea.value).substring(strPos,txtarea.value.length);
94+
txtarea.value=front+text+back;
95+
strPos = strPos + text.length;
9696
txtarea.selectionStart = strPos;
97-
txtarea.selectionEnd = strPos;
98-
txtarea.focus();
99-
txtarea.scrollTop = scrollPos;
100-
}
97+
txtarea.selectionEnd = strPos;
98+
txtarea.focus();
99+
txtarea.scrollTop = scrollPos;
100+
}
101101

102102
button.hitButton = function (event) {
103-
104-
//event.preventDefault();
105-
//self.input.focus();
106-
//have to check for normal input vs just content editable at some point
103+
button.removeEventListener('touchend', button.hitButton, false);
104+
event.preventDefault();
107105

108106
if (self.input.replaceRange) {
109107
var cursor_temp = self.input.getCursor();
@@ -115,28 +113,29 @@ strPos = txtarea.selectionStart;
115113
} else {
116114
insertAtCaret(self.input, button.value);
117115
}
118-
event.preventDefault();
119-
button.removeEventListener('touchend', button.hitButton, false);
120116

121-
};
117+
if(key.behavior){
118+
key.behavior(self.input)
119+
};
122120

123-
button.addEventListener('touchstart',function(){
124-
//event.preventDefault();
121+
};
122+
var onTouchStart = function(){
125123
button.addEventListener('touchend', button.hitButton, false);
126-
}, false);
124+
};
125+
126+
button.addEventListener('touchstart', onTouchStart, false);
127127
button.addEventListener('touchmove', function(){
128-
//event.preventDefault();
129128
button.removeEventListener('touchend', button.hitButton, false);
130129
}, false);
131-
132-
if (self.options.debug) {
133-
button.addEventListener('mousedown', function (event) {
134-
event.preventDefault();
135-
}, false);
136-
button.addEventListener('mouseup', function (event) {
137-
event.preventDefault();
138-
}, false);
139-
button.addEventListener('click', button.hitButton, false);
130+
131+
button.addEventListener('mousedown', function (event) {
132+
event.preventDefault();
133+
}, false);
134+
button.addEventListener('mouseup', function (event) {
135+
event.preventDefault();
136+
}, false);
137+
if (self.options.debug && !((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1) || (navigator.userAgent.indexOf('iPad') != -1))) {
138+
button.addEventListener('click', button.hitButton, false);
140139
}
141140

142141
self.board.appendChild(button);
@@ -175,11 +174,13 @@ strPos = txtarea.selectionStart;
175174
window.addEventListener('scroll', function () {
176175
if (self.input) {
177176
self.board.style.top = window.pageYOffset + "px";
177+
self.board.style.left = window.pageXOffset + "px";
178178
}
179179
}, false);
180180
window.addEventListener('resize', function () {
181181
if (self.input) {
182182
self.board.style.top = window.pageYOffset + "px";
183+
self.board.style.left = window.pageXOffset + "px";
183184
self.board.style.width = window.innerWidth + "px";
184185
}
185186
}, false);
@@ -192,13 +193,20 @@ strPos = txtarea.selectionStart;
192193
this.removeClass('visible');
193194
this.input = false;
194195
this.board.style.top = "-60px";
196+
if(this.options.onHide){
197+
this.options.onHide();
198+
}
195199
}
196200

197201
Keys.prototype.show = function () {
198202
var self = this;
199203
this.addClass('visible');
200204
self.board.style.top = (window.pageYOffset) + "px";
205+
self.board.style.left = window.pageXOffset + "px";
201206
self.board.style.width = window.innerWidth + "px";
207+
if(self.options.onShow){
208+
self.options.onShow();
209+
}
202210
}
203211

204212
window.Keys = Keys;

lib/WeBWorK/ContentGenerator/Problem.pm

Lines changed: 29 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -796,9 +796,12 @@ sub warnings {
796796
sub head {
797797
my ($self) = @_;
798798
my $ce = $self->r->ce;
799-
799+
my $webwork_htdocs_url = $ce->{webwork_htdocs_url};
800800
return "" if ( $self->{invalidSet} );
801-
801+
print qq{
802+
<link rel="stylesheet" href="$webwork_htdocs_url/js/lib/vendor/keys/keys.css">
803+
<script src="$webwork_htdocs_url/js/lib/vendor/keys/keys.js"></script>
804+
};
802805
#If we are using achievements then print the achievement css file
803806
if ($ce->{achievementsEnabled}) {
804807
print "<link rel=\"stylesheet\" type=\"text/css\" href=\"$ce->{webworkURLs}->{htdocs}/css/achievements.css\"/>";
@@ -1317,13 +1320,35 @@ sub output_misc{
13171320
-name => 'problemSeed',
13181321
-value => $r->param("problemSeed")
13191322
)) if defined($r->param("problemSeed")) and $permissionLevel>= $professorPermissionLevel; # only allow this for professors
1320-
1323+
#HACK FIXME
1324+
print q{
1325+
<script language="javascript">
1326+
var new_keyboard = new Keys([
1327+
{value: 'sqrt()',
1328+
display: '$ \\\\sqrt{} $',
1329+
behavior:
1330+
function(input){
1331+
input.selectionStart -= 1;
1332+
input.selectionEnd -= 1;
1333+
//this.focus();
1334+
}
1335+
1336+
},
1337+
'^','=',
1338+
'(',')','+','-','*','/',
1339+
'1','2','3','4','5','6','7','8','9','0',
1340+
'{','}','_'],
1341+
{debug:false} );
1342+
new_keyboard.build();
1343+
</script>
1344+
};
13211345
return "";
13221346
}
13231347

13241348
# output_summary subroutine
13251349

1326-
# prints out the summary of the questions that the student has answered for the current problem, along with available information about correctness
1350+
# prints out the summary of the questions that the student has answered
1351+
# for the current problem, along with available information about correctness
13271352

13281353
sub output_summary{
13291354

0 commit comments

Comments
 (0)