docs: function (el, width, position, ellipsisStr, context, ellipsisEndStyle) {
          var document = Aria.$window.document;
          this.textContent = el.innerHTML;
          this.context = context;
          this.ellipsisElement = el;
          this.ellipsesNeeded = false;
          this.position = position;
  
          if (el.childNodes.length == 1 && el.childNodes[0].nodeType == 3) {
  
              // Get the width automatically from the parent if none was specified
              if (!width) {
  
                  width = el.parentNode.offsetWidth;
                  if (el.parentNode.lastChild.className == "xICNsortIndicator") {
                      if (el.parentNode.lastChild.offsetWidth > 0) {
                          width = width - el.parentNode.lastChild.offsetWidth;
                      }
                  }
              }
  
              // temp element to get the width of text and the elipses
              var tempSizerEl = this._createSizerEl(el);
  
              tempSizerEl.innerHTML = el.innerHTML;
              document.body.appendChild(tempSizerEl);
              var textWidth = tempSizerEl.offsetWidth;
              tempSizerEl.parentNode.removeChild(tempSizerEl);
  
              tempSizerEl.innerHTML = (ellipsisStr != null ? ellipsisStr : "") + "&nbsp;";
              document.body.appendChild(tempSizerEl);
              var ellipsisWidth = tempSizerEl.offsetWidth;
  
              tempSizerEl.parentNode.removeChild(tempSizerEl);
              tempSizerEl = null;
  
              if (textWidth > width) {
  
                  this.ellipsesNeeded = true;
                  // Create the new span that will hold the complete string
                  var textSpan = document.createElement("SPAN");
                  // FIXME: use a css class instead
                  textSpan.style.whiteSpace = "nowrap";
                  textSpan.style.overflow = "hidden";
                  textSpan.style.display = "inline-block";
                  textSpan.style.verticalAlign = "bottom";
  
                  width -= ellipsisWidth;
  
                  if (ellipsisEndStyle == "fullCharacter") {
                      // we want to make sure a character doesn't get truncated
  
                      // Save the expected width
                      var expectedWidth = width;
  
                      // create a tmp element to calculate the width of the computed string
                      var tmpContainerElement = this._createSizerEl(el);
  
                      var minChar = 0;
                      var minLength = 0;
                      var maxChar = this.textContent.length;
                      var maxLength = textWidth;
  
                      this._getCharacters = position === "left" ? this._getCharactersLeft : this._getCharactersRight;
                      /**
                       * The full text excluding the ellipsis text
                       * @type String
                       */
                      this.fullText = el.textContent || el.innerText || ""; // in IE : innerText
  
                      while (maxChar - minChar > 1) {
  
                          var charsInMiddle = maxChar - minChar;
                          var lengthInMiddle = maxLength - minLength;
                          var avgLengthInMiddle = lengthInMiddle / charsInMiddle;
                          var numberOfCharToBeDisplayed = minChar
                                  + Math.round((expectedWidth - minLength) / avgLengthInMiddle);
  
                          if (numberOfCharToBeDisplayed === maxChar) {
                              numberOfCharToBeDisplayed--;
                          } else if (numberOfCharToBeDisplayed === minChar) {
                              numberOfCharToBeDisplayed++;
                          }
  
                          tmpContainerElement.innerHTML = ariaUtilsString.escapeForHTML(this._getCharacters(numberOfCharToBeDisplayed));
  
                          width = tmpContainerElement.offsetWidth;
  
                          if (width > expectedWidth) {
                              maxChar = numberOfCharToBeDisplayed;
                              maxLength = width;
                          } else {
                              minChar = numberOfCharToBeDisplayed;
                              minLength = width;
                          }
  
                      }
                      /**
                       * The truncated text excluding the ellipsis text
                       * @type String
                       */
                      this.truncatedText = this._getCharacters(minChar);
  
                      // delete tmp element
                      tmpContainerElement.parentNode.removeChild(tmpContainerElement);
                      tmpContainerElement = null;
  
                      textSpan.innerHTML = ariaUtilsString.escapeForHTML(this.truncatedText);
                  } else {
                      if (width < 0) {
                          // this check is important, otherwise IE can raise an
                          // exception when setting the width
                          width = 0;
                      }
                      textSpan.style.width = width + "px";
                      textSpan.innerHTML = el.innerHTML;
                  }
  
                  if (position == "left") {
                      textSpan.style.direction = "rtl";
                  }
  
                  el.innerHTML = "";
  
                  var ellSpan = document.createElement("SPAN");
                  if (position == "left") {
                      ellSpan.innerHTML = ellipsisStr + "&nbsp;";
                      el.appendChild(ellSpan);
                      el.appendChild(textSpan);
                  } else if (position == "right") {
                      ellSpan.innerHTML = "&nbsp;" + ellipsisStr;
                      el.appendChild(textSpan);
                      el.appendChild(ellSpan);
                  }
  
              }
          } else {
              this.$logWarn(this.ELLIPSIS_NONTEXTUAL_ELEMENTS);
          }
  
      }