update draft

_drafts/the-algebra-in-algebraic-datatypes.md

@@ -118,11 +118,22 @@ Now of course this all seems very abstract, and it is. The strenght of category
 
 # Thinking with functions
 
-Now that we've unconvered some interesting algebraic properties of types in Haskell we'll begin viewing these from a category theoretic perspective, which will let us make these notions formal. In doing so we'll need to switch our perspective from types to functions, as category is all about arrows rather than objects.
+Now that we've unconvered some interesting algebraic properties of types in Haskell we'll begin viewing these from a category theoretic perspective, which will let us make these notions formal. In doing so we'll need to switch our perspective from the individual types to functions between them, as category is all about arrows rather than objects.
 
+In category theory we define many things using commuting diagrams, and products are no exception. In categary theory, the product of objects $$A$$ and $$B$$ is an object $$A \times B$$, with two arrows $$fst : A \times B \to A$$ and $$snd : A \times B \to B$$, and the requirment that for any C, and f, g, there is an arrow k, such that the following arrow commutes.
+
+{% details What is a commuting diagram %}
+A commuting diagram is one in which all ways of walking from one point to another, composing functions along the way, are equal. In the diagram below this means that $$f = fst \circ k$$, and that $$g = snd \circ k$$.
+{% enddetails %}
+
+{% cd Product diagram s:40 %}
+& \ar[ddl, "f"'] C \ar[dd, dotted, "k"] \ar[ddr, "g"] & \\
+& & \\
+A & \ar[l, "fst"] A \times B \ar[r, "snd"'] & B
+{% endcd %}
 
-* Explain commuting diagrams somewhere here?
 * Products + Coproducts
+* Explain commuting diagrams somewhere here?
 
 * Initial objects
 * Generalized elements

_plugins/cd.rb

@@ -0,0 +1,58 @@
+# Made by me :)
+# Feel free to use if you give credit
+
+require "base64"
+
+module Jekyll
+  module Tags
+    class CDTag < Liquid::Block
+
+      def initialize(tag_name, markup, tokens)
+        super
+        arr = markup.split("s:")
+        if arr[1] != nil
+          @scale = arr[1].to_i
+        else
+          @scale = 60
+        end
+        @caption = arr[0].strip
+      end
+
+      def render(context)
+        site = context.registers[:site]
+
+        converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
+        caption = converter.convert(@caption).gsub(/<\/?p[^>]*>/, '').chomp
+
+        code = super(context)
+
+        latex = <<EOF
+\\documentclass[tikz]{standalone}
+\\usepackage{tikz-cd}
+\\begin{document}
+\\begin{tikzcd}#{code}\\end{tikzcd}
+\\end{document}
+EOF
+
+        Dir.mktmpdir do |dir|
+          File.write("#{dir}/cd.tex", latex)
+          raise "pdflatex" unless system("pdflatex -output-directory #{dir} #{dir}/cd.tex")
+          raise "inkscape" unless system("inkscape -l --export-filename=#{dir}/cd.svg #{dir}/cd.pdf")
+          raise "scour" unless system("scour -i #{dir}/cd.svg -o #{dir}/optimized_cd.svg --enable-viewboxing --enable-id-stripping --enable-comment-stripping --shorten-ids --indent=none")
+          svg = File.read("#{dir}/optimized_cd.svg")
+          return <<EOF
+<figure class="cdfig">
+  <img class="cd" style="width: #{@scale}%;" src="data:image/svg+xml;base64,#{Base64.encode64(svg)}" alt="A commutative diagram"/>
+  <figcaption>#{@caption}</figcaption>
+</figure>
+EOF
+        end
+
+        "<details><summary>#{caption}</summary>#{body}</details>"
+      end
+
+    end
+  end
+end
+
+Liquid::Template.register_tag('cd', Jekyll::Tags::CDTag)

_plugins/details_tag.rb

@@ -0,0 +1,23 @@
+# from http://movb.de/jekyll-details-support.html
+module Jekyll
+  module Tags
+    class DetailsTag < Liquid::Block
+
+      def initialize(tag_name, markup, tokens)
+        super
+        @caption = markup
+      end
+
+      def render(context)
+        site = context.registers[:site]
+        converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
+        caption = converter.convert(@caption).gsub(/<\/?p[^>]*>/, '').chomp
+        body = converter.convert(super(context))
+        "<details><summary>#{caption}</summary>#{body}</details>"
+      end
+
+    end
+  end
+end
+
+Liquid::Template.register_tag('details', Jekyll::Tags::DetailsTag)

assets/css/main.scss

@@ -187,6 +187,19 @@ table {
   border-collapse: collapse;
 }
 
+.cd {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  margin-bottom: 1em;
+  filter: invert(1);
+}
+
+.cdfig {
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
 // https://github.com/daveyarwood/gruvbox-pygments/tree/master
 .highlight .hll { background-color: #ffffcc }
 .highlight  { background: #282828; color: #ebdbb2; background-color: #282828 }

deps.nix

@@ -124,4 +124,4 @@ with pkgs; let
       rouge
     ]);
 in
-[ nodejs ] ++ rubyEnv.gems
+[ nodejs inkscape scour ] ++ rubyEnv.gems