Add the ability to put html into tooltip

diff --git a/js/foundation.tooltip.js b/js/foundation.tooltip.js
index 0da2990adce914b5d282304b79842043b3b223f5..f71b4aa8cfef0489576f86b82e2e354f86fcedf7 100644 (file)
--- a/js/foundation.tooltip.js
+++ b/js/foundation.tooltip.js
@@ -40,9 +40,15 @@ class Tooltip {
     this.options.tipText = this.options.tipText || this.$element.attr('title');
     this.template = this.options.template ? $(this.options.template) : this._buildTemplate(elemId);
 
-    this.template.appendTo(document.body)
-        .text(this.options.tipText)
-        .hide();
+    if(this.options.allowHtml) {
+      this.template.appendTo(document.body)
+          .html(this.options.tipText)
+          .hide();
+    } else {
+      this.template.appendTo(document.body)
+          .text(this.options.tipText)
+          .hide();
+    }
 
     this.$element.attr({
       'title': '',
@@ -332,7 +338,8 @@ class Tooltip {
    * @function
    */
   destroy() {
-    this.$element.attr('title', this.template.text())
+    var oldText = this.options.allowHtml ? this.template.html() : this.options.text();
+    this.$element.attr('title', oldText)
                  .off('.zf.trigger .zf.tootip')
                 //  .removeClass('has-tip')
                  .removeAttr('aria-describedby')
@@ -348,6 +355,11 @@ class Tooltip {
 
 Tooltip.defaults = {
   disableForTouch: false,
+  /**
+   * Allow html content in tooltip (Unsafe if user generated)
+   * @example false
+   */
+  allowHtml: false,
   /**
    * Time, in ms, before a tooltip should open on hover.
    * @option
@@ -442,4 +454,4 @@ Tooltip.defaults = {
 // Window exports
 Foundation.plugin(Tooltip, 'Tooltip');
 
-}(jQuery);
\ No newline at end of file
+}(jQuery);