added dynamic labels for datatypes

gufmar · Sep 4, 2017 · 129eabf · 129eabf
1 parent 975a9fb
commit 129eabf
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "webvowl",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "dependencies": {
     "d3": "^3.5.6",
     "lodash": "^4.1.0"

diff --git a/src/webvowl/js/elements/nodes/RectangularNode.js b/src/webvowl/js/elements/nodes/RectangularNode.js
@@ -13,9 +13,10 @@ module.exports = (function () {
 			width = 60,
 			pinGroupElement,
 			haloGroupElement,
+            labelWidth = 80,
+            myWidth=80,
 			smallestRadius = height / 2;
 
-
 		// Properties
 		this.height = function (p) {
 			if (!arguments.length) return height;
@@ -55,9 +56,52 @@ module.exports = (function () {
 
 		};
 
+        this.textWidth = function () {
+            //
+            if(graph.options().dynamicLabelWidth()===true) {
+                return that.getMyWidth();
+            }
+            return labelWidth;
+        };
+        this.width= function(){
+            if(graph.options().dynamicLabelWidth()===true){
+                return that.getMyWidth();
+            }
+            return labelWidth;
+        };
+
+        this.getMyWidth=function(){
+            // use a simple heuristic
+            var text = that.labelForCurrentLanguage();
+            myWidth =measureTextWidth(text,"text")+20;
+
+            // check for sub names;
+            var indicatorText=that.indicationString();
+            var indicatorWidth=measureTextWidth(indicatorText,"subtext")+20;
+            if (indicatorWidth>myWidth)
+                myWidth=indicatorWidth;
+
+            return myWidth;
+        };
+
 		this.textWidth = function () {
             return that.width();
 		};
+        function measureTextWidth(text, textStyle) {
+            // Set a default value
+            if (!textStyle) {
+                textStyle = "text";
+            }
+            var d = d3.select("body")
+                    .append("div")
+                    .attr("class", textStyle)
+                    .attr("id", "width-test") // tag this element to identify it
+                    .attr("style", "position:absolute; float:left; white-space:nowrap; visibility:hidden;")
+                    .text(text),
+                w = document.getElementById("width-test").offsetWidth;
+            d.remove();
+            return w;
+        }
 
 		this.toggleFocus = function () {
 			that.focused(!that.focused());