Info: render 'info' section from category

src/CategoryBase.js

@@ -57,6 +57,10 @@ function CategoryBase (id, data) {
     }
   }
 
+  this.domInfo = document.createElement('div')
+  this.domInfo .className = 'info'
+  this.dom.appendChild(this.domInfo)
+
   this.domContent = document.createElement('div')
   this.domContent.className = 'content'
   this.dom.appendChild(this.domContent)

src/CategoryOverpass.js

@@ -113,7 +113,6 @@ function CategoryOverpass (id, data) {
 
   this.domStatus = document.createElement('div')
   this.domStatus.className = 'status'
-
   this.dom.appendChild(this.domStatus)
 
   register_hook('state-get', function (state) {
@@ -192,6 +191,11 @@ CategoryOverpass.prototype.open = function () {
   this.isOpen = true
 
   state.update()
+
+  if ('info' in this.data) {
+    var template = OverpassLayer.twig.twig({ data: this.data.info, autoescape: true })
+    this.domInfo.innerHTML = template.render(this.data)
+  }
 }
 
 CategoryOverpass.prototype.recalc = function () {

style.css

@@ -183,10 +183,12 @@ body {
   float: right;
 }
 #content .category > .content,
+#content .category > .info,
 #content .category > .status {
   display: none;
 }
 #content .category.open > .content,
+#content .category.open > .info,
 #content .category.open > .status {
   display: block;
 }