Color blind mode
This is a very basic implementation of a color blind system, I added a simple button under play (that doesn't fade)
This commit is contained in:
parent
f39eb822bc
commit
ef71be61e5
3 changed files with 38 additions and 0 deletions
|
@ -69,6 +69,7 @@
|
|||
<div id="openSideBar" class = 'helpText'><i class="fa fa-info-circle fa-lg"></i> <i class="fa fa-arrow-left"><b> Help</b></i></div>
|
||||
<div id="overlay" class="faded"></div>
|
||||
<div id = 'pauseBtn'><div id = 'pauseBtnInner'><i class="fa fa-pause fa-2x"></div></i></div>
|
||||
<div id = 'colorBlindBtn'><b> Color Blind</b></div>
|
||||
<div id = 'restartBtn'><div id = 'restartBtnInner'><i class="fa fa-refresh fa-2x"></i></div></div>
|
||||
<div id="bottombar">
|
||||
<a href="https://twitter.com/intent/tweet?hashtags=hextris&original_referer=http%3A%2F%2F0.0.0.0%3A8080%2F&text=Play%20Hextris!%20-&tw_p=tweetbutton&url=http%3A%2F%2Fhextris.github.io%2F" class="twitter-share-button" data-url="http://hextris.github.io/" data-text="Play Hextris! -" data-hashtags="hextris">Tweet</a>
|
||||
|
|
25
js/input.js
25
js/input.js
|
@ -72,6 +72,31 @@ function addKeyListeners() {
|
|||
pause();
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#colorBlindBtn").on('touchstart mousedown', function() {
|
||||
window.colors = ["#8e44ad", "#f1c40f", "#3498db", "#d35400"];
|
||||
|
||||
window.hexColorsToTintedColors = {
|
||||
"#8e44ad": "rgb(229,152,102)",
|
||||
"#f1c40f": "rgb(246,223,133)",
|
||||
"#3498db": "rgb(151,201,235)",
|
||||
"#d35400": "rgb(210,180,222)"
|
||||
};
|
||||
|
||||
window.rgbToHex = {
|
||||
"rgb(142,68,173)": "#8e44ad",
|
||||
"rgb(241,196,15)": "#f1c40f",
|
||||
"rgb(52,152,219)": "#3498db",
|
||||
"rgb(211,84,0)": "#d35400"
|
||||
};
|
||||
|
||||
window.rgbColorsToTintedColors = {
|
||||
"rgb(142,68,173)": "rgb(229,152,102)",
|
||||
"rgb(241,196,15)": "rgb(246,223,133)",
|
||||
"rgb(52,152,219)": "rgb(151,201,235)",
|
||||
"rgb(46,204,113)": "rgb(210,180,222)"
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
|
|
|
@ -123,6 +123,18 @@ button:focus {
|
|||
background-color:rgba(236,240,241,.7);
|
||||
}
|
||||
|
||||
#colorBlindBtn {
|
||||
position:absolute;
|
||||
width:120px;
|
||||
height:20px;
|
||||
z-index:9999;
|
||||
left: 47%;
|
||||
top:65%;
|
||||
font-size:15px;
|
||||
text-align:center;
|
||||
color:#232323;
|
||||
cursor:pointer;
|
||||
}
|
||||
.instructions_body {
|
||||
margin-left:3px;
|
||||
width:calc(100% - 12px) ! important;
|
||||
|
|
Loading…
Reference in a new issue