ndwarshuis
/
wolfchart
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update to v2.3 

see readme for details
This commit is contained in:
Ballantyne de Wolf 2021-07-02 22:41:20 +10:00
parent 85715cfb52
commit 1353908a76
2 changed files with 326 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
README.md
View File

@ -1,4 +1,4 @@
# WolfChart v2.0 # WolfChart v2.3
by Ballantyne de Wolf, Offspring Digital by Ballantyne de Wolf, Offspring Digital
This is professional optometrist/optician/ophthalmologist tool for sight testing. It cannot be used safely by the general public. This is professional optometrist/optician/ophthalmologist tool for sight testing. It cannot be used safely by the general public.
@ -10,7 +10,26 @@ Now that's out of the way, the objectives are:
3. Can be used on a wide variety of screen hardware 3. Can be used on a wide variety of screen hardware
3. Customisable optotypes and alphabets to come eg Arabic, Hebrew, Chinese, Thai, Cyrillic etc 3. Customisable optotypes and alphabets to come eg Arabic, Hebrew, Chinese, Thai, Cyrillic etc
To Do List Ver2.3
- Bug fixes
- guide dots on V charts hide and show behaviour fixed
- shuffle and duochrome disabled in single and column modes
-
- Additions
- Experimental optotypes in Chinese, Arabic and Hebrew
- Removed the Man from Shapes5, leaving 5 shapes in use, and set out alphabet to work better vertically
Ver2.2
- Bug fixes
- moved SVG transforms to css transforms. Safari doesn't implement SVG transform, all browsers implement SVG.css transform. Means have to add units
- fixed badly-written rotate90 function, also not working on Safari
- Rejigged Snellen BS4724 6/6 and 6/5 lines to get rid of an FU
- fixed sidebar controls not responding to nav links
- fixed text-decoration in nav-button-div a
- Additions
- characterClick now cycles through: mask one letter > mask column of letters > show all >
Ver2.1 Ver2.1
- Now displays charts in 4 categories, using direction buttons and keys to navigate - Now displays charts in 4 categories, using direction buttons and keys to navigate
@ -22,6 +41,7 @@ Ver2.1
- Removed colour pickers, replaced with text, preset buttons and hue-only sliders for filter tests - Removed colour pickers, replaced with text, preset buttons and hue-only sliders for filter tests
- Various improvements under bonnet - Various improvements under bonnet
- Switched off PWA features like manifest and sw.js - will maybe bring them back later. - Switched off PWA features like manifest and sw.js - will maybe bring them back later.
- Versioned as X.y in localStorage
Ver1.8 Ver1.8
- fixed bug of bg colour not stored on first use. - fixed bug of bg colour not stored on first use.

396
index.htm
View File

@ -8,7 +8,7 @@
<html lang=en> <html lang=en>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>WolfChart v</title> <title>WolfChart</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAdCAMAAAD8QJ61AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRFqamphoaGxcXF1tbW9/f3U1NTLi4uurq64+PjnZ2ddHR07Ozsk5OTAAAA////////NZC25gAAABB0Uk5T////////////////////AOAjXRkAAAFRSURBVHjadFNZYsUgCATU4AJ6/9sWFVP72vJhCA4wLMK4hUoYHwKXHgp3xj4I+C9AQw6994ZIHZjpF6DGviTPL2YuF4ARGofoCJfSDyDX3CPUzuXc1XlAPAB0c3pcacozC0rcAHeMj4IH0LotAjcAVB8PoOqxpBtAyDOYPewAqu5U4oCSPYOZNU1tKk4nWYRDXXRdPM/66nZrGF5A0h9ySsOTIv68PzkMELEtOh+AzXcCRsS8M6QyD+OQxI6rFeK1W5+qNrSPvDkwOsBrsMhozutntpvZGhXhroHq0VZP0AB5QjOk3QA+0Af3zGE09lYuZ5q4BOS7gfe4eycj+uzYPovJYQSp4SyCyilwjS37yr0xzP2d5AxwdjLQPRDrbFi8iN6txskpeztsd4SsvRG/1z4ai1BFxEAFZT4vKNLudwE2lRHJctH/T8+klPJh+RJgAA5sKxGB5VuMAAAAAElFTkSuQmCC" /> <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAdCAMAAAD8QJ61AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRFqamphoaGxcXF1tbW9/f3U1NTLi4uurq64+PjnZ2ddHR07Ozsk5OTAAAA////////NZC25gAAABB0Uk5T////////////////////AOAjXRkAAAFRSURBVHjadFNZYsUgCATU4AJ6/9sWFVP72vJhCA4wLMK4hUoYHwKXHgp3xj4I+C9AQw6994ZIHZjpF6DGviTPL2YuF4ARGofoCJfSDyDX3CPUzuXc1XlAPAB0c3pcacozC0rcAHeMj4IH0LotAjcAVB8PoOqxpBtAyDOYPewAqu5U4oCSPYOZNU1tKk4nWYRDXXRdPM/66nZrGF5A0h9ySsOTIv68PzkMELEtOh+AzXcCRsS8M6QyD+OQxI6rFeK1W5+qNrSPvDkwOsBrsMhozutntpvZGhXhroHq0VZP0AB5QjOk3QA+0Af3zGE09lYuZ5q4BOS7gfe4eycj+uzYPovJYQSp4SyCyilwjS37yr0xzP2d5AxwdjLQPRDrbFi8iN6txskpeztsd4SsvRG/1z4ai1BFxEAFZT4vKNLudwE2lRHJctH/T8+klPJh+RJgAA5sKxGB5VuMAAAAAElFTkSuQmCC" />
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1"> <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
<style type="text/css"> <style type="text/css">
@ -566,9 +566,6 @@
float: left; float: left;
cursor: pointer; cursor: pointer;
} }
.char-line svg.guide-dot {
cursor: default;
}
.char-line svg.disable { .char-line svg.disable {
opacity: 0; opacity: 0;
@ -721,7 +718,6 @@
} }
#nav-button-div { #nav-button-div {
display: block; display: block;
text-decoration: none;
border-radius:31px 0 0 31px; border-radius:31px 0 0 31px;
background-color: rgb(204,204,204); background-color: rgb(204,204,204);
position:relative; position:relative;
@ -731,6 +727,7 @@
} }
#nav-button-div a{ #nav-button-div a{
cursor: pointer; cursor: pointer;
text-decoration: none;
display:inline-block; display:inline-block;
height:100%; height:100%;
width:62px; width:62px;
@ -876,6 +873,10 @@
<option value="4">TumblingE</option> <option value="4">TumblingE</option>
<option value="5">Vanishing Sloan</option> <option value="5">Vanishing Sloan</option>
<option value="6">Shapes</option> <option value="6">Shapes</option>
<option value="7">Chinese (beta)</option>
<option value="8">Arabic (beta)</option>
<option value="9">Hebrew</option>
<!-- <option value="10">Crowded HOTV</option> -->
</select> </select>
</div> </div>
</div> </div>
@ -1079,7 +1080,7 @@
</svg> </svg>
</a> </a>
<div class="panel-body"> <div class="panel-body">
<strong>Very quick guide: </strong>Calibrate and configure your chart using the Settings form and consult this help guide if you get stuck. You will need a measuring tape to measure viewing distance and a ruler to measure the calibration line.<br />Charts are in 4 categories; V for VA, R for Refraction, B for Binocular and M for Miscellaneous. Use the onscreen arrows or arrows on your keyboard to navigate horizontally between categories and vertically within categories. Alternatively, the category buttons in the flyout at bottom right give you one-click access to your most-used chart in that category. These category links are also mapped to the corresponding letters on your keyboard.<br />Click or tap on any letter to mask it. Click or tap on any line label to mask that line. Click or tap again to unmask. If there is a round button in the sidebar below the navigation arrows, the chart has a function mapped to the spacebar, such as zoom or rotate. You can also activate the function by clicking on or tapping the chart itself or the button.<br /><strong>Why is one of the charts just black?</strong><br />So you can darken your room with one click.<br /><br /> <strong>Very quick guide: </strong>Calibrate and configure your chart using the Settings form and consult this help guide if you get stuck. You will need a measuring tape to measure viewing distance and a ruler to measure the calibration line.<br />Charts are in 4 categories; V for VA, R for Refraction, B for Binocular and M for Miscellaneous. Use the onscreen arrows or arrows on your keyboard to navigate horizontally between categories and vertically within categories. Alternatively, the category buttons in the flyout at bottom right give you one-click access to your most-used chart in that category. These category links are also mapped to the corresponding letters on your keyboard.<br />Click or tap on any line label to mask that line. Click or tap again to unmask. <br />Click or tap on any letter to mask it. Click or tap on it again to mask a column of letters. Click or tap on any letter in the column to show all again. <br />If there is a round button in the sidebar below the navigation arrows, the chart has a function mapped to the spacebar, such as zoom or rotate. You can also activate the function by clicking on or tapping the chart itself or the button.<br /><strong>Why is one of the charts just black?</strong><br />So you can darken your room with one click.<br /><br />
</div> </div>
<div class="accordion"> <div class="accordion">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
@ -1577,7 +1578,7 @@
<svg id="Sloan_S" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Sloan_S" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 5 1.5 A 1.5 1.5 0 0 0 3.5 0 H 1.5 A 1.5 1.5 0 0 0 1.5 3 H 3.5 A 0.5 0.5 0 0 1 3.5 4 H 1.5 A 0.5 0.5 0 0 1 1 3.5 H 0 A 1.5 1.5 0 0 0 1.5 5 H 3.5 A 1.5 1.5 0 1 0 3.5 2 H 1.5 A 0.5 0.5 0 1 1 1.5 1 H 3.5 A 0.5 0.5 0 0 1 4 1.5 H 5" fill="black"></path> <path d="M 5 1.5 A 1.5 1.5 0 0 0 3.5 0 H 1.5 A 1.5 1.5 0 0 0 1.5 3 H 3.5 A 0.5 0.5 0 0 1 3.5 4 H 1.5 A 0.5 0.5 0 0 1 1 3.5 H 0 A 1.5 1.5 0 0 0 1.5 5 H 3.5 A 1.5 1.5 0 1 0 3.5 2 H 1.5 A 0.5 0.5 0 1 1 1.5 1 H 3.5 A 0.5 0.5 0 0 1 4 1.5 H 5" fill="black"></path>
</svg> </svg>
<svg id="Sloan_T" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Sloan_T" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<polygon points="0,0 5,0 5,1 3,1 3,5 2,5 2,1 0,1" fill="black" /> <polygon points="0,0 5,0 5,1 3,1 3,5 2,5 2,1 0,1" fill="black" />
</svg> </svg>
<svg id="Sloan_V" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Sloan_V" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
@ -1686,36 +1687,158 @@
<path d="M 0.23 0.23 H 4.77 V 0.9 L 1.05 4.23 H 4.77 V 4.77 H 0.23 V 4.1 L 4 0.77 H 0.23 V 0.23" fill="black" stroke="none"></path> <path d="M 0.23 0.23 H 4.77 V 0.9 L 1.05 4.23 H 4.77 V 4.77 H 0.23 V 4.1 L 4 0.77 H 0.23 V 0.23" fill="black" stroke="none"></path>
</svg> </svg>
<!--new Shapes 5x5--> <!--new Shapes 5x5-->
<svg id="Shape5_C" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Shape5_0" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H3V2H5V3H3V5H2V3H0V2H2z" fill="black" stroke="none"></path> <path d="M2 0H3V2H5V3H3V5H2V3H0V2H2z" fill="black" stroke="none"></path>
</svg> </svg>
<svg id="Shape5_M" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Shape5_M" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 2H5V3H3.2L4.5 5H3.3L2.5 3.8L1.7 5H0.5L1.8 3H0z" fill="black"></path> <path d="M0 2H5V3H3.2L4.5 5H3.3L2.5 3.8L1.7 5H0.5L1.8 3H0z" fill="black"></path>
<circle cx="2.5" cy="1" r="1" fill="black" stroke="none"></circle> <circle cx="2.5" cy="1" r="1" fill="black" stroke="none"></circle>
</svg> </svg>
<svg id="Shape5_S" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Shape5_1" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 0H5V5H0V1H1V4H4V1H0z" fill="black" stroke="none"></path> <path d="M0 0H5V5H0V1H1V4H4V1H0z" fill="black" stroke="none"></path>
</svg> </svg>
<svg id="Shape5_T" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Shape5_2" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 5L2.5 0L5 5H3.7L2.5 2.5L1.3 5z" fill="black" stroke="none"></path> <path d="M0 5L2.5 0L5 5H3.7L2.5 2.5L1.3 5z" fill="black" stroke="none"></path>
</svg> </svg>
<svg id="Shape5_O" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Shape5_3" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M2.5 0 A 2.5 2.5 0 0 1 2.5 5 V 4 A 1.5 1.5 0 0 0 2.5 1 A 1.5 1.5 0 0 0 2.5 4 V 5 A 2.5 2.5 0 0 1 2.5 0" fill="black" stroke="none"></path> <path d="M2.5 0 A 2.5 2.5 0 0 1 2.5 5 V 4 A 1.5 1.5 0 0 0 2.5 1 A 1.5 1.5 0 0 0 2.5 4 V 5 A 2.5 2.5 0 0 1 2.5 0" fill="black" stroke="none"></path>
</svg> </svg>
<svg id="Shape5_F" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="Shape5_4" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none"></path> <path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none"></path>
<path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(72,2.5,2.5)"></path> <path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(72,2.5,2.5)"></path>
<path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(144,2.5,2.5)"></path> <path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(144,2.5,2.5)"></path>
<path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(216,2.5,2.5)"></path> <path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(216,2.5,2.5)"></path>
<path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(288,2.5,2.5)"></path> <path d="M2 0H3V2L2.5 2.5L2 2zz" fill="black" stroke="none" transform="rotate(288,2.5,2.5)"></path>
</svg> </svg>
<!-- Chinese01 - experimental -->
<svg id="Chinese01_0" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 0H5V1H2.25L2.1 2H4.5V4H5V5H3.5V3H1.9L1.5 4H3.5V5H0V4H0.5L0.9 3H0.5V2H1.1L1.25 1H0V0z" fill="black"></path>
</svg>
<svg id="Chinese01_1" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H3V1H5V4H3V3H4V2H3V5H2V4H0V1H2V2H1V3H2V0z" fill="black"></path>
</svg>
<svg id="Chinese01_2" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M1 0H2V1H5V2H2V4H4V3H5V5H1V2H0V1H1V0z" fill="black"></path>
</svg>
<svg id="Chinese01_3" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 0H5V2H4V1H1V2H5V5H0V3H1V4H4V3H0V0z" fill="black"></path>
</svg>
<svg id="Chinese01_4" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 1H1.9L2 0H3L3.1 1H5V2H3.4C3.8 3 4.2 4 5 5H3.8C3.2 4 2.8 3.3 2.5 2.3C2.2 3.3 1.8 4 1.2 5H0C0.8 4 1.2 3 1.6 2H0V1z" fill="black"></path>
</svg>
<svg id="Chinese01_5" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0.5 0H4.5V1H0.5V0zM0.5 2H4.5V3H0.5V2zM0 4H5V5H0V4z" fill="black"></path>
</svg>
<svg id="Chinese01_6" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H3V1H5V2H3V4H5V5H0V4H2V0z" fill="black"></path>
</svg>
<svg id="Chinese01_7" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,6,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M1 0H2V5H0V4H1V0zM3 0H4V4H3V0zM5 0H6V5H5V0z" fill="black"></path>
</svg>
<svg id="Chinese01_8" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0.5 0H4.5V1H3V4H5V5H0V4H2V1H0.5V0z" fill="black"></path>
</svg>
<svg id="Chinese01_9" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 1H2.1L2.2 0H3.2L3.1 1H4A1 1 0 0 1 5 2V4A1 1 0 0 1 4 5H3V4H3.75A0.25 0.25 0 0 0 4 3.75V2.25A0.25 0.25 0 0 0 3.75 2H2.9C2.55 3 1.9 4 1.2 5H0C0.8 4 1.4 3 1.9 2H0V1z" fill="black"></path>
</svg>
<!-- Arabic - experimental - thanks to Alice Kswani -->
<svg id="Arabic01_0" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M1 0H3V1H2V2H3V3H0V2H1V0zM4 0H5V5H0V4H4V0z" fill="black"></path>
</svg>
<svg id="Arabic01_1" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M0 1H1V4H4V3H2V0H5V1H3V2H5V5H0V1z" fill="black"></path>
</svg>
<svg id="Arabic01_2" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M0 2H1V4H4V2H5V5H0V2zM1 0H2V1H1V0M3 0H4V1H3V0z" fill="black"></path>
</svg>
<svg id="Arabic01_3" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M2 0H5V5H0V4H4V3H2V1H3V2H4V1H2V0z" fill="black"></path>
</svg>
<svg id="Arabic01_4" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M0 2H1V4H4V0H5V5H0V2z" fill="black"></path>
</svg>
<svg id="Arabic01_5" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M0 0H1V2H4V0H5V3H0V0zM2 4H3V5H2V4z" fill="black"></path>
</svg>
<svg id="Arabic01_6" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M0 0H5V1H2.5C1 3 1 4 2 4H5V5H1.5C-0.25 5 -0.25 3 1.25 1H0V0z" fill="black"></path>
</svg>
<svg id="Arabic01_7" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M1 0H2A3 3 0 0 1 5 3V5H0V4H4V3.5A2.5 2.5 0 0 0 1.5 1H1V0z" fill="black"></path>
</svg>
<svg id="Arabic01_8" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M1 0H2V2H5V5H2V4H4V3H2V5H0V4H1V0z" fill="black"></path>
</svg>
<svg id="Arabic01_9" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm"
style="margin: 3.49mm;">
<path d="M2 0H5V1H3V2H4V3H1V4H5V5H0V2H2V0z" fill="black"></path>
</svg>
<!-- Hebrew01 -->
<svg id="Hebrew01_0" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 0 V2 C 0 5.8 4.6 5.78 4.8 3 L5 0 H 4 L3.8 3 C 3.55 4.5 1.4 4.1 1.2 3 Q 2.8 3 2.9 2 L 3 0 H 2 L 1.9 1.5 Q 1.8 2.1 1 2 V 0 H 0" fill="black"></path>
</svg>
<svg id="Hebrew01_1" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,4,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M0 0H 1.1 L2.15 2.55C2.6 2 2.8 1.5 2.95 0L4 0.2C3.8 2.5 3 4 0.2 5L0 3.95C0.5 3.7 0.7 3.7 1.3 3.3L0 0z" fill="black"></path>
</svg>
<svg id="Hebrew01_2" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0 H 3 Q 4.9 0 5 2.5 V 5 5 H 4 V 3.5 Q 4.15 0.9 2.5 1 H 2 V 4 Q 2 4.9 1 5 H 0 V 4 Q 1.05 4.1 1 3.5 V 1 H 0 V 0" fill="black"></path>
</svg>
<svg id="Hebrew01_3" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,4,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0.25 C 5.3 -1.4 5.3 6.4 0 4.75 V 3.75 C 4 5.4 3.7 0 0.9 0.9 V 1.5 Q 0.9 2.4 1.5 2.2 V 3.1 Q 0.1 3.3 0 1.5 V 0.25" fill="black"></path>
</svg>
<svg id="Hebrew01_4" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,4,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0 H 1.1 L 2.3 2.1 Q 3.1 1.8 3 0 H 4 Q 4.1 2.2 2.8 3 L 4 5 H 2.9 L 1.35 2.3 Q 1.1 2.4 1.1 3 L 1 5 H 0 Q 0 1.8 0.8 1.4 L 0 0" fill="black"></path>
</svg>
<svg id="Hebrew01_5" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,3.5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0.5 0 H 1.5 Q 2.9 0.2 3 1.5 V 3.5 L 3.5 5 H 2.5 L 2.1 3.8 Q 1 3.7 1 5 H 0 Q 0 3 2 2.85 V 2 Q 2 1 1 1 H 0.5 V 0" fill="black"></path>
</svg>
<svg id="Hebrew01_6" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,4,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0.25 C 5.3 -1.4 5.3 6.4 0 4.75 V 3.75 C 4 5.4 4 -0.4 0 1.25 V 0.25" fill="black"></path>
</svg>
<svg id="Hebrew01_7" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,4,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0 L 2.8 4 H 0 V 5 H 4 V 3.9 L 2.9 2.4 Q 4 2 4 1 V 0 H 3 V 0.5 Q 3 1.4 2.4 1.7 L 1.2 0 H 0" fill="black"></path>
</svg>
<svg id="Hebrew01_8" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,4,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0 H 4 V 1 H 3 V 5 H 2 V 1 H 0 V 0" fill="black"></path>
</svg>
<svg id="Hebrew01_9" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<path d="M 0 0 H 2 Q 4 0 4 2 V 4 H 5 V 5 H 0 V 4 H 3 V 2.5 Q 3 1.1 2 1 H 0 V 0" fill="black"></path>
</svg>
<!-- Crowded HOTV -->
<svg id="CrowdedHOTV01_0" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,8,9" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H6V1H2V0zM7 2H8V7H7V2zM2 8H6V9H2V8zM0 2H1V7H0V2z" fill="black"></path>
<path d="M2 2H3V4H5V2H6V7H5V5H3V7H2V2z" fill="black"></path>
</svg>
<svg id="CrowdedHOTV01_1" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,9,9" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H7V1H2V0zM8 2H9V7H8V2zM2 8H7V9H2V8zM0 2H1V7H0V2z" fill="black"></path>
<path d="M4.5 2A2.5 2.5 0 1 1 4.5 7V6A1.5 1.5 0 1 0 4.5 3V2z" fill="black"></path>
<path d="M4.5 2A2.5 2.5 0 1 0 4.5 7V6A1.5 1.5 0 1 1 4.5 3V2z" fill="black"></path>
</svg>
<svg id="CrowdedHOTV01_2" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,8,9" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H6V1H2V0zM7 2H8V7H7V2zM2 8H6V9H2V8zM0 2H1V7H0V2z" fill="black"></path>
<path d="M2 2H6V3H4.5V7H3.5V3H2V2z" fill="black"></path>
</svg>
<svg id="CrowdedHOTV01_3" class="optotype-symbol" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,8,9" height="8.73mm" style="margin: 3.49mm;">
<path d="M2 0H6V1H2V0zM7 2H8V7H7V2zM2 8H6V9H2V8zM0 2H1V7H0V2z" fill="black"></path>
<path d="M2 2H3.1L4 5.2L4.9 2H6L4.5 7H3.5L2 2z" fill="black"></path>
</svg>
<!-- end of optotype svgs -->
<!-- other letter chart furniture--> <!-- other letter chart furniture-->
<!-- guides for 6/12 and 6/6 ---> <!-- guides for 6/12 and 6/6 --->
<svg id="red_rect" class="guide-dot" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="red_rect" class="guide-dot" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<rect x="0" cy="0" width="5" height="5" fill="rgba(255,0,0,1)" stroke="rgba(100,100,125,1)" stroke-width="0.05" /> <rect x="0" cy="0" width="5" height="5" fill="rgba(255,0,0,1)" stroke="none" />
</svg> </svg>
<svg id="green_dot" class="guide-dot" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;"> <svg id="green_dot" class="guide-dot" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0,0,5,5" height="8.73mm" style="margin: 3.49mm;">
<circle cx="2.5" cy="2.5" r="1.5" fill="rgba(0,200,127,1)" stroke="rgba(100,120,106,1)" stroke-width="0.05" /> <circle cx="2.5" cy="2.5" r="2.5" fill="rgba(0,200,127,1)" stroke="none" />
</svg> </svg>
<!-- arrows and buttons for navigation --> <!-- arrows and buttons for navigation -->
<div id="buttons"> <div id="buttons">
@ -1868,8 +1991,8 @@
return this.pushStack(this.get().reverse(), arguments); return this.pushStack(this.get().reverse(), arguments);
}; };
//Version number //Version number
var ver = 2.1; var ver = 2.3;
document.title += ver; document.title += " v"+ver;
//main js //main js
function configBarSetting() { function configBarSetting() {
this.sidebar = function () { this.sidebar = function () {
@ -2159,7 +2282,7 @@
} }
} }
this.sidebarControls = function (selCat) { this.sidebarControls = function (selCat, selChart) {
var callBackFunction = this; var callBackFunction = this;
var thisLink = $('#bt'+objWolf[selCat].cat); var thisLink = $('#bt'+objWolf[selCat].cat);
var thisCol = objWolf[selCat].col; var thisCol = objWolf[selCat].col;
@ -2215,8 +2338,10 @@
$('.shuffle-button').show(); $('.shuffle-button').show();
} else { } else {
$('.f-button').hide(); $('.f-button').hide();
$('.bg-button').hide();
$('.shuffle-button').hide();
// display a space bar function button // display a space bar function button
var thisSVG = $('#' + objWolf.chartThisId).find('svg'), thisChart = objWolf[objWolf.catThis].arCharts[objWolf.chartThis]; var thisChart = objWolf[selCat].arCharts[selChart], thisSVG = $('#' + thisChart.id).find('svg');
if (thisSVG.length > 0) { if (thisSVG.length > 0) {
objWolf.hasSBFunc.forEach(function (el, idx) { objWolf.hasSBFunc.forEach(function (el, idx) {
if (thisSVG[0].id == el[0]) { if (thisSVG[0].id == el[0]) {
@ -2303,7 +2428,7 @@
setTimeout(function() { setTimeout(function() {
outGoingChart.removeClass(anims.join(' ')).hide(); outGoingChart.removeClass(anims.join(' ')).hide();
inComingChart.addClass(objWolf.animIn).show(); inComingChart.addClass(objWolf.animIn).show();
functionConfigWolfChart.sidebarControls(objWolf.catThis); functionConfigWolfChart.sidebarControls(selCat,selChart);
},200); },200);
}, },
function() { function() {
@ -2313,13 +2438,14 @@
} else {//using navigation buttons } else {//using navigation buttons
outGoingChart.removeClass(anims.join(' ')).hide(); outGoingChart.removeClass(anims.join(' ')).hide();
inComingChart.show(); inComingChart.show();
functionConfigWolfChart.sidebarControls(objWolf.catThis); functionConfigWolfChart.sidebarControls(selCat,selChart);
} }
} else {//first use } else {//first use
$(charts[selChart]).show(); $(charts[selChart]).show();
functionConfigWolfChart.sidebarControls(objWolf.catThis); functionConfigWolfChart.sidebarControls(selCat,selChart);
} }
//navigation to and display of chart is now finished
//update cat and chartThis //update cat and chartThis
objWolf.chartThis = selChart; objWolf.chartThis = selChart;
objWolf.chartThisId = charts[selChart].id; objWolf.chartThisId = charts[selChart].id;
@ -2353,17 +2479,30 @@
$('#sAlphabet').append('<option value="3">ETDRS</option><option value="4">SloanU</option>'); $('#sAlphabet').append('<option value="3">ETDRS</option><option value="4">SloanU</option>');
break; break;
case '3': case '3':
$('#sAlphabet').append('<option value="5">Landolt C</option>'); $('#sAlphabet').append('<option value="5">Landolt_5Chars_01</option>');
break; break;
case '4': case '4':
$('#sAlphabet').append('<option value="6">Tumbling E</option>'); $('#sAlphabet').append('<option value="6">Tumbling_5Chars_01</option>');
break; break;
case '5': case '5':
$('#sAlphabet').append('<option value="7">Vanishing ETDRS</option>'); $('#sAlphabet').append('<option value="7">Vanishing_5Chars_01</option>');
break; break;
case '6': case '6':
$('#sAlphabet').append('<option value="8">Shapes</option>'); $('#sAlphabet').append('<option value="8">Shapes_5Chars_01</option>');
break; break;
case '7':
$('#sAlphabet').append('<option value="9">Chinese_5Chars_01</option>');
break;
case '8':
$('#sAlphabet').append('<option value="10">Arabic_5chars_01</option>');
break;
case '9':
$('#sAlphabet').append('<option value="11">Hebrew_5Chars_01</option>');
break;
/* case '10':
$('#sAlphabet').append('<option value="13">Crowded HOTV 3</option><option value="12">Crowded HOTV 1</option>');
break; */
} }
}); });
}; };
@ -2403,6 +2542,7 @@
}; };
}; };
this.CaculatorCharacterHeight = function (numeratorType) { this.CaculatorCharacterHeight = function (numeratorType) {
//sets the VA value to be displayed in scoreBox div
var setHeightFunction = this; var setHeightFunction = this;
var dist = $('#iDistance').val(); var dist = $('#iDistance').val();
switch (notation) { switch (notation) {
@ -2464,7 +2604,7 @@
//set height for character //set height for character
setHeightFunction.SetHeightCharacter(dist) setHeightFunction.SetHeightCharacter(dist)
}; };
this.GenerateCharacter = function (alphabetType) { this.GenerateCharacter = function (alphabetType,localOptotype) {
var arrayCharacter = [], var arrayCharacter = [],
convertFunction = this; convertFunction = this;
switch (alphabetType) { switch (alphabetType) {
@ -2473,7 +2613,7 @@
arrayCharacter = ['Snellen_N,Snellen_L,Snellen_A,Snellen_Y,Snellen_Z', 'Snellen_E,Snellen_F,Snellen_R,Snellen_D,Snellen_U', 'Snellen_T,Snellen_P,Snellen_V,Snellen_H,Snellen_X', 'Snellen_Y,Snellen_E,Snellen_L,Snellen_R,Snellen_T', 'Snellen_F,Snellen_X,Snellen_U,Snellen_D,Snellen_H', 'Snellen_A,Snellen_N,Snellen_P,Snellen_V,Snellen_Z', 'Snellen_H,Snellen_Z,Snellen_T,Snellen_Y,Snellen_D', 'Snellen_V,Snellen_F,Snellen_X,Snellen_N,Snellen_R', 'Snellen_A,Snellen_L,Snellen_P,Snellen_U,Snellen_E', 'Snellen_P,Snellen_U,Snellen_V,Snellen_F,Snellen_Y', 'Snellen_T,Snellen_A,Snellen_H,Snellen_E,Snellen_D', 'Snellen_L,Snellen_R,Snellen_N,Snellen_Z,Snellen_X', 'Snellen_D,Snellen_Y,Snellen_P,Snellen_L,Snellen_N', 'Snellen_Z,Snellen_A,Snellen_T,Snellen_F,Snellen_R'] arrayCharacter = ['Snellen_N,Snellen_L,Snellen_A,Snellen_Y,Snellen_Z', 'Snellen_E,Snellen_F,Snellen_R,Snellen_D,Snellen_U', 'Snellen_T,Snellen_P,Snellen_V,Snellen_H,Snellen_X', 'Snellen_Y,Snellen_E,Snellen_L,Snellen_R,Snellen_T', 'Snellen_F,Snellen_X,Snellen_U,Snellen_D,Snellen_H', 'Snellen_A,Snellen_N,Snellen_P,Snellen_V,Snellen_Z', 'Snellen_H,Snellen_Z,Snellen_T,Snellen_Y,Snellen_D', 'Snellen_V,Snellen_F,Snellen_X,Snellen_N,Snellen_R', 'Snellen_A,Snellen_L,Snellen_P,Snellen_U,Snellen_E', 'Snellen_P,Snellen_U,Snellen_V,Snellen_F,Snellen_Y', 'Snellen_T,Snellen_A,Snellen_H,Snellen_E,Snellen_D', 'Snellen_L,Snellen_R,Snellen_N,Snellen_Z,Snellen_X', 'Snellen_D,Snellen_Y,Snellen_P,Snellen_L,Snellen_N', 'Snellen_Z,Snellen_A,Snellen_T,Snellen_F,Snellen_R']
break; break;
case '2'://BS4274.3 case '2'://BS4274.3
arrayCharacter = ['Snellen_U,Snellen_R,Snellen_N,Snellen_D,Snellen_V', 'Snellen_N,Snellen_F,Snellen_R,Snellen_Z,Snellen_E', 'Snellen_P,Snellen_H,Snellen_D,Snellen_F,Snellen_U', 'Snellen_R,Snellen_P,Snellen_N,Snellen_E,Snellen_Z', 'Snellen_D,Snellen_V,Snellen_E,Snellen_P,Snellen_R', 'Snellen_U,Snellen_D,Snellen_H,Snellen_V,Snellen_N', 'Snellen_Z,Snellen_U,Snellen_V,Snellen_F,Snellen_P', 'Snellen_E,Snellen_R,Snellen_D,Snellen_H,Snellen_Z', 'Snellen_U,Snellen_D,Snellen_P,Snellen_N,Snellen_F', 'Snellen_V,Snellen_E,Snellen_H,Snellen_U,Snellen_P', 'Snellen_F,Snellen_Z,Snellen_V,Snellen_R,Snellen_N', 'Snellen_H,Snellen_R,Snellen_E,Snellen_Z,Snellen_D', 'Snellen_N,Snellen_F,Snellen_H,Snellen_P,Snellen_Z', 'Snellen_U,Snellen_V,Snellen_F,Snellen_E,Snellen_H'] arrayCharacter = ['Snellen_U,Snellen_R,Snellen_N,Snellen_D,Snellen_V', 'Snellen_N,Snellen_F,Snellen_R,Snellen_Z,Snellen_E', 'Snellen_P,Snellen_H,Snellen_D,Snellen_F,Snellen_V', 'Snellen_R,Snellen_U,Snellen_N,Snellen_E,Snellen_Z', 'Snellen_D,Snellen_V,Snellen_E,Snellen_P,Snellen_R', 'Snellen_U,Snellen_D,Snellen_H,Snellen_V,Snellen_N', 'Snellen_Z,Snellen_U,Snellen_V,Snellen_F,Snellen_P', 'Snellen_E,Snellen_R,Snellen_D,Snellen_H,Snellen_Z', 'Snellen_U,Snellen_D,Snellen_P,Snellen_N,Snellen_F', 'Snellen_V,Snellen_E,Snellen_H,Snellen_U,Snellen_P', 'Snellen_F,Snellen_Z,Snellen_V,Snellen_R,Snellen_N', 'Snellen_H,Snellen_R,Snellen_E,Snellen_Z,Snellen_D', 'Snellen_N,Snellen_F,Snellen_H,Snellen_P,Snellen_Z', 'Snellen_U,Snellen_V,Snellen_F,Snellen_E,Snellen_H']
break; break;
case '3': case '3':
arrayCharacter = ['Sloan_C,Sloan_H,Sloan_N,Sloan_R,Sloan_V', 'Sloan_D,Sloan_K,Sloan_O,Sloan_S,Sloan_V', 'Sloan_V,Sloan_O,Sloan_R,Sloan_D,Sloan_N', 'Sloan_H,Sloan_Z,Sloan_C,Sloan_K,Sloan_X', 'Sloan_O,Sloan_K,Sloan_V,Sloan_H,Sloan_D', 'Sloan_Z,Sloan_R,Sloan_N,Sloan_S,Sloan_C', 'Sloan_K,Sloan_S,Sloan_D,Sloan_C,Sloan_H', 'Sloan_R,Sloan_N,Sloan_O,Sloan_V,Sloan_Z', 'Sloan_D,Sloan_H,Sloan_R,Sloan_O,Sloan_K', 'Sloan_C,Sloan_N,Sloan_Z,Sloan_S,Sloan_V', 'Sloan_H,Sloan_O,Sloan_S,Sloan_D,Sloan_N', 'Sloan_C,Sloan_V,Sloan_K,Sloan_Z,Sloan_R', 'Sloan_D,Sloan_H,Sloan_R,Sloan_N,Sloan_O', 'Sloan_S,Sloan_V,Sloan_C,Sloan_K,Sloan_Z'] arrayCharacter = ['Sloan_C,Sloan_H,Sloan_N,Sloan_R,Sloan_V', 'Sloan_D,Sloan_K,Sloan_O,Sloan_S,Sloan_V', 'Sloan_V,Sloan_O,Sloan_R,Sloan_D,Sloan_N', 'Sloan_H,Sloan_Z,Sloan_C,Sloan_K,Sloan_X', 'Sloan_O,Sloan_K,Sloan_V,Sloan_H,Sloan_D', 'Sloan_Z,Sloan_R,Sloan_N,Sloan_S,Sloan_C', 'Sloan_K,Sloan_S,Sloan_D,Sloan_C,Sloan_H', 'Sloan_R,Sloan_N,Sloan_O,Sloan_V,Sloan_Z', 'Sloan_D,Sloan_H,Sloan_R,Sloan_O,Sloan_K', 'Sloan_C,Sloan_N,Sloan_Z,Sloan_S,Sloan_V', 'Sloan_H,Sloan_O,Sloan_S,Sloan_D,Sloan_N', 'Sloan_C,Sloan_V,Sloan_K,Sloan_Z,Sloan_R', 'Sloan_D,Sloan_H,Sloan_R,Sloan_N,Sloan_O', 'Sloan_S,Sloan_V,Sloan_C,Sloan_K,Sloan_Z']
@ -2487,10 +2627,27 @@
case '6': case '6':
arrayCharacter = ['TumblingE_N,TumblingE_S,TumblingE_E,TumblingE_N,TumblingE_W', 'TumblingE_E,TumblingE_E,TumblingE_N,TumblingE_W,TumblingE_S', 'TumblingE_E,TumblingE_S,TumblingE_S,TumblingE_W,TumblingE_N', 'TumblingE_N,TumblingE_W,TumblingE_N,TumblingE_S,TumblingE_E', 'TumblingE_S,TumblingE_W,TumblingE_N,TumblingE_W,TumblingE_E', 'TumblingE_W,TumblingE_E,TumblingE_S,TumblingE_N,TumblingE_S', 'TumblingE_W,TumblingE_N,TumblingE_E,TumblingE_S,TumblingE_W', 'TumblingE_S,TumblingE_N,TumblingE_N,TumblingE_W,TumblingE_E', 'TumblingE_N,TumblingE_E,TumblingE_S,TumblingE_W,TumblingE_W', 'TumblingE_N,TumblingE_S,TumblingE_E,TumblingE_N,TumblingE_W', 'TumblingE_E,TumblingE_E,TumblingE_N,TumblingE_W,TumblingE_S', 'TumblingE_E,TumblingE_S,TumblingE_S,TumblingE_W,TumblingE_N', 'TumblingE_N,TumblingE_W,TumblingE_N,TumblingE_S,TumblingE_E', 'TumblingE_S,TumblingE_W,TumblingE_N,TumblingE_W,TumblingE_E']; arrayCharacter = ['TumblingE_N,TumblingE_S,TumblingE_E,TumblingE_N,TumblingE_W', 'TumblingE_E,TumblingE_E,TumblingE_N,TumblingE_W,TumblingE_S', 'TumblingE_E,TumblingE_S,TumblingE_S,TumblingE_W,TumblingE_N', 'TumblingE_N,TumblingE_W,TumblingE_N,TumblingE_S,TumblingE_E', 'TumblingE_S,TumblingE_W,TumblingE_N,TumblingE_W,TumblingE_E', 'TumblingE_W,TumblingE_E,TumblingE_S,TumblingE_N,TumblingE_S', 'TumblingE_W,TumblingE_N,TumblingE_E,TumblingE_S,TumblingE_W', 'TumblingE_S,TumblingE_N,TumblingE_N,TumblingE_W,TumblingE_E', 'TumblingE_N,TumblingE_E,TumblingE_S,TumblingE_W,TumblingE_W', 'TumblingE_N,TumblingE_S,TumblingE_E,TumblingE_N,TumblingE_W', 'TumblingE_E,TumblingE_E,TumblingE_N,TumblingE_W,TumblingE_S', 'TumblingE_E,TumblingE_S,TumblingE_S,TumblingE_W,TumblingE_N', 'TumblingE_N,TumblingE_W,TumblingE_N,TumblingE_S,TumblingE_E', 'TumblingE_S,TumblingE_W,TumblingE_N,TumblingE_W,TumblingE_E'];
break; break;
case '7': arrayCharacter = ['VanSloan_C,VanSloan_H,VanSloan_N,VanSloan_R,VanSloan_V', 'VanSloan_D,VanSloan_K,VanSloan_O,VanSloan_S,VanSloan_V', 'VanSloan_V,VanSloan_O,VanSloan_R,VanSloan_D,VanSloan_N', 'VanSloan_H,VanSloan_Z,VanSloan_C,VanSloan_K,VanSloan_X', 'VanSloan_O,VanSloan_K,VanSloan_V,VanSloan_H,VanSloan_D', 'VanSloan_Z,VanSloan_R,VanSloan_N,VanSloan_S,VanSloan_C', 'VanSloan_K,VanSloan_S,VanSloan_D,VanSloan_C,VanSloan_H', 'VanSloan_R,VanSloan_N,VanSloan_O,VanSloan_V,VanSloan_Z', 'VanSloan_D,VanSloan_H,VanSloan_R,VanSloan_O,VanSloan_K', 'VanSloan_C,VanSloan_N,VanSloan_Z,VanSloan_S,VanSloan_V', 'VanSloan_H,VanSloan_O,VanSloan_S,VanSloan_D,VanSloan_N', 'VanSloan_C,VanSloan_V,VanSloan_K,VanSloan_Z,VanSloan_R', 'VanSloan_D,VanSloan_H,VanSloan_R,VanSloan_N,VanSloan_O', 'VanSloan_S,VanSloan_V,VanSloan_C,VanSloan_K,VanSloan_Z']; case '7':
arrayCharacter = ['VanSloan_C,VanSloan_H,VanSloan_N,VanSloan_R,VanSloan_V', 'VanSloan_D,VanSloan_K,VanSloan_O,VanSloan_S,VanSloan_V', 'VanSloan_V,VanSloan_O,VanSloan_R,VanSloan_D,VanSloan_N', 'VanSloan_H,VanSloan_Z,VanSloan_C,VanSloan_K,VanSloan_X', 'VanSloan_O,VanSloan_K,VanSloan_V,VanSloan_H,VanSloan_D', 'VanSloan_Z,VanSloan_R,VanSloan_N,VanSloan_S,VanSloan_C', 'VanSloan_K,VanSloan_S,VanSloan_D,VanSloan_C,VanSloan_H', 'VanSloan_R,VanSloan_N,VanSloan_O,VanSloan_V,VanSloan_Z', 'VanSloan_D,VanSloan_H,VanSloan_R,VanSloan_O,VanSloan_K', 'VanSloan_C,VanSloan_N,VanSloan_Z,VanSloan_S,VanSloan_V', 'VanSloan_H,VanSloan_O,VanSloan_S,VanSloan_D,VanSloan_N', 'VanSloan_C,VanSloan_V,VanSloan_K,VanSloan_Z,VanSloan_R', 'VanSloan_D,VanSloan_H,VanSloan_R,VanSloan_N,VanSloan_O', 'VanSloan_S,VanSloan_V,VanSloan_C,VanSloan_K,VanSloan_Z'];
break; break;
case '8': arrayCharacter = ['Shape5_S,Shape5_O,Shape5_M,Shape5_C,Shape5_T', 'Shape5_O,Shape5_M,Shape5_S,Shape5_C,Shape5_F', 'Shape5_M,Shape5_T,Shape5_O,Shape5_S,Shape5_C', 'Shape5_F,Shape5_O,Shape5_S,Shape5_M,Shape5_T', 'Shape5_F,Shape5_O,Shape5_M,Shape5_C,Shape5_T', 'Shape5_O,Shape5_S,Shape5_F,Shape5_T,Shape5_C', 'Shape5_S,Shape5_O,Shape5_M,Shape5_T,Shape5_C', 'Shape5_F,Shape5_M,Shape5_C,Shape5_S,Shape5_F', 'Shape5_O,Shape5_T,Shape5_S,Shape5_F,Shape5_C', 'Shape5_M,Shape5_O,Shape5_T,Shape5_F,Shape5_M', 'Shape5_C,Shape5_S,Shape5_F,Shape5_O,Shape5_T', 'Shape5_S,Shape5_F,Shape5_M,Shape5_S,Shape5_C', 'Shape5_O,Shape5_T,Shape5_C,Shape5_M,Shape5_F', 'Shape5_S,Shape5_M,Shape5_T,Shape5_O,Shape5_C']; case '8':
arrayCharacter = ['Shape5_0,Shape5_3,Shape5_1,Shape5_4,Shape5_2','Shape5_1,Shape5_2,Shape5_0,Shape5_3,Shape5_4','Shape5_4,Shape5_0,Shape5_2,Shape5_1,Shape5_3','Shape5_2,Shape5_3,Shape5_1,Shape5_4,Shape5_0','Shape5_1,Shape5_4,Shape5_3,Shape5_0,Shape5_2','Shape5_3,Shape5_0,Shape5_4,Shape5_2,Shape5_1','Shape5_2,Shape5_1,Shape5_0,Shape5_4,Shape5_3','Shape5_0,Shape5_2,Shape5_1,Shape5_3,Shape5_4','Shape5_3,Shape5_1,Shape5_0,Shape5_4,Shape5_2','Shape5_4,Shape5_0,Shape5_2,Shape5_3,Shape5_1','Shape5_2,Shape5_4,Shape5_3,Shape5_1,Shape5_0','Shape5_1,Shape5_3,Shape5_4,Shape5_0,Shape5_2','Shape5_0,Shape5_4,Shape5_2,Shape5_1,Shape5_3','Shape5_4,Shape5_1,Shape5_3,Shape5_0,Shape5_2'];
break; break;
case '9':
arrayCharacter = ['Chinese01_0,Chinese01_1,Chinese01_6,Chinese01_3,Chinese01_2','Chinese01_3,Chinese01_2,Chinese01_4,Chinese01_8,Chinese01_7','Chinese01_6,Chinese01_9,Chinese01_5,Chinese01_0,Chinese01_1','Chinese01_4,Chinese01_3,Chinese01_0,Chinese01_7,Chinese01_9','Chinese01_8,Chinese01_1,Chinese01_2,Chinese01_5,Chinese01_6','Chinese01_9,Chinese01_8,Chinese01_6,Chinese01_4,Chinese01_0','Chinese01_1,Chinese01_7,Chinese01_3,Chinese01_9,Chinese01_5','Chinese01_5,Chinese01_0,Chinese01_2,Chinese01_7,Chinese01_8','Chinese01_6,Chinese01_3,Chinese01_8,Chinese01_4,Chinese01_1','Chinese01_2,Chinese01_4,Chinese01_1,Chinese01_7,Chinese01_9','Chinese01_8,Chinese01_5,Chinese01_3,Chinese01_0,Chinese01_6','Chinese01_4,Chinese01_2,Chinese01_1,Chinese01_8,Chinese01_7','Chinese01_9,Chinese01_6,Chinese01_5,Chinese01_3,Chinese01_2','Chinese01_7,Chinese01_4,Chinese01_0,Chinese01_9,Chinese01_5'];
break;
case '10':
arrayCharacter = ['Arabic01_0,Arabic01_1,Arabic01_6,Arabic01_3,Arabic01_2','Arabic01_3,Arabic01_2,Arabic01_4,Arabic01_8,Arabic01_7','Arabic01_6,Arabic01_9,Arabic01_5,Arabic01_0,Arabic01_1','Arabic01_4,Arabic01_3,Arabic01_0,Arabic01_7,Arabic01_9','Arabic01_8,Arabic01_1,Arabic01_2,Arabic01_5,Arabic01_6','Arabic01_9,Arabic01_8,Arabic01_6,Arabic01_4,Arabic01_0','Arabic01_1,Arabic01_7,Arabic01_3,Arabic01_9,Arabic01_5','Arabic01_5,Arabic01_0,Arabic01_2,Arabic01_7,Arabic01_8','Arabic01_6,Arabic01_3,Arabic01_8,Arabic01_4,Arabic01_1','Arabic01_2,Arabic01_4,Arabic01_1,Arabic01_7,Arabic01_9','Arabic01_8,Arabic01_5,Arabic01_3,Arabic01_0,Arabic01_6','Arabic01_4,Arabic01_2,Arabic01_1,Arabic01_8,Arabic01_7','Arabic01_9,Arabic01_6,Arabic01_5,Arabic01_3,Arabic01_2','Arabic01_7,Arabic01_4,Arabic01_0,Arabic01_9,Arabic01_5'];
break;
case '11':
arrayCharacter = ['Hebrew01_2,Hebrew01_8,Hebrew01_0,Hebrew01_6,Hebrew01_4','Hebrew01_7,Hebrew01_1,Hebrew01_5,Hebrew01_9,Hebrew01_3','Hebrew01_8,Hebrew01_0,Hebrew01_2,Hebrew01_4,Hebrew01_6','Hebrew01_9,Hebrew01_5,Hebrew01_7,Hebrew01_3,Hebrew01_1','Hebrew01_6,Hebrew01_4,Hebrew01_8,Hebrew01_0,Hebrew01_2','Hebrew01_1,Hebrew01_3,Hebrew01_9,Hebrew01_5,Hebrew01_7','Hebrew01_0,Hebrew01_6,Hebrew01_4,Hebrew01_2,Hebrew01_8','Hebrew01_5,Hebrew01_7,Hebrew01_3,Hebrew01_1,Hebrew01_9','Hebrew01_4,Hebrew01_2,Hebrew01_8,Hebrew01_6,Hebrew01_0','Hebrew01_3,Hebrew01_9,Hebrew01_1,Hebrew01_7,Hebrew01_5','Hebrew01_2,Hebrew01_6,Hebrew01_0,Hebrew01_8,Hebrew01_4','Hebrew01_7,Hebrew01_5,Hebrew01_9,Hebrew01_1,Hebrew01_3','Hebrew01_8,Hebrew01_4,Hebrew01_2,Hebrew01_0,Hebrew01_6','Hebrew01_1,Hebrew01_5,Hebrew01_7,Hebrew01_3,Hebrew01_9'];
break;
/* case '12':
arrayCharacter = ['CrowdedHOTV01_0','CrowdedHOTV01_2','CrowdedHOTV01_3','CrowdedHOTV01_1','CrowdedHOTV01_2','CrowdedHOTV01_0','CrowdedHOTV01_1','CrowdedHOTV01_3','CrowdedHOTV01_1','CrowdedHOTV01_0','CrowdedHOTV01_2','CrowdedHOTV01_3','CrowdedHOTV01_0','CrowdedHOTV01_2'];
break;
case '13':
arrayCharacter = ['CrowdedHOTV01_0,CrowdedHOTV01_2','CrowdedHOTV01_2,CrowdedHOTV01_3','CrowdedHOTV01_3,CrowdedHOTV01_1','CrowdedHOTV01_1,CrowdedHOTV01_0,CrowdedHOTV01_2','CrowdedHOTV01_2,CrowdedHOTV01_3,CrowdedHOTV01_1','CrowdedHOTV01_0,CrowdedHOTV01_1,CrowdedHOTV01_3','CrowdedHOTV01_1,CrowdedHOTV01_2,CrowdedHOTV01_0','CrowdedHOTV01_3,CrowdedHOTV01_0,CrowdedHOTV01_2','CrowdedHOTV01_1,CrowdedHOTV01_2,CrowdedHOTV01_3','CrowdedHOTV01_0,CrowdedHOTV01_3,CrowdedHOTV01_1','CrowdedHOTV01_2,CrowdedHOTV01_1,CrowdedHOTV01_0','CrowdedHOTV01_3,CrowdedHOTV01_0,CrowdedHOTV01_2','CrowdedHOTV01_0,CrowdedHOTV01_3,CrowdedHOTV01_1','CrowdedHOTV01_2,CrowdedHOTV01_1,CrowdedHOTV01_3'];
break; */
} }
//reverse the order of each line if config set to Mirrored //reverse the order of each line if config set to Mirrored
if(localsMirrored == 2) { if(localsMirrored == 2) {
@ -2508,15 +2665,16 @@
var arrayHeight = -1, counter = 0; var arrayHeight = -1, counter = 0;
for (var i = 0; i < arrayCharacter.length; i++) { for (var i = 0; i < arrayCharacter.length; i++) {
arrayHeight++; arrayHeight++;
var scoreText = chartArray[arrayHeight][1], //get score text var scoreText = chartArray[arrayHeight][1]; //get score text
heightText = chartArray[arrayHeight][2]; //get heigth for character var heightText = (localOptotype == 10) ? chartArray[arrayHeight][2]*9/5 : chartArray[arrayHeight][2]; //get height for character
var splitArr = arrayCharacter[i].split(',') var marginText = (localOptotype == 10) ? heightText : heightText / 2; //get height for character
var splitArr = arrayCharacter[i].split(',');
for (var x = 0; x < splitArr.length; x++) { for (var x = 0; x < splitArr.length; x++) {
var alphabet = splitArr[x]; var alphabet = splitArr[x];
//set style and append svg //set style and append svg
$('#list-character #' + alphabet).clone().css({ $('#list-character #' + alphabet).clone().css({
height: heightText + 'mm', height: heightText + 'mm',
margin: heightText / 2 + 'mm', margin: heightText + 'mm ' + marginText + 'mm',
}).attr({ }).attr({
id: alphabet + '_'+counter, id: alphabet + '_'+counter,
}).appendTo('#line-' + (i + 1)); }).appendTo('#line-' + (i + 1));
@ -2534,7 +2692,7 @@
//set height for parent line //set height for parent line
$('#line-' + (i + 1)).css('height', heightText + 'mm'); $('#line-' + (i + 1)).css('height', heightText + 'mm');
$('#line-' + (i + 1)).css('line-height', heightText + 'mm'); $('#line-' + (i + 1)).css('line-height', heightText + 'mm');
$('#line-' + (i + 1)).css('margin', heightText / 2 + 'mm'); $('#line-' + (i + 1)).css('margin', heightText/2 + 'mm');
var parentHeight = convertFunction.ConvertPixelToMM($('#line-' + (i + 1)).parent().height() / 2 - 12.5); var parentHeight = convertFunction.ConvertPixelToMM($('#line-' + (i + 1)).parent().height() / 2 - 12.5);
var scoreBoxCol = colours.optotype.replace(/[\d\.]+\)$/g, '1'); var scoreBoxCol = colours.optotype.replace(/[\d\.]+\)$/g, '1');
$('<div class="scoreBox" >' + scoreText + '</div>').insertAfter('#line-' + (i + 1)).css({color:scoreBoxCol}); $('<div class="scoreBox" >' + scoreText + '</div>').insertAfter('#line-' + (i + 1)).css({color:scoreBoxCol});
@ -2620,21 +2778,23 @@
//svg is centred with css text-align on the chart //svg is centred with css text-align on the chart
var svgW = svg.viewBox.baseVal.width*elSubtense, svgH = svg.viewBox.baseVal.height*elSubtense, var svgW = svg.viewBox.baseVal.width*elSubtense, svgH = svg.viewBox.baseVal.height*elSubtense,
svgX = viewWidth/2-svgW/2, svgY = viewHeight/2-svgH/2; svgX = viewWidth/2-svgW/2, svgY = viewHeight/2-svgH/2;
var strTrans = 'translate(0,'+svgY+')'; var strTrans = 'translate(0,'+svgY+'px)';
if(localsMirrored == 2) { if(localsMirrored == 2) {
strTrans += 'scale(-1,1)'; strTrans += 'scale(-1,1)';
} }
var thisChart = $('#'+chartsSVG[s].id); var thisChart = $('#'+chartsSVG[s].id);
if(!thisChart.parent().hasClass('animated')) {//exclude animated charts which will be fullscreen if(!thisChart.parent().hasClass('animated')) {//exclude animated charts which will be fullscreen
thisChart.attr({ thisChart.attr({
'transform':strTrans,
'width':svgW, 'width':svgW,
}).css({
'transform':strTrans,//svg 1.0 doesn't allow transform on SVG, so only some browsers allow it
}); });
} else { } else {
thisChart.attr({ thisChart.attr({
'width': viewWidth, 'width': viewWidth,
'height': viewHeight*0.8, 'height': viewHeight*0.8,
'transform': 'translate(0,'+viewHeight*0.1+')', }).css({
'transform': 'translate(0,'+viewHeight*0.1+'px)',//but does allow css transform
}); });
} }
} }
@ -2683,17 +2843,17 @@
}); });
} }
function rotate90 (el) { function rotate90 (el) {
var angle = 0, trans = $(el).attr('transform'); var angle = 90, trans = $(el).css('transform');
angle = 90; if(!thisChart.isToggled) {
if(!objWolf.isRotated){trans +=' rotate('+angle+')';} trans +=' rotate(-'+angle+'deg)';
else {
var arTrans = trans.split(' ');
trans = arTrans[0];
} }
$(el).attr('transform',trans); else {
trans +=' rotate('+angle+'deg)';
}
$(el).css('transform',trans);
} }
function spaceSeptumChart () { function spaceSeptumChart () {
var thisChart = objWolf[objWolf.catThis].arCharts[objWolf.chartThis].isToggled = true; thisChart.isToggled = true;
var buttonLayers = $('.interspace-button').find('g'); var buttonLayers = $('.interspace-button').find('g');
$(buttonLayers[0]).hide(); $(buttonLayers[0]).hide();
$(buttonLayers[1]).show(); $(buttonLayers[1]).show();
@ -2732,36 +2892,41 @@
this.shuffleLetters = function () { this.shuffleLetters = function () {
if(objWolf.catThis == 0) { if(objWolf.catThis == 0) {
var callBack = this; //check if letters are displayed in a column or singled
callBack.swapSVGLayers($('.shuffle-button')); var colCheck = $('.in-a-column, .disable');
if(!objWolf.isShuffled) { //if not, shuffle, else do nothing
$('.char-line').each(function (index) { if(colCheck.length == 0) {
var parent = $(this); var callBack = this;
var arVisible = parent.find('svg:not([style*="display: none"])'), callBack.swapSVGLayers($('.shuffle-button'));
arDots = parent.find('svg.guide-dot'); if(!objWolf.isShuffled) {
//count how many letters are visible $('.char-line').each(function (index) {
var lineLength = arVisible.length; var parent = $(this);
//hide all the letters var arVisible = parent.find('svg:not([style*="display: none"])'),
arAlphabet = parent.find('svg.optotype-symbol').hide(), arDots = parent.find('svg.guide-dot');
//shuffle them //count how many letters are visible
arAlphabet = callBack.YatesShuffle(arAlphabet); var lineLength = arVisible.length;
//append shuffled letters to the number in the pre-shuffled line //hide all the letters
for (i = 0; i < lineLength; i++) { arAlphabet = parent.find('svg.optotype-symbol').hide(),
$(arAlphabet[i]).appendTo(parent).show(); //shuffle them
arAlphabet = callBack.YatesShuffle(arAlphabet);
//append shuffled letters to the number in the pre-shuffled line
for (i = 0; i < lineLength; i++) {
$(arAlphabet[i]).appendTo(parent).show();
}
if (arDots.length != 0) {
parent.prepend(arDots[0]).append(arDots[1]);
}
$('#sUnshuffled').attr('display','block');
$('#sShuffled').attr('display','none');
});
} else {
callBack.UnShuffleFunction(oldCharacter);
$('#sUnshuffled').attr('display','none');
$('#sShuffled').attr('display','block');
} }
if (arDots.length != 0) { objWolf.isShuffled=!objWolf.isShuffled;
parent.prepend(arDots[0]).append(arDots[1]); }
}
$('#sUnshuffled').attr('display','block');
$('#sShuffled').attr('display','none');
});
} else {
callBack.UnShuffleFunction(oldCharacter);
$('#sUnshuffled').attr('display','none');
$('#sShuffled').attr('display','block');
}
objWolf.isShuffled=!objWolf.isShuffled;
} }
} }
@ -2770,15 +2935,24 @@
var id = oldCharacter[i][0], var id = oldCharacter[i][0],
svg = oldCharacter[i][1]; svg = oldCharacter[i][1];
var dataLine = $('.chart.V').find('>div[data-line=' + id + ']').html(svg); var dataLine = $('.chart.V').find('>div[data-line=' + id + ']').html(svg);
if (objWolf.isDuo) {
$('.guide-dot').hide();
}
} }
}; };
this.duoBGFunction = function () { this.duoBGFunction = function () {
var callBack = this; var callBack = this;
if(objWolf.catThis == 0) { //check if letters are displayed in a column, or singled
var colCheck = $('.in-a-column, .disable');
//only duochrome if not a column
if(colCheck.length == 0) {
if(objWolf.catThis == 0) {
$('#letterChart').toggleClass('duo'); $('#letterChart').toggleClass('duo');
$('.guide-dot').toggle();
objWolf.isDuo = !objWolf.isDuo; objWolf.isDuo = !objWolf.isDuo;
callBack.swapSVGLayers($('.bg-button')); callBack.swapSVGLayers($('.bg-button'));
}
} }
}; };
this.swapSVGLayers = function (el) { this.swapSVGLayers = function (el) {
@ -3341,35 +3515,71 @@
} }
this.characterClick = function () { this.characterClick = function () {
$(document).on('click', '.optotype-symbol', function () { $(document).on('click', '.optotype-symbol', function () {
var characterSVG = $('.char-line svg'); var characterSVG = $('.char-line .optotype-symbol'), el = $(this),
if ($(this).hasClass('active')) { guideDotSVG = $('svg.guide-dot');
$(this).removeClass('active'); if(el.hasClass('in-a-column')) {
characterSVG.removeClass('disable') //show all letters
} else { characterSVG.attr('class','optotype-symbol');
$(this).addClass('active'); if (!objWolf.isDuo) {
characterSVG.addClass('disable') guideDotSVG.show();
}
} }
}) else if (el.hasClass('active')) {
//show a column of letters containing this one
el.removeClass('active');
guideDotSVG.hide();
var lines = $('.char-line').each(function (idx, elem) {
var b = objWolf.pointer;
$(elem).find('.optotype-symbol').each(function (idx, elem) {
if (idx == b) {
$(elem).addClass('in-a-column');
$(elem).removeClass('disable');
}
});
});
}
else {
//show only the letter clicked
el.addClass('active');
characterSVG.addClass('disable');
el.removeClass('disable');
guideDotSVG.hide();
//find the position of the clicked letter along the line
var parent = this.parentNode, callBack = this, pos="";
$('#'+parent.id).find('.optotype-symbol').each(function (idx, elem) {
if (elem.id == callBack.id) {
objWolf.pointer = idx;
}
});
}
});
}; };
this.scoreBoxClick = function () { this.scoreBoxClick = function () {
$(document).on('click', '.character-line .scoreBox', function () { $(document).on('click','.scoreBox, .guide-dot', function() {
var lineSVG = $(this).prev(); var clicked = $(this), lineSVG = "", characterLine = $('.character-line .char-line'),
var characterLine = $('.character-line .char-line'); characterSVG = $('.char-line .optotype-symbol');
var characterSVG = $('.char-line svg'); if(clicked[0].getAttribute('class')=="scoreBox") {
if($(this).hasClass('active')) { lineSVG = $(this).prev();
$(this).removeClass('active'); } else {
lineSVG = clicked.parent();
}
var activeElems = lineSVG.parent().find('.guide-dot, .scoreBox')
if(clicked.hasClass('active')) {
activeElems.removeClass('active');
characterLine.css('visibility','visible') characterLine.css('visibility','visible')
characterSVG.removeClass('disable active'); characterSVG.removeClass('disable active');
} else { } else {
$('.character-line .scoreBox').removeClass('active'); $('.character-line .scoreBox, .guide-dot').removeClass('active');
$(this).addClass('active'); activeElems.addClass('active');
characterLine.css('visibility','hidden') characterLine.css('visibility','hidden')
lineSVG.css('visibility','visible'); lineSVG.css('visibility','visible');
characterSVG.removeClass('disable active') characterSVG.removeClass('disable active')
} }
});
})
}; };
this.hideIdleMouse = function () { this.hideIdleMouse = function () {
var idleMouseTimer; var idleMouseTimer;
@ -3491,7 +3701,7 @@
callBackFunction.SetBgColor(colours.backgrounds.optotype); callBackFunction.SetBgColor(colours.backgrounds.optotype);
callBackFunction.CaculatorCharacterHeight(numeratorType); callBackFunction.CaculatorCharacterHeight(numeratorType);
//generate letter charts //generate letter charts
callBackFunction.GenerateCharacter(alphabetType); callBackFunction.GenerateCharacter(alphabetType, localOptotype);
//generate single charts //generate single charts
callBackFunction.GenerateSingleCharts(); callBackFunction.GenerateSingleCharts();
//set shortcut //set shortcut