Compare commits
3 Commits
5e82aeb855
...
05ee3d9b63
| Author | SHA1 | Date | |
|---|---|---|---|
| 05ee3d9b63 | |||
| 15cbc6ccfe | |||
| 4eca54312b |
@ -7,11 +7,12 @@
|
|||||||
<title>The Void System</title>
|
<title>The Void System</title>
|
||||||
<link href="/stylesheets/home.css" rel="stylesheet" type="text/css" media="all">
|
<link href="/stylesheets/home.css" rel="stylesheet" type="text/css" media="all">
|
||||||
<link rel="stylesheet" href="/stylesheets/base.css" 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">
|
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<canvas id="backgroundSim" width="1000px" height="1000px" alt="Background Image Space Physics simulation"></canvas>
|
|
||||||
<h1 id="intotitle">Welcome to the Void System</h1>
|
<h1 id="intotitle">Welcome to the Void System</h1>
|
||||||
<div id="mainview">
|
<div id="mainview">
|
||||||
<div id="postarea">
|
<div id="postarea">
|
||||||
@ -155,7 +156,6 @@
|
|||||||
<button onclick="forgetMe()" type="submit">Forget me</button>
|
<button onclick="forgetMe()" type="submit">Forget me</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script src="/javascript/simulation.js"></script>
|
|
||||||
<script src="/javascript/remeber.js"></script>
|
<script src="/javascript/remeber.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</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);
|
||||||
|
}
|
||||||
|
}
|
||||||
BIN
media/fonts/SPACEMAN.TTF
Normal file
BIN
media/fonts/SPACEMAN.TTF
Normal file
Binary file not shown.
@ -11,49 +11,64 @@
|
|||||||
<body>
|
<body>
|
||||||
<!---->
|
<!---->
|
||||||
<div id="mainView">
|
<div id="mainView">
|
||||||
|
<h1>Rock Collection</h1>
|
||||||
|
<div class="collection">
|
||||||
|
<ul class="collectionList">
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
<li class="collectionItem">
|
||||||
|
<a href="http://"></a>
|
||||||
|
<img:src></img:src>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
<h1>Gear Collection</h1>
|
<h1>Gear Collection</h1>
|
||||||
<div class="gearCollection">
|
<div class="collection">
|
||||||
<ul id="gearList">
|
<ul id="collectionList">
|
||||||
<li class="gearItem">
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<a href="http://"></a>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<img:src></img:src>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
</li>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<li class="gearItem">
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<a href="http://"></a>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<img:src></img:src>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
</li>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<li class="gearItem">
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<a href="http://"></a>
|
<li class="collectionItem"><a href="http://" class="itemLink"></a><img src="" alt="" class="itemImg"></li>
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
<li class="gearItem">
|
|
||||||
<a href="http://"></a>
|
|
||||||
<img:src></img:src>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
<h1>My Pic collection</h1>
|
<h1>My Pic collection</h1>
|
||||||
<div class="gallery">
|
<div class="gallery">
|
||||||
|
|||||||
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>
|
||||||
@ -1,9 +1,15 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: SPACEMAN;
|
||||||
|
src: url("/media/fonts/SPACEMAN.TTF");
|
||||||
|
}
|
||||||
|
|
||||||
body{
|
body{
|
||||||
background-image: url("/media/Art/EmptySpace.png");
|
background-image: url("/media/Art/EmptySpace.png");
|
||||||
background-size: 6%;
|
background-size: 6%;
|
||||||
cursor: url("/media/Art/comet.png");
|
cursor: url("/media/Art/comet.png");
|
||||||
color: rgb(57, 214, 253);
|
color: rgb(57, 214, 253);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
font-family: SPACEMAN;
|
||||||
}
|
}
|
||||||
|
|
||||||
#back{
|
#back{
|
||||||
|
|||||||
Reference in New Issue
Block a user