Mobile defense/firefox pixelation

This commit is contained in:
MaxRobinsonTheGreat
2020-07-23 15:52:02 -06:00
parent b0af739747
commit cafb444417
4 changed files with 310 additions and 7 deletions

15
dist/css/style.css vendored
View File

@@ -19,7 +19,10 @@ body{
width: 100%;
text-align: center;
transform: scale(1);
image-rendering: pixelated;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
image-rendering: crisp-edges;
}
#env-canvas {
@@ -49,7 +52,10 @@ body{
}
img {
image-rendering: pixelated;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
image-rendering: crisp-edges;
width: 60%;
border-radius: 10px;
}
@@ -152,7 +158,10 @@ button:hover{
bottom: 0;
}
#editor-env {
image-rendering: pixelated;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
image-rendering: crisp-edges;
height: 195px;
width: 195px;
}

6
dist/index.html vendored
View File

@@ -56,7 +56,7 @@
<div class="tabnav">
<p class='tabnav-item' id='about'>About</p>
<p class='tabnav-item' id='editor'>Editor</p>
<p class='tabnav-item' id='hyperparameters'>Rule Tuning</p>
<p class='tabnav-item' id='hyperparameters'>Simulation Controls</p>
<p class='tabnav-item' id='stats'>Stats</p>
<button id="minimize" title="Minimze Control Panel"><i class="fa fa-minus"></i></button>
</div>
@@ -118,7 +118,7 @@
</div>
<div id='hyperparameters' class='tab'>
<div class='left-half'>
<h2>Rule Tuning</h2>
<h2>Simulation Controls</h2>
<h4>Food Production vs Lifespan</h4>
<label for="food-prod-prob" title='The probability that a producer cell will produce food each tick.'>Probability of producing food:</label>
<input type="number" id="food-prod-prob" min=".001" max="100" value=4 step="1">
@@ -161,7 +161,7 @@
<label for="food-blocks" title='When on, reproduction will fail if offspring intersect with food. When off, offspring will remove blocking food.'>Food blocks reproduction</label>
<input type="checkbox" id="food-blocks" checked>
<br>
<button id='reset-rules'>Reset all rules</button>
<button id='reset-rules'>Reset all controls</button>
</div>
</div>
<div id='stats' class='tab'>

289
dist/js/bundle.js vendored

File diff suppressed because one or more lines are too long

View File

@@ -3,6 +3,13 @@
import Engine from './Engine';
$('document').ready(function(){
let isMobile = window.matchMedia("only screen and (max-width: 760px)").matches;
console.log(isMobile)
if (isMobile) {
alert("Though the simulation still works on mobile, most features are disabled. Try it on desktop for the full experience!");
$('.control-panel').css('display', 'none');
}
var engine = new Engine();
engine.start(60);
});