Add meta data table to matches (1st attempt)

Change-Id: I35616dafe7b2bb2e17bca3cc480add287e5e8630
diff --git a/dev/js/src/match/reference.js b/dev/js/src/match/reference.js
index 978930c..9d59af3 100644
--- a/dev/js/src/match/reference.js
+++ b/dev/js/src/match/reference.js
@@ -23,5 +23,73 @@
   fileEditionStatement
 */
 define(function () {
-  return;
+  return {
+
+    /**
+     * Create new match object
+     */
+    create : function (match) {
+      return Object.create(this)._init(match);
+    },
+
+    /**
+     * Initialize object
+     */
+    _init : function (match) {
+      this._match = match;
+      this.opened = false;
+      return this;
+    },
+
+    /**
+     * Get match object
+     */
+    match : function () {
+      return this._match;
+    },
+
+    /**
+     * Create match reference view.
+     */
+    element : function (metaInfo) {
+      if (this._element !== undefined)
+        return this._element;
+      
+      var metaTable = document.createElement('dl');
+      metaTable.classList.add('metatable');
+
+      this._element = metaTable;
+
+      // TODO: Meta fields should be separated
+      var keys = Object.keys(metaInfo);
+      for (var i in keys.sort()) {
+        var k = keys[i];
+        if (k !== "UID" &&
+            k !== "corpusID" &&
+            k !== "docID" &&
+            k !== "textID" &&
+            k !== "corpusSigle" &&
+            k !== "docSigle" &&
+            k !== "layerInfos") {
+
+          var metaL = document.createElement('div');
+          metaL.appendChild(
+            document.createElement('dt')
+          ).appendChild(
+            document.createTextNode(k)
+          );
+
+          metaL.appendChild(
+            document.createElement('dd')
+          ).appendChild(
+            document.createTextNode(metaInfo[k])
+          );
+
+          metaTable.appendChild(metaL);
+        };
+      };
+
+      return this._element;
+    }
+  };
 });