xxxxxxxxxx
152
// Title: Coding Challenge #9 - Solar System with Textures
// Author: Daniel Kaye
// URL: http://dnkaye.com/2020_CodingChallenges.html
//
// Based on Daniel Schiffman's (Coding Train) coding challenges
// URL: https://thecodingtrain.com/CodingChallenges/009-solarsystemgenerator3d-texture
//
// What is this?
// Attempt to add 3d textures to the planets of my previously created 3d solar system
//
// How do I do this?
// I attempt to complete Daniel Schiffman's coding challenges before watching
// his video, then afterwards I watch and see what he did differently, and learn!
//
// Things I'm proud of / differences from The Coding Train version:
// not much - never used textures with p5.js before, but it was so easy - just load an image and use the 'texture' function instead of the 'fill' function
// had to make each planet rotate aroudn a random axis now that they have textures
let speed = 0.002;
let lightColor;
let lightLocation;
let sunRadius = 20;
let sunAngleX = 0;
let sunAngleY = 0;
let sunAngleZ = 0;
let planets = [];
let numOfPlanets = 6;
let minPlanetRadius = 3;
let maxPlanetRadius = 15;
let stars = [];
let numOfStars = 200;
let sunTexture;
let earthTexture;
let textureImages = [];
let numOfPlanetTextures = 7;
let fontArial;
function preload() {
sunTexture = loadImage('texture_sun.png');
earthTexture = loadImage('texture_earth.jpg');
for (let i = 0; i < numOfPlanetTextures; i++) {
textureImages.push(loadImage('texture_planet_' + i + '.jpg'));
}
fontArial = loadFont('ARIAL.TTF');
}
function setup() {
createCanvas(400, 400, WEBGL);
createLights();
createPlanets();
createStars();
textureImages.push(earthTexture);
textFont(fontArial);
}
function draw() {
if (focused || frameCount < 30) {
background(0);
// drawStars(); // seems to crash program? Just draws 200 points...?
push();
locateCamera();
drawLights();
drawSun();
drawOrbits();
drawPlanets();
pop();
} else {
drawUnpauseInstructions();
}
}
function drawUnpauseInstructions() {
noStroke();
fill(255);
textAlign(CENTER);
textSize(18);
text('click to activate', 0, height / 2 - height / 5);
}
function locateCamera() {
translate(0, -height / 8, 0);
rotateX(PI * 0.3);
}
function createLights() {
lightColor = color(255);
lightLocation = createVector(width, height, -100);
}
function drawLights() {
ambientLight(100);
directionalLight(lightColor, lightLocation);
}
function createPlanets() {
for (let i = 0; i < numOfPlanets; i++) {
planets.push(new Planet());
}
}
function drawPlanets() {
for (let planet of planets) {
planet.drawPlanet();
}
}
function drawOrbits() {
for (let planet of planets) {
planet.drawOrbit();
}
}
function drawSun() {
noStroke();
texture(sunTexture);
push();
rotateX(sunAngleX);
rotateY(sunAngleY);
rotateZ(sunAngleZ);
sphere(sunRadius);
pop();
sunAngleX += speed;
sunAngleY += speed;
sunAngleZ += speed;
}
function createStars() {
for (let i = 0; i < numOfStars; i++) {
let point = [];
point[0] = random(-width / 2, width / 2);
point[1] = random(-height / 2, height / 2);
stars.push(point);
}
}
function drawStars() {
stroke(255, 125);
strokeWeight(0.25);
for (let arr of stars) {
point(arr[0], arr[1]);
}
}
function isHovered() {
if (mouseX > 0 && mouseX < width && mouseY > 0 && mouseY < height) {
return true;
} else {
return false;
}
}