Add filter for Who's on First
Also change #sectionDisplay to #sectionWof for consistency with the manual.
This commit is contained in:
Daniel Sinn
+4
-147
@@ -94,155 +94,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="sectionDisplay">
|
<section id="sectionWof">
|
||||||
<h2>Who's on First</h2>
|
<h2>Who's on First</h2>
|
||||||
|
|
||||||
<dl id="displayList">
|
<div><input type="text" id="wofInput" /></div>
|
||||||
<dt> </dt> <dd>bottom-left</dd>
|
<dl id="wofList"></dl>
|
||||||
<dt>BLANK</dt> <dd>middle-right</dd>
|
<table id="wofTable"></table>
|
||||||
<dt>C</dt> <dd>top-right</dd>
|
|
||||||
<dt>CEE</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>DISPLAY</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>FIRST</dt> <dd>top-right</dd>
|
|
||||||
<dt>HOLD ON</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>LEAD</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>LED</dt> <dd>middle-left</dd>
|
|
||||||
<dt>LEED</dt> <dd>bottom-left</dd>
|
|
||||||
<dt>NO</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>NOTHING</dt> <dd>middle-left</dd>
|
|
||||||
<dt>OKAY</dt> <dd>top-right</dd>
|
|
||||||
<dt>READ</dt> <dd>middle-right</dd>
|
|
||||||
<dt>RED</dt> <dd>middle-right</dd>
|
|
||||||
<dt>REED</dt> <dd>bottom-left</dd>
|
|
||||||
<dt>SAYS</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>SEE</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>U</dt> <dd>top-left</dd>
|
|
||||||
<dt>UR</dt> <dd>top-left</dd>
|
|
||||||
<dt>THEIR</dt> <dd>middle-right</dd>
|
|
||||||
<dt>THERE</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>THEY ARE</dt> <dd>middle-left</dd>
|
|
||||||
<dt>THEY'RE</dt> <dd>bottom-left</dd>
|
|
||||||
<dt>YES</dt> <dd>middle-left</dd>
|
|
||||||
<dt>YOU</dt> <dd>middle-right</dd>
|
|
||||||
<dt>YOU ARE</dt> <dd>bottom-right</dd>
|
|
||||||
<dt>YOUR</dt> <dd>middle-right</dd>
|
|
||||||
<dt>YOU'RE</dt> <dd>middle-right</dd>
|
|
||||||
</dl>
|
|
||||||
|
|
||||||
<table id="displayTable">
|
|
||||||
<tr>
|
|
||||||
<th>"BLANK":</th>
|
|
||||||
<td>WAIT, RIGHT, OKAY, MIDDLE, BLANK</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"DONE":</th>
|
|
||||||
<td>SURE, UH HUH, NEXT, WHAT?, YOUR, UR, YOU'RE, HOLD, LIKE, YOU, U, YOU ARE, UH UH, DONE</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"FIRST":</th>
|
|
||||||
<td>LEFT, OKAY, YES, MIDDLE, NO, RIGHT, NOTHING, UHHH, WAIT, READY, BLANK, WHAT, PRESS, FIRST</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"HOLD":</th>
|
|
||||||
<td>YOU ARE, U, DONE, UH UH, YOU, UR, SURE, WHAT?, YOU'RE, NEXT, HOLD</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"LEFT":</th>
|
|
||||||
<td>RIGHT, LEFT</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"LIKE":</th>
|
|
||||||
<td>YOU'RE, NEXT, U, UR, HOLD, DONE, UH UH, WHAT?, UH HUH, YOU, LIKE</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"MIDDLE":</th>
|
|
||||||
<td>BLANK, READY, OKAY, WHAT, NOTHING, PRESS, NO, WAIT, LEFT, MIDDLE</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"NEXT":</th>
|
|
||||||
<td>WHAT?, UH HUH, UH UH, YOUR, HOLD, SURE, NEXT</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"NO":</th>
|
|
||||||
<td>BLANK, UHHH, WAIT, FIRST, WHAT, READY, RIGHT, YES, NOTHING, LEFT, PRESS, OKAY, NO</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"NOTHING":</th>
|
|
||||||
<td>UHHH, RIGHT, OKAY, MIDDLE, YES, BLANK, NO, PRESS, LEFT, WHAT, WAIT, FIRST, NOTHING</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"OKAY":</th>
|
|
||||||
<td>MIDDLE, NO, FIRST, YES, UHHH, NOTHING, WAIT, OKAY</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"PRESS":</th>
|
|
||||||
<td>RIGHT, MIDDLE, YES, READY, PRESS</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"READY":</th>
|
|
||||||
<td>YES, OKAY, WHAT, MIDDLE, LEFT, PRESS, RIGHT, BLANK, READY</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"RIGHT":</th>
|
|
||||||
<td>YES, NOTHING, READY, PRESS, NO, WAIT, WHAT, RIGHT</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"SURE":</th>
|
|
||||||
<td>YOU ARE, DONE, LIKE, YOU'RE, YOU, HOLD, UH HUH, UR, SURE</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"U":</th>
|
|
||||||
<td>UH HUH, SURE, NEXT, WHAT?, YOU'RE, UR, UH UH, DONE, U</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"UH HUH":</th>
|
|
||||||
<td>UH HUH</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"UH UH":</th>
|
|
||||||
<td>UR, U, YOU ARE, YOU'RE, NEXT, UH UH</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"UHHH":</th>
|
|
||||||
<td>READY, NOTHING, LEFT, WHAT, OKAY, YES, RIGHT, NO, PRESS, BLANK, UHHH</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"UR":</th>
|
|
||||||
<td>DONE, U, UR</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"WAIT":</th>
|
|
||||||
<td>UHHH, NO, BLANK, OKAY, YES, LEFT, FIRST, PRESS, WHAT, WAIT</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"WHAT":</th>
|
|
||||||
<td>UHHH, WHAT</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"WHAT?":</th>
|
|
||||||
<td>YOU, HOLD, YOU'RE, YOUR, U, DONE, UH UH, LIKE, YOU ARE, UH HUH, UR, NEXT, WHAT?</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"YES":</th>
|
|
||||||
<td>OKAY, RIGHT, UHHH, MIDDLE, FIRST, WHAT, PRESS, READY, NOTHING, YES</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"YOU ARE":</th>
|
|
||||||
<td>YOUR, NEXT, LIKE, UH HUH, WHAT?, DONE, UH UH, HOLD, YOU, U, YOU'RE, SURE, UR</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"YOU":</th>
|
|
||||||
<td>SURE, YOU ARE, YOUR, YOU'RE, NEXT, UH HUH, UR, HOLD, WHAT?, YOU</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"YOU'RE":</th>
|
|
||||||
<td>YOU, YOU'RE</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>"YOUR":</th>
|
|
||||||
<td>UH UH, YOU ARE, UH HUH, YOUR</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="sectionMemory">
|
<section id="sectionMemory">
|
||||||
|
|||||||
@@ -225,20 +225,20 @@ h2 {
|
|||||||
transform: rotate(-135deg);
|
transform: rotate(-135deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
#sectionDisplay {
|
#sectionWof {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
#sectionDisplay dl, #sectionDisplay table {
|
#sectionWof dl, #sectionWof table {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1em;
|
||||||
}
|
}
|
||||||
#sectionDisplay.collapsed dl, #sectionDisplay.collapsed table {
|
#sectionWof.collapsed dl, #sectionWof.collapsed table {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
#sectionDisplay dl {
|
#sectionWof dl {
|
||||||
margin-right: 4em;
|
margin-right: 4em;
|
||||||
}
|
}
|
||||||
#sectionDisplay dt {
|
#sectionWof dt {
|
||||||
background-color: black;
|
background-color: black;
|
||||||
clear: left;
|
clear: left;
|
||||||
color: white;
|
color: white;
|
||||||
@@ -246,18 +246,21 @@ h2 {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
width: 6em;
|
width: 6em;
|
||||||
}
|
}
|
||||||
#sectionDisplay dd {
|
#sectionWof dd {
|
||||||
margin-bottom: 0.4em;
|
margin-bottom: 0.4em;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
#sectionDisplay dt, #sectionDisplay dd {
|
#sectionWof dt, #sectionWof dd {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
#sectionDisplay table {
|
#sectionWof dt.inactive + dd {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
#sectionWof table {
|
||||||
margin-left: 0.5em;
|
margin-left: 0.5em;
|
||||||
}
|
}
|
||||||
#sectionDisplay th {
|
#sectionWof th {
|
||||||
border: 1px solid black;
|
border: 1px solid black;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -206,6 +206,122 @@ $('.jsResetSection').on('click', function () {
|
|||||||
}).first().trigger('change');
|
}).first().trigger('change');
|
||||||
})();
|
})();
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
/**
|
||||||
|
* Who's on First
|
||||||
|
*/
|
||||||
|
var TL = 'top-left',
|
||||||
|
TR = 'top-right',
|
||||||
|
ML = 'middle-left',
|
||||||
|
MR = 'middle-right',
|
||||||
|
BL = 'bottom-left',
|
||||||
|
BR = 'bottom-right',
|
||||||
|
displays = {
|
||||||
|
'\u00a0': BL,
|
||||||
|
'BLANK': MR,
|
||||||
|
'C': TR,
|
||||||
|
'CEE': BR,
|
||||||
|
'DISPLAY': BR,
|
||||||
|
'FIRST': TR,
|
||||||
|
'HOLD ON': BR,
|
||||||
|
'LEAD': BR,
|
||||||
|
'LED': ML,
|
||||||
|
'LEED': BL,
|
||||||
|
'NO': BR,
|
||||||
|
'NOTHING': ML,
|
||||||
|
'OKAY': TR,
|
||||||
|
'READ': MR,
|
||||||
|
'RED': MR,
|
||||||
|
'REED': BL,
|
||||||
|
'SAYS': BR,
|
||||||
|
'SEE': BR,
|
||||||
|
'U': TL,
|
||||||
|
'UR': TL,
|
||||||
|
'THEIR': MR,
|
||||||
|
'THERE': BR,
|
||||||
|
'THEY ARE': ML,
|
||||||
|
'THEY\'RE': BL,
|
||||||
|
'YES': ML,
|
||||||
|
'YOU': MR,
|
||||||
|
'YOU ARE': BR,
|
||||||
|
'YOUR': MR,
|
||||||
|
'YOU\'RE': MR
|
||||||
|
},
|
||||||
|
sequence = {
|
||||||
|
'BLANK': 'WAIT, RIGHT, OKAY, MIDDLE, BLANK',
|
||||||
|
'DONE': 'SURE, UH HUH, NEXT, WHAT?, YOUR, UR, YOU\'RE, HOLD, LIKE, YOU, U, YOU ARE, UH UH, DONE',
|
||||||
|
'FIRST': 'LEFT, OKAY, YES, MIDDLE, NO, RIGHT, NOTHING, UHHH, WAIT, READY, BLANK, WHAT, PRESS, FIRST',
|
||||||
|
'HOLD': 'YOU ARE, U, DONE, UH UH, YOU, UR, SURE, WHAT?, YOU\'RE, NEXT, HOLD',
|
||||||
|
'LEFT': 'RIGHT, LEFT',
|
||||||
|
'LIKE': 'YOU\'RE, NEXT, U, UR, HOLD, DONE, UH UH, WHAT?, UH HUH, YOU, LIKE',
|
||||||
|
'MIDDLE': 'BLANK, READY, OKAY, WHAT, NOTHING, PRESS, NO, WAIT, LEFT, MIDDLE',
|
||||||
|
'NEXT': 'WHAT?, UH HUH, UH UH, YOUR, HOLD, SURE, NEXT',
|
||||||
|
'NO': 'BLANK, UHHH, WAIT, FIRST, WHAT, READY, RIGHT, YES, NOTHING, LEFT, PRESS, OKAY, NO',
|
||||||
|
'NOTHING': 'UHHH, RIGHT, OKAY, MIDDLE, YES, BLANK, NO, PRESS, LEFT, WHAT, WAIT, FIRST, NOTHING',
|
||||||
|
'OKAY': 'MIDDLE, NO, FIRST, YES, UHHH, NOTHING, WAIT, OKAY',
|
||||||
|
'PRESS': 'RIGHT, MIDDLE, YES, READY, PRESS',
|
||||||
|
'READY': 'YES, OKAY, WHAT, MIDDLE, LEFT, PRESS, RIGHT, BLANK, READY',
|
||||||
|
'RIGHT': 'YES, NOTHING, READY, PRESS, NO, WAIT, WHAT, RIGHT',
|
||||||
|
'SURE': 'YOU ARE, DONE, LIKE, YOU\'RE, YOU, HOLD, UH HUH, UR, SURE',
|
||||||
|
'U': 'UH HUH, SURE, NEXT, WHAT?, YOU\'RE, UR, UH UH, DONE, U',
|
||||||
|
'UH HUH': 'UH HUH',
|
||||||
|
'UH UH': 'UR, U, YOU ARE, YOU\'RE, NEXT, UH UH',
|
||||||
|
'UHHH': 'READY, NOTHING, LEFT, WHAT, OKAY, YES, RIGHT, NO, PRESS, BLANK, UHHH',
|
||||||
|
'UR': 'DONE, U, UR',
|
||||||
|
'WAIT': 'UHHH, NO, BLANK, OKAY, YES, LEFT, FIRST, PRESS, WHAT, WAIT',
|
||||||
|
'WHAT': 'UHHH, WHAT',
|
||||||
|
'WHAT?': 'YOU, HOLD, YOU\'RE, YOUR, U, DONE, UH UH, LIKE, YOU ARE, UH HUH, UR, NEXT, WHAT?',
|
||||||
|
'YES': 'OKAY, RIGHT, UHHH, MIDDLE, FIRST, WHAT, PRESS, READY, NOTHING, YES',
|
||||||
|
'YOU ARE': 'YOUR, NEXT, LIKE, UH HUH, WHAT?, DONE, UH UH, HOLD, YOU, U, YOU\'RE, SURE, UR',
|
||||||
|
'YOU': 'SURE, YOU ARE, YOUR, YOU\'RE, NEXT, UH HUH, UR, HOLD, WHAT?, YOU',
|
||||||
|
'YOU\'RE': 'YOU, YOU\'RE',
|
||||||
|
'YOUR': 'UH UH, YOU ARE, UH HUH, YOUR'
|
||||||
|
},
|
||||||
|
$list = $('#wofList'),
|
||||||
|
$table = $('#wofTable'),
|
||||||
|
$displays = {},
|
||||||
|
$rows = {};
|
||||||
|
|
||||||
|
$.each(displays, function (word, location) {
|
||||||
|
var $dt = $('<dt>' + word + '</dt>');
|
||||||
|
$list.append($dt)
|
||||||
|
.append($('<dd>' + location + '</dd>'));
|
||||||
|
$displays[word] = $dt;
|
||||||
|
});
|
||||||
|
|
||||||
|
$.each(sequence, function (word, sequence) {
|
||||||
|
var $row = $('<tr></tr>')
|
||||||
|
.append('<th>"' + word + '":</th>')
|
||||||
|
.append('<td>' + sequence + '</td>');
|
||||||
|
$table.append($row);
|
||||||
|
$rows[word] = $row;
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#wofInput').on('keyup', function () {
|
||||||
|
var value = this.value.replace(/^ +| +|[^A-Za-z']$/, '').toUpperCase();
|
||||||
|
this.value = value;
|
||||||
|
|
||||||
|
$.each($displays, function (word, $dt) {
|
||||||
|
$dt.removeClass('inactive');
|
||||||
|
});
|
||||||
|
$.each($rows, function (word, $row) {
|
||||||
|
$row.removeClass('inactive');
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
$.each($displays, function (word, $dt) {
|
||||||
|
word.indexOf(value) !== 0 && $dt.addClass('inactive');
|
||||||
|
});
|
||||||
|
|
||||||
|
$.each($rows, function (word, $row) {
|
||||||
|
word.indexOf(value) !== 0 && $row.addClass('inactive');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
|
||||||
(function () {
|
(function () {
|
||||||
/**
|
/**
|
||||||
* Memory
|
* Memory
|
||||||
|
|||||||
Reference in New Issue
Block a user