// This is a public instance of the `DynamicText` class. // The `DynamicText` object serves to resize text that is set through its // public methods so that the text won't ever overrun the parent container. var DynamicText = (function () { // the initialization of the `DynamicText` instance. var DynamicText = function ($parent) { if (typeof jQuery !== "undefined" && $parent instanceof jQuery) { // we grab the first element in a jQuery list to run DynamicText on. this.parent = $parent[0]; } else if ($parent instanceof Node) { // this is a node rather than a list, so we just take the element given // to run DynamicText on. this.parent = $parent; } this.node = document.createElement("span"); this.node.style.whiteSpace = "nowrap"; this.prev_content = this.parent.innerHTML; this.parent.innerHTML = ""; this.parent.appendChild(this.node); this.update(); }; // an object for private functions that are inaccessible to the outside // world. var internal_funcs = { insertText: function (type, text, node, parent) { if (type === DynamicText.prototype.TYPE.TEXT) { node.innerText = text; } else if (type === DynamicText.prototype.TYPE.HTML) { node.innerHTML = text; } else { blueslip.error("The method '" + type + "' is not a valid " + " DynamicText input method."); } // reset the font-size to inherit the parent's size; 1em. node.style.fontSize = "1em"; var width = { node: node.offsetWidth, parent: parent.clientWidth, }; // if the width is larger than the parent, resize by the ratio of // the parent's width to the node's width. if (width.node > width.parent) { node.style.fontSize = (width.parent / width.node) + "em"; } else { node.style.fontSize = "1em"; } }, }; DynamicText.prototype = { // insertion enum types. TYPE: { TEXT: 1, HTML: 2, }, // re-set the content inside the span element and process for width. // the structure goes like: // FROM: content // TO: // content // update: function () { // call `text` by default since if HTML is needed (unsafe), it can be // done manually. this.text(this.prev_content); }, // this takes about 0.005ms for items that don't need resizing and 0.08ms // for items that do need resizing. text: function (text) { internal_funcs.insertText(this.TYPE.TEXT, text, this.node, this.parent); }, // this function takes approx 0.4ms/iteration. // the speed is mostly limited to the slowness of the innerHTML function. html: function (html) { internal_funcs.insertText(this.TYPE.HTML, html, this.node, this.parent); }, }; // keep these arguments updated with `DynamicText` class constructor. return function ($node) { return new DynamicText($node); }; }()); if (typeof module !== 'undefined') { module.exports = DynamicText; }