commit 7d7b209d427f26e29a5fac3e6ec96f4fb9149b1d
parent 752a6c5863a60de59054f7ccc24c64f3a53cbe8a
Author: mpizzzle <m@michaelpercival.xyz>
Date: Mon, 9 Nov 2020 22:51:04 +0000
correcting links?
Diffstat:
3 files changed, 33 insertions(+), 33 deletions(-)
diff --git a/2020.html b/2020.html
@@ -39,8 +39,8 @@
<p>The simplest method of division is to take each t123 triangle and divide it into three sub triangles; you can calculate the sub-triangle geometry by finding two new vertices along the perimeter of the parent t123 triangle via the golden ratio (again, check out the link above for more detail).</p>
<p>Doing this correctly you can fit two t123's and one t124 perfectly into a parent t123 triangle, and in a similar manner the rules for dividing t124 triangles is to fit one t123 and one t124. Boom, infinite Penrose tilings. Simple right? Check out the initial decagon and first t123 split below:
-<p><a href="assets/pizza.png"><img src="assets/pizza.png" alt="" width="400" height="400" /></a>
-<a href="assets/more_complicated_pizza.png"><img src="assets/more_complicated_pizza.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/pizza.png"><img src="blog/assets/pizza.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/more_complicated_pizza.png"><img src="blog/assets/more_complicated_pizza.png" alt="" width="400" height="400" /></a></p>
<p>I have used the <a href="https://www.sfml-dev.org/">sfml</a> library in the past as a wrapper for GLSL shading, but it turned out to be a pain to use for this project. I admit my knowledge of the library is poor, but in a marginally more complex project I found a few too many things to be restrictive, for example managing <a href="https://www.sfml-dev.org/documentation/2.5.1/classsf_1_1VertexBuffer.php">vertex buffers</a> (how do I handle my own element buffer objects?); in the end I'd rather just call the OpenGL functions myself, so I scrapped the library in favour of <a href="https://www.glfw.org/">glfw</a>. A little more work required in exchange for a little more control turned out to be the right balance.</p>
@@ -61,24 +61,24 @@
</ul></p>
<p>Once that was solved I ended up with this interesting pattern, from which the Penrose tiling can be carved out:</p>
-<a href="assets/skeleton.png"><img src="assets/skeleton.png" alt="" width="400" height="400" /></a></p>
+<a href="blog/assets/skeleton.png"><img src="blog/assets/skeleton.png" alt="" width="400" height="400" /></a></p>
<p>Despite the above picture being formed from only two different triangles, it is not a valid Penrose tiling. Some of the lines need to be removed, and at the time I was rendering whole triangles instead of individual lines which wasn't flexible enough in terms of design. Once I figured out which lines needed to be removed and how, I ended up with the following:</p>
-<p><a href="assets/p2.png"><img src="assets/p2.png" alt="" width="400" height="400" /></a>
-<a href="assets/p3.png"><img src="assets/p3.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p2.png"><img src="blog/assets/p2.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p3.png"><img src="blog/assets/p3.png" alt="" width="400" height="400" /></a></p>
<p>Voila! That qualifies as a valid Penrose tiling, and with some careful tinkering I was able to generate the P3 tiling also. Next, using the triangle index data for shading (one element buffer for the t123 triangles, and one for t124):</p>
-<p><a href="assets/p2_two_colour.png"><img src="assets/p2_two_colour.png" alt="" width="400" height="400" /></a>
-<a href="assets/p3_two_colour.png"><img src="assets/p3_two_colour.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p2_two_colour.png"><img src="blog/assets/p2_two_colour.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p3_two_colour.png"><img src="blog/assets/p3_two_colour.png" alt="" width="400" height="400" /></a></p>
<p>Then trying to be clever by using a six colour palette (including the lines and background). This was achieved by looking at the parent type of any given triangle giving us 2² colour options for the triangles. I think it turned out nicely:</p>
-<p><a href="assets/p3_four_colour_1.png"><img src="assets/p3_four_colour_1.png" alt="" width="400" height="400" /></a>
-<a href="assets/p2_four_colour_1.png"><img src="assets/p2_four_colour_1.png" alt="" width="400" height="400" /></a></p>
-<p><a href="assets/p2_four_colour_2.png"><img src="assets/p2_four_colour_2.png" alt="" width="400" height="400" /></a>
-<a href="assets/p3_four_colour_2.png"><img src="assets/p3_four_colour_2.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p3_four_colour_1.png"><img src="blog/assets/p3_four_colour_1.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p2_four_colour_1.png"><img src="blog/assets/p2_four_colour_1.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p2_four_colour_2.png"><img src="blog/assets/p2_four_colour_2.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p3_four_colour_2.png"><img src="blog/assets/p3_four_colour_2.png" alt="" width="400" height="400" /></a></p>
<p>I know there are better and more elegant ways of shading Penrose tilings but I feel happy that I've done what I set out to do, the hard part is waiting for divine inspiration to kick in before I try and paint one for real.</p>
<p>You can find the code used to generate the images above on github <a href="https://github.com/mpizzzle/penrose">here</a>. If you want to compile the program yourself you'll have install the dependencies manually for now; I may take the time to package it with a more modern build tool in the future.</p>
diff --git a/blog/penrose-tilings-part-1.html b/blog/penrose-tilings-part-1.html
@@ -15,8 +15,8 @@
<p>The simplest method of division is to take each t123 triangle and divide it into three sub triangles; you can calculate the sub-triangle geometry by finding two new vertices along the perimeter of the parent t123 triangle via the golden ratio (again, check out the link above for more detail).</p>
<p>Doing this correctly you can fit two t123's and one t124 perfectly into a parent t123 triangle, and in a similar manner the rules for dividing t124 triangles is to fit one t123 and one t124. Boom, infinite Penrose tilings. Simple right? Check out the initial decagon and first t123 split below:
-<p><a href="assets/pizza.png"><img src="assets/pizza.png" alt="" width="540" height="540" /></a>
-<a href="assets/more_complicated_pizza.png"><img src="assets/more_complicated_pizza.png" alt="" width="540" height="540" /></a></p>
+<p><a href="blog/assets/pizza.png"><img src="blog/assets/pizza.png" alt="" width="540" height="540" /></a>
+<a href="blog/assets/more_complicated_pizza.png"><img src="blog/assets/more_complicated_pizza.png" alt="" width="540" height="540" /></a></p>
<p>I have used the <a href="https://www.sfml-dev.org/">sfml</a> library in the past as a wrapper for GLSL shading, but it turned out to be a pain to use for this project. I admit my knowledge of the library is poor, but in a marginally more complex project I found a few too many things to be restrictive, for example managing <a href="https://www.sfml-dev.org/documentation/2.5.1/classsf_1_1VertexBuffer.php">vertex buffers</a> (how do I handle my own element buffer objects?); in the end I'd rather just call the OpenGL functions myself, so I scrapped the library in favour of <a href="https://www.glfw.org/">glfw</a>. A little more work required in exchange for a little more control turned out to be the right balance.</p>
@@ -37,24 +37,24 @@
</ul></p>
<p>Once that was solved I ended up with this interesting pattern, from which the Penrose tiling can be carved out:</p>
-<a href="assets/skeleton.png"><img src="assets/skeleton.png" alt="" width="540" height="540" /></a></p>
+<a href="blog/assets/skeleton.png"><img src="blog/assets/skeleton.png" alt="" width="540" height="540" /></a></p>
<p>Despite the above picture being formed from only two different triangles, it is not a valid Penrose tiling. Some of the lines need to be removed, and at the time I was rendering whole triangles instead of individual lines which wasn't flexible enough in terms of design. Once I figured out which lines needed to be removed and how, I ended up with the following:</p>
-<p><a href="assets/p2.png"><img src="assets/p2.png" alt="" width="540" height="540" /></a>
-<a href="assets/p3.png"><img src="assets/p3.png" alt="" width="540" height="540" /></a></p>
+<p><a href="blog/assets/p2.png"><img src="blog/assets/p2.png" alt="" width="540" height="540" /></a>
+<a href="blog/assets/p3.png"><img src="blog/assets/p3.png" alt="" width="540" height="540" /></a></p>
<p>Voila! That qualifies as a valid Penrose tiling, and with some careful tinkering I was able to generate the P3 tiling also. Next, using the triangle index data for shading (one element buffer for the t123 triangles, and one for t124):</p>
-<p><a href="assets/p2_two_colour.png"><img src="assets/p2_two_colour.png" alt="" width="540" height="540" /></a>
-<a href="assets/p3_two_colour.png"><img src="assets/p3_two_colour.png" alt="" width="540" height="540" /></a></p>
+<p><a href="blog/assets/p2_two_colour.png"><img src="blog/assets/p2_two_colour.png" alt="" width="540" height="540" /></a>
+<a href="blog/assets/p3_two_colour.png"><img src="blog/assets/p3_two_colour.png" alt="" width="540" height="540" /></a></p>
<p>Then trying to be clever by using a six colour palette (including the lines and background). This was achieved by looking at the parent type of any given triangle giving us 2² colour options for the triangles. I think it turned out nicely:</p>
-<p><a href="assets/p3_four_colour_1.png"><img src="assets/p3_four_colour_1.png" alt="" width="540" height="540" /></a>
-<a href="assets/p2_four_colour_1.png"><img src="assets/p2_four_colour_1.png" alt="" width="540" height="540" /></a></p>
-<p><a href="assets/p2_four_colour_2.png"><img src="assets/p2_four_colour_2.png" alt="" width="540" height="540" /></a>
-<a href="assets/p3_four_colour_2.png"><img src="assets/p3_four_colour_2.png" alt="" width="540" height="540" /></a></p>
+<p><a href="blog/assets/p3_four_colour_1.png"><img src="blog/assets/p3_four_colour_1.png" alt="" width="540" height="540" /></a>
+<a href="blog/assets/p2_four_colour_1.png"><img src="blog/assets/p2_four_colour_1.png" alt="" width="540" height="540" /></a></p>
+<p><a href="blog/assets/p2_four_colour_2.png"><img src="blog/assets/p2_four_colour_2.png" alt="" width="540" height="540" /></a>
+<a href="blog/assets/p3_four_colour_2.png"><img src="blog/assets/p3_four_colour_2.png" alt="" width="540" height="540" /></a></p>
<p>I know there are better and more elegant ways of shading Penrose tilings but I feel happy that I've done what I set out to do, the hard part is waiting for divine inspiration to kick in before I try and paint one for real.</p>
<p>You can find the code used to generate the images above on github <a href="https://github.com/mpizzzle/penrose">here</a>. If you want to compile the program yourself you'll have install the dependencies manually for now; I may take the time to package it with a more modern build tool in the future.</p>
diff --git a/rss.xml b/rss.xml
@@ -23,8 +23,8 @@ Updates from Michael Percival. Give this file to your RSS feeder to receive blog
<p>The simplest method of division is to take each t123 triangle and divide it into three sub triangles; you can calculate the sub-triangle geometry by finding two new vertices along the perimeter of the parent t123 triangle via the golden ratio (again, check out the link above for more detail).</p>
<p>Doing this correctly you can fit two t123's and one t124 perfectly into a parent t123 triangle, and in a similar manner the rules for dividing t124 triangles is to fit one t123 and one t124. Boom, infinite Penrose tilings. Simple right? Check out the initial decagon and first t123 split below:
-<p><a href="assets/pizza.png"><img src="assets/pizza.png" alt="" width="400" height="400" /></a>
-<a href="assets/more_complicated_pizza.png"><img src="assets/more_complicated_pizza.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/pizza.png"><img src="blog/assets/pizza.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/more_complicated_pizza.png"><img src="blog/assets/more_complicated_pizza.png" alt="" width="400" height="400" /></a></p>
<p>I have used the <a href="https://www.sfml-dev.org/">sfml</a> library in the past as a wrapper for GLSL shading, but it turned out to be a pain to use for this project. I admit my knowledge of the library is poor, but in a marginally more complex project I found a few too many things to be restrictive, for example managing <a href="https://www.sfml-dev.org/documentation/2.5.1/classsf_1_1VertexBuffer.php">vertex buffers</a> (how do I handle my own element buffer objects?); in the end I'd rather just call the OpenGL functions myself, so I scrapped the library in favour of <a href="https://www.glfw.org/">glfw</a>. A little more work required in exchange for a little more control turned out to be the right balance.</p>
@@ -45,24 +45,24 @@ Updates from Michael Percival. Give this file to your RSS feeder to receive blog
</ul></p>
<p>Once that was solved I ended up with this interesting pattern, from which the Penrose tiling can be carved out:</p>
-<a href="assets/skeleton.png"><img src="assets/skeleton.png" alt="" width="400" height="400" /></a></p>
+<a href="blog/assets/skeleton.png"><img src="blog/assets/skeleton.png" alt="" width="400" height="400" /></a></p>
<p>Despite the above picture being formed from only two different triangles, it is not a valid Penrose tiling. Some of the lines need to be removed, and at the time I was rendering whole triangles instead of individual lines which wasn't flexible enough in terms of design. Once I figured out which lines needed to be removed and how, I ended up with the following:</p>
-<p><a href="assets/p2.png"><img src="assets/p2.png" alt="" width="400" height="400" /></a>
-<a href="assets/p3.png"><img src="assets/p3.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p2.png"><img src="blog/assets/p2.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p3.png"><img src="blog/assets/p3.png" alt="" width="400" height="400" /></a></p>
<p>Voila! That qualifies as a valid Penrose tiling, and with some careful tinkering I was able to generate the P3 tiling also. Next, using the triangle index data for shading (one element buffer for the t123 triangles, and one for t124):</p>
-<p><a href="assets/p2_two_colour.png"><img src="assets/p2_two_colour.png" alt="" width="400" height="400" /></a>
-<a href="assets/p3_two_colour.png"><img src="assets/p3_two_colour.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p2_two_colour.png"><img src="blog/assets/p2_two_colour.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p3_two_colour.png"><img src="blog/assets/p3_two_colour.png" alt="" width="400" height="400" /></a></p>
<p>Then trying to be clever by using a six colour palette (including the lines and background). This was achieved by looking at the parent type of any given triangle giving us 2² colour options for the triangles. I think it turned out nicely:</p>
-<p><a href="assets/p3_four_colour_1.png"><img src="assets/p3_four_colour_1.png" alt="" width="400" height="400" /></a>
-<a href="assets/p2_four_colour_1.png"><img src="assets/p2_four_colour_1.png" alt="" width="400" height="400" /></a></p>
-<p><a href="assets/p2_four_colour_2.png"><img src="assets/p2_four_colour_2.png" alt="" width="400" height="400" /></a>
-<a href="assets/p3_four_colour_2.png"><img src="assets/p3_four_colour_2.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p3_four_colour_1.png"><img src="blog/assets/p3_four_colour_1.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p2_four_colour_1.png"><img src="blog/assets/p2_four_colour_1.png" alt="" width="400" height="400" /></a></p>
+<p><a href="blog/assets/p2_four_colour_2.png"><img src="blog/assets/p2_four_colour_2.png" alt="" width="400" height="400" /></a>
+<a href="blog/assets/p3_four_colour_2.png"><img src="blog/assets/p3_four_colour_2.png" alt="" width="400" height="400" /></a></p>
<p>I know there are better and more elegant ways of shading Penrose tilings but I feel happy that I've done what I set out to do, the hard part is waiting for divine inspiration to kick in before I try and paint one for real.</p>
<p>You can find the code used to generate the images above on github <a href="https://github.com/mpizzzle/penrose">here</a>. If you want to compile the program yourself you'll have install the dependencies manually for now; I may take the time to package it with a more modern build tool in the future.</p>