You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

141 lines
3.6 KiB
JavaScript

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

// P_3_1_3_02
//
// Generative Gestaltung Creative Coding im Web
// ISBN: 978-3-87439-902-9, First Edition, Hermann Schmidt, Mainz, 2018
// Benedikt Groß, Hartmut Bohnacker, Julia Laub, Claudius Lazzeroni
// with contributions by Joey Lee and Niels Poldervaart
// Copyright 2018
//
// http://www.generative-gestaltung.de
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
/**
* analysing and sorting the letters of a text
* connecting subsequent letters with lines
*
* MOUSE
* position x : interpolate between normal text and sorted position
*
* KEYS
* 1 : toggle lines on/off
* 2 : toggle text on/off
* 3 : switch all letters off
* 4 : switch all letters on
* a-z : switch letter on/off
* CONTROL : save png
*/
'use strict';
var joinedText;
var alphabet;
var drawLetters = [];
var posX;
var posY;
var drawLines = false;
var drawText = true;
function preload() {
joinedText = loadStrings('data/library_babel_extract1.txt');
}
function setup() {
createCanvas(1920, windowHeight);
textFont('monospace', 30);
fill(0);
joinedText = joinedText.join(' ');
alphabet = getUniqCharacters();
for (var i = 0; i < alphabet.length; i++) {
drawLetters[i] = true;
}
}
function draw() {
background(213,204,255);
posX = 20;
posY = 40;
var oldX = 0;
var oldY = 0;
// go through all characters in the text to draw them
for (var i = 0; i < joinedText.length; i++) {
// again, find the index of the current letter in the character set
var upperCaseChar = joinedText.charAt(i).toUpperCase();
var index = alphabet.indexOf(upperCaseChar);
if (index < 0) continue;
var sortY = index * 20 + 40;
var m = map(mouseX, 50, width - 50, 0, 1);
m = constrain(m, 0, 1);
var interY = lerp(posY, sortY, m);
if (drawLetters[index]) {
if (drawLines) {
if (oldX != 0 && oldY != 0) {
stroke(181, 157, 0, 100);
line(oldX, oldY, posX, interY);
}
oldX = posX;
oldY = interY;
}
if (drawText) {
noStroke();
text(joinedText.charAt(i), posX, interY);
}
} else {
oldX = 0;
oldY = 0;
}
posX += textWidth(joinedText.charAt(i));
if (posX >= width - 200 && upperCaseChar == ' ') {
posY += 30;
posX = 20;
}
}
}
function getUniqCharacters() {
var charsArray = joinedText.toUpperCase().split('');
var uniqCharsArray = charsArray.filter(function(char, index) {
return charsArray.indexOf(char) == index;
}).sort();
return uniqCharsArray.join('');
}
function keyReleased() {
if (keyCode == CONTROL) saveCanvas(gd.timestamp(), 'png');
if (key == '1') drawLines = !drawLines;
if (key == '2') drawText = !drawText;
if (key == '3') {
for (var i = 0; i < alphabet.length; i++) {
drawLetters[i] = false;
}
}
if (key == '4') {
drawText = true;
for (var i = 0; i < alphabet.length; i++) {
drawLetters[i] = true;
}
}
var index = alphabet.indexOf(key.toUpperCase());
if (index >= 0) {
drawLetters[index] = !drawLetters[index];
}
}