Added start to the background physics sim
This commit is contained in:
@ -7,11 +7,12 @@
|
||||
<title>The Void System</title>
|
||||
<link href="/stylesheets/home.css" rel="stylesheet" type="text/css" media="all">
|
||||
<link rel="stylesheet" href="/stylesheets/base.css" type="text/css" media="all">
|
||||
<script src="/libraries/p5/p5.js"></script>
|
||||
<script src="/javascript/libraries/p5/p5.js"></script>
|
||||
<style>canvas{z-index: -1;}</style>
|
||||
<script src="/javascript/newsim.js"></script>
|
||||
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="backgroundSim" width="1000px" height="1000px" alt="Background Image Space Physics simulation"></canvas>
|
||||
<h1 id="intotitle">Welcome to the Void System</h1>
|
||||
<div id="mainview">
|
||||
<div id="postarea">
|
||||
@ -155,7 +156,6 @@
|
||||
<button onclick="forgetMe()" type="submit">Forget me</button>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/javascript/simulation.js"></script>
|
||||
<script src="/javascript/remeber.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
151
javascript/newsim.js
Normal file
151
javascript/newsim.js
Normal file
@ -0,0 +1,151 @@
|
||||
let images = {};
|
||||
let simulator = [];
|
||||
let maxSpeed = 1;
|
||||
let backgroundImage;
|
||||
|
||||
let LEFT = [-1,0];
|
||||
|
||||
const entityTypes = {
|
||||
METERORITE_SMALL: "meteorite_small",
|
||||
METERORITE_LARGE: "meteorite_large",
|
||||
COMET: "comet",
|
||||
};
|
||||
|
||||
let Settings = {
|
||||
windowWrap: true,
|
||||
physics: true,
|
||||
}
|
||||
|
||||
function getMass(type){
|
||||
switch (type){
|
||||
case entityTypes.COMET: return 1400.0;
|
||||
case entityTypes.METERORITE_SMALL: return 500.0;
|
||||
case entityTypes.METERORITE_LARGE: return 1000.0;
|
||||
}
|
||||
}
|
||||
|
||||
function createEntity(x, y, vx, vy, type){
|
||||
let entity = {
|
||||
x: x,
|
||||
y: y,
|
||||
ax: 0.0,
|
||||
ay: 0.0,
|
||||
vx: vx,
|
||||
vy: vy,
|
||||
rot: 0,
|
||||
mass: getMass(type),
|
||||
type: type,
|
||||
}
|
||||
simulator.push(entity);
|
||||
}
|
||||
|
||||
|
||||
function getRandomType(){
|
||||
let rand = Math.random();
|
||||
if (rand > 0.955){
|
||||
console.log("Comet made");
|
||||
return entityTypes.COMET;
|
||||
}if(rand > 0.4){
|
||||
return entityTypes.METERORITE_SMALL;
|
||||
}else{
|
||||
return entityTypes.METERORITE_LARGE;
|
||||
}
|
||||
}
|
||||
|
||||
function physicsUpdate(entity){
|
||||
entity.vx += entity.ax;
|
||||
entity.vy += entity.ay;
|
||||
entity.x += entity.vx;
|
||||
entity.y += entity.vy;
|
||||
}
|
||||
|
||||
function onHit(entity){
|
||||
|
||||
}
|
||||
|
||||
function drawBackground(refImage){
|
||||
let w = windowWidth / refImage.width;
|
||||
let h = windowHeight / refImage.height;
|
||||
for (let iy = 0; iy <= h; iy++){
|
||||
for (let ix = 0; ix <= w; ix++){
|
||||
image(refImage, refImage.width * ix, refImage.height * iy);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function drawEntity(entity){
|
||||
push();
|
||||
imageMode(CENTER);
|
||||
translate(entity.x, entity.y, 0);
|
||||
rotate((Math.atan2(entity.vx, entity.vy) - Math.atan2(-1,0)) * 180/Math.PI);
|
||||
image(images[entity.type], 0,0);
|
||||
pop();
|
||||
}
|
||||
|
||||
function preload(){
|
||||
images[entityTypes.METERORITE_SMALL] = loadImage("/media/Art/meteorite_small_1.png");
|
||||
images[entityTypes.METERORITE_LARGE] = loadImage("/media/Art/Meteorite_Large_1_100.png");
|
||||
images[entityTypes.COMET] = loadImage("/media/Art/comet.png");
|
||||
//images["ship"] = loadImage("/media/Art/ship.png"); #Make Ship asset for game portion
|
||||
images["background"] = loadImage("/media/Art/EmptySpace.png");
|
||||
}
|
||||
|
||||
function setup(){
|
||||
let canvas = createCanvas(windowWidth, windowHeight);
|
||||
background(255);
|
||||
describe("A space physics simulator");
|
||||
|
||||
canvas.position(0,0);
|
||||
|
||||
//Load Entities
|
||||
let entityCount = 50;
|
||||
for(let i = 0; i <= entityCount; i+=1){
|
||||
createEntity(
|
||||
Math.floor(Math.random() * windowWidth),
|
||||
Math.floor(Math.random() * windowHeight),
|
||||
(Math.random() * maxSpeed * 2)-maxSpeed,
|
||||
(Math.random() * maxSpeed * 2)-maxSpeed,
|
||||
getRandomType(),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function mouseClicked(){
|
||||
console.log(mouseX, mouseY);
|
||||
simulator.forEach((entity) =>{
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
function draw(){
|
||||
//background(images["background"]);
|
||||
//Draw Tiled Background
|
||||
drawBackground(images["background"]);
|
||||
|
||||
for(let e = 1; e < simulator.length; e++){
|
||||
let entity = simulator[e]
|
||||
|
||||
//Physics Update
|
||||
if (Settings.physics){
|
||||
physicsUpdate(entity)
|
||||
}
|
||||
|
||||
//Window Wrap
|
||||
if (Settings.windowWrap){
|
||||
if (entity.x > windowWidth){
|
||||
entity.x = 0;
|
||||
}
|
||||
if (entity.x < 0){
|
||||
entity.x = windowWidth;
|
||||
}
|
||||
if (entity.y > windowHeight){
|
||||
entity.y = 0;
|
||||
}
|
||||
if (entity.y < 0){
|
||||
entity.y = windowHeight;
|
||||
}
|
||||
}
|
||||
//Draw Entity
|
||||
drawEntity(entity);
|
||||
}
|
||||
}
|
||||
15
pages/simonly.html
Normal file
15
pages/simonly.html
Normal file
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script src="/javascript/libraries/p5/p5.js"></script>
|
||||
<script src="/javascript/libraries/p5/addons/p5.sound.js"></script>
|
||||
<script src="/javascript/newsim.js"></script>
|
||||
<style>body{margin:0;padding:0;} canvas{z-index: -1};</style>
|
||||
<title>Background Physics Sim only</title>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user