added controls to modify constants at runtime

This commit is contained in:
Daniel Brunner
2016-11-30 00:16:13 +01:00
parent 1139442791
commit e07faeece3
2 changed files with 77 additions and 60 deletions
+30 -18
View File
@@ -3,25 +3,37 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Gummi Engine</title>
<meta name="description" content="">
<title>Gummi Engine</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
.point {
position: absolute;
width: 30px;
height: 30px;
background-color: #000;
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.0/gh-fork-ribbon.min.css" />
</head>
<body>
<h1>Gummi Engine</h1>
<a class="github-fork-ribbon" href="https://github.com/0xFEEDC0DE64/Gummi-Engine" title="Fork me on GitHub">Fork me on GitHub</a>
<style type="text/css">
.point {
position: absolute;
width: 30px;
height: 30px;
background-color: #000;
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.0/gh-fork-ribbon.min.css" />
</head>
<body>
<h1>Gummi Engine</h1>
<a class="github-fork-ribbon" href="https://github.com/0xFEEDC0DE64/Gummi-Engine" title="Fork me on GitHub">Fork me on GitHub</a>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
<form>
<label>DELTAT: <input type="range" id="input_deltat" value=".01" min="-2" max="2" step=".0001" /></label> <span id="display_deltat"></span><br />
<label>SEGLEN: <input type="range" id="input_seglen" value="10" min="-10" max="20" step=".1" /></label> <span id="display_seglen"></span><br />
<label>SPRINGK: <input type="range" id="input_springk" value="10" min="-10" max="20" step=".1" /></label> <span id="display_springk"></span><br />
<label>MASS: <input type="range" id="input_mass" value="1" min="-2" max="2" step=".01" /></label> <span id="display_mass"></span><br />
<label>GRAVITY: <input type="range" id="input_gravity" value="50" min="-10" max="100" step=".1" /></label> <span id="display_gravity"></span><br />
<label>RESISTANCE: <input type="range" id="input_resistance" value="10" min="-10" max="50" step=".1" /></label> <span id="display_resistance"></span><br />
<label>STOPVEL: <input type="range" id="input_stopvel" value=".1" min="-2" max="2" step=".001" /></label> <span id="display_stopvel"></span><br />
<label>STOPACC: <input type="range" id="input_stopacc" value=".1" min="-2" max="2" step=".001" /></label> <span id="display_stopacc"></span><br />
<label>BOUNCE: <input type="range" id="input_bounce" value=".75" min="-2" max="2" step=".001" /></label> <span id="display_bounce"></span>
</form>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
+47 -42
View File
@@ -1,14 +1,3 @@
var DELTAT = .01;
var SEGLEN = 10;
var SPRINGK = 10;
var MASS = 1;
var GRAVITY = 50;
var RESISTANCE = 10;
var STOPVEL = 0.1;
var STOPACC = 0.1;
var DOTSIZE = 32;
var BOUNCE = 0.75;
class Vector2 {
constructor(vec, y) {
if(typeof vec === "undefined" &&
@@ -159,50 +148,66 @@ $(document).ready(function($) {
for (var i = 0; i < 8; i++) {
entities.push(new Entity());
}
var mousePosition = new Vector2;
$(document).mousemove(function(event) {
entities[0].position = new Vector2(
mousePosition = new Vector2(
event.pageX,
event.pageY
);
});
setInterval(function() {
var DELTAT = parseFloat($('#input_deltat').val());
var SEGLEN = parseFloat($('#input_seglen').val());
var SPRINGK = parseFloat($('#input_springk').val());
var MASS = parseFloat($('#input_mass').val());
var GRAVITY = parseFloat($('#input_gravity').val());
var RESISTANCE = parseFloat($('#input_resistance').val());
var STOPVEL = parseFloat($('#input_stopvel').val());
var STOPACC = parseFloat($('#input_stopacc').val());
var BOUNCE = parseFloat($('#input_bounce').val());
$('#display_deltat').text(DELTAT);
$('#display_seglen').text(SEGLEN);
$('#display_springk').text(SPRINGK);
$('#display_mass').text(MASS);
$('#display_gravity').text(GRAVITY);
$('#display_resistance').text(RESISTANCE);
$('#display_stopvel').text(STOPVEL);
$('#display_stopacc').text(STOPACC);
$('#display_bounce').text(BOUNCE);
var windowSize = new Vector2($(window).width(), $(window).height());
$.each(entities, function(i, entity){
if(i > 0) {
var spring = new Vector2();
var springForce = function(i, j) {
var d = i.sub(j);
var len = d.length();
return len > SEGLEN ? d.div(len).mul(SPRINGK).mul(len - SEGLEN) : new Vector2();
}
if (i > 0) {
spring = spring.add(springForce(entities[i - 1].position, entity.position));
}
if (i < (entities.length - 1)) {
spring = spring.add(springForce(entities[i + 1].position, entity.position));
}
var resist = entity.speed.mul(-RESISTANCE);
var accel = spring.add(resist).div(MASS).add(0, GRAVITY);
entity.speed = entity.speed.add(accel.mul(DELTAT));
if (Math.abs(entity.speed.getX()) < STOPVEL &&
Math.abs(entity.speed.getY()) < STOPVEL &&
Math.abs(accel.getX()) < STOPACC &&
Math.abs(accel.getY()) < STOPACC) {
entity.speed = new Vector2();
}
entity.position = entity.position.add(entity.speed);
var springForce = function(i, j) {
var d = i.sub(j);
var len = d.length();
return len > SEGLEN ? d.div(len).mul(SPRINGK).mul(len - SEGLEN) : new Vector2();
}
var spring = springForce(i > 0 ? entities[i - 1].position : mousePosition, entity.position);
if (i < (entities.length - 1)) {
spring = spring.add(springForce(entities[i + 1].position, entity.position));
}
var resist = entity.speed.mul(-RESISTANCE);
var accel = spring.add(resist).div(MASS).add(0, GRAVITY);
entity.speed = entity.speed.add(accel.mul(DELTAT));
if (Math.abs(entity.speed.getX()) < STOPVEL &&
Math.abs(entity.speed.getY()) < STOPVEL &&
Math.abs(accel.getX()) < STOPACC &&
Math.abs(accel.getY()) < STOPACC) {
entity.speed = new Vector2();
}
entity.position = entity.position.add(entity.speed);
if (entity.position.getX() < 0) {
if (entity.speed.getX() < 0) {
entity.speed.setX(BOUNCE * -entity.speed.getX());