Added close button to annotation table
Change-Id: I639ecd3a59513658e32d646ddd5740dd76c287b5
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index 6019e40..8779ee9 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -280,8 +280,8 @@
// Add meta information to match
showMeta : function () {
- var matchmeta = d.createElement('div');
- matchmeta.classList.add('matchmeta', 'loading');
+ var metaTable = document.createElement('div');
+ metaTable.classList.add('metatable'); // , 'loading');
// TODO: This is part of the getMeta!
var metaInfo = this._match.element().getAttribute('data-info');
@@ -294,17 +294,18 @@
// Add metainfo to matchview
var metaElem = matchMetaClass.create(this._match).element(metaInfo);
- this.element().appendChild(metaElem);
- /*
- elem.insertBefore(
- metaElem,
- elem.firstChild
- );
- */
+ metaTable.appendChild(metaElem);
+ this.element().appendChild(metaTable);
+
+ // Add button
+ this._addButton('close', metaTable, function (e) {
+ this.parentNode.removeChild(this);
+ e.halt();
+ });
};
// Load data
- matchmeta.classList.remove('loading');
+ metaTable.classList.remove('loading');
},
@@ -313,8 +314,11 @@
// Append default table
var matchtable = d.createElement('div');
- matchtable.classList.add('matchtable', 'loading');
- this.element().appendChild(matchtable);
+ matchtable.classList.add('matchtable'); // , 'loading');
+
+ var info = this.element();
+ info.appendChild(matchtable);
+
// Create the table asynchronous
this.getTableData(undefined, function (table) {
@@ -329,8 +333,34 @@
// Add query creator
this._matchCreator = matchQueryCreator.create(info);
});
+
+ // Add button
+ this._addButton('close', matchtable, function (e) {
+ this.parentNode.removeChild(this);
+ e.halt();
+ });
+
+ // Load data
+ matchtable.classList.remove('loading');
},
+
+ _addButton : function (buttonType, element, cb) {
+ // TODO: Unless existent
+ var actions = document.createElement('ul');
+ actions.classList.add('action', 'image');
+ var b = actions.addE('li');
+ b.className = buttonType;
+ b.addE('span').addT(buttonType);
+ b.addEventListener(
+ 'click', cb.bind(element)
+ );
+
+ element.appendChild(actions);
+ return actions;
+ },
+
+
/**
* Create match information view.
*/
diff --git a/dev/js/src/match/meta.js b/dev/js/src/match/meta.js
index 02da3dc..8237935 100644
--- a/dev/js/src/match/meta.js
+++ b/dev/js/src/match/meta.js
@@ -61,9 +61,6 @@
if (this._element !== undefined)
return this._element;
- var metaTable = document.createElement('div');
- metaTable.classList.add('metatable');
-
/*
var header = metaTable.appendChild(
document.createElement('h6')
@@ -76,9 +73,9 @@
);
*/
- var metaDL = metaTable.addE('dl');
+ var metaDL = document.createElement('dl');
- this._element = metaTable;
+ this._element = metaDL;
// TODO: Meta fields should be separated
var keys = Object.keys(metaInfo);
@@ -101,31 +98,7 @@
metaDL.appendChild(metaL);
};
};
-
- this.addButton('close', function (e) {
- var el = this.element();
- el.parentNode.removeChild(el);
- e.halt();
- });
-
return this._element;
- },
-
- // TODO: This should be a method by all matchinfo objects
- addButton : function (buttonType, cb) {
- // TODO: Unless existent
- var actions = document.createElement('ul');
- actions.classList.add('action', 'image');
- var button = actions.addE('li');
- button.className = buttonType;
- button.addE('span').addT(buttonType);
- button.addEventListener(
- 'click', cb.bind(this)
- );
-
- this.element().appendChild(actions);
- return actions;
- },
-
+ }
};
});
diff --git a/dev/js/src/match/table.js b/dev/js/src/match/table.js
index 46f2890..67e20cd 100644
--- a/dev/js/src/match/table.js
+++ b/dev/js/src/match/table.js
@@ -2,6 +2,7 @@
* Table representation of morphological
* annotations of a match.
*/
+// TODO: Create base object for all matchinfo classes!
define(["util"], function () {
const _TermRE = new RegExp("^(?:([^\/]+?)\/)?([^:]+?):(.+?)$");
const d = document;
@@ -70,6 +71,7 @@
return this._info[pos][foundry + '/' + layer]
},
+
// Parse the snippet
_parse : function (children) {
@@ -149,7 +151,11 @@
return this._element;
// First the legend table
- var table = d.createElement('table');
+ var wrap = d.createElement('div');
+
+ var table = wrap.addE('table');
+
+ this._element = wrap;
// Single row in head
var tr = table.addE('thead').addE('tr');
@@ -239,7 +245,7 @@
};
};
- return this._element = table;
- }
+ return this._element;
+ },
};
});
diff --git a/dev/scss/main/matchinfo.scss b/dev/scss/main/matchinfo.scss
index 3709b59..cdfd293 100644
--- a/dev/scss/main/matchinfo.scss
+++ b/dev/scss/main/matchinfo.scss
@@ -139,7 +139,7 @@
}
-div.matchtable {
+div.matchtable > div {
z-index: 20;
margin-left: $left-distance - ($border-size / 2);
margin-right: $right-match-distance;
@@ -278,7 +278,7 @@
}
-div.metatable {
+div.metatable, div.matchtable {
position: relative;
}