1 files changed, 55 insertions, 26 deletions

diff --git a/src/client/views/nodes/LabelBigText.js b/src/client/views/nodes/LabelBigText.js
index db43551d8..290152cd0 100644
--- a/src/client/views/nodes/LabelBigText.js
+++ b/src/client/views/nodes/LabelBigText.js
@@ -5,14 +5,14 @@ And from Jetroid/bigtext.js v1.0.0, September 2016
 
 Usage:
 BigText("#myElement",{
-	rotateText: {Number}, (null)
-	fontSizeFactor: {Number}, (0.8)
-	maximumFontSize: {Number}, (null)
-	limitingDimension: {String}, ("both")
-	horizontalAlign: {String}, ("center")
-	verticalAlign: {String}, ("center")
-	textAlign: {String}, ("center")
-	whiteSpace: {String}, ("nowrap")
+    rotateText: {Number}, (null)
+    fontSizeFactor: {Number}, (0.8)
+    maximumFontSize: {Number}, (null)
+    limitingDimension: {String}, ("both")
+    horizontalAlign: {String}, ("center")
+    verticalAlign: {String}, ("center")
+    textAlign: {String}, ("center")
+    whiteSpace: {String}, ("nowrap")
 });
 
 
@@ -28,6 +28,8 @@ fontSizeFactor: This option is used to give some vertical spacing for letters th
 
 maximumFontSize: maximum font size to use.
 
+minimumFontSize: minimum font size to use.  if font is calculated smaller than this, text will be rendered at this size and wrapped
+
 limitingDimension: In which dimension the font size should be limited. Possible values: "width", "height" or "both". Defaults to both. Using this option with values different than "both" overwrites the element parent width or height.
 
 horizontalAlign: Where to align the text horizontally. Possible values: "left", "center", "right". Defaults to "center".
@@ -98,7 +100,8 @@ export default function BigText(element, options) {
         horizontalAlign: "center",
         verticalAlign: "center",
         textAlign: "center",
-        whiteSpace: "nowrap"
+        whiteSpace: "nowrap",
+        singleLine: true
     };
 
     //Merge provided options and default options
@@ -109,20 +112,29 @@ export default function BigText(element, options) {
 
     //Get variables which we will reference frequently
     var style = element.style;
-    var computedStyle = document.defaultView.getComputedStyle(element);
     var parent = element.parentNode;
     var parentStyle = parent.style;
     var parentComputedStyle = document.defaultView.getComputedStyle(parent);
 
     //hides the element to prevent "flashing"
     style.visibility = "hidden";
-
     //Set some properties
     style.display = "inline-block";
     style.clear = "both";
     style.float = "left";
-    style.fontSize = (1000 * options.fontSizeFactor) + "px";
-    style.lineHeight = "1000px";
+    var fontSize = options.maximumFontSize;
+    if (options.singleLine) {
+        style.fontSize = (fontSize * options.fontSizeFactor) + "px";
+        style.lineHeight = fontSize + "px";
+    } else {
+        for (; fontSize > options.minimumFontSize; fontSize = fontSize - Math.min(fontSize / 2, Math.max(0, fontSize - 48) + 2)) {
+            style.fontSize = (fontSize * options.fontSizeFactor) + "px";
+            style.lineHeight = "1";
+            if (element.offsetHeight <= +parentComputedStyle.height.replace("px", "")) {
+                break;
+            }
+        }
+    }
     style.whiteSpace = options.whiteSpace;
     style.textAlign = options.textAlign;
     style.position = "relative";
@@ -130,6 +142,7 @@ export default function BigText(element, options) {
     style.margin = 0;
     style.left = "50%";
     style.top = "50%";
+    var computedStyle = document.defaultView.getComputedStyle(element);
 
     //Get properties of parent to allow easier referencing later.
     var parentPadding = {
@@ -154,6 +167,7 @@ export default function BigText(element, options) {
         width: element.offsetWidth, //Note: This is slightly larger than the jQuery version
         height: element.offsetHeight,
     };
+    if (!box.width || !box.height) return element;
 
 
     if (options.rotateText !== null) {
@@ -172,22 +186,37 @@ export default function BigText(element, options) {
         box.height = element.offsetWidth * sine + element.offsetHeight * cosine;
     }
 
-    var widthFactor = (parentInnerWidth - parentPadding.left - parentPadding.right) / box.width;
-    var heightFactor = (parentInnerHeight - parentPadding.top - parentPadding.bottom) / box.height;
+    var parentWidth = (parentInnerWidth - parentPadding.left - parentPadding.right);
+    var parentHeight = (parentInnerHeight - parentPadding.top - parentPadding.bottom);
+    var widthFactor = parentWidth / box.width;
+    var heightFactor = parentHeight / box.height;
     var lineHeight;
 
     if (options.limitingDimension.toLowerCase() === "width") {
-        lineHeight = Math.floor(widthFactor * 1000);
-        parentStyle.height = lineHeight + "px";
+        lineHeight = Math.floor(widthFactor * fontSize);
     } else if (options.limitingDimension.toLowerCase() === "height") {
-        lineHeight = Math.floor(heightFactor * 1000);
+        lineHeight = Math.floor(heightFactor * fontSize);
     } else if (widthFactor < heightFactor)
-        lineHeight = Math.floor(widthFactor * 1000);
+        lineHeight = Math.floor(widthFactor * fontSize);
     else if (widthFactor >= heightFactor)
-        lineHeight = Math.floor(heightFactor * 1000);
+        lineHeight = Math.floor(heightFactor * fontSize);
 
     var fontSize = lineHeight * options.fontSizeFactor;
-    if (options.maximumFontSize !== null && fontSize > options.maximumFontSize) {
+    if (fontSize < options.minimumFontSize) {
+        parentStyle.display = "flex";
+        parentStyle.alignItems = "center";
+        style.textAlign = "center";
+        style.visibility = "";
+        style.fontSize = options.minimumFontSize + "px";
+        style.lineHeight = "";
+        style.overflow = "hidden";
+        style.textOverflow = "ellipsis";
+        style.top = "";
+        style.left = "";
+        style.margin = "";
+        return element;
+    }
+    if (options.maximumFontSize && fontSize > options.maximumFontSize) {
         fontSize = options.maximumFontSize;
         lineHeight = fontSize / options.fontSizeFactor;
     }
@@ -197,11 +226,11 @@ export default function BigText(element, options) {
     style.marginBottom = "0px";
     style.marginRight = "0px";
 
-    if (options.limitingDimension.toLowerCase() === "height") {
-        //this option needs the font-size to be set already so computedStyle.getPropertyValue("width") returns the right size
-        //this +4 is to compensate the rounding erros that can occur due to the calls to Math.floor in the centering code
-        parentStyle.width = (parseInt(computedStyle.getPropertyValue("width")) + 4) + "px";
-    }
+    // if (options.limitingDimension.toLowerCase() === "height") {
+    //     //this option needs the font-size to be set already so computedStyle.getPropertyValue("width") returns the right size
+    //     //this +4 is to compensate the rounding erros that can occur due to the calls to Math.floor in the centering code
+    //     parentStyle.width = (parseInt(computedStyle.getPropertyValue("width")) + 4) + "px";
+    // }
 
     //Calculate the inner width and height
     var innerDimensions = _calculateInnerDimensions(computedStyle);