xxxxxxxxxx
256
let x = 0;
let y = 0;
let button;
let backgroundIsMoving = false;
let screen = 1;
let fade2 = 0;
let fade3 = 0;
let start = false;
let alpha = 255;
let mySound;
let a = -5;
let b = -100;
let c = -550;
let d = 80;
let speed = 2;
let fadeDevice = 1;
var points;
var font;
var amt = 2;
var multiplier = 0.08;
function preload() {
particle_texture = loadImage("assets/fog.png");
cover = loadImage("assets/cover.png");
//mountain = loadImage("assets/Asset 1.png");
img = loadImage("assets/Artboard 1.png");
font = loadFont("assets/Calistoga-Regular.ttf");
mist = loadImage("assets/mist.png");
mySound = loadSound("assets/nature.m4a");
}
function setup() {
createCanvas(650, 850);
btn = createButton("Motion");
btn.mousePressed(function () {
DeviceOrientationEvent.requestPermission();
});
mySound.play();
img.resize(0, 850);
//Retrieve title into points
points = font.textToPoints(
"Arts of Living on a Damaged Planet",
22,
350,
38,
{
sampleFactor: 0.3,
simplifyThreshold: 0,
}
);
}
function draw() {
//Drawing cover page
background(220);
drawCover();
//Drawing all the pages after pressing the button
if (start == true) {
noTint();
background(220);
image(img, x, 0);
fill(255, 90);
noStroke();
textSize(12.5);
text("next page >", width - 95, height - 30);
//rect(width - 100, height - 50, 70, 30);
print(x);
//Turning pages
changeBG();
textAppear();
//Making fog effect
makeFog();
setInterval(fogReappear, 45000);
}
}
function drawCover() {
cover.resize(0, 850);
clear();
noTint();
image(cover, 0, 0);
fill(0, 130);
//Trees disappearing
alpha -= 0.8;
fill(50, 61, 67, alpha);
rect(600, 190, 30, height);
fill(29, 38, 45, alpha);
rect(120, 200, 25, height);
rect(270, 300, 60, height);
fill(76, 93, 101, alpha);
rect(380, 140, 50, height);
//Drawing press button
fill(255, 90);
noStroke();
rectMode(CENTER);
rect(width / 2, height / 2, 50, 50);
rect(width / 2, height / 2, 60, 60);
textSize(30);
textAlign(CENTER);
fill(255, 200);
textSize(11);
text("press to read", width / 2, height / 2 - 40);
fill(255);
textSize(30);
textFont(font);
//text("Arts of Living on a Damaged Planet", width / 2, height / 2 - 90);
noStroke();
for (let i = 0; i < points.length; i++) {
fill(255);
//Get locations
var p = points[i];
var nX = noise(p.x + p.y + frameCount * multiplier);
var locX = map(nX, 0, 1, -amt, amt);
var nY = noise(p.x + p.y + 2 + frameCount * multiplier);
var locY = map(nY, 0, 1, -amt, amt);
ellipse(p.x + locX, p.y + locY, 1, 1);
}
}
function mouseClicked() {
if (
mouseX > width - 140 &&
mouseX < width - 20 &&
mouseY > height - 60 &&
mouseY < height - 10 &&
backgroundIsMoving == false
) {
backgroundIsMoving = true;
print("true");
}
}
function mousePressed() {
if (
mouseX > width / 2 - 25 &&
mouseX < width / 2 + 25 &&
mouseY > height / 2 - 25 &&
mouseY < height / 2 + 25 &&
start == false
) {
start = true;
}
}
function changeBG() {
if (backgroundIsMoving == true) {
x -= 15;
}
if (x <= -500 && screen == 1) {
backgroundIsMoving = false;
screen = 2;
}
if (x <= -1000 && screen == 2) {
backgroundIsMoving = false;
screen = 3;
} else if (backgroundIsMoving == true && screen == 3) {
remove();
}
}
function textAppear() {
//Drawing page 1
if (backgroundIsMoving == false && screen == 1) {
textSize(15);
textAlign(CENTER);
textLeading(25);
fill(255, fade2);
text(
"Introduction: Haunted Landscapes of the Anthropocene \nWhat Kinds of Human Disturbance Can Life on Earth Bear?",
width / 2,
160
);
fade2 += 10;
}
//Drawing page 2
else if (backgroundIsMoving == false && screen == 2) {
textSize(15);
textLeading(25);
fill(255, fade2);
text(
"The winds of the Anthropocene carry ghosts—the vestiges and signs of past ways of life still charged in the present. This book offers stories of those winds as they blow over haunted landscapes. Our ghosts are the traces of more-than-human histories through which ecologies are made and unmade. ",
width / 2,
250,
500,
300
);
fade2 += 10;
}
//Drawing page 3
else if (backgroundIsMoving == false && screen == 3) {
textSize(15);
textLeading(25);
fill(255, fade3);
text(
"“Anthropocene” is the proposed name for a geologic epoch in which humans have become the major force determining the continuing liv-ability of the earth. The word tells a big story: living arrangements that took millions of years to put into place are being undone in the blink of an eye. ",
width / 2,
250,
500,
300
);
fade3 += 10;
}
}
function touchMoved() {
fadeDevice -= 0.03;
if (fadeDevice <= 0) {
return false;
}
}
function fogReappear() {
//Make fog reappear
if (fadeDevice < 1 && fadeDevice >= 0.5) {
fadeDevice += 0.009;
}
//Slower process
if (fadeDevice < 0.5) {
fadeDevice += 0.008;
}
}
function makeFog() {
//Drawing fog texture
push();
tint(255, 220 * fadeDevice);
mist.resize(0, 950);
//for(i=0; i < 3; i ++){
image(mist, a, b);
image(mist, c, d);
//}
pop();
//Fog moving
c += speed * 0.5;
a += speed;
if (a > 0 || a < -300) {
speed = speed * -1;
}
}