P_3_1_2: Code style improvements

Author: Niels-NTG

01_P/P_3_1_2_01/sketch.js

@@ -1,4 +1,4 @@
-// P_3_1_2_01.pde
+// P_3_1_2_01
 //
 // Generative Gestaltung, ISBN: 978-3-87439-759-9
 // First Edition, Hermann Schmidt, Mainz, 2009
@@ -20,7 +20,7 @@
  * typewriter. uses input (text) as blueprint for a visual composition.
  *
  * MOUSE
- * drag                : move canvas
+ * click + drag        : move canvas
  *
  * KEYS
  * a-z                 : text input (keyboard)
@@ -82,12 +82,14 @@ function setup() {
   offsetX = 0;
   offsetY = 0;
   zoom = 0.75;
+
   actRandomSeed = 6;
 
   cursor(HAND);
   textFont(font, 25);
   textAlign(LEFT, BASELINE);
-  imageMode(CORNER);
+  noStroke();
+  fill(0);
 }
 
 function windowResized() {
@@ -96,7 +98,6 @@ function windowResized() {
 
 function draw() {
   background(255);
-  noStroke();
 
   if (mouseIsPressed && mouseButton == LEFT) {
     centerX = mouseX - offsetX;
@@ -161,15 +162,13 @@ function draw() {
         break;
 
       default: // all others
-        fill(0);
         text(letter, 0, 0);
         translate(letterWidth, 0);
     }
   }
 
   // blink cursor after text
-  fill(0);
-  if (int(frameCount / 6) % 2 == 0) rect(0, 0, 15, 2);
+  if (frameCount / 6 % 2 == 0) rect(0, 0, 15, 2);
 }
 
 
@@ -192,9 +191,6 @@ function keyPressed() {
       textTyped = textTyped.substring(0, max(0, textTyped.length - 1));
       print(textTyped);
       break;
-    case TAB:
-    case ESCAPE:
-      break;
     case ENTER:
     case RETURN:
       // enable linebreaks
@@ -212,5 +208,6 @@ function keyPressed() {
 function keyTyped() {
   if (keyCode >= 32) {
     textTyped += key;
+    print(textTyped);
   }
 }

01_P/P_3_1_2_02/sketch.js

@@ -1,4 +1,4 @@
-// P_3_1_2_02.pde
+// P_3_1_2_02
 //
 // Generative Gestaltung, ISBN: 978-3-87439-759-9
 // First Edition, Hermann Schmidt, Mainz, 2009
@@ -24,42 +24,43 @@
 *
 * KEYS
 * a-z                 : text input (keyboard)
-* space               : random straight / small curve
 * ,.!?                : curves
+* space               : random straight / small curve
 * :+-xz               : icons
 * o                   : station with the last 7 typed letters as name
 * a u                 : stop
 * del, backspace      : remove last letter
 * arrow up            : zoom canvas +
 * arrow down          : zoom canvas -
+* alt                 : new random layout
 * ctrl                : save png
 */
 'use strict';
 
+var textTyped = 'Was hier folgt ist Tet! So asnt, und mag. Ich mag Tet sehr.';
 var font;
-var textTyped =  "Was hier folgt ist Tet! So asnt, und mag. Ich mag Tet sehr.";
 
 var shapeSpace;
 var shapeSpace2;
 var shapePeriod;
 var shapeComma;
-var shapeExclamationmark;
-
 var shapeQuestionmark;
+var shapeExclamationmark;
 var shapeReturn;
 var icon1;
 var icon2;
 var icon3;
 var icon4;
 var icon5;
 
-var centerX = 0;
-var centerY = 0;
-var offsetX = 0;
-var offsetY = 0;
-var zoom = 0.75;
+var centerX;
+var centerY;
+var offsetX;
+var offsetY;
+var zoom;
+
+var actRandomSeed;
 
-//new RGBColour(0, 130, 164);
 var palette = [
   [253, 195, 0],
   [0, 0, 0],
@@ -92,17 +93,21 @@ function preload() {
 function setup() {
   createCanvas(windowWidth, windowHeight);
 
-  textFont(font, 25);
+  centerX = width / 2;
+  centerY = height / 2;
+  offsetX = 0;
+  offsetY = 0;
+  zoom = 0.75;
+  actRandomSeed = 6;
+
   cursor(HAND);
+  textFont(font, 25);
+  textAlign(LEFT, BASELINE);
   noStroke();
   fill(0);
-
-  centerX = width / 2;
-  centerY = height / 2;
 }
 
 function windowResized() {
-  // resize canvas when window is resized
   resizeCanvas(windowWidth, windowHeight);
 }
 
@@ -114,27 +119,23 @@ function draw() {
     centerY = mouseY - offsetY;
   }
 
+  // allways produce the same sequence of random numbers
+  randomSeed(actRandomSeed);
+
   translate(centerX, centerY);
   scale(zoom);
 
-  push();
-
-  randomSeed(0);
-
   actColorIndex = 0;
   fill(palette[actColorIndex][0], palette[actColorIndex][1], palette[actColorIndex][2]);
   rect(0, -25, 10, 35);
 
   for (var i = 0; i < textTyped.length; i++) {
-    var fontSize = 25;
-    textFont(font, fontSize);
     var letter = textTyped.charAt(i);
     var letterWidth = textWidth(letter);
 
     // ------ letter rule table ------
     switch (letter) {
       case ' ': //space
-        //60% notrun, 20% left, 20% right
         var dir = floor(random(5));
         if (dir == 0) {
           image(shapeSpace, 0, -15);
@@ -147,26 +148,31 @@ function draw() {
           rotate(-QUARTER_PI);
         }
         break;
+
       case ',':
         image(shapeComma, 0, -15);
         translate(33, 15);
         rotate(QUARTER_PI);
         break;
+
       case '.':
         image(shapePeriod, 0, -56);
         translate(56, -56);
         rotate(-HALF_PI);
         break;
+
       case '!':
         image(shapeExclamationmark, 0, -30);
         translate(43, -18);
         rotate(-QUARTER_PI);
         break;
+
       case '?':
         image(shapeQuestionmark, 0, -30);
         translate(43, -18);
         rotate(-QUARTER_PI);
         break;
+
       case '\n':
         // start a new line at a random position near the center
         rect(0, -25, 10, 35);
@@ -178,6 +184,7 @@ function draw() {
         fill(palette[actColorIndex][0], palette[actColorIndex][1], palette[actColorIndex][2]);
         rect(0, -25, 10, 35);
         break;
+
       case 'o': // Station big
         rect(0, -15, letterWidth + 1, 15);
         push();
@@ -193,31 +200,39 @@ function draw() {
         pop();
         translate(letterWidth, 0);
         break;
+
       case 'a': // Station small left
         rect(0, 0 - 15, letterWidth + 1, 25);
         rect(0, 0 - 15, letterWidth + 1, 15);
         translate(letterWidth, 0);
         break;
+
       case 'u':  // Station small right
         rect(0, 0 - 25, letterWidth + 1, 25);
         rect(0, 0 - 15, letterWidth + 1, 15);
         translate(letterWidth, 0);
         break;
+
       case ':': // icon
         image(icon1, 0, -60, 30, 30);
         break;
+
       case '+': // icon
         image(icon2, 0, -60, 35, 30);
         break;
+
       case '-': // icon
         image(icon3, 0, -60, 30, 30);
         break;
+
       case 'x': // icon
         image(icon4, 0, -60, 30, 30);
         break;
+
       case 'z': // icon
         image(icon5, 0, -60, 30, 30);
         break;
+
       default: // all others
         rect(0, -15, letterWidth + 1, 15);
         translate(letterWidth, 0);
@@ -227,8 +242,6 @@ function draw() {
   // blink cursor after text
   fill(200, 30, 40);
   if (frameCount / 6 % 2 == 0) rect(0, 0, 15, 2);
-
-  pop();
 }
 
 function mousePressed() {
@@ -238,6 +251,7 @@ function mousePressed() {
 
 function keyReleased() {
   if (keyCode == CONTROL) saveCanvas(gd.timestamp(), 'png');
+  if (keyCode == ALT) actRandomSeed++;
 }
 
 function keyPressed() {