//Solar Syctem with p5.js
// There is an issue with the viewport which I am currently working on
let sunImg;
let imgMercury;
let imgVenus;
let imgEarth;
let imgMars;
let imgJupiter;
let imgSaturn;
let imgUranus;
let imgNeptune;
function preload()
{
sunImg = loadImage('/uploads/ultron6/sun.png');
imgMercury = loadImage('/uploads/ultron6/mercury.png');
imgVenus = loadImage('/uploads/ultron6/venus.png');
imgEarth = loadImage('/uploads/ultron6/earth.png');
imgMars = loadImage('/uploads/ultron6/mars.png');
imgJupiter = loadImage('/uploads/ultron6/jupitor.png');
imgSaturn = loadImage('/uploads/ultron6/saturn.png');
imgUranus = loadImage('/uploads/ultron6/pluto.png');
imgNeptune = loadImage('/uploads/ultron6/Neptune.png');
}
var starsQuantity = 300;
var planetSpace = .6;
var orbitAngle = 4;
var dropoff = .59;
var tail = 0.5;
var ismousedown = false;
var mousedown;
var mouseup;
var planets = [];
var stars = [];
var paused = false;
function setup() {
createCanvas(windowWidth * 2, windowHeight * 2, WEBGL);
console.log(windowWidth);
console.log(windowHeight);
createStars(starsQuantity);
createSolarSystem();
console.log(planets);
// hide();
}
function draw() {
background(20);
var sun = planets[0];
for(var i=0;i<stars.length;i++){
stars[i].show();
}
planets[0].show();
for(i=1;i<planets.length;i++){
planets[i].update(sun);
planets[i].show();
}
planets[0].showUpper();
if(ismousedown){
stroke('#F4511E');
fill('#FFC107');
ellipseMode(RADIUS);
ellipse(mouseX,mouseY,4,4);
var currentposition = createVector(mouseX,mouseY);
stroke('#F4511E');
strokeWeight(2);
line(mousedown.x,mousedown.y,mouseX,mouseY);
}
}
function Star() {
this.position = createVector(random(0,windowWidth), random(0,windowHeight));
this.size = random(2);
this.show = function(){
fill(255);
stroke(150);
strokeWeight(1);
ellipseMode(RADIUS);
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function asteroid(launchPosition,launchSpeed) {
this.size = windowWidth/400+random(1);
this.position = launchPosition;
this.tails = [];
this.gravityscale = 0;
this.acceleration = 0;
this.velocity = createVector(launchSpeed.x,launchSpeed.y);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(1);
stroke('#F4511E');
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>20){this.tails.splice(0,1)}
strokeWeight(2);
fill('#F4511E');
point(this.tails[i].x,this.tails[i].y);
}
fill('#FFC107');
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function createSolarSystem(){
planets.push(new Sun());
planets.push(new Mercury());
planets.push(new Venus());
planets.push(new Earth());
planets.push(new Mars());
planets.push(new Jupiter());
planets.push(new Saturn());
planets.push(new Uranus());
planets.push(new Neptune());
}
function clearSolarSystem() {
planets = [];
}
function Sun() {
this.size = windowWidth/30+random(5);
this.position = createVector(windowWidth/2, windowHeight/2);
this.update = function(sun){}
this.show = function(){
noFill();
noStroke();
texture(sunImg);
arc(this.position.x,this.position.y,this.size,this.size, 0, 2*PI);
}
this.showUpper = function(){
noStroke();
noFill();
texture(sunImg);
arc(this.position.x,this.position.y,this.size,this.size, PI, 0);
}
}
function Mercury() {
this.size = windowWidth/200+random(2);
this.position = createVector(windowWidth/2+planetSpace*windowWidth/20+30, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20)); // higher = more horizontal
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(2);
stroke('#BCAAA4');
texture(imgMercury);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function Venus() {
this.size = windowWidth/150+random(2);
this.position = createVector(windowWidth/2+2*planetSpace*windowWidth/20+30, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(2);
stroke('#FF8F00');
texture(imgVenus);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function Earth() {
this.size = windowWidth/150+random(2);
this.position = createVector(windowWidth/2+3*planetSpace*windowWidth/20+30, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(2);
stroke('#8BC34A');
texture(imgEarth);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function Mars() {
this.size = windowWidth/190+random(2);
this.position = createVector(windowWidth/2+4*planetSpace*windowWidth/20+30, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(2);
stroke('#D84315');
texture(imgMars);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function Jupiter() {
this.size = windowWidth/50+random(2);
this.position = createVector(windowWidth/2+5*planetSpace*windowWidth/20+45, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(2);
stroke('#FFE0B2');
texture(imgJupiter);
ellipseMode(RADIUS);
ellipse(this.position.x,this.position.y,this.size,this.size);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
stroke('#FFB74D');
point(this.tails[i].x,this.tails[i].y);
}
// fill('#FFE0B2');
// ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function Saturn() {
this.size = windowWidth/80+random(2);
this.position = createVector(windowWidth/2+6*planetSpace*windowWidth/20+70, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(3);
stroke('#FFE082');
texture(imgSaturn);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
ellipse(this.position.x,this.position.y,this.size,this.size);
// translate(width/2, height/2);
// rotate(15);
noFill();
stroke('#FFECB3');
ellipseMode(RADIUS);
ellipse(this.position.x,this.position.y,this.size+this.size/1.5,this.size/3);
}
}
function Uranus() {
this.size = windowWidth/100+random(2);
this.position = createVector(windowWidth/2+7*planetSpace*windowWidth/20+90, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
strokeWeight(1);
stroke('#E3F2FD');
texture(imgUranus);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
strokeWeight(2);
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
ellipse(this.position.x,this.position.y,this.size,this.size);
noFill();
stroke('#BBDEFB');
// ellipseMode(RADIUS);
//ellipse(this.position.x,this.position.y,this.size+this.size/2,this.size/4);
}
}
function Neptune() {
this.size = windowWidth/110+random(2);
this.position = createVector(windowWidth/2+8*planetSpace*windowWidth/20+100, windowHeight/2);
this.tails = [];
this.distance = p5.Vector.sub(createVector(windowWidth/2, windowHeight/2), this.position);
this.gravityscale = Math.sqrt(Math.pow(this.distance.x,2)+Math.pow(this.distance.y,2))*10;
this.initalspeed = (Math.pow(this.gravityscale,dropoff)/(orbitAngle*20));
this.velocity = createVector(0,this.initalspeed);
this.acceleration = createVector(0,0);
this.update = function(sun){
strokeWeight(1);
stroke('#0288D1');
texture(imgNeptune);
ellipseMode(RADIUS);
for(var i=0;i<this.tails.length-this.size/2;i++){
fill('#4FC3F7');
strokeWeight(2);
if(this.tails.length>this.initalspeed*70*tail){this.tails.splice(0,1)}
point(this.tails[i].x,this.tails[i].y);
}
this.acceleration = p5.Vector.sub(sun.position, this.position);
this.acceleration.x = this.acceleration.x/this.gravityscale;
this.acceleration.y = this.acceleration.y/this.gravityscale;
this.velocity.add(this.acceleration);
this.position.add(this.velocity);
}
this.show = function(){
this.tails.push(createVector(this.position.x,this.position.y));
ellipse(this.position.x,this.position.y,this.size,this.size);
}
}
function createStars(quantity) {
for(var i=0;i<quantity;i++){
stars.push(new Star());
}
}
function clearStars() {
stars = [];
}
function setOrbitAngle(value) {
orbitAngle = Math.floor(orbitAngle);
orbitAngle = value;
reset();
}