objectDisplay: order blocks

src/displayBlock.js

@@ -1,7 +1,11 @@
-module.exports = function displayBlock ({dom, content, title}) {
+module.exports = function displayBlock ({dom, content, title, order}) {
   const block = document.createElement('div')
   block.className = 'block'
 
+  if (order) {
+    block.setAttribute('data-order', order)
+  }
+
   if (title) {
     const header = document.createElement('h3')
     header.innerHTML = title
@@ -17,4 +21,16 @@ module.exports = function displayBlock ({dom, content, title}) {
   }
 
   dom.appendChild(block)
+
+  reorder(dom)
+}
+
+function reorder (dom) {
+  const children = Array.from(dom.children)
+  children.sort((child1, child2) => {
+    let o1 = child1.hasAttribute('data-order') ? parseFloat(child1.getAttribute('data-order')) : 0
+    let o2 = child2.hasAttribute('data-order') ? parseFloat(child2.getAttribute('data-order')) : 0
+    return o1 - o2
+  })
+  children.forEach(child => dom.appendChild(child))
 }

src/objectDisplay.js

@@ -68,13 +68,15 @@ module.exports = function objectDisplay ({feature, category, dom, displayId, fal
   displayBlock({
     dom,
     content: exportAll(feature),
-    title: lang('header:export')
+    title: lang('header:export'),
+    order: 5
   })
 
   displayBlock({
     dom,
     content: tagsDisplay(feature.object.tags),
-    title: lang('header:attributes')
+    title: lang('header:attributes'),
+    order: 10
   })
 
   div = document.createElement('dl')
@@ -103,7 +105,8 @@ module.exports = function objectDisplay ({feature, category, dom, displayId, fal
   displayBlock({
     dom,
     content: div,
-    title: lang('header:osm_meta')
+    title: lang('header:osm_meta'),
+    order: 11
   })
 
   call_hooks_callback('show-' + displayId, feature, category, dom, err => {