/*
 * jquery.flot.tooltip
 *
 * description: easy-to-use tooltips for Flot charts
 * version: 0.8.5
 * authors: Krzysztof Urbas @krzysu [myviews.pl],Evan Steinkerchner @Roundaround
 * website: https://github.com/krzysu/flot.tooltip
 *
 * build on 2015-05-11
 * released under MIT License, 2012
 */
(function ($) {
  // plugin options, default values
  var defaultOptions = {
    tooltip: {
      show: false,
      cssClass: "flotTip",
      content: "%s | X: %x | Y: %y",
      // allowed templates are:
      // %s -> series label,
      // %c -> series color,
      // %lx -> x axis label (requires flot-axislabels plugin https://github.com/markrcote/flot-axislabels),
      // %ly -> y axis label (requires flot-axislabels plugin https://github.com/markrcote/flot-axislabels),
      // %x -> X value,
      // %y -> Y value,
      // %x.2 -> precision of X value,
      // %p -> percent
      xDateFormat: null,
      yDateFormat: null,
      monthNames: null,
      dayNames: null,
      shifts: {
        x: 10,
        y: 20,
      },
      defaultTheme: true,
      lines: false,

      // callbacks
      onHover: function (flotItem, $tooltipEl) {},

      $compat: false,
    },
  };

  // dummy default options object for legacy code (<0.8.5) - is deleted later
  defaultOptions.tooltipOpts = defaultOptions.tooltip;

  // object
  var FlotTooltip = function (plot) {
    // variables
    this.tipPosition = { x: 0, y: 0 };

    this.init(plot);
  };

  // main plugin function
  FlotTooltip.prototype.init = function (plot) {
    var that = this;

    // detect other flot plugins
    var plotPluginsLength = $.plot.plugins.length;
    this.plotPlugins = [];

    if (plotPluginsLength) {
      for (var p = 0; p < plotPluginsLength; p++) {
        this.plotPlugins.push($.plot.plugins[p].name);
      }
    }

    plot.hooks.bindEvents.push(function (plot, eventHolder) {
      // get plot options
      that.plotOptions = plot.getOptions();

      // for legacy (<0.8.5) implementations
      if (typeof that.plotOptions.tooltip === "boolean") {
        that.plotOptions.tooltipOpts.show = that.plotOptions.tooltip;
        that.plotOptions.tooltip = that.plotOptions.tooltipOpts;
        delete that.plotOptions.tooltipOpts;
      }

      // if not enabled return
      if (
        that.plotOptions.tooltip.show === false ||
        typeof that.plotOptions.tooltip.show === "undefined"
      )
        return;

      // shortcut to access tooltip options
      that.tooltipOptions = that.plotOptions.tooltip;

      if (that.tooltipOptions.$compat) {
        that.wfunc = "width";
        that.hfunc = "height";
      } else {
        that.wfunc = "innerWidth";
        that.hfunc = "innerHeight";
      }

      // create tooltip DOM element
      var $tip = that.getDomElement();

      // bind event
      $(plot.getPlaceholder()).bind("plothover", plothover);

      $(eventHolder).bind("mousemove", mouseMove);
    });

    plot.hooks.shutdown.push(function (plot, eventHolder) {
      $(plot.getPlaceholder()).unbind("plothover", plothover);
      $(eventHolder).unbind("mousemove", mouseMove);
    });

    function mouseMove(e) {
      var pos = {};
      pos.x = e.pageX;
      pos.y = e.pageY;
      plot.setTooltipPosition(pos);
    }

    function plothover(event, pos, item) {
      // Simple distance formula.
      var lineDistance = function (p1x, p1y, p2x, p2y) {
        return Math.sqrt((p2x - p1x) * (p2x - p1x) + (p2y - p1y) * (p2y - p1y));
      };

      // Here is some voodoo magic for determining the distance to a line form a given point {x, y}.
      var dotLineLength = function (x, y, x0, y0, x1, y1, o) {
        if (
          o &&
          !((o = (function (x, y, x0, y0, x1, y1) {
            if (typeof x0 !== "undefined") return { x: x0, y: y };
            else if (typeof y0 !== "undefined") return { x: x, y: y0 };

            var left,
              tg = -1 / ((y1 - y0) / (x1 - x0));

            return {
              x: (left =
                (x1 * (x * tg - y + y0) + x0 * (x * -tg + y - y1)) /
                (tg * (x1 - x0) + y0 - y1)),
              y: tg * left - tg * x + y,
            };
          })(x, y, x0, y0, x1, y1)),
          o.x >= Math.min(x0, x1) &&
            o.x <= Math.max(x0, x1) &&
            o.y >= Math.min(y0, y1) &&
            o.y <= Math.max(y0, y1))
        ) {
          var l1 = lineDistance(x, y, x0, y0),
            l2 = lineDistance(x, y, x1, y1);
          return l1 > l2 ? l2 : l1;
        } else {
          var a = y0 - y1,
            b = x1 - x0,
            c = x0 * y1 - y0 * x1;
          return Math.abs(a * x + b * y + c) / Math.sqrt(a * a + b * b);
        }
      };

      if (item) {
        plot.showTooltip(item, pos);
      } else if (
        that.plotOptions.series.lines.show &&
        that.tooltipOptions.lines === true
      ) {
        var maxDistance = that.plotOptions.grid.mouseActiveRadius;

        var closestTrace = {
          distance: maxDistance + 1,
        };

        $.each(plot.getData(), function (i, series) {
          var xBeforeIndex = 0,
            xAfterIndex = -1;

          // Our search here assumes our data is sorted via the x-axis.
          // TODO: Improve efficiency somehow - search smaller sets of data.
          for (var j = 1; j < series.data.length; j++) {
            if (series.data[j - 1][0] <= pos.x && series.data[j][0] >= pos.x) {
              xBeforeIndex = j - 1;
              xAfterIndex = j;
            }
          }

          if (xAfterIndex === -1) {
            plot.hideTooltip();
            return;
          }

          var pointPrev = {
              x: series.data[xBeforeIndex][0],
              y: series.data[xBeforeIndex][1],
            },
            pointNext = {
              x: series.data[xAfterIndex][0],
              y: series.data[xAfterIndex][1],
            };

          var distToLine = dotLineLength(
            series.xaxis.p2c(pos.x),
            series.yaxis.p2c(pos.y),
            series.xaxis.p2c(pointPrev.x),
            series.yaxis.p2c(pointPrev.y),
            series.xaxis.p2c(pointNext.x),
            series.yaxis.p2c(pointNext.y),
            false
          );

          if (distToLine < closestTrace.distance) {
            var closestIndex =
              lineDistance(pointPrev.x, pointPrev.y, pos.x, pos.y) <
              lineDistance(pos.x, pos.y, pointNext.x, pointNext.y)
                ? xBeforeIndex
                : xAfterIndex;

            var pointSize = series.datapoints.pointsize;

            // Calculate the point on the line vertically closest to our cursor.
            var pointOnLine = [
              pos.x,
              pointPrev.y +
                (pointNext.y - pointPrev.y) *
                  ((pos.x - pointPrev.x) / (pointNext.x - pointPrev.x)),
            ];

            var item = {
              datapoint: pointOnLine,
              dataIndex: closestIndex,
              series: series,
              seriesIndex: i,
            };

            closestTrace = {
              distance: distToLine,
              item: item,
            };
          }
        });

        if (closestTrace.distance < maxDistance + 1)
          plot.showTooltip(closestTrace.item, pos);
        else plot.hideTooltip();
      } else {
        plot.hideTooltip();
      }
    }

    // Quick little function for setting the tooltip position.
    plot.setTooltipPosition = function (pos) {
      var $tip = that.getDomElement();

      var totalTipWidth = $tip.outerWidth() + that.tooltipOptions.shifts.x;
      var totalTipHeight = $tip.outerHeight() + that.tooltipOptions.shifts.y;
      if (
        pos.x - $(window).scrollLeft() >
        $(window)[that.wfunc]() - totalTipWidth
      ) {
        pos.x -= totalTipWidth;
      }
      if (
        pos.y - $(window).scrollTop() >
        $(window)[that.hfunc]() - totalTipHeight
      ) {
        pos.y -= totalTipHeight;
      }
      that.tipPosition.x = pos.x;
      that.tipPosition.y = pos.y;
    };

    // Quick little function for showing the tooltip.
    plot.showTooltip = function (target, position) {
      var $tip = that.getDomElement();

      // convert tooltip content template to real tipText
      var tipText = that.stringFormat(that.tooltipOptions.content, target);
      if (tipText === "") return;

      $tip.html(tipText);
      plot.setTooltipPosition({ x: position.pageX, y: position.pageY });
      $tip
        .css({
          left: that.tipPosition.x + that.tooltipOptions.shifts.x,
          top: that.tipPosition.y + that.tooltipOptions.shifts.y,
        })
        .show();

      // run callback
      if (typeof that.tooltipOptions.onHover === "function") {
        that.tooltipOptions.onHover(target, $tip);
      }
    };

    // Quick little function for hiding the tooltip.
    plot.hideTooltip = function () {
      that.getDomElement().hide().html("");
    };
  };

  /**
   * get or create tooltip DOM element
   * @return jQuery object
   */
  FlotTooltip.prototype.getDomElement = function () {
    var $tip = $("." + this.tooltipOptions.cssClass);

    if ($tip.length === 0) {
      $tip = $("<div />").addClass(this.tooltipOptions.cssClass);
      $tip.appendTo("body").hide().css({ position: "absolute" });

      if (this.tooltipOptions.defaultTheme) {
        $tip.css({
          background: "#fff",
          "z-index": "1040",
          padding: "0.4em 0.6em",
          "border-radius": "0.5em",
          "font-size": "0.8em",
          border: "1px solid #111",
          display: "none",
          "white-space": "nowrap",
        });
      }
    }

    return $tip;
  };

  /**
   * core function, create tooltip content
   * @param  {string} content - template with tooltip content
   * @param  {object} item - Flot item
   * @return {string} real tooltip content for current item
   */
  FlotTooltip.prototype.stringFormat = function (content, item) {
    var percentPattern = /%p\.{0,1}(\d{0,})/;
    var seriesPattern = /%s/;
    var colorPattern = /%c/;
    var xLabelPattern = /%lx/; // requires flot-axislabels plugin https://github.com/markrcote/flot-axislabels, will be ignored if plugin isn't loaded
    var yLabelPattern = /%ly/; // requires flot-axislabels plugin https://github.com/markrcote/flot-axislabels, will be ignored if plugin isn't loaded
    var xPattern = /%x\.{0,1}(\d{0,})/;
    var yPattern = /%y\.{0,1}(\d{0,})/;
    var xPatternWithoutPrecision = "%x";
    var yPatternWithoutPrecision = "%y";
    var customTextPattern = "%ct";

    var x, y, customText, p;

    // for threshold plugin we need to read data from different place
    if (typeof item.series.threshold !== "undefined") {
      x = item.datapoint[0];
      y = item.datapoint[1];
      customText = item.datapoint[2];
    } else if (
      typeof item.series.lines !== "undefined" &&
      item.series.lines.steps
    ) {
      x = item.series.datapoints.points[item.dataIndex * 2];
      y = item.series.datapoints.points[item.dataIndex * 2 + 1];
      // TODO: where to find custom text in this variant?
      customText = "";
    } else {
      x = item.series.data[item.dataIndex][0];
      y = item.series.data[item.dataIndex][1];
      customText = item.series.data[item.dataIndex][2];
    }

    // I think this is only in case of threshold plugin
    if (item.series.label === null && item.series.originSeries) {
      item.series.label = item.series.originSeries.label;
    }

    // if it is a function callback get the content string
    if (typeof content === "function") {
      content = content(item.series.label, x, y, item);
    }

    // the case where the passed content is equal to false
    if (typeof content === "boolean" && !content) {
      return "";
    }

    // percent match for pie charts and stacked percent
    if (typeof item.series.percent !== "undefined") {
      p = item.series.percent;
    } else if (typeof item.series.percents !== "undefined") {
      p = item.series.percents[item.dataIndex];
    }
    if (typeof p === "number") {
      content = this.adjustValPrecision(percentPattern, content, p);
    }

    // series match
    if (typeof item.series.label !== "undefined") {
      content = content.replace(seriesPattern, item.series.label);
    } else {
      //remove %s if label is undefined
      content = content.replace(seriesPattern, "");
    }

    // color match
    if (typeof item.series.color !== "undefined") {
      content = content.replace(colorPattern, item.series.color);
    } else {
      //remove %s if color is undefined
      content = content.replace(colorPattern, "");
    }

    // x axis label match
    if (this.hasAxisLabel("xaxis", item)) {
      content = content.replace(
        xLabelPattern,
        item.series.xaxis.options.axisLabel
      );
    } else {
      //remove %lx if axis label is undefined or axislabels plugin not present
      content = content.replace(xLabelPattern, "");
    }

    // y axis label match
    if (this.hasAxisLabel("yaxis", item)) {
      content = content.replace(
        yLabelPattern,
        item.series.yaxis.options.axisLabel
      );
    } else {
      //remove %ly if axis label is undefined or axislabels plugin not present
      content = content.replace(yLabelPattern, "");
    }

    // time mode axes with custom dateFormat
    if (this.isTimeMode("xaxis", item) && this.isXDateFormat(item)) {
      content = content.replace(
        xPattern,
        this.timestampToDate(
          x,
          this.tooltipOptions.xDateFormat,
          item.series.xaxis.options
        )
      );
    }
    if (this.isTimeMode("yaxis", item) && this.isYDateFormat(item)) {
      content = content.replace(
        yPattern,
        this.timestampToDate(
          y,
          this.tooltipOptions.yDateFormat,
          item.series.yaxis.options
        )
      );
    }

    // set precision if defined
    if (typeof x === "number") {
      content = this.adjustValPrecision(xPattern, content, x);
    }
    if (typeof y === "number") {
      content = this.adjustValPrecision(yPattern, content, y);
    }

    // change x from number to given label, if given
    if (typeof item.series.xaxis.ticks !== "undefined") {
      var ticks;
      if (this.hasRotatedXAxisTicks(item)) {
        // xaxis.ticks will be an empty array if tickRotor is being used, but the values are available in rotatedTicks
        ticks = "rotatedTicks";
      } else {
        ticks = "ticks";
      }

      // see https://github.com/krzysu/flot.tooltip/issues/65
      var tickIndex = item.dataIndex + item.seriesIndex;

      for (var index in item.series.xaxis[ticks]) {
        if (
          item.series.xaxis[ticks].hasOwnProperty(tickIndex) &&
          !this.isTimeMode("xaxis", item)
        ) {
          var valueX = this.isCategoriesMode("xaxis", item)
            ? item.series.xaxis[ticks][tickIndex].label
            : item.series.xaxis[ticks][tickIndex].v;
          if (valueX === x) {
            content = content.replace(
              xPattern,
              item.series.xaxis[ticks][tickIndex].label
            );
          }
        }
      }
    }

    // change y from number to given label, if given
    if (typeof item.series.yaxis.ticks !== "undefined") {
      for (var index in item.series.yaxis.ticks) {
        if (item.series.yaxis.ticks.hasOwnProperty(index)) {
          var valueY = this.isCategoriesMode("yaxis", item)
            ? item.series.yaxis.ticks[index].label
            : item.series.yaxis.ticks[index].v;
          if (valueY === y) {
            content = content.replace(
              yPattern,
              item.series.yaxis.ticks[index].label
            );
          }
        }
      }
    }

    // if no value customization, use tickFormatter by default
    if (typeof item.series.xaxis.tickFormatter !== "undefined") {
      //escape dollar
      content = content.replace(
        xPatternWithoutPrecision,
        item.series.xaxis
          .tickFormatter(x, item.series.xaxis)
          .replace(/\$/g, "$$")
      );
    }
    if (typeof item.series.yaxis.tickFormatter !== "undefined") {
      //escape dollar
      content = content.replace(
        yPatternWithoutPrecision,
        item.series.yaxis
          .tickFormatter(y, item.series.yaxis)
          .replace(/\$/g, "$$")
      );
    }

    if (customText) content = content.replace(customTextPattern, customText);

    return content;
  };

  // helpers just for readability
  FlotTooltip.prototype.isTimeMode = function (axisName, item) {
    return (
      typeof item.series[axisName].options.mode !== "undefined" &&
      item.series[axisName].options.mode === "time"
    );
  };

  FlotTooltip.prototype.isXDateFormat = function (item) {
    return (
      typeof this.tooltipOptions.xDateFormat !== "undefined" &&
      this.tooltipOptions.xDateFormat !== null
    );
  };

  FlotTooltip.prototype.isYDateFormat = function (item) {
    return (
      typeof this.tooltipOptions.yDateFormat !== "undefined" &&
      this.tooltipOptions.yDateFormat !== null
    );
  };

  FlotTooltip.prototype.isCategoriesMode = function (axisName, item) {
    return (
      typeof item.series[axisName].options.mode !== "undefined" &&
      item.series[axisName].options.mode === "categories"
    );
  };

  //
  FlotTooltip.prototype.timestampToDate = function (tmst, dateFormat, options) {
    var theDate = $.plot.dateGenerator(tmst, options);
    return $.plot.formatDate(
      theDate,
      dateFormat,
      this.tooltipOptions.monthNames,
      this.tooltipOptions.dayNames
    );
  };

  //
  FlotTooltip.prototype.adjustValPrecision = function (
    pattern,
    content,
    value
  ) {
    var precision;
    var matchResult = content.match(pattern);
    if (matchResult !== null) {
      if (RegExp.$1 !== "") {
        precision = RegExp.$1;
        value = value.toFixed(precision);

        // only replace content if precision exists, in other case use thickformater
        content = content.replace(pattern, value);
      }
    }
    return content;
  };

  // other plugins detection below

  // check if flot-axislabels plugin (https://github.com/markrcote/flot-axislabels) is used and that an axis label is given
  FlotTooltip.prototype.hasAxisLabel = function (axisName, item) {
    return (
      $.inArray(this.plotPlugins, "axisLabels") !== -1 &&
      typeof item.series[axisName].options.axisLabel !== "undefined" &&
      item.series[axisName].options.axisLabel.length > 0
    );
  };

  // check whether flot-tickRotor, a plugin which allows rotation of X-axis ticks, is being used
  FlotTooltip.prototype.hasRotatedXAxisTicks = function (item) {
    return (
      $.inArray(this.plotPlugins, "tickRotor") !== -1 &&
      typeof item.series.xaxis.rotatedTicks !== "undefined"
    );
  };

  //
  var init = function (plot) {
    new FlotTooltip(plot);
  };

  // define Flot plugin
  $.plot.plugins.push({
    init: init,
    options: defaultOptions,
    name: "tooltip",
    version: "0.8.5",
  });
})(jQuery);