Skip to content

Commit

Permalink
deploy: 7f3b993
Browse files Browse the repository at this point in the history
  • Loading branch information
noelwelsh committed Nov 30, 2023
1 parent 7006f7f commit dce3dc8
Show file tree
Hide file tree
Showing 16 changed files with 84 additions and 105 deletions.
24 changes: 12 additions & 12 deletions algebra/picture.html
Original file line number Diff line number Diff line change
Expand Up @@ -74,21 +74,21 @@ <h2 id="drawing-pictures" class="section">Drawing Pictures</h2>

<h2 id="writing-and-converting-pictures" class="section">Writing and Converting Pictures</h2>
<p>In addition to drawing a picture to the screen we can write it to a file or convert it to some other type. The <code>write</code> method saves a picture to a file. When we call write we must pass two parameters: a normal parameter that is the file name to use and a type parameter that gives the format of the file. In the example below we save a file as a <a href="https://en.wikipedia.org/wiki/Portable_Network_Graphics">PNG</a>.</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">format</span><span>.</span><span class="identifier">_</span><span>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">format</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">cats</span><span>.</span><span class="identifier">effect</span><span>.</span><span class="identifier">unsafe</span><span>.</span><span class="identifier">implicits</span><span>.</span><span class="identifier">global</span><span>

</span><span class="keyword">val</span><span> </span><span class="identifier">picture</span><span> = </span><span class="identifier">circle</span><span>(</span><span class="number-literal">100</span><span>)

</span><span class="identifier">picture</span><span>.</span><span class="identifier">write</span><span>[</span><span class="type-name">Png</span><span>](</span><span class="string-literal">&quot;circle.png&quot;</span><span>)</span></code></pre>
<p>The <code>write</code> method is <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/syntax/WriterSyntax.html">WriterSyntax</a> that comes from the <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/effect/Writer.html">Writer</a>. There are other methods that allow, for example, specifying a <code>Frame</code> to use when saving the file.</p>
<p>We can convert a <code>Picture</code> to a <a href="https://en.wikipedia.org/wiki/Base64">Base64</a> value using the <code>base64</code> method. As with <code>write</code>, this method is <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/syntax/Base64Syntax.html">Base64Syntax</a> for the <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/effect/Base64.html">Base64</a>. The parameters are similar to <code>write</code>: we must specify a format to encode the picture in but we don&#39;t specify a filename. Instead we get back the result of evaluating the <code>Picture</code> (the <code>A</code> in <code>F[A]</code> which is usually <code>()</code>) and a <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/core/Base64.html">Base64</a> value.</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">format</span><span>.</span><span class="identifier">_</span><span>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">format</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">cats</span><span>.</span><span class="identifier">effect</span><span>.</span><span class="identifier">unsafe</span><span>.</span><span class="identifier">implicits</span><span>.</span><span class="identifier">global</span><span>

</span><span class="keyword">val</span><span> </span><span class="identifier">picture</span><span> = </span><span class="identifier">circle</span><span>(</span><span class="number-literal">100</span><span>)
Expand All @@ -99,10 +99,10 @@ <h2 id="converting-other-types-to-a-picture" class="section">Converting Other Ty
<p>The <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/algebra/ToPicture.html">ToPicture</a> algebra provides a single method that converts some type (fixed for each instance of <code>ToPicture</code>) to a <code>F[Unit]</code>. The <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/syntax/ToPictureSyntax.html">ToPictureSyntax</a> wraps the result in a <code>Picture</code>, as is standard for syntax, and therefore gives a way to convert the input type to a <code>Picture</code>.</p>
<p>The available instances vary depending on the backend. For the Java2D backend, <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/core/Base64.html">Base64</a> and <code>BufferedImage</code> values can be converted to <code>Picture</code>. For SVG only <code>Base64</code> is currently supported.</p>
<p>Here is quick example of use. First we create a <code>Base64</code> value from a <code>Picture</code>.</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">format</span><span>.</span><span class="identifier">_</span><span>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">format</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">cats</span><span>.</span><span class="identifier">effect</span><span>.</span><span class="identifier">unsafe</span><span>.</span><span class="identifier">implicits</span><span>.</span><span class="identifier">global</span></code></pre>
<pre><code class="nohighlight"><span class="comment">// The value we throw away is the result of evaluating the
// `Picture`, which is `Unit`.
Expand Down
20 changes: 10 additions & 10 deletions algebra/using.html
Original file line number Diff line number Diff line change
Expand Up @@ -69,9 +69,9 @@ <h2 id="using-a-single-backend" class="section">Using a Single Backend</h2>
<li>Compose <code>Pictures</code> using the methods provided by the syntax imports.</li>
</ol>
<p>For example, the following imports are used for the Java2D backend:</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.</span><span class="identifier">_</span></code></pre>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.*</span></code></pre>
<p>Given these imports we can create pictures. To construct atomic elements we call the constructors on <code>Picture</code>.</p>
<pre><code class="nohighlight"><span class="keyword">val</span><span> </span><span class="identifier">smallCircle</span><span> = </span><span class="type-name">Picture</span><span>.</span><span class="identifier">circle</span><span>(</span><span class="number-literal">100</span><span>)
</span><span class="keyword">val</span><span> </span><span class="identifier">largeSquare</span><span> = </span><span class="type-name">Picture</span><span>.</span><span class="identifier">square</span><span>(</span><span class="number-literal">200</span><span>)</span></code></pre>
Expand All @@ -92,9 +92,9 @@ <h2 id="using-a-single-backend" class="section">Using a Single Backend</h2>
<h2 id="using-backend-specific-features" class="section">Using Backend Specific Features</h2>
<p>Using backend specific features follows the same pattern as using a single backend. Here&#39;s an example using the <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/algebra/Bitmap.html">Bitmap</a> algebra, which is currently only supported by the <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/java2d.html">java2d</a> backend. (The bitmap used is the <a href="https://www.deviantart.com/kaiseto/journal/Most-of-my-Pixel-Art-is-now-Creative-Commons-369510391">Old God</a> created by Kevin Chaloux and released under Creative Commons.)</p>
<p>The first step is, as before, to import the Doodle core, Java2D backend, syntax extensions, and the Cats Effect runtime.</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.</span><span class="identifier">_</span><span>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">java2d</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">cats</span><span>.</span><span class="identifier">effect</span><span>.</span><span class="identifier">unsafe</span><span>.</span><span class="identifier">implicits</span><span>.</span><span class="identifier">global</span></code></pre>
<p>Now we can go about creating our picture, using the <code>read</code> method to load a bitmap image.</p>
<pre><code class="nohighlight"><span class="keyword">val</span><span> </span><span class="identifier">redCircle</span><span> = </span><span class="type-name">Picture</span><span>.</span><span class="identifier">circle</span><span>(</span><span class="number-literal">100</span><span>).</span><span class="identifier">strokeColor</span><span>(</span><span class="type-name">Color</span><span>.</span><span class="identifier">red</span><span>)
Expand All @@ -107,8 +107,8 @@ <h2 id="using-backend-specific-features" class="section">Using Backend Specific

<h2 id="creating-cross-backend-pictures" class="section">Creating Cross-Backend Pictures</h2>
<p>Targeting multiple backends requires a little bit more work than working with a single backend. We can&#39;t use the usual constructor methods on a <code>Picture</code> object, as those methods target a specific backend and we want to work across multiple backends. However, every constructor method has a syntax equivalent that we can call. So to create a circle we can write</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.</span><span class="identifier">_</span><span>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">syntax</span><span>.</span><span class="identifier">all</span><span>.*

</span><span class="identifier">circle</span><span>(</span><span class="number-literal">100</span><span>)</span></code></pre>
<p>Once we know how to do this, everything proceeds as before. Here&#39;s a complete example.</p>
Expand All @@ -122,8 +122,8 @@ <h2 id="creating-cross-backend-pictures" class="section">Creating Cross-Backend
<h2 id="using-raw-algebras" class="section">Using Raw Algebras</h2>
<p>We never need to call methods on algebras directly. Doodle provides the <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/algebra/Picture.html">Picture</a> abstraction and lots of <a class="api" href="https://javadoc.io/doc/org.creativescala/doodle-docs_3/latest/doodle/syntax.html">syntax</a> to avoid this. However, if some reason you did want to use algebras directly here is how to do it. Understanding this does help a bit in understanding the utilities that Doodle provides to avoid using algebras directly.</p>
<p>To use algebras directly, write a method with a parameter that is the algebras that you need. For example, if we were to write a simple program using <code>Layout</code>, <code>Style</code>, and <code>Shape</code> we might write the following.</p>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.</span><span class="identifier">_</span><span>
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">algebra</span><span>.</span><span class="identifier">_</span><span>
<pre><code class="nohighlight"><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">core</span><span>.*
</span><span class="keyword">import</span><span> </span><span class="identifier">doodle</span><span>.</span><span class="identifier">algebra</span><span>.*

</span><span class="comment">// Two red circles beside each other
</span><span class="keyword">def</span><span> </span><span class="declaration-name">twoRedCircles</span><span>[</span><span class="type-name">Alg</span><span> &lt;: </span><span class="type-name">Layout</span><span> &amp; </span><span class="type-name">Style</span><span> &amp; </span><span class="type-name">Shape</span><span>](</span><span class="identifier">algebra</span><span>: </span><span class="type-name">Alg</span><span>): </span><span class="identifier">algebra</span><span>.</span><span class="type-name">Drawing</span><span>[</span><span class="type-name">Unit</span><span>] = {
Expand Down
Loading

0 comments on commit dce3dc8

Please sign in to comment.