Code viewer for World: Solar System
//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();
}