{"id":2924,"date":"2016-09-10T09:22:25","date_gmt":"2016-09-10T08:22:25","guid":{"rendered":"http:\/\/www.lyceelecorbusier.eu\/p5js\/?p=2924"},"modified":"2016-09-10T09:36:06","modified_gmt":"2016-09-10T08:36:06","slug":"p5-re-code-04","status":"publish","type":"post","link":"https:\/\/www.lyceelecorbusier.eu\/p5js\/?p=2924","title":{"rendered":"\/ p5 \/ re-code 04"},"content":{"rendered":"<p>Inspir\u00e9 par &#8220;Structure Square Series Inwards&#8221; de <a href=\"http:\/\/dada.compart-bremen.de\/item\/agent\/633\" target=\"_blank\">Roger Coqart<\/a><\/p>\n\n<!-- iframe plugin v.5.1 wordpress.org\/plugins\/iframe\/ -->\n<iframe src=\"http:\/\/lyceelecorbusier.eu\/p5\/recode\/04-recode\" width=\"780\" height=\"780\" style=\"border: 1px solid #ddd;\" scrolling=\"yes\" class=\"iframe-class\" frameborder=\"0\"><\/iframe>\n\n<pre>\/* \r\nPart of the ReCode Project (http:\/\/recodeproject.com)\r\nBased on \"Structure Square Series Inwards\" by Roger Coqart\r\nOriginally published in \"Computer Graphics and Art\" v1n3, 1976\r\nCopyright (c) 2013 Fabien bonnamy - OSI\/MIT license (http:\/\/recodeproject\/license).\r\n*\/\r\n\r\n\/* @pjs pauseOnBlur=\"true\"; *\/\r\n\r\nvar x1,x2,y1,y2,aleatoire,ecart,marge,taille; \r\nvar h = 36; \/\/ Mettre un multiple de 3\r\nvar check = [0,1,2,3,4,5,6,7];\r\nvar lines = [ [0,0,h,h], [h,0,0,h], [h\/2,0,h\/2,h], [0,h\/2,h,h\/2], [0,h\/2,h\/2,0], [0,h\/2,h\/2,h], [h\/2,0,h,h\/2], [h,h\/2,h\/2,h] ]; \r\n\r\nfunction setup(){\r\n noLoop(); \/\/ j'utilise le noLoop car je ne souhaite pas la fonction draw() soit execut\u00e9e plus d'une fois \r\n smooth(); \/\/ pour que mes traits soient plus net\r\n aleatoire = 0; \/\/\r\n marge = h\/3; \/\/ l'espace entre les carr\u00e9s\r\n ecart = h+marge; \/\/ la place dans laquelle evelue un carr\u00e9\r\n taille = ((h+marge)*13); \/\/ la taille de mon carr\u00e9\r\n createCanvas(taille +marge , taille + marge); \/\/ notez que rajoute marge encore une fois afin dessiner la border droit et bas\r\n}\r\n\r\nfunction draw(){\r\n background(255);\r\n translate(marge,marge);\/\/ je deplace le point initial de mon ecran pour creer une marge en haut et \u00e0 gauche\r\n stroke(0);\r\n strokeWeight(2); \/\/ traits sont noir\r\n\r\n \/\/ j'utilise une double bouble for pour plac\u00e9 chaque carr\u00e9s sur l'ecran. \r\n \/\/ Ici je place 15 carr\u00e9s en long (i) et 15 en large (j)\r\n for (var i = 0; i &lt;15; i++){\r\n for (var j = 0; j &lt; 15; j++){\r\n \/\/Je deplace le point 0,0 de mon ecran \u00e0 chaque tour de boucle. cela me permet de toujour utilser 0,0 comme point de reference.\r\n \/\/ pour ce faire je vais un translate encapsuluer avec mon code dans un pushMatrix, popMatrix\r\n push();\r\n translate(i*ecart, j*ecart);\r\n fill(255,255,255);\r\n\r\n \/\/maintenant en fonction de l'emplacement de mon carr\u00e9 je dessine plus ou moins de trais \u00e0 l'interieur\r\n\r\n \/\/ carr\u00e9 est au centre\r\n if(j == 6 &amp;&amp; i == 6){\r\n rect(0, 0, h, h);\r\n }\r\n \/\/ carr\u00e9s sont 1 carr\u00e9 du centre\r\n else if(j&gt;=5 &amp;&amp; j&lt;8 &amp;&amp; i&gt;=5 &amp;&amp; i&lt;8){\r\n rect(0, 0, h, h); \r\n strokeWeight(2);\r\n generateLines(2);\r\n }\r\n \/\/ carr\u00e9s sont 2 carr\u00e9s du centre\r\n else if(j&gt;=4 &amp;&amp; j&lt;9 &amp;&amp; i&gt;=4 &amp;&amp; i&lt;9){\r\n rect(0, 0, h, h); \r\n strokeWeight(2);\r\n generateLines(3);\r\n }\r\n \/\/ carr\u00e9s sont 3 carr\u00e9s du centre\r\n else if(j&gt;=3 &amp;&amp; j&lt;10 &amp;&amp; i&gt;=3 &amp;&amp; i&lt;10){\r\n rect(0, 0, h, h); \r\n strokeWeight(2);\r\n generateLines(4);\r\n }\r\n \/\/ carr\u00e9s sont 4 carr\u00e9 du centre\r\n else if(j&gt;=2 &amp;&amp; j&lt;11 &amp;&amp; i&gt;=2 &amp;&amp; i&lt;11){\r\n rect(0, 0, h, h); \r\n strokeWeight(2);\r\n generateLines(5);\r\n }\r\n \/\/ carr\u00e9s sont 5 carr\u00e9 du centre\r\n else if(j&gt;=1 &amp;&amp; j&lt;12 &amp;&amp; i&gt;=1 &amp;&amp; i&lt;12){\r\n rect(0, 0, h, h); \r\n strokeWeight(2);\r\n generateLines(6);\r\n }\r\n \/\/ carr\u00e9s sont 6 carr\u00e9 du centre\r\n else if(j&gt;=0 &amp;&amp; j&lt;13 &amp;&amp; i&gt;=0 &amp;&amp; i&lt;13){\r\n rect(0, 0, h, h); \r\n strokeWeight(2);\r\n generateLines(7);\r\n }\r\n pop();\r\n } \r\n }\r\n \/\/decommenter pour enregistrer l'image produite\r\n \/\/saveFrame(\"squareColor\"+h+\".jpg\");\r\n}\r\n\r\n\/\/ fonction qui recoit un nombre de lignes en arguments\r\n\/\/ Cette dessine les trais et fait aussi attention ne pas en dessiner les uns sur les autres\r\nfunction generateLines(numberOfLines) {\r\n \/\/ nous avons un tableau initial allant de 0 \u00e0 7\r\n \/\/ on echange quelques valeurs \r\n for (var i = 0; i&lt;numberOfLines-1; i++){\r\n var rand1 = int(random(8));\r\n var rand2 = int(random(8));\r\n var temp;\r\n\r\n temp = check[rand1];\r\n check[rand1] = check[rand2];\r\n check[rand2] = temp;\r\n }\r\n\r\n \/\/ puis on lit un nombre d'entr\u00e9es egale \u00e0 l'argument pass\u00e9\r\n for (var i = 0; i&lt; numberOfLines; i++){\r\n aleatoire = check[i];\r\n line(lines[aleatoire][0], lines[aleatoire][1], lines[aleatoire][2], lines[aleatoire][3]); \r\n }\r\n}<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Inspir\u00e9 par &#8220;Structure Square Series Inwards&#8221; de Roger Coqart \/* Part of the ReCode Project (http:\/\/recodeproject.com) Based on &#8220;Structure Square Series Inwards&#8221; by Roger Coqart Originally published in &#8220;Computer Graphics and Art&#8221; v1n3, 1976 Copyright (c) 2013 Fabien&#8230; <a class=\"read-more\" href=\"https:\/\/www.lyceelecorbusier.eu\/p5js\/?p=2924\">Lire la suite&#8230;<\/a><\/p>\n","protected":false},"author":1,"featured_media":2926,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[9,6],"tags":[],"_links":{"self":[{"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts\/2924"}],"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=2924"}],"version-history":[{"count":2,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts\/2924\/revisions"}],"predecessor-version":[{"id":2927,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/posts\/2924\/revisions\/2927"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=\/wp\/v2\/media\/2926"}],"wp:attachment":[{"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2924"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2924"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lyceelecorbusier.eu\/p5js\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2924"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}