{"id":2548,"date":"2016-02-13T11:02:49","date_gmt":"2016-02-13T10:02:49","guid":{"rendered":"http:\/\/www.lyceelecorbusier.eu\/p5js\/?p=2548"},"modified":"2016-09-09T17:01:25","modified_gmt":"2016-09-09T16:01:25","slug":"2548","status":"publish","type":"post","link":"https:\/\/www.lyceelecorbusier.eu\/p5js\/?p=2548","title":{"rendered":"\/ p5.js \/ P_2_1_3_04"},"content":{"rendered":"<p style=\"text-align: center;\"><!--more-->\n<!-- iframe plugin v.5.1 wordpress.org\/plugins\/iframe\/ -->\n<iframe src=\"http:\/\/lyceelecorbusier.eu\/p5\/generative\/P_2_1_3_04\" width=\"780\" height=\"780\" style=\"border: 1px solid #ddd;\" scrolling=\"yes\" class=\"iframe-class\" frameborder=\"0\"><\/iframe>\n\n<pre style=\"text-align: left;\">\/\/ P_2_1_3_04\r\n\/\/\r\n\/\/ Generative Gestaltung, ISBN: 978-3-87439-759-9\r\n\/\/ First Edition, Hermann Schmidt, Mainz, 2009\r\n\/\/ Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni\r\n\/\/ Copyright 2009 Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni\r\n\/\/\r\n\/\/ http:\/\/www.generative-gestaltung.de\r\n\/\/\r\n\/\/ Licensed under the Apache License, Version 2.0 (the \"License\");\r\n\/\/ you may not use this file except in compliance with the License.\r\n\/\/ You may obtain a copy of the License at http:\/\/www.apache.org\/licenses\/LICENSE-2.0\r\n\/\/ Unless required by applicable law or agreed to in writing, software\r\n\/\/ distributed under the License is distributed on an \"AS IS\" BASIS,\r\n\/\/ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n\/\/ See the License for the specific language governing permissions and\r\n\/\/ limitations under the License.\r\n\/**\r\n\u00a0* changing positions of stapled circles in a grid\r\n\u00a0* \u00a0\u00a0 \u00a0 \r\n\u00a0* MOUSE\r\n\u00a0* position x\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 : module detail\r\n\u00a0* position y\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 : module parameter\r\n\u00a0* \r\n\u00a0* KEYS\r\n\u00a0* 1-3\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 : draw mode\r\n\u00a0* arrow left\/right\u00a0\u00a0\u00a0 : number of tiles horizontally\r\n\u00a0* arrow up\/down\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 : number of tiles vertically\r\n\u00a0* s\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 : save png\r\n\u00a0*\/\r\n\r\nvar tileCountX = 8;\r\nvar tileCountY = 8;\r\nvar count = 0;\r\nvar drawMode = 1;\r\n\r\nfunction setup() { \r\n\u00a0 createCanvas(780, 780);\r\n} \r\n\r\nfunction draw() { \r\n\u00a0 colorMode(HSB, 360, 100, 100); \r\n\u00a0 rectMode(CENTER);\r\n\u00a0 smooth();\r\n\u00a0 stroke(0);\r\n\u00a0 noFill();\r\n\u00a0 background(360); \r\n\u00a0 count = mouseX\/10 + 10;\r\n\u00a0 var para = mouseY\/height;\r\n\u00a0 for (var gridY=0; gridY&lt;= tileCountY; gridY++) {\r\n\u00a0\u00a0\u00a0 for (var gridX=0; gridX&lt;= tileCountX; gridX++) { \u00a0\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 var tileWidth = width \/ tileCountX;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 var tileHeight = height \/ tileCountY;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 var posX = tileWidth*gridX + tileWidth\/2;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 var posY = tileHeight*gridY + tileHeight\/2;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 push();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 translate(posX, posY);\r\n\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ switch between modules\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 switch (drawMode) {\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 case 1:\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 for(var i=0; i &lt; count; i++) {\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 rect(0, 0, tileWidth, tileHeight);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 scale(1 - 3.0\/count);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 rotate(para*0.1);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 break;\r\n\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 case 2:\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 colorMode(HSB, 360, 100, 100); \r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 for(var i=0; i&lt; count; i++) {\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 noStroke();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 from = color(0,0,0,0.5);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 to = color(52, 100, 71);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 gradient = lerpColor(from, to, i\/count);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 fill(gradient, i\/count*200);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 rotate(PI\/4);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 rect(0, 0, tileWidth, tileHeight);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 scale(1 - 3.0\/count);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 rotate(para*1.5);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 break;\r\n\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 case 3:\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 colorMode(RGB, 255);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 for(var i=0; i&lt; count; i++) {\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 noStroke();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 from = color(0, 130, 164);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 to = color(255);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 gradient = lerpColor(from, to, i\/count);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 fill(gradient,170);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 push();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 translate(4*i,0);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ellipse(0, 0, tileWidth\/4, tileHeight\/4);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 pop();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 push();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 translate(-4*i,0);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ellipse(0, 0, tileWidth\/4, tileHeight\/4);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 pop();\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 scale(1 - 1.5\/count);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 rotate(para*1.5);\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 break;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 }\r\n\u00a0\u00a0\u00a0\u00a0\u00a0 pop();\r\n\u00a0\u00a0\u00a0 }\r\n\u00a0 }\r\n} \r\n\r\n\r\nfunction keyTyped(){\r\n\u00a0 if (key == 's' || key == 'S') save(\"P_2_1_3_04.png\");\r\n\u00a0 if (key == '1') drawMode = 1;\r\n\u00a0 if (key == '2') drawMode = 2;\r\n\u00a0 if (key == '3') drawMode = 3;\r\n}\r\n\r\nfunction keyPressed(){\r\n\u00a0 if (keyCode == DOWN_ARROW) tileCountY = max(tileCountY-1, 1);\r\n\u00a0 if (keyCode == UP_ARROW) tileCountY += 1;\r\n\u00a0 if (keyCode == LEFT_ARROW) tileCountX = max(tileCountX-1, 1);\r\n\u00a0 if (keyCode == RIGHT_ARROW) tileCountX += 1;\r\n}<\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":2549,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[10,6],"tags":[],"_links":{"self":[{"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts\/2548"}],"collection":[{"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2548"}],"version-history":[{"count":2,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts\/2548\/revisions"}],"predecessor-version":[{"id":2551,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts\/2548\/revisions\/2551"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/media\/2549"}],"wp:attachment":[{"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2548"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2548"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2548"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}