HyML - XML & (X)HTML generator for Hy.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# HyML - XML / (X)HTML generator for Hy\n",
    "\n",
    "## Motivation\n",
    "\n",
    "## Previous similar work\n",
    "\n",
    "## Installation"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "My environment for the sake of clarity:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Hy version:  0.13.0\n",
      "Python 3.5.2 |Anaconda custom (64-bit)| (default, Jul  5 2016, 11:41:13) [MSC v.1900 64 bit (AMD64)]\n"
     ]
    }
   ],
   "source": [
    "(import hy sys)\n",
    "(print \"Hy version: \" hy.__version__)\n",
    "(print \"Python\" sys.version)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Import main macros"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "(require [hyml.macros [*]]\n",
    "         [hyml.helpers [*]])\n",
    "(import (hyml.macros (*)))\n",
    "(import (hyml.helpers (indent)))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Then we are ready for the show!"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Almost all-in-one example\n",
    "\n",
    "First I'd like to show an example that uses most features included in the HyML module. Then I will go thru all  presented features case by case."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n",
      "<!DOCTYPE html>\n",
      "<html lang=\"en\" xmlns=\"http://www.w3.org/1999/xhtml\">\n",
      "\t<head>\n",
      "\t\t<title>Page title</title>\n",
      "\t</head>\n",
      "\t<body>\n",
      "\t\t<!-- body starts here -->\n",
      "\t\t<div class=\"main_container\">\n",
      "\t\t\t<h1 class=\"main header\">Page header</h1>\n",
      "\t\t\t<ul id=\"main\">\n",
      "\t\t\t\tList\n",
      "\t\t\t\t<li class=\"even\">0</li>\n",
      "\t\t\t\t<li class=\"odd\">1</li>\n",
      "\t\t\t\t<li class=\"even\">2</li>\n",
      "\t\t\t</ul>\n",
      "\t\t</div>\n",
      "\t</body>\n",
      "</html>\n"
     ]
    }
   ],
   "source": [
    "; by default there is no indentation, thus for pretty print we use indent\n",
    "(print (indent \n",
    "  ; specify parser macro (ML macros) that must be one of the following:\n",
    "  ; xml, xhtml, xhtml5, html4, or html5 \n",
    "  (xhtml5\n",
    "  ; plain text content\n",
    "  ; xml declaration below could also be done with a custom tag: (?xml :version \"1.0\" :encoding \"UTF-8\")\n",
    "  \"<?xml version=\\\"1.0\\\" encoding=\\\"UTF-8\\\"?>\"\n",
    "  ; more plain text content\n",
    "  ; doctype could also be done with a custom tag: (!DOCTYPE \"html\")\n",
    "  \"<!DOCTYPE html>\"\n",
    "  ; define tag name as the first parameter\n",
    "  ; define attributes by keywords\n",
    "  (html :lang \"en\" :xmlns \"http://www.w3.org/1999/xhtml\"\n",
    "    ; define nested tags and content by similar manner\n",
    "    (head\n",
    "      ; everything else except the first parameter and keywords are\n",
    "      ; regarded as inner html content\n",
    "      (title \"Page title\"))\n",
    "    (body\n",
    "      ; plain text content\n",
    "      ; comments could also be done with a custom tag: (!-- \"comments\")\n",
    "      \"<!-- body starts here -->\"\n",
    "      ; short notation for div element and class attribute <div class=\"\"/>\n",
    "      ; note that - character in main-container will become to main_container due to Hy\n",
    "      ; internal language construction\n",
    "      (.main-container\n",
    "         ; short notation for class attribute for specified element: <h1 class=\"\"/>\n",
    "         ; with multiple dot notation classes are concatenated with space\n",
    "         (h1.main.header\n",
    "           ; unquote macro with ~ to evaluate normal Hy code\n",
    "           ; after unquoted expression rest of the code is continued to be parsed by ML macros again\n",
    "           ~(.capitalize \"page header\"))\n",
    "         ; short notation for id attribute for specified element: <ul id=\"\"/>\n",
    "         ; you should not use joined #main#sub similar to class notation, althought it is not prohibited,\n",
    "         ; because id=\"main sub\" is not a good id according to html attribute specifications\n",
    "         (ul#main \"List\"\n",
    "           ; unquote splice ~@ processes lists and concatenates results\n",
    "           ; list-comp* is a slightly modified vesion of list-comp\n",
    "           ; in list-comp* the list argument is the first and the expression is\n",
    "           ; the second argument. in native list-comp those arguments are in reverse order\n",
    "           ~@(list-comp* [[idx num] (enumerate (range 3))]\n",
    "                         ; quote (`) a line and unquote variables and expressions to calculate\n",
    "                         ; and set correct class for even and odd list items\n",
    "                         `(li :class ~(if (even? idx) \"even\" \"odd\") ~num)))))))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## XML, HTML4, HTML5, XHTML, and XHTML5\n",
    "\n",
    "At the moment HyML module contains `xml`, `html4`, `html5`, `xhtml`, and `xhtml5` macros (called as `ML` macros in short) to generate the (M)arkup (L)anguage code. `xml` is a generic generator which allows using any tag names and attributes. `html4` and `xhtml` macros allows to use only html4 specified tag names. Same applies to `html5` and `xhtml5`. Complete chart of the allowed elements are listed at the end of the document.\n",
    "\n",
    "Tags can be created with or without attributes, as well as with or without content. For example:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "<node/>\n",
      "<node attribute=\"\"/>\n",
      "<node attribute=\"value\"/>\n",
      "<node attribute=\"value\"></node>\n",
      "<node attribute=\"value\">Content</node>\n"
     ]
    }
   ],
   "source": [
    "(println\n",
    "  (xml (node))\n",
    "  (xml (node :attribute \"\")) ; force to use empty attribute\n",
    "  (xml (node :attribute \"value\"))\n",
    "  (xml (node :attribute \"value\" \"\")) ; force to use empty content\n",
    "  (xml (node :attribute \"value\" \"Content\")))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "However in `html4` and `html5` there are certain tags that cannot have endings so they will be rendered in correct form by the parser. \"Forbidden\" labeled tags are listed at the end of the document. One of them is for example the meta tag:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<meta name=keywords content=HTML,CSS,XML,JavaScript>'"
      ]
     },
     "execution_count": 5,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(html4 (meta :name \"keywords\" :content \"HTML,CSS,XML,JavaScript\"))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "To see and compare the difference in xhtml, let macro print the same:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<meta name=\"keywords\" content=\"HTML,CSS,XML,JavaScript\"/>'"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xhtml (meta :name \"keywords\" :content \"HTML,CSS,XML,JavaScript\"))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Shorthand macro\n",
    "\n",
    "`#㎖` (Square Ml) can be used as a shorthand [reader macro](http://docs.hylang.org/en/latest/language/readermacros.html) for generating xml/html/xhtml code:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<html><head><title>Page title</title></head><body><div class=\"container\">Page content</div></body></html>'"
      ]
     },
     "execution_count": 7,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "#㎖(html\n",
    "    (head (title \"Page title\"))\n",
    "    (body (div \"Page content\" :class \"container\")))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "`#㎖` actually utilizes `xml` macro so same result can be achieved with the next, maybe more convenient and recommended notation:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<html><head><title>Page title</title></head><body><div class=\"container\">Page content</div></body></html>'"
      ]
     },
     "execution_count": 8,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xml\n",
    "  (html\n",
    "    (head (title \"Page title\"))\n",
    "    (body (div \"Page content\" :class \"container\"))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "It is not possible to define other `ML` macro to be used with the `#㎖` shorthand reader macro. You could however define your own shorthands following next quidelines:\n",
    "\n",
    "<code>(defsharp {unicode-char} [code] (parse-{parser} code))</code>\n",
    "\n",
    "`{unicode-char}` can be any [unicode char](https://unicode-table.com/en/) you want. `{parser}` must be one of the following available parsers: xml, xhtml, xhtml5, html4, or html5.\n",
    "\n",
    "With `#㎖` shorthand you have to provide a single root node for generating code. Directry using `ML` macros makes it possible to generate multiple instances of code, and might be more informative notation style anyway:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<p>Sentence 1</p><p>Sentence 2</p><p>Sentence 3</p>'"
      ]
     },
     "execution_count": 9,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xml (p \"Sentence 1\") (p \"Sentence 2\") (p \"Sentence 3\"))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Let us then render the code, not just printing it. This can be done via `html5>` macro imported earlier from helpers:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 10,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "Content is <b>king</b>!"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "execution_count": 10,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(html4> \"Content is \" (b king) !)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Renderers are available for all `ML` macros: `xml>`, `xhtml>`, `xhtml5>`, `html4>`, and `html5>`.\n",
    "\n",
    "## Validation and minimizing\n",
    "\n",
    "If validation of the html tag names is a concern, then one should use `html4`, `html5`, `xhtml`, and `xhtml5` macro family. In the example below if we try to use `time` element in `html4`, which is specifically available in `html5` only, we will get an `HyTMLError` exception:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 11,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    ";(try\n",
    "; (html4 (time))\n",
    "; (catch [e [HyTMLError]]))\n",
    ";hytml.macros.HyTMLError: Tag 'time' not meeting html4 specs"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Other features in `html4` and `html5` macros are attribute and tag minimizing. Under the [certain rules](https://html.spec.whatwg.org/multipage/syntax.html#optional-tags) start and end tags can be removed from the output. Also boolean attributes can be shortened. In `html4` and `html5` macros minimizing is a default feature that can't be bypassed. If you do not want to minimize code, you must use `xhtml` or `xhtml5` macro. Contrary in `xhtml` and `xhtml5` macros attribute and tag minimizing is NOT available. Instead all tags are strictly closed and attributes in `key=\"value\"` format."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 12,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<title/><table><tr><td>Cell 1<td>Cell 2<td>Cell 3</table>'"
      ]
     },
     "execution_count": 12,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "; valid html4 document\n",
    "(html4 (title) (table (tr (td \"Cell 1\") (td \"Cell 2\") (td \"Cell 3\"))))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 13,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<title/><table><tr><td>Cell 1</td><td>Cell 2</td><td>Cell 3</td></tr></table>'"
      ]
     },
     "execution_count": 13,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "; in xhtml tags and attributes will be output in complete format\n",
    "(xhtml (title) (table (tr (td \"Cell 1\") (td \"Cell 2\") (td \"Cell 3\"))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "<blockquote>Note that above xhtml code is still not a valid xhtml document even tags and attributes are perfectly output. `ML` macros do no validate structure of the document just tag names. For validation one should use official [validator](https://validator.w3.org/) service and follow the html [specifications](https://w3c.github.io/html/) to create a valid document. `ML` macros can be used to guide on that process but more importantly it is meant to automatize the generation of the xml code while adding programming capabilities on it.</blockquote>\n",
    "\n",
    "<blockquote>`xml` on the other hand doesn't give a dime of the used tag names. They can be anything, even processed names. Same applies to keywords, values, and contents. You should use more strict `xhtml`, `xhtml5`, `html4`, and `html5` macros to make sure that tag names are corresponding to HTML4 or HTML5 specifications.</blockquote>"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 14,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<input disabled>'"
      ]
     },
     "execution_count": 14,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "; see how boolean attribute minimizing works\n",
    "(html4 (input :disabled \"disabled\"))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Unquoting code\n",
    "\n",
    "In all `ML` macros you can pass any code in it. See for example:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 15,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<p>Sum: <b><apply>sum<[1, 2, 3, 4]/></apply></b></p>'"
      ]
     },
     "execution_count": 15,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xml (p \"Sum: \" (b (apply sum [[1 2 3 4]]))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "But you see, the result was not possibly what you expected. `ML` macros will interpret the first item of the _expression_ as a name of the tag. Thus _apply_ becomes a tag name. Until the next _expression_ everything else is interpreted either as a content or a keyword.\n",
    "\n",
    "However using `~` (unquote) symbol, `ML` macro behaviour can be stopped for a moment:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 16,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<p>Sum: <b>10</b>!</p>'"
      ]
     },
     "execution_count": 16,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xml (p \"Sum: \" (b ~(apply sum [[1 2 3 4]])) !))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "So the following expression after `~` will be evaluated and then result is returned back to the original parser. And the rest of the code will be interpreted via macro. In this case it was just an exclamation mark.\n",
    "\n",
    "<blockquote>Note that it is not mandatory to wrap strings with `\"\"` if given input doesn't contain any spaces. You could also single quote simple non-spaced letter sequences. So `!` is same as `\"!\"` in this case.</blockquote>\n",
    "\n",
    "Quoting and executing normal Hy code inside html gives almost unlimited possibility to use HyML as a templating engine. Of cource there is also a risk to evaluate code that breaks the code execution. Plus uncontrolled template engine code may be a security consern.\n",
    "\n",
    "## Unquote splice\n",
    "\n",
    "In addition to unquote, one can handle lists and iterators with `~@` (unquote-splice) symbol. This is particularly useful when a list of html elements needs to be passed to the parent element. Take for example this table head generation snippet:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 17,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<table><thead><tr><th class=\"even\">col 0</th><th class=\"odd\">col 1</th><th class=\"even\">col 2</th></tr></thead></table>'"
      ]
     },
     "execution_count": 17,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xhtml \n",
    " (table (thead\n",
    "   (tr ~@(list-comp\n",
    "         `(th :class (if (even? ~i) \"even\" \"odd\") ~label \" \" ~i)\n",
    "         [[i label] (enumerate (* [\"col\"] 3))])))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "[List comprehensions](https://docs.python.org/3/tutorial/datastructures.html#list-comprehensions) notation might seem a little bit strange for some people. It takes a processing part (expression) as the first argument, and the actual list to be processed as the second argument. On a nested code this will move lists to be processed in first hand to the end of the notation. For example:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 18,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<ul><b>List</b><li>item 1</li><li>item 2</li></ul><ul><b>List</b><li>item 1</li><li>item 2</li></ul>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "execution_count": 18,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xml> \n",
    "  ~@(list-comp `(ul (b \"List\")\n",
    "      ~@(list-comp `(li item \" \" ~li)\n",
    "          [li uls]))\n",
    "    [uls [[1 2] [1 2]]]))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "But there is another slighly modified macro to use in similar manner:\n",
    "\n",
    "## `list-comp*`\n",
    "\n",
    "Let's do again above example but this time with a dedicated `list-comp*` macro. Now the lists to be processed is passed as the first argument to the `list-comp*` macro and the expression for processing list items is the second argument. Yet the second argument itself contains a new list processing loop until final list item is to be processed. This is perhaps easier to follow for some people:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 19,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<ul><b>List</b><li>item 1</li><li>item 2</li></ul><ul><b>List</b><li>item 1</li><li>item 2</li></ul>'"
      ]
     },
     "execution_count": 19,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xhtml\n",
    "  ~@(list-comp* [uls [[1 2] [1 2]]]\n",
    "    `(ul (b \"List\")\n",
    "      ~@(list-comp* [li uls]\n",
    "        `(li item \" \" ~li)))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Of cource it is just a matter of the taste which one you like. `list-comp*` with `unquote-splice` symbol (`~@`) reminds us that it is possible to create any similar custom macros for the HyML processor. `~@` can be thought as a macro caller, not just unquoting and executing Hy code in a normal lisp mode.\n",
    "\n",
    "Here is a more complex table generation example from the [remarkuple](http://nbviewer.jupyter.org/github/markomanninen/remarkuple3/blob/master/Remarkuple%203%20documentation.ipynb) Python module docs. One should notice how variables (`col`, `row`, and `cell`) are referenced by quoting them:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 20,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<table id=data><caption>Data table<colgroup><col style=background-color:red><col style=\"background-color: green\"><col style=\"background-color: blue\"><thead><tr><th>Column 1</th><th>Column 2</th><th>Column 3</th></thead><tbody id=tbody1><tr><td>1.0<td>1.1<td>1.2</tr><tr><td>2.0<td>2.1<td>2.2</tr></tbody><tbody id=tbody2><tr><td>1.0<td>1.1<td>1.2</tr><tr><td>2.0<td>2.1<td>2.2</tr><tfoot><tr><td colspan=3>Footer</tfoot></table>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "execution_count": 20,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(html4>\n",
    "  (table#data\n",
    "    (caption \"Data table\")\n",
    "    (colgroup\n",
    "      (col :style \"background-color:red\")\n",
    "      (col :style \"background-color: green\")\n",
    "      (col :style \"background-color: blue\"))\n",
    "    (thead\n",
    "      (tr\n",
    "        ~@(list-comp* [col [\"Column 1\" \"Column 2\" \"Column 3\"]]\n",
    "          `(th ~col))))\n",
    "    (tbody#tbody1\n",
    "     ~@(list-comp* [row (range 1 3)]\n",
    "       `(tr\n",
    "         ~@(list-comp* [cell (range 3)]\n",
    "           `(td  ~row \".\" ~cell)))))\n",
    "    (tbody#tbody2\n",
    "     ~@(list-comp* [row (range 1 3)]\n",
    "       `(tr\n",
    "         ~@(list-comp* [cell (range 3)]\n",
    "           `(td  ~row \".\" ~cell)))))\n",
    "    (tfoot \n",
    "      (tr\n",
    "        (td :colspan \"3\" \"Footer\")))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Address book table from CSV file\n",
    "\n",
    "We should of course be able to use external source for the html. Let's try with a short csv file:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 21,
   "metadata": {
    "collapsed": false,
    "scrolled": true
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<table class=\"data\"><caption>Contacts</caption><thead><th>Title</th><th>Name</th><th>Phone</th></thead><tbody><td>Mr.</td><td>John</td><td>07868785831</td></tbody><tbody><td>Miss</td><td>Linda</td><td>0141-2244-5566</td></tbody><tbody><td>Master</td><td>Jack</td><td>0142-1212-1234</td></tbody><tbody><td>Mr.</td><td>Bush</td><td>911-911-911</td></tbody></table>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "execution_count": 21,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xhtml> \n",
    " (table.data\n",
    "   (caption \"Contacts\")\n",
    "   ~@(list-comp*\n",
    "     [[idx row] (enumerate (.split (.read (open \"data.csv\" \"r\")) \"\\n\"))]\n",
    "     (if (pos? idx) \n",
    "         `(tbody\n",
    "            ~@(list-comp* [item (.split row \",\")]\n",
    "              `(td ~item)))\n",
    "         `(thead\n",
    "            ~@(list-comp* [item (.split row \",\")]\n",
    "              `(th ~item)))))))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Templates\n",
    "\n",
    "It is possible to load code from an external file too. This feature has not been deeply implemented yet, but you get the feeling by the next example. Firt I'm just going to show external template file content:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 22,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "(html :lang ~lang\n",
      "  (head (title ~title))\n",
      "  (body\n",
      "  \t(p ~body)))\n"
     ]
    }
   ],
   "source": [
    "(with [f (open \"templates/template.hy\")] (print (f.read)))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Then I use `include` macro to read and process the content:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 23,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'<html lang=\"en\"><head><title>Page title</title></head><body><p>Content</p></body></html>'"
      ]
     },
     "execution_count": 23,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(defvar lang \"en\"\n",
    "        title \"Page title\"\n",
    "        body \"Content\")\n",
    "\n",
    "(xhtml ~@(include \"templates/template.hy\"))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "All globally defined variables are available on `ML` macros likewise:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 24,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'en, Page title, Content'"
      ]
     },
     "execution_count": 24,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xhtml ~lang \", \" ~title \", \" ~body)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## HTML4 / 5 specifications\n",
    "\n",
    "`xml` does not care about the markup specifications other than general tag and attribute notation. It is totally dummy about the naming conventions of the tags or their relation to each other or global structure of the markup document. It is all on the responsibility of the user to make it correct.\n",
    "\n",
    "`html4` and `html5` macros will render tags as specified below. These macros will minimize code when possible. Using undefined tag will raise an error. Attributes are not validated however. One should use official [validator](http://validator.w3.org/) for a proper validation.\n",
    "\n",
    "Below is the last example of using `ML` macros. It will print the first 5 rows of the HTML4/5 specifications.\n",
    "\n",
    "Columns are:\n",
    "\n",
    "- Tag name\n",
    "- Tag title\n",
    "- Forbidden (if there should be no content or end tag)\n",
    "- Omit (forbidden plus omit short tag like `<col>`)\n",
    "- HTML4 (is html4 compatible?)\n",
    "- HTML5 (is html5 compatible?)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 25,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<table class=\"data\"><caption>HTML Element Specifications</caption><thead><tr><th>Tag name</th><th>Tag title</th><th>Forbidden</th><th>Omit</th><th>HTML4</th><th>HTML5</th></tr></thead><tbody><tr><td>A</td><td>a</td><td>False</td><td>False</td><td class=\"html4\">True</td><td class=\"html5\"/></tr><tr><td>ABBR</td><td>abbr</td><td>False</td><td>False</td><td class=\"html4\">True</td><td class=\"html5\"/></tr><tr><td>ACRONYM</td><td>acronym</td><td>False</td><td>False</td><td class=\"html4\">True</td><td class=\"\"/></tr><tr><td>ADDRESS</td><td>address</td><td>False</td><td>False</td><td class=\"html4\">True</td><td class=\"html5\"/></tr><tr><td>APPLET</td><td>applet</td><td>False</td><td>False</td><td class=\"html4\">True</td><td class=\"\"/></tr></tbody></table>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "execution_count": 25,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "(xhtml>\n",
    "  (table.data\n",
    "    (caption \"HTML Element Specifications\")\n",
    "    (thead\n",
    "      (tr\n",
    "        ~@(list-comp* [col [\"Tag name\" \"Tag title\" \"Forbidden\" \"Omit\" \"HTML4\" \"HTML5\"]]\n",
    "          `(th ~col))))\n",
    "    (tbody \n",
    "     ~@(list-comp* [[id row] (take 5 (.items (do (import (hyml.macros (specs))) specs)))]\n",
    "       (do\n",
    "        `(tr\n",
    "          (td ~(.upper (get row :name)))\n",
    "          (td ~(get row :name))\n",
    "          (td ~(get row :forbidden))\n",
    "          (td ~(get row :omit))\n",
    "          (td ~(get row :html4) :class (if ~(get row :html4) \"html4\" \"\"))\n",
    "          (td :class (if ~(get row :html5) \"html5\" \"\"))))))))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 26,
   "metadata": {
    "collapsed": true
   },
   "outputs": [],
   "source": [
    "; lets import pandas dataframe for easy table view\n",
    "(import [pandas])\n",
    "; set max rows to 200 to prevent pruning displayed rows\n",
    "(pandas.set_option \"display.max_rows\" 200)\n",
    "; disable jupyter notebook autoscroll on the next cell"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 27,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "application/javascript": [
       "IPython.OutputArea.prototype._should_scroll = function(lines) {return false}"
      ],
      "text/plain": [
       "<IPython.core.display.Javascript object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "%javascript IPython.OutputArea.prototype._should_scroll = function(lines) {return false}"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 28,
   "metadata": {
    "collapsed": false,
    "scrolled": true
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div>\n",
       "<table border=\"1\" class=\"dataframe\">\n",
       "  <thead>\n",
       "    <tr style=\"text-align: right;\">\n",
       "      <th></th>\n",
       "      <th>﷐:forbidden</th>\n",
       "      <th>﷐:html4</th>\n",
       "      <th>﷐:html5</th>\n",
       "      <th>﷐:name</th>\n",
       "      <th>﷐:omit</th>\n",
       "      <th>﷐:title</th>\n",
       "    </tr>\n",
       "  </thead>\n",
       "  <tbody>\n",
       "    <tr>\n",
       "      <th>﷐:a</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>a</td>\n",
       "      <td>False</td>\n",
       "      <td>Anchor</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:abbr</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>abbr</td>\n",
       "      <td>False</td>\n",
       "      <td>Abbreviation</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:acronym</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>acronym</td>\n",
       "      <td>False</td>\n",
       "      <td>Acronym</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:address</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>address</td>\n",
       "      <td>False</td>\n",
       "      <td>Address</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:applet</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>applet</td>\n",
       "      <td>False</td>\n",
       "      <td>Java applet</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:area</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>area</td>\n",
       "      <td>True</td>\n",
       "      <td>Image map region</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:article</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>article</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines an article</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:aside</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>aside</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines content aside from the page content</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:audio</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>audio</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines sound content</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:b</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>b</td>\n",
       "      <td>False</td>\n",
       "      <td>Bold text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:base</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>base</td>\n",
       "      <td>True</td>\n",
       "      <td>Document base URI</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:basefont</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>basefont</td>\n",
       "      <td>False</td>\n",
       "      <td>Base font change</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:bdi</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>bdi</td>\n",
       "      <td>False</td>\n",
       "      <td>Isolates a part of text that might be formatte...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:bdo</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>bdo</td>\n",
       "      <td>False</td>\n",
       "      <td>BiDi override</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:big</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>big</td>\n",
       "      <td>False</td>\n",
       "      <td>Large text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:blockquote</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>blockquote</td>\n",
       "      <td>False</td>\n",
       "      <td>Block quotation</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:body</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>body</td>\n",
       "      <td>False</td>\n",
       "      <td>Document body</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:br</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>br</td>\n",
       "      <td>True</td>\n",
       "      <td>Line break</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:button</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>button</td>\n",
       "      <td>False</td>\n",
       "      <td>Button</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:canvas</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>canvas</td>\n",
       "      <td>False</td>\n",
       "      <td>Used to draw graphics, on the fly, via scripti...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:caption</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>caption</td>\n",
       "      <td>False</td>\n",
       "      <td>Table caption</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:center</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>center</td>\n",
       "      <td>False</td>\n",
       "      <td>Centered block</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:cite</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>cite</td>\n",
       "      <td>False</td>\n",
       "      <td>Citation</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:code</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>code</td>\n",
       "      <td>False</td>\n",
       "      <td>Computer code</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:col</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>col</td>\n",
       "      <td>True</td>\n",
       "      <td>Table column</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:colgroup</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>colgroup</td>\n",
       "      <td>False</td>\n",
       "      <td>Table column group</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:datalist</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>datalist</td>\n",
       "      <td>False</td>\n",
       "      <td>Specifies a list of pre-defined options for in...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:dd</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>dd</td>\n",
       "      <td>False</td>\n",
       "      <td>Definition description</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:del</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>del</td>\n",
       "      <td>False</td>\n",
       "      <td>Deleted text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:details</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>details</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines additional details that the user can v...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:dfn</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>dfn</td>\n",
       "      <td>False</td>\n",
       "      <td>Defined term</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:dialog</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>dialog</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a dialog box or window</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:dir</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>dir</td>\n",
       "      <td>False</td>\n",
       "      <td>Directory list</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:div</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>div</td>\n",
       "      <td>False</td>\n",
       "      <td>Generic block-level container</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:dl</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>dl</td>\n",
       "      <td>False</td>\n",
       "      <td>Definition list</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:dt</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>dt</td>\n",
       "      <td>False</td>\n",
       "      <td>Definition term</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:em</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>em</td>\n",
       "      <td>False</td>\n",
       "      <td>Emphasis</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:embed</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>embed</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a container for an external (non-HTML)...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:fieldset</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>fieldset</td>\n",
       "      <td>False</td>\n",
       "      <td>Form control group</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:figcaption</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>figcaption</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a caption for a &lt;figure&gt; element</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:figure</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>figure</td>\n",
       "      <td>False</td>\n",
       "      <td>Specifies self-contained content</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:font</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>font</td>\n",
       "      <td>False</td>\n",
       "      <td>Font change</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:footer</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>footer</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a footer for a document or section</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:form</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>form</td>\n",
       "      <td>False</td>\n",
       "      <td>Interactive form</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:frame</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>frame</td>\n",
       "      <td>False</td>\n",
       "      <td>Frame</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:frameset</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>frameset</td>\n",
       "      <td>False</td>\n",
       "      <td>Frameset</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:h1</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>h1</td>\n",
       "      <td>False</td>\n",
       "      <td>Level-one heading</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:h2</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>h2</td>\n",
       "      <td>False</td>\n",
       "      <td>Level-two heading</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:h3</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>h3</td>\n",
       "      <td>False</td>\n",
       "      <td>Level-three heading</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:h4</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>h4</td>\n",
       "      <td>False</td>\n",
       "      <td>Level-four heading</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:h5</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>h5</td>\n",
       "      <td>False</td>\n",
       "      <td>Level-five heading</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:h6</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>h6</td>\n",
       "      <td>False</td>\n",
       "      <td>Level-six heading</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:head</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>head</td>\n",
       "      <td>False</td>\n",
       "      <td>Document head</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:header</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>header</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a header for a document or section</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:hr</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>hr</td>\n",
       "      <td>True</td>\n",
       "      <td>Horizontal rule</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:html</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>html</td>\n",
       "      <td>False</td>\n",
       "      <td>HTML document</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:i</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>i</td>\n",
       "      <td>False</td>\n",
       "      <td>Italic text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:iframe</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>iframe</td>\n",
       "      <td>False</td>\n",
       "      <td>Inline frame</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:img</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>img</td>\n",
       "      <td>True</td>\n",
       "      <td>Inline image</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:input</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>input</td>\n",
       "      <td>True</td>\n",
       "      <td>Form input</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:ins</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>ins</td>\n",
       "      <td>False</td>\n",
       "      <td>Inserted text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:isindex</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>isindex</td>\n",
       "      <td>False</td>\n",
       "      <td>Input prompt</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:kbd</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>kbd</td>\n",
       "      <td>False</td>\n",
       "      <td>Text to be input</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:keygen</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>keygen</td>\n",
       "      <td>True</td>\n",
       "      <td>Defines a key-pair generator field (for forms)</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:label</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>label</td>\n",
       "      <td>False</td>\n",
       "      <td>Form field label</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:legend</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>legend</td>\n",
       "      <td>False</td>\n",
       "      <td>Fieldset caption</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:li</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>li</td>\n",
       "      <td>False</td>\n",
       "      <td>List item</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:link</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>link</td>\n",
       "      <td>True</td>\n",
       "      <td>Document relationship</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:main</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>main</td>\n",
       "      <td>False</td>\n",
       "      <td>Specifies the main content of a document</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:map</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>map</td>\n",
       "      <td>False</td>\n",
       "      <td>Image map</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:mark</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>mark</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines marked/highlighted text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:menu</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>menu</td>\n",
       "      <td>False</td>\n",
       "      <td>Menu list</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:menuitem</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>menuitem</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a command/menu item that the user can ...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:meta</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>meta</td>\n",
       "      <td>True</td>\n",
       "      <td>Metadata</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:meter</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>meter</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a scalar measurement within a known ra...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:nav</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>nav</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines navigation links</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:noframes</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>noframes</td>\n",
       "      <td>False</td>\n",
       "      <td>Frames alternate content</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:noscript</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>noscript</td>\n",
       "      <td>False</td>\n",
       "      <td>Alternate script content</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:object</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>object</td>\n",
       "      <td>False</td>\n",
       "      <td>Object</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:ol</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>ol</td>\n",
       "      <td>False</td>\n",
       "      <td>Ordered list</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:optgroup</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>optgroup</td>\n",
       "      <td>False</td>\n",
       "      <td>Option group</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:option</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>option</td>\n",
       "      <td>False</td>\n",
       "      <td>Menu option</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:output</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>output</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines the result of a calculation</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:p</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>p</td>\n",
       "      <td>False</td>\n",
       "      <td>Paragraph</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:param</th>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>param</td>\n",
       "      <td>True</td>\n",
       "      <td>Object parameter</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:picture</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>picture</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a container for multiple image resources</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:pre</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>pre</td>\n",
       "      <td>False</td>\n",
       "      <td>Preformatted text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:progress</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>progress</td>\n",
       "      <td>False</td>\n",
       "      <td>Represents the progress of a task</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:q</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>q</td>\n",
       "      <td>False</td>\n",
       "      <td>Short quotation</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:rp</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>rp</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines what to show in browsers that do not s...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:rt</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>rt</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines an explanation/pronunciation of charac...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:ruby</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>ruby</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a ruby annotation (for East Asian typo...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:s</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>s</td>\n",
       "      <td>False</td>\n",
       "      <td>Strike-through text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:samp</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>samp</td>\n",
       "      <td>False</td>\n",
       "      <td>Sample output</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:script</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>script</td>\n",
       "      <td>False</td>\n",
       "      <td>Client-side script</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:section</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>section</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a section in a document</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:select</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>select</td>\n",
       "      <td>False</td>\n",
       "      <td>Option selector</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:small</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>small</td>\n",
       "      <td>False</td>\n",
       "      <td>Small text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:source</th>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>source</td>\n",
       "      <td>True</td>\n",
       "      <td>Defines multiple media resources for media ele...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:span</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>span</td>\n",
       "      <td>False</td>\n",
       "      <td>Generic inline container</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:strike</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>strike</td>\n",
       "      <td>False</td>\n",
       "      <td>Strike-through text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:strong</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>strong</td>\n",
       "      <td>False</td>\n",
       "      <td>Strong emphasis</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:style</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>style</td>\n",
       "      <td>False</td>\n",
       "      <td>Embedded style sheet</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:sub</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>sub</td>\n",
       "      <td>False</td>\n",
       "      <td>Subscript</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:summary</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>summary</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a visible heading for a &lt;details&gt; element</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:sup</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>sup</td>\n",
       "      <td>False</td>\n",
       "      <td>Superscript</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:table</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>table</td>\n",
       "      <td>False</td>\n",
       "      <td>Table</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:tbody</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>tbody</td>\n",
       "      <td>False</td>\n",
       "      <td>Table body</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:td</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>td</td>\n",
       "      <td>False</td>\n",
       "      <td>Table data cell</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:textarea</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>textarea</td>\n",
       "      <td>False</td>\n",
       "      <td>Multi-line text input</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:tfoot</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>tfoot</td>\n",
       "      <td>False</td>\n",
       "      <td>Table foot</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:th</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>th</td>\n",
       "      <td>False</td>\n",
       "      <td>Table header cell</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:thead</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>thead</td>\n",
       "      <td>False</td>\n",
       "      <td>Table head</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:time</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>time</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a date/time</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:title</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>title</td>\n",
       "      <td>False</td>\n",
       "      <td>Document title</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:tr</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>tr</td>\n",
       "      <td>False</td>\n",
       "      <td>Table row</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:track</th>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>track</td>\n",
       "      <td>True</td>\n",
       "      <td>Defines text tracks for media elements (&lt;video...</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:tt</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>tt</td>\n",
       "      <td>False</td>\n",
       "      <td>Teletype text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:u</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>u</td>\n",
       "      <td>False</td>\n",
       "      <td>Underlined text</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:ul</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>ul</td>\n",
       "      <td>False</td>\n",
       "      <td>Unordered list</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:var</th>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>True</td>\n",
       "      <td>var</td>\n",
       "      <td>False</td>\n",
       "      <td>Variable</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:video</th>\n",
       "      <td>False</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>video</td>\n",
       "      <td>False</td>\n",
       "      <td>Defines a video or movie</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>﷐:wbr</th>\n",
       "      <td>True</td>\n",
       "      <td>False</td>\n",
       "      <td>True</td>\n",
       "      <td>wbr</td>\n",
       "      <td>True</td>\n",
       "      <td>Defines a possible line-break</td>\n",
       "    </tr>\n",
       "  </tbody>\n",
       "</table>\n",
       "</div>"
      ],
      "text/plain": [
       "             ﷐:forbidden ﷐:html4 ﷐:html5      ﷐:name ﷐:omit  \\\n",
       "﷐:a                False    True    True           a  False   \n",
       "﷐:abbr             False    True    True        abbr  False   \n",
       "﷐:acronym          False    True   False     acronym  False   \n",
       "﷐:address          False    True    True     address  False   \n",
       "﷐:applet           False    True   False      applet  False   \n",
       "﷐:area              True    True    True        area   True   \n",
       "﷐:article          False   False    True     article  False   \n",
       "﷐:aside            False   False    True       aside  False   \n",
       "﷐:audio            False   False    True       audio  False   \n",
       "﷐:b                False    True    True           b  False   \n",
       "﷐:base              True    True    True        base   True   \n",
       "﷐:basefont          True    True   False    basefont  False   \n",
       "﷐:bdi              False   False    True         bdi  False   \n",
       "﷐:bdo              False    True    True         bdo  False   \n",
       "﷐:big              False    True   False         big  False   \n",
       "﷐:blockquote       False    True    True  blockquote  False   \n",
       "﷐:body             False    True    True        body  False   \n",
       "﷐:br                True    True    True          br   True   \n",
       "﷐:button           False    True    True      button  False   \n",
       "﷐:canvas           False   False    True      canvas  False   \n",
       "﷐:caption          False    True    True     caption  False   \n",
       "﷐:center           False    True   False      center  False   \n",
       "﷐:cite             False    True    True        cite  False   \n",
       "﷐:code             False    True    True        code  False   \n",
       "﷐:col               True    True    True         col   True   \n",
       "﷐:colgroup         False    True    True    colgroup  False   \n",
       "﷐:datalist         False   False    True    datalist  False   \n",
       "﷐:dd               False    True    True          dd  False   \n",
       "﷐:del              False    True    True         del  False   \n",
       "﷐:details          False   False    True     details  False   \n",
       "﷐:dfn              False    True    True         dfn  False   \n",
       "﷐:dialog           False   False    True      dialog  False   \n",
       "﷐:dir              False    True   False         dir  False   \n",
       "﷐:div              False    True    True         div  False   \n",
       "﷐:dl               False    True    True          dl  False   \n",
       "﷐:dt               False    True    True          dt  False   \n",
       "﷐:em               False    True    True          em  False   \n",
       "﷐:embed            False   False    True       embed  False   \n",
       "﷐:fieldset         False    True    True    fieldset  False   \n",
       "﷐:figcaption       False   False    True  figcaption  False   \n",
       "﷐:figure           False   False    True      figure  False   \n",
       "﷐:font             False    True   False        font  False   \n",
       "﷐:footer           False   False    True      footer  False   \n",
       "﷐:form             False    True    True        form  False   \n",
       "﷐:frame             True    True   False       frame  False   \n",
       "﷐:frameset         False    True   False    frameset  False   \n",
       "﷐:h1               False    True    True          h1  False   \n",
       "﷐:h2               False    True    True          h2  False   \n",
       "﷐:h3               False    True    True          h3  False   \n",
       "﷐:h4               False    True    True          h4  False   \n",
       "﷐:h5               False    True    True          h5  False   \n",
       "﷐:h6               False    True    True          h6  False   \n",
       "﷐:head             False    True    True        head  False   \n",
       "﷐:header           False   False    True      header  False   \n",
       "﷐:hr                True    True    True          hr   True   \n",
       "﷐:html             False    True    True        html  False   \n",
       "﷐:i                False    True    True           i  False   \n",
       "﷐:iframe           False    True    True      iframe  False   \n",
       "﷐:img               True    True    True         img   True   \n",
       "﷐:input             True    True    True       input   True   \n",
       "﷐:ins              False    True    True         ins  False   \n",
       "﷐:isindex           True    True    True     isindex  False   \n",
       "﷐:kbd              False    True    True         kbd  False   \n",
       "﷐:keygen           False   False    True      keygen   True   \n",
       "﷐:label            False    True    True       label  False   \n",
       "﷐:legend           False    True    True      legend  False   \n",
       "﷐:li               False    True    True          li  False   \n",
       "﷐:link              True    True    True        link   True   \n",
       "﷐:main             False   False    True        main  False   \n",
       "﷐:map              False    True    True         map  False   \n",
       "﷐:mark             False   False    True        mark  False   \n",
       "﷐:menu             False    True    True        menu  False   \n",
       "﷐:menuitem         False   False    True    menuitem  False   \n",
       "﷐:meta              True    True    True        meta   True   \n",
       "﷐:meter            False   False    True       meter  False   \n",
       "﷐:nav              False   False    True         nav  False   \n",
       "﷐:noframes         False    True   False    noframes  False   \n",
       "﷐:noscript         False    True    True    noscript  False   \n",
       "﷐:object           False    True    True      object  False   \n",
       "﷐:ol               False    True    True          ol  False   \n",
       "﷐:optgroup         False    True    True    optgroup  False   \n",
       "﷐:option           False    True    True      option  False   \n",
       "﷐:output           False   False    True      output  False   \n",
       "﷐:p                False    True    True           p  False   \n",
       "﷐:param             True    True    True       param   True   \n",
       "﷐:picture          False   False    True     picture  False   \n",
       "﷐:pre              False    True    True         pre  False   \n",
       "﷐:progress         False   False    True    progress  False   \n",
       "﷐:q                False    True    True           q  False   \n",
       "﷐:rp               False   False    True          rp  False   \n",
       "﷐:rt               False   False    True          rt  False   \n",
       "﷐:ruby             False   False    True        ruby  False   \n",
       "﷐:s                False    True    True           s  False   \n",
       "﷐:samp             False    True    True        samp  False   \n",
       "﷐:script           False    True    True      script  False   \n",
       "﷐:section          False   False    True     section  False   \n",
       "﷐:select           False    True    True      select  False   \n",
       "﷐:small            False    True    True       small  False   \n",
       "﷐:source            True   False    True      source   True   \n",
       "﷐:span             False    True    True        span  False   \n",
       "﷐:strike           False    True   False      strike  False   \n",
       "﷐:strong           False    True    True      strong  False   \n",
       "﷐:style            False    True    True       style  False   \n",
       "﷐:sub              False    True    True         sub  False   \n",
       "﷐:summary          False   False    True     summary  False   \n",
       "﷐:sup              False    True    True         sup  False   \n",
       "﷐:table            False    True    True       table  False   \n",
       "﷐:tbody            False    True    True       tbody  False   \n",
       "﷐:td               False    True    True          td  False   \n",
       "﷐:textarea         False    True    True    textarea  False   \n",
       "﷐:tfoot            False    True    True       tfoot  False   \n",
       "﷐:th               False    True    True          th  False   \n",
       "﷐:thead            False    True    True       thead  False   \n",
       "﷐:time             False   False    True        time  False   \n",
       "﷐:title            False    True    True       title  False   \n",
       "﷐:tr               False    True    True          tr  False   \n",
       "﷐:track             True   False    True       track   True   \n",
       "﷐:tt               False    True   False          tt  False   \n",
       "﷐:u                False    True    True           u  False   \n",
       "﷐:ul               False    True    True          ul  False   \n",
       "﷐:var              False    True    True         var  False   \n",
       "﷐:video            False   False    True       video  False   \n",
       "﷐:wbr               True   False    True         wbr   True   \n",
       "\n",
       "                                                        ﷐:title  \n",
       "﷐:a                                                      Anchor  \n",
       "﷐:abbr                                             Abbreviation  \n",
       "﷐:acronym                                               Acronym  \n",
       "﷐:address                                               Address  \n",
       "﷐:applet                                            Java applet  \n",
       "﷐:area                                         Image map region  \n",
       "﷐:article                                    Defines an article  \n",
       "﷐:aside             Defines content aside from the page content  \n",
       "﷐:audio                                   Defines sound content  \n",
       "﷐:b                                                   Bold text  \n",
       "﷐:base                                        Document base URI  \n",
       "﷐:basefont                                     Base font change  \n",
       "﷐:bdi         Isolates a part of text that might be formatte...  \n",
       "﷐:bdo                                             BiDi override  \n",
       "﷐:big                                                Large text  \n",
       "﷐:blockquote                                    Block quotation  \n",
       "﷐:body                                            Document body  \n",
       "﷐:br                                                 Line break  \n",
       "﷐:button                                                 Button  \n",
       "﷐:canvas      Used to draw graphics, on the fly, via scripti...  \n",
       "﷐:caption                                         Table caption  \n",
       "﷐:center                                         Centered block  \n",
       "﷐:cite                                                 Citation  \n",
       "﷐:code                                            Computer code  \n",
       "﷐:col                                              Table column  \n",
       "﷐:colgroup                                   Table column group  \n",
       "﷐:datalist    Specifies a list of pre-defined options for in...  \n",
       "﷐:dd                                     Definition description  \n",
       "﷐:del                                              Deleted text  \n",
       "﷐:details     Defines additional details that the user can v...  \n",
       "﷐:dfn                                              Defined term  \n",
       "﷐:dialog                         Defines a dialog box or window  \n",
       "﷐:dir                                            Directory list  \n",
       "﷐:div                             Generic block-level container  \n",
       "﷐:dl                                            Definition list  \n",
       "﷐:dt                                            Definition term  \n",
       "﷐:em                                                   Emphasis  \n",
       "﷐:embed       Defines a container for an external (non-HTML)...  \n",
       "﷐:fieldset                                   Form control group  \n",
       "﷐:figcaption           Defines a caption for a <figure> element  \n",
       "﷐:figure                       Specifies self-contained content  \n",
       "﷐:font                                              Font change  \n",
       "﷐:footer             Defines a footer for a document or section  \n",
       "﷐:form                                         Interactive form  \n",
       "﷐:frame                                                   Frame  \n",
       "﷐:frameset                                             Frameset  \n",
       "﷐:h1                                          Level-one heading  \n",
       "﷐:h2                                          Level-two heading  \n",
       "﷐:h3                                        Level-three heading  \n",
       "﷐:h4                                         Level-four heading  \n",
       "﷐:h5                                         Level-five heading  \n",
       "﷐:h6                                          Level-six heading  \n",
       "﷐:head                                            Document head  \n",
       "﷐:header             Defines a header for a document or section  \n",
       "﷐:hr                                            Horizontal rule  \n",
       "﷐:html                                            HTML document  \n",
       "﷐:i                                                 Italic text  \n",
       "﷐:iframe                                           Inline frame  \n",
       "﷐:img                                              Inline image  \n",
       "﷐:input                                              Form input  \n",
       "﷐:ins                                             Inserted text  \n",
       "﷐:isindex                                          Input prompt  \n",
       "﷐:kbd                                          Text to be input  \n",
       "﷐:keygen         Defines a key-pair generator field (for forms)  \n",
       "﷐:label                                        Form field label  \n",
       "﷐:legend                                       Fieldset caption  \n",
       "﷐:li                                                  List item  \n",
       "﷐:link                                    Document relationship  \n",
       "﷐:main                 Specifies the main content of a document  \n",
       "﷐:map                                                 Image map  \n",
       "﷐:mark                          Defines marked/highlighted text  \n",
       "﷐:menu                                                Menu list  \n",
       "﷐:menuitem    Defines a command/menu item that the user can ...  \n",
       "﷐:meta                                                 Metadata  \n",
       "﷐:meter       Defines a scalar measurement within a known ra...  \n",
       "﷐:nav                                  Defines navigation links  \n",
       "﷐:noframes                             Frames alternate content  \n",
       "﷐:noscript                             Alternate script content  \n",
       "﷐:object                                                 Object  \n",
       "﷐:ol                                               Ordered list  \n",
       "﷐:optgroup                                         Option group  \n",
       "﷐:option                                            Menu option  \n",
       "﷐:output                    Defines the result of a calculation  \n",
       "﷐:p                                                   Paragraph  \n",
       "﷐:param                                        Object parameter  \n",
       "﷐:picture      Defines a container for multiple image resources  \n",
       "﷐:pre                                         Preformatted text  \n",
       "﷐:progress                    Represents the progress of a task  \n",
       "﷐:q                                             Short quotation  \n",
       "﷐:rp          Defines what to show in browsers that do not s...  \n",
       "﷐:rt          Defines an explanation/pronunciation of charac...  \n",
       "﷐:ruby        Defines a ruby annotation (for East Asian typo...  \n",
       "﷐:s                                         Strike-through text  \n",
       "﷐:samp                                            Sample output  \n",
       "﷐:script                                     Client-side script  \n",
       "﷐:section                       Defines a section in a document  \n",
       "﷐:select                                        Option selector  \n",
       "﷐:small                                              Small text  \n",
       "﷐:source      Defines multiple media resources for media ele...  \n",
       "﷐:span                                 Generic inline container  \n",
       "﷐:strike                                    Strike-through text  \n",
       "﷐:strong                                        Strong emphasis  \n",
       "﷐:style                                    Embedded style sheet  \n",
       "﷐:sub                                                 Subscript  \n",
       "﷐:summary     Defines a visible heading for a <details> element  \n",
       "﷐:sup                                               Superscript  \n",
       "﷐:table                                                   Table  \n",
       "﷐:tbody                                              Table body  \n",
       "﷐:td                                            Table data cell  \n",
       "﷐:textarea                                Multi-line text input  \n",
       "﷐:tfoot                                              Table foot  \n",
       "﷐:th                                          Table header cell  \n",
       "﷐:thead                                              Table head  \n",
       "﷐:time                                      Defines a date/time  \n",
       "﷐:title                                          Document title  \n",
       "﷐:tr                                                  Table row  \n",
       "﷐:track       Defines text tracks for media elements (<video...  \n",
       "﷐:tt                                              Teletype text  \n",
       "﷐:u                                             Underlined text  \n",
       "﷐:ul                                             Unordered list  \n",
       "﷐:var                                                  Variable  \n",
       "﷐:video                                Defines a video or movie  \n",
       "﷐:wbr                             Defines a possible line-break  "
      ]
     },
     "execution_count": 28,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "; show all specs\n",
    "(pandas.DataFrame.transpose (pandas.DataFrame specs))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 29,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<style>\n",
       "\n",
       "/**\n",
       " * Copyright: Marko Manninen, 04/2016 (https://www.github.com/markomanninen)\n",
       " */\n",
       "\n",
       ".rendered_html table.data,\n",
       ".rendered_html table.data tr,\n",
       ".rendered_html table.data th,\n",
       ".rendered_html table.data td {\n",
       "    border: 0\n",
       "}\n",
       "\n",
       "table.data {\n",
       "    color: black;\n",
       "    border: 0;\n",
       "\tmargin: 1.5em auto;\n",
       "\tborder-bottom: 1px solid #999;\n",
       "\tborder-collapse: collapse;\n",
       "\t-webkit-border-top-left-radius: 8px;\n",
       "\t-webkit-border-top-right-radius: 8px;\n",
       "\t-moz-border-radius: 8px 8px 0 0;\n",
       "\tborder-radius: 8px 8px 0 0;\n",
       "\tbackground: #444;\n",
       "}\n",
       "table.data caption {\n",
       "    margin-bottom: .75em;\n",
       "    text-align: center;\n",
       "\tfont-style: italic;\n",
       "}\n",
       "table.data td {\n",
       "\t-moz-transition: background 0.2s linear;\n",
       "\t-o-transition: background 0.2s linear;\n",
       "\ttransition: background 0.2s linear;\n",
       "\twhite-space: nowrap;\n",
       "\tborder-top: 1px solid #eee;\n",
       "\tborder-left: 1px solid #eee;\n",
       "\tpadding: 0.4em 0.8em;\n",
       "\tbackground: #fff;\n",
       "}\n",
       "table.data tfoot,\n",
       "table.data tbody {\n",
       "    outline-offset: -1px;\n",
       "    outline: 1px solid #ccc;\n",
       "}\n",
       "\n",
       "table.data thead {}\n",
       "table.data thead th {\n",
       "\tborder: none;\n",
       "    border-bottom: 2px solid #eee;\n",
       "\tbackground: transparent;\n",
       "\tcolor: #fff;\n",
       "\ttext-align: center;\n",
       "\tcursor: pointer;\n",
       "    padding: 0.4em 0.8em;\n",
       "}\n",
       "\n",
       "table.data tbody {}\n",
       "table.data tbody tr:not(.html5):hover td {\n",
       "\tbackground: #ffe;\n",
       "    color: black;\n",
       "}\n",
       "table.data tbody tr:not(.html5) td:not(.html5):hover {\n",
       "\tbackground: #f5f6d2;\n",
       "}\n",
       "table.data tbody tr td:last-child {\n",
       "\ttext-align: center\n",
       "}\n",
       "\n",
       "table.data tbody tr th {\n",
       "\tcolor: white;\n",
       "    padding: 0.4em 0.8em;\n",
       "    text-transform: uppercase\n",
       "}\n",
       "\n",
       "\n",
       "table.data tfoot {}\n",
       "table.data tfoot td {\n",
       "    padding: 0.4em 0.8em;\n",
       "\ttext-align: center;\n",
       "\tfont-style: italic;\n",
       "}\n",
       "\n",
       "table.data .right {\n",
       "    text-align: right\n",
       "}\n",
       "\n",
       "table.data tr.ok td {background-color: white;}\n",
       "table.data tr.failed td {background-color: red; color: white}\n",
       "table.data tr.error td {background-color: lightpink}\n",
       "table.data tbody.failures {}\n",
       "table.data tbody.errors {}\n",
       "\n",
       "table.data .html4 {\n",
       "\n",
       "}\n",
       "\n",
       "table.data tr td.html5,\n",
       "table.data tr:hover td.html5,\n",
       "table.data tr td.html5:hover {\n",
       "\theight: 50px;\n",
       "\tbackground: 15px 3px #fff no-repeat url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAsVBMVEX////kTSbxZSnr6+sAAADkVC7nUybzfkzHx8flZkb98+7lakvq3tuzs7M2Nja6urpRUVGUlJTzglFnZ2f0jWHtiG/rWif1vK58fHzpycH87Ojvln/nl4LujXSqqqrxajDlWTXnpZTrfGDqd1jyqZb3zMH52dHe3t4iIiI8PDwUFBTnmob4uZ/5x7L849j2oHz71cXouq7p0sz3q4r0taXqz8j40sji4uLycjvycDj2o4Ba0xTVAAAB9ElEQVRIibXU63KqMBQF4I0E5VKt9kA9At4AL/X0UOm9ff8H697RICS79FfXjM4QPpyQLAOgci1GMBSjhaBMxnjlCjEciwmw0bmYjLq5OAh8xP4r/tgwlk91c0EckAPykTjsO/l+N2nwxd3ijvhhvx9+P/cLt0FyzILhtuviZwfwRl8715ZfOxdj8/P5rbw6P+S1xUvrh5QtHuu3+83gddyejc57zaDXJr/q5iuNB13csgKNZ2Qcr86gzpJ4pvE58cCuc7kzID7XeEp8xfEP4qnGCzljjvd6t5ZVaHwq+RXCKxlfpZR8qvGN5C/IM2NlkG80vpWoQj7n+Fbjcc1Tg/eNDpxbsEa+5riuTy1IbfWu9at+ch0A8IjPzYV8oGX3DC4XJDN5yHUAIGq3oB6XHYgMnsiOBSo3FBp/J54YvDAL/E7jbAdUC6rZbOYpTr/usx1QLXhULSAe4nDJdkC1YIY8UvwBh49sB5otqHKH+DI84vB/vgONFuC+VunT0Zej95L7JneI/9PX/YnvwLkF2WObxyHfAYD8tOBeUr2duH/8HJyOjZzhUb1FTrZ+Ke/DZX3KmB04t4A7lrgO6C24/PP6XAcAnk1OlPLM8DhtnpO9W2WtIGV2ST4xjbSTeBVNv7HnbItc2bwwu8LE3ySel2yYnYcvzuElaKKAbG4AAAAASUVORK5CYII=');\n",
       "}\n",
       "\n",
       "div.output_scroll {height: inherit;}\n",
       "\n",
       "table#data { margin: 1em auto; border-collapse: collapse; border: 0} \n",
       "table#data caption { font-size: 1.2em; text-align: center; padding: 3px} \n",
       "table#data th, table#data td { padding: .25em; border: 1px solid #000; font-family: sans-serif; color: white} \n",
       "table#data th { color: #004900; font-weight: bold; text-align: left; } \n",
       "table#data thead th { border-bottom: 3px double #000; background-color: #ddd; text-align: center; } \n",
       "table#data tfoot td { border-top: 3px double #000; color: #fff; font-style: italic; font-size: .8em; text-align: center; background-color: brown} \n",
       "table#data tbody th { color: #000; }\n",
       "table#data #tbody2 {font-weight: bold;font-size: 1.5em;}\n",
       "\n",
       "</style>\n"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "execution_count": 29,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "; include notebook custom styles\n",
    "(IPython.display.HTML (.read (open \"styles.css\" \"r\")))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## The [MIT](http://choosealicense.com/licenses/mit/) License\n",
    "\n",
    "Copyright (c) 2017 Marko Manninen"
   ]
  }
 ],
 "metadata": {
  "anaconda-cloud": {},
  "kernelspec": {
   "display_name": "Calysto Hy",
   "language": "hy",
   "name": "calysto_hy"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "scheme"
   },
   "mimetype": "text/x-hylang",
   "name": "hy",
   "pygments_lexer": "lisp"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 1
}