max fps and active tab css
This commit is contained in:
4
dist/css/style.css
vendored
4
dist/css/style.css
vendored
@@ -134,6 +134,10 @@ button:active{
|
||||
background-color: #81d2c7;
|
||||
color: black;
|
||||
}
|
||||
.open-tab {
|
||||
background-color: #66a39b;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.tab {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
|
||||
2
dist/index.html
vendored
2
dist/index.html
vendored
@@ -59,7 +59,7 @@
|
||||
<div id='tab-container' class='control-set'>
|
||||
|
||||
<div class="tabnav">
|
||||
<p class='tabnav-item' id='about'>About</p>
|
||||
<p class='tabnav-item open-tab' id='about'>About</p>
|
||||
<p class='tabnav-item' id='editor'>Editor</p>
|
||||
<p class='tabnav-item' id='hyperparameters'>Simulation Controls</p>
|
||||
<p class='tabnav-item' id='stats'>Stats</p>
|
||||
|
||||
@@ -114,11 +114,14 @@ class ControlPanel {
|
||||
defineEngineSpeedControls(){
|
||||
this.slider = document.getElementById("slider");
|
||||
this.slider.oninput = function() {
|
||||
this.fps = this.slider.value
|
||||
const max_fps = 300;
|
||||
this.fps = this.slider.value;
|
||||
if (this.fps>=max_fps) this.fps = 1000;
|
||||
if (this.engine.running) {
|
||||
this.changeEngineSpeed(this.fps);
|
||||
}
|
||||
$('#fps').text("Target FPS: "+this.fps);
|
||||
let text = this.fps >= max_fps ? 'MAX' : this.fps;
|
||||
$('#fps').text("Target FPS: "+text);
|
||||
}.bind(this);
|
||||
$('.pause-button').click(function() {
|
||||
$('.pause-button').find("i").toggleClass("fa fa-pause");
|
||||
@@ -177,6 +180,8 @@ class ControlPanel {
|
||||
$('.tab').css('display', 'none');
|
||||
var tab = '#'+this.id+'.tab';
|
||||
$(tab).css('display', 'grid');
|
||||
$('.tabnav-item').removeClass('open-tab')
|
||||
$('#'+this.id+'.tabnav-item').addClass('open-tab');
|
||||
self.engine.organism_editor.is_active = (this.id == 'editor');
|
||||
self.stats_panel.stopAutoRender();
|
||||
if (this.id === 'stats') {
|
||||
|
||||
Reference in New Issue
Block a user