/* built with Studio Sketchpad:
* https://sketchpad.cc
*
* observe the evolution of this sketch:
* https://p5js.sketchpad.cc/sp/pad/view/ro.90xVTuJFcVi/rev.25
*
* authors:
* GoToLoop
* license (unless otherwise specified):
* creative commons attribution-share alike 3.0 license.
* https://creativecommons.org/licenses/by-sa/3.0/
*/
/**
* Word Frequencies (v2.04)
* by LDLathrop & BlindFish (2016-May-15)
* mod GoToLoop
*
* forum.Processing.org/two/discussion/16600/
* script-won-t-load-in-browser-but-no-error-message-in-console#Item_8
*
* p5js.SketchPad.cc/sp/pad/view/ro.90xVTuJFcVi/latest
*/
"use strict";
const CSV_FILE = 'cltop.csv',
SKETCHPAD = '/static/uploaded_resources/p.19392/',
HOSTED = true,
CSV_PATH = (HOSTED && SKETCHPAD || '') + CSV_FILE;
let candidate, words;
function preload() {
candidate = loadTable(CSV_PATH, 'header');
}
function setup() {
createCanvas(500, 432);
frameRate(60).noStroke().textAlign(LEFT, BASELINE);
createWords(candidate);
}
function draw() {
background(0);
for (let w of words) w.script();
}
function mousePressed() {
for (let w of words) w.pickSpd();
}
function createWords(csv) {
const gap = Word.GAP + Word.MAX_SIZE;
let minFreq = Number.POSITIVE_INFINITY, maxFreq = 0;
words = Array(csv.getRowCount());
csv.getRows().forEach((elem, idx) => {
const word = elem.getString('Words'),
freq = elem.getNum('Frequency');
words[idx] = new Word(word, freq, width>>1, idx*gap + gap);
minFreq = min(minFreq, freq), maxFreq = max(maxFreq, freq);
});
for (let w of words) w.mapFreq(minFreq, maxFreq);
}
class Word {
static get MIN_SPD() { return .3; }
static get MAX_SPD() { return 3; }
static get MIN_GREY() { return 0o150; }
static get MAX_GREY() { return 0xFF; }
static get MIN_SIZE() { return 12; }
static get MAX_SIZE() { return 36; }
static get GAP() { return 4; }
constructor (word, freq, x, y) {
this.word = word, this.freq = freq;
this.x = x, this.y = y;
this.pickSpd();
}
static negOrPos() {
return Math.random() < .5 && -1 || 1;
}
pickSpd(spd) {
this.spd = spd || random(Word.MIN_SPD, Word.MAX_SPD) * Word.negOrPos();
}
mapFreq(minFreq, maxFreq) {
this.freqGray = map(this.freq, minFreq, maxFreq, Word.MIN_GREY, Word.MAX_GREY);
this.freqSize = map(this.freq, minFreq, maxFreq, Word.MIN_SIZE, Word.MAX_SIZE);
textSize(this.freqSize);
this.w = textWidth(this.word);
}
script() {
this.bounce();
this.display();
}
bounce() {
(this.x += this.spd) >= width - this.w | this.x <= 0 && (this.spd *= -1);
}
display() {
fill(this.freqGray);
textSize(this.freqSize);
text(this.word, this.x, this.y);
}
}