Skip to content

Commit

Permalink
working fine
Browse files Browse the repository at this point in the history
  • Loading branch information
hspencer committed Jul 23, 2020
1 parent bb6522c commit af04b75
Show file tree
Hide file tree
Showing 3 changed files with 83 additions and 59 deletions.
4 changes: 2 additions & 2 deletions boundary.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@

function Boundary(x, y, w, h, a) {
var options = {
friction: 0,
restitution: 0.95,
friction: 0.3,
restitution: 0.195,
angle: a,
isStatic: true
};
Expand Down
28 changes: 13 additions & 15 deletions note.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,15 @@ class Note {
constructor(lat, lon, title, text, author) {
this.connectedTo = "nothing";
this.springDist = 0;
this.creatingSprings = false;
this.creatingSpring = false;
let margin = w / 5;
this.x = map(lon, minlon, maxlon, margin, w - margin);
this.y = map(lat, minlat, maxlat, h - margin, margin);
this.title = title;
this.text = text;
this.author = author;
this.label = author.toUpperCase();
this.radius = map(this.text.length, 0, 50, 0, 30);
this.r = 12;
this.radius = map(this.text.length, 0, 50, 6, 25);
this.r = this.radius;
this.over = false;
this.touched = false;
this.angle;
Expand Down Expand Up @@ -40,39 +39,39 @@ class Note {
translate(pos.x, pos.y);
rotate(this.angle);


if (this.over && this.touched) {
fill(180, 30, 0, 20);
if (this.over && this.touched) {
fill(180, 30, 0, 45);
noStroke();
ellipse(0, 0, this.r * 2);
stroke(0);
strokeWeight(3);
point(0, 0);
}
if (this.over && !this.touched) {
fill(180, 30, 0, 20);
fill(180, 30, 0, 45);
stroke(180, 30, 0, 250);
strokeWeight(1);
ellipse(0, 0, this.r * 2);
}
}
if (!this.over && this.touched) {
stroke(0);
strokeWeight(3);
point(0, 0);
}
}
if (!this.over && !this.touched) {
stroke(0, 45);
strokeWeight(1.5);
fill(190, 25);
ellipse(0, 0, this.r * 2);
}
}

pop();

if (this.creatingSprings) {
if (this.creatingSpring) {
// paint growing circle
noFill();
stroke(0, 45);
stroke(0, 10);
strokeWeight(3);
ellipse(this.x, this.y, this.springDist * 2);
// check all other notes
for (let other of notes) {
Expand All @@ -89,13 +88,12 @@ class Note {
bodyB: other.body,
stiffness: 1
}

this.connectedTo = other.title;
// create new spring
let spring = Constraint.create(options);
World.add(world, spring);
springs.push(spring);
this.creatingSprings = false;
this.creatingSpring = false;
}
this.springDist++;
}
Expand Down
110 changes: 68 additions & 42 deletions sketch.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,15 +28,17 @@ let boundaries = [];
let serif, sans, sansBold;

function preload() {
// calculate width and height from html div
w = document.getElementById("p5").offsetWidth;
h = document.getElementById("p5").offsetHeight;
let url = "https://wiki.ead.pucv.cl/api.php?action=ask&format=json&maxlag=2000&uselang=user&errorformat=bc&query=[[Categor%C3%ADa:Acto%20del%20momento%20simult%C3%A1neo]]|%3FNota|%3FAutor|%3FPosici%C3%B3n|%3FImagen";
data = loadJSON(url, gotData, 'jsonp');

// fonts
serif = loadFont("fonts/Alegreya-Regular.ttf");
sans = loadFont("fonts/AlegreyaSans-Light.ttf");
sansBold = loadFont("fonts/AlegreyaSans-Bold.ttf");
}
// geographical boundaries
let minlat, maxlat, minlon, maxlon;

function gotData(response) {
Expand All @@ -48,13 +50,12 @@ function gotData(response) {
let thisResult = data.query.results[key];
let lat = thisResult.printouts['Posición'][0].lat;
let lon = thisResult.printouts['Posición'][0].lon;

// calc geo boundaries
if (minlat > lat) { minlat = lat; }
if (minlon > lon) { minlon = lon; }
if (maxlat < lat) { maxlat = lat; }
if (maxlon < lon) { maxlon = lon; }
}

}

function createObjects() {
Expand All @@ -71,14 +72,17 @@ function createObjects() {

/// limits
// top
boundaries.push(new Boundary(w / 2, 0 - 49, width, 100, 0));

let thickness = 500;

boundaries.push(new Boundary(w / 2, 0 - thickness / 2, width, thickness, 0));

// bottom
boundaries.push(new Boundary(w / 2, height + 49, width, 100, 0));
boundaries.push(new Boundary(w / 2, height + thickness / 2, width, thickness, 0));

// sides
boundaries.push(new Boundary(-49, h / 2, 100, height * 15, 0));
boundaries.push(new Boundary(w + 49, h / 2, 100, height * 15, 0));
boundaries.push(new Boundary(-thickness / 2, h / 2, thickness, height * 15, 0));
boundaries.push(new Boundary(w + thickness / 2, h / 2, thickness, height * 15, 0));

for (let key in data.query.results) {
let thisResult = data.query.results[key];
Expand All @@ -100,6 +104,12 @@ function createObjects() {
}
}

let g; // other graphics
function createBlendGraphics() {
g = createGraphics(w, h);
g.background(255);
}

let btnS;
let springs;

Expand All @@ -110,7 +120,7 @@ function setup() {
sketch.parent('p5');
createMatterStuff();
createObjects();

createBlendGraphics();
// btnU = createButton("U");
// btnU.parent('btns');
// btnU.mousePressed(unlinkAll);
Expand All @@ -126,24 +136,6 @@ function createMatterStuff() {
engine.world.gravity.y = 0;
}

function drawNameAndTitle(note) {
fill(180, 30, 0);
textSize(16);
noStroke();
text(note.title.toUpperCase(), 0, 20);
let tw = textWidth(note.title.toUpperCase());
textFont(serif);
fill(0, 190);
let aw = textWidth(" - " + note.author);

if (tw + aw < w) {
text(" - " + note.author, tw, 20);
} else {
text(note.author, 0, 20 + textAscent());
}

}

function windowResized() {
notes = [];
springs = [];
Expand All @@ -153,34 +145,29 @@ function windowResized() {
sketch = createCanvas(w, h);
sketch.parent('p5');
createObjects();
createBlendGraphics();
}

function draw() {
background(255);
background(g.get());
Engine.update(engine);

for (let note of notes) {
note.display();

if (note.over) {
drawNameAndTitle(note);
displayNoteTitle(note);
}

// if a note is being clicked or dragged display the content
if (mConstraint.body === note.body) {
fill(255, 15);
noStroke();
rect(0, 0, w, h);
textSize(40);
fill(0, 200);
text(note.text, 0, 30, w, h - 30);
displayNoteContent(note);
}
}

// draw springs
for (spring of springs) {
stroke(180, 30, 0, 160);
line(spring.bodyA.position.x, spring.bodyA.position.y, spring.bodyB.position.x, spring.bodyB.position.y);
stroke(180, 30, 0, 160);
strokeWeight(.25);
line(spring.bodyA.position.x, spring.bodyA.position.y, spring.bodyB.position.x, spring.bodyB.position.y);

}

Expand All @@ -191,22 +178,23 @@ function draw() {

// paint line while dragging object

strokeWeight(1);
stroke(180, 30, 0, 30);
strokeWeight(2);
stroke(180, 30, 0, 140);
line(pos.x + offset.x, pos.y + offset.y, m.x, m.y);
}

if (mouseX < 0 || mouseX > width || mouseY < 0 || mouseY > height) {
mConstraint.constraint.bodyB = null;
}
updateGraphics();
}

function mouseClicked() {
for (note of notes) {
if (note.over) {
if (!note.touched) {
note.touched = true;
note.creatingSprings = true;
note.creatingSpring = true;
}
}
}
Expand All @@ -218,7 +206,7 @@ function touchEnded() {
if (note.over) {
if (!note.touched) {
note.touched = true;
note.creatingSprings = true;
note.creatingSpring = true;
}
}
}
Expand All @@ -230,4 +218,42 @@ function saveFile() {
let file = createImage(width, height);
file = get();
file.save(filename, 'png');
}

function displayNoteTitle(note) {
g.fill(180, 30, 0);
g.textFont(serif);
g.textSize(16);
g.noStroke();
g.text(note.title.toUpperCase(), 0, 20);
let tw = g.textWidth(note.title.toUpperCase());
g.textFont(serif);
g.fill(0, 190);
let aw = g.textWidth(" - " + note.author);
if (tw + aw < w) {
g.text(" - " + note.author, tw, 20);
} else {
g.text(note.author, 0, 20 + textAscent());
}
}

function displayNoteContent(note) {
g.textSize(48);
g.fill(80, 150);
g.text(note.text, 0, 30, w, h - 30);
}

function updateGraphics() {
// draw springs trails
for (spring of springs) {
g.stroke(180, 30, 0, 45);
strokeWeight(1);
g.line(spring.bodyA.position.x, spring.bodyA.position.y, spring.bodyB.position.x, spring.bodyB.position.y);

}
g.blendMode(ADD);
g.fill(255, 1);
g.noStroke();
g.rect(0, 0, w, h);
g.blendMode(BLEND);
}

0 comments on commit af04b75

Please sign in to comment.