Introduce panel system for match information
Change-Id: Id209cb9d928f4511d02ade47543c3486a611313e
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
deleted file mode 100644
index 655535f..0000000
--- a/dev/js/src/match/info.js
+++ /dev/null
@@ -1,430 +0,0 @@
-/**
- * Information about a match.
- */
-/*
- * TODO:
- * Create a "panel" object, that is the parent of this
- * class and supports a simple .add() method to add views
- * to an element.
- */
-define([
- 'match/infolayer',
- 'match/table',
- 'match/treehierarchy',
- 'match/treearc',
- 'match/meta',
- 'util'
-], function (infoLayerClass,
- matchTableClass,
- matchTreeHierarchyClass,
- matchTreeArcClass,
- matchMetaClass) {
-
- // Override
- KorAP.API.getMatchInfo = KorAP.API.getMatchInfo || function () {
- KorAP.log(0, 'KorAP.API.getMatchInfo() not implemented')
- return {};
- };
-
- const loc = KorAP.Locale;
- const d = document;
-
- return {
-
- /**
- * Create new match object
- */
- create : function (match) {
- return Object.create(this)._init(match);
- },
-
-
- /**
- * Initialize object
- */
- _init : function (match) {
- this._match = match;
- this._visibleTable = false;
- this._visibleMeta = false;
- this.opened = false;
- return this;
- },
-
-
- /**
- * Get match object
- */
- match : function () {
- return this._match;
- },
-
-
- /**
- * Retrieve and parse snippet for table
- * representation
- */
- getTableData : function (tokens, cb) {
- var focus = [];
-
- // Get all tokens
- if (tokens === undefined) {
- focus = this._match.getTokens();
- }
-
- // Get only some tokens
- else {
-
- // Push newly to focus array
- for (var i = 0; i < tokens.length; i++) {
- var term = tokens[i];
- try {
- // Create info layer objects
- var layer = infoLayerClass.create(term);
- layer.type = "tokens";
- focus.push(layer);
- }
- catch (e) {
- continue;
- };
- };
- };
-
- // No tokens chosen
- if (focus.length == 0)
- cb(null);
-
- try {
- // Get info (may be cached)
- KorAP.API.getMatchInfo(
- this._match,
- { 'spans' : false, 'layer' : focus },
-
- // Callback for retrieval
- function (matchResponse) {
-
- if (matchResponse === undefined)
- cb(null);
-
- // Get snippet from match info
- if (matchResponse["snippet"] !== undefined) {
- this._table = matchTableClass.create(matchResponse["snippet"]);
- cb(this._table);
- };
- }.bind(this)
- );
- }
- catch (e) {
- KorAP.log(0, e);
- cb(null);
- };
-
- /*
- // Todo: Store the table as a hash of the focus
- return null;
- */
- },
-
-
- /**
- * Receive meta data from server.
- */
- getMetaData : function (cb) {
-
- var match = this._match;
-
- try {
- KorAP.API.getTextInfo(
- match, {}, function (textResponse) {
-
- if (textResponse === undefined) {
- cb(null);
- return;
- };
-
- var doc = textResponse["document"];
-
- if (doc === undefined) {
- cb(null);
- return;
- };
-
- var fields = doc["fields"];
- if (fields === undefined) {
- cb(null);
- return;
- };
-
- // Add metainfo to matchview
- cb(matchMetaClass.create(
- match, fields
- ));
- }
- );
- }
- catch (e) {
- KorAP.log(0, e);
- cb(null);
- };
- },
-
-
- /**
- * Retrieve and parse snippet for tree representation
- */
- getTreeData : function (foundry, layer, type, cb) {
- var focus = [];
-
- try {
- // TODO: Support and cache multiple trees
- KorAP.API.getMatchInfo(
- this._match, {
- 'spans' : true,
- 'foundry' : foundry,
- 'layer' : layer
- },
- function (matchResponse) {
- if (matchResponse === undefined) {
- cb(null);
- return;
- };
-
- // Get snippet from match info
- if (matchResponse["snippet"] !== undefined) {
- // Todo: This should be cached somehow
-
- if (type === "spans") {
- cb(matchTreeHierarchyClass.create(matchResponse["snippet"]));
- }
- else if (type === "rels") {
- cb(matchTreeArcClass.create(matchResponse["snippet"]));
- }
-
- // Unknown tree type
- else {
- cb(null);
- };
- }
- else {
- cb(null);
- };
- }.bind(this)
- );
- }
- catch (e) {
- KorAP.log(0, e);
- cb(null);
- };
- },
-
-
- /**
- * Destroy this match information view.
- */
- destroy : function () {
-
- // Remove circular reference
- /*
- if (this._treeMenu !== undefined)
- delete this._treeMenu["info"];
-
- this._treeMenu.destroy();
- this._treeMenu = undefined;
- */
- this._match = undefined;
- this._matchCreator = undefined;
- // Element destroy
- },
-
-
- /**
- * Add a new tree view to the list
- */
- showTree : function (foundry, layer, type, cb) {
- var matchtree = d.createElement('div');
- matchtree.classList.add('matchtree', 'loading');
-
- this.element().appendChild(matchtree);
-
- // Add title line
- var h6 = matchtree.addE('h6');
- h6.addE('span').addT(foundry);
- h6.addE('span').addT(layer);
-
- var tree = matchtree.addE('div');
-
- // Add close action button
- var actions = this._addButton('close', matchtree, function (e) {
- this.parentNode.removeChild(this);
- e.halt();
- });
-
- // tree.classList.add('loading'); // alternatively
-
- // Get tree data async
- this.getTreeData(foundry, layer, type, function (treeObj) {
- matchtree.classList.remove('loading');
-
- // Something went wrong - probably log!!!
-
- if (treeObj === null) {
- tree.addT('No data available.');
- }
- else {
- tree.appendChild(treeObj.element());
- treeObj.show();
-
- // Reposition the view to the center
- // (This may in a future release be a reposition
- // to move the root to the actual match)
-
- // This is currently not supported by relations
- if (type === "spans") {
- var dl = d.createElement('li');
- dl.className = 'download';
- dl.addEventListener(
- 'click', function (e) {
- var a = treeObj.downloadLink();
- d.body.appendChild(a);
- a.click();
- d.body.removeChild(a)
- e.halt();
- }
- );
-
- actions.appendChild(dl);
- };
-
- treeObj.center();
- };
-
- if (cb !== undefined)
- cb(treeObj);
- });
- matchtree.classList.remove('loading');
- },
-
-
- // Add meta information to match
- showMeta : function () {
-
- // Already visible
- if (this._visibleMeta)
- return;
-
- this._visibleMeta = true;
-
- var metaTable = document.createElement('div');
- metaTable.classList.add('metatable', 'loading');
- this.element().appendChild(metaTable);
-
- /*
- * This was temporary
- var metaInfo = this._match.element().getAttribute('data-info');
- if (metaInfo)
- metaInfo = JSON.parse(metaInfo);
- */
- var that = this;
-
- this.getMetaData(function (meta) {
-
- if (meta === null)
- return;
-
- // Load data
- metaTable.classList.remove('loading');
-
- metaTable.appendChild(meta.element());
-
- // Add button
- that._addButton('close', metaTable, function (e) {
- this.parentNode.removeChild(this);
- that._visibleMeta = false;
- e.halt();
- });
- });
-
- // Do not load any longer
- metaTable.classList.remove('loading');
- },
-
-
- // Add table
- showTable : function () {
-
- // Already visible
- if (this._visibleTable)
- return;
-
- this._visibleTable = true;
-
- // Append default table
- var matchtable = d.createElement('div');
- matchtable.classList.add('matchtable', 'loading');
- var info = this.element();
- info.appendChild(matchtable);
-
- var that = this;
-
- // TODO:
- // Create try-catch-exception-handling
-
- // Create the table asynchronous
- this.getTableData(undefined, function (table) {
-
- // Load data
- matchtable.classList.remove('loading');
-
- if (table !== null) {
- matchtable.appendChild(table.element());
- };
- });
-
- // Add button
- this._addButton('close', matchtable, function (e) {
- this.parentNode.removeChild(this);
- that._visibleTable = false;
- e.halt();
- });
-
- // Load data
- matchtable.classList.remove('loading');
- },
-
- // Add action button
- // TODO:
- // These are view-buttons that should be added to
- // the view and not to the panel!
- _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.
- */
- element : function () {
-
- if (this._element !== undefined)
- return this._element;
-
- // Create info table
- var info = d.createElement('div');
- info.classList.add('matchinfo');
-
- this._element = info;
-
- return this._element;
- }
- };
-});
diff --git a/dev/js/src/match/treearc.js b/dev/js/src/match/treearc.js
index badbacf..6f0690b 100644
--- a/dev/js/src/match/treearc.js
+++ b/dev/js/src/match/treearc.js
@@ -404,6 +404,10 @@
labelE.appendChild(textNode);
var labelBox = labelE.getBBox();
+
+ if (!labelBox)
+ console.log("----");
+
var textWidth = labelBox.width; // labelE.getComputedTextLength();
var textHeight = labelBox.height; // labelE.getComputedTextLength();