added vendor directory and gulp support for better dependency organization and compiling less and js files
removed timeline css and merged it with the theme css and added gulp support for a browser sync task as well for easier development removed composer package until the repo issue is resolved - added minified versions into the bower.json for when the repo issue is resolved
This commit is contained in:
@@ -2,11 +2,11 @@
|
||||
* jquery.flot.tooltip
|
||||
*
|
||||
* description: easy-to-use tooltips for Flot charts
|
||||
* version: 0.8.5
|
||||
* version: 0.8.7
|
||||
* authors: Krzysztof Urbas @krzysu [myviews.pl],Evan Steinkerchner @Roundaround
|
||||
* website: https://github.com/krzysu/flot.tooltip
|
||||
*
|
||||
* build on 2015-05-11
|
||||
* build on 2016-03-15
|
||||
* released under MIT License, 2012
|
||||
*/
|
||||
(function ($) {
|
||||
@@ -25,6 +25,7 @@
|
||||
// %y -> Y value,
|
||||
// %x.2 -> precision of X value,
|
||||
// %p -> percent
|
||||
// %n -> value (not percent) of pie chart
|
||||
xDateFormat: null,
|
||||
yDateFormat: null,
|
||||
monthNames: null,
|
||||
@@ -34,7 +35,9 @@
|
||||
y: 20
|
||||
},
|
||||
defaultTheme: true,
|
||||
snap: true,
|
||||
lines: false,
|
||||
clickTips: false,
|
||||
|
||||
// callbacks
|
||||
onHover: function (flotItem, $tooltipEl) {},
|
||||
@@ -99,12 +102,18 @@
|
||||
|
||||
// bind event
|
||||
$( plot.getPlaceholder() ).bind("plothover", plothover);
|
||||
if (that.tooltipOptions.clickTips) {
|
||||
$( plot.getPlaceholder() ).bind("plotclick", plotclick);
|
||||
}
|
||||
that.clickmode = false;
|
||||
|
||||
$(eventHolder).bind('mousemove', mouseMove);
|
||||
});
|
||||
|
||||
plot.hooks.shutdown.push(function (plot, eventHolder){
|
||||
$(plot.getPlaceholder()).unbind("plothover", plothover);
|
||||
$(plot.getPlaceholder()).unbind("plotclick", plotclick);
|
||||
plot.removeTooltip();
|
||||
$(eventHolder).unbind("mousemove", mouseMove);
|
||||
});
|
||||
|
||||
@@ -115,6 +124,25 @@
|
||||
plot.setTooltipPosition(pos);
|
||||
}
|
||||
|
||||
/**
|
||||
* open the tooltip (if not already open) and freeze it on the current position till the next click
|
||||
*/
|
||||
function plotclick(event, pos, item) {
|
||||
if (! that.clickmode) {
|
||||
// it is the click activating the clicktip
|
||||
plothover(event, pos, item);
|
||||
if (that.getDomElement().is(":visible")) {
|
||||
$(plot.getPlaceholder()).unbind("plothover", plothover);
|
||||
that.clickmode = true;
|
||||
}
|
||||
} else {
|
||||
// it is the click deactivating the clicktip
|
||||
$( plot.getPlaceholder() ).bind("plothover", plothover);
|
||||
plot.hideTooltip();
|
||||
that.clickmode = false;
|
||||
}
|
||||
}
|
||||
|
||||
function plothover(event, pos, item) {
|
||||
// Simple distance formula.
|
||||
var lineDistance = function (p1x, p1y, p2x, p2y) {
|
||||
@@ -147,7 +175,7 @@
|
||||
};
|
||||
|
||||
if (item) {
|
||||
plot.showTooltip(item, pos);
|
||||
plot.showTooltip(item, that.tooltipOptions.snap ? item : pos);
|
||||
} else if (that.plotOptions.series.lines.show && that.tooltipOptions.lines === true) {
|
||||
var maxDistance = that.plotOptions.grid.mouseActiveRadius;
|
||||
|
||||
@@ -155,6 +183,8 @@
|
||||
distance: maxDistance + 1
|
||||
};
|
||||
|
||||
var ttPos = pos;
|
||||
|
||||
$.each(plot.getData(), function (i, series) {
|
||||
var xBeforeIndex = 0,
|
||||
xAfterIndex = -1;
|
||||
@@ -203,11 +233,18 @@
|
||||
distance: distToLine,
|
||||
item: item
|
||||
};
|
||||
|
||||
if (that.tooltipOptions.snap) {
|
||||
ttPos = {
|
||||
pageX: series.xaxis.p2c(pointOnLine[0]),
|
||||
pageY: series.yaxis.p2c(pointOnLine[1])
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (closestTrace.distance < maxDistance + 1)
|
||||
plot.showTooltip(closestTrace.item, pos);
|
||||
plot.showTooltip(closestTrace.item, ttPos);
|
||||
else
|
||||
plot.hideTooltip();
|
||||
} else {
|
||||
@@ -227,18 +264,39 @@
|
||||
if ((pos.y - $(window).scrollTop()) > ($(window)[that.hfunc]() - totalTipHeight)) {
|
||||
pos.y -= totalTipHeight;
|
||||
}
|
||||
that.tipPosition.x = pos.x;
|
||||
that.tipPosition.y = pos.y;
|
||||
|
||||
/*
|
||||
The section applies the new positioning ONLY if pos.x and pos.y
|
||||
are numbers. If they are undefined or not a number, use the last
|
||||
known numerical position. This hack fixes a bug that kept pie
|
||||
charts from keeping their tooltip positioning.
|
||||
*/
|
||||
|
||||
if (isNaN(pos.x)) {
|
||||
that.tipPosition.x = that.tipPosition.xPrev;
|
||||
}
|
||||
else {
|
||||
that.tipPosition.x = pos.x;
|
||||
that.tipPosition.xPrev = pos.x;
|
||||
}
|
||||
if (isNaN(pos.y)) {
|
||||
that.tipPosition.y = that.tipPosition.yPrev;
|
||||
}
|
||||
else {
|
||||
that.tipPosition.y = pos.y;
|
||||
that.tipPosition.yPrev = pos.y;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// Quick little function for showing the tooltip.
|
||||
plot.showTooltip = function (target, position) {
|
||||
plot.showTooltip = function (target, position, targetPosition) {
|
||||
var $tip = that.getDomElement();
|
||||
|
||||
// convert tooltip content template to real tipText
|
||||
var tipText = that.stringFormat(that.tooltipOptions.content, target);
|
||||
if (tipText === '')
|
||||
return;
|
||||
return;
|
||||
|
||||
$tip.html(tipText);
|
||||
plot.setTooltipPosition({ x: position.pageX, y: position.pageY });
|
||||
@@ -257,6 +315,10 @@
|
||||
plot.hideTooltip = function () {
|
||||
that.getDomElement().hide().html('');
|
||||
};
|
||||
|
||||
plot.removeTooltip = function() {
|
||||
that.getDomElement().remove();
|
||||
};
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -264,23 +326,26 @@
|
||||
* @return jQuery object
|
||||
*/
|
||||
FlotTooltip.prototype.getDomElement = function () {
|
||||
var $tip = $('.' + this.tooltipOptions.cssClass);
|
||||
var $tip = $('<div>');
|
||||
if (this.tooltipOptions && this.tooltipOptions.cssClass) {
|
||||
$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'
|
||||
});
|
||||
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'
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -294,7 +359,6 @@
|
||||
* @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/;
|
||||
@@ -305,15 +369,24 @@
|
||||
var xPatternWithoutPrecision = "%x";
|
||||
var yPatternWithoutPrecision = "%y";
|
||||
var customTextPattern = "%ct";
|
||||
|
||||
var x, y, customText, p;
|
||||
var nPiePattern = "%n";
|
||||
|
||||
var x, y, customText, p, n;
|
||||
|
||||
// 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) {
|
||||
}
|
||||
|
||||
// for CurvedLines plugin we need to read data from different place
|
||||
else if (typeof item.series.curvedLines !== "undefined") {
|
||||
x = item.datapoint[0];
|
||||
y = item.datapoint[1];
|
||||
}
|
||||
|
||||
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?
|
||||
@@ -339,6 +412,13 @@
|
||||
return '';
|
||||
}
|
||||
|
||||
/* replacement of %ct and other multi-character templates must
|
||||
precede the replacement of single-character templates
|
||||
to avoid conflict between '%c' and '%ct' and similar substrings
|
||||
*/
|
||||
if (customText)
|
||||
content = content.replace(customTextPattern, customText);
|
||||
|
||||
// percent match for pie charts and stacked percent
|
||||
if (typeof (item.series.percent) !== 'undefined') {
|
||||
p = item.series.percent;
|
||||
@@ -349,6 +429,16 @@
|
||||
content = this.adjustValPrecision(percentPattern, content, p);
|
||||
}
|
||||
|
||||
// replace %n with number of items represented by slice in pie charts
|
||||
if (item.series.hasOwnProperty('pie')) {
|
||||
if (typeof (item.series.data[0][1] !== 'undefined')) {
|
||||
n = item.series.data[0][1];
|
||||
}
|
||||
}
|
||||
if (typeof n === 'number') {
|
||||
content = content.replace(nPiePattern, n);
|
||||
}
|
||||
|
||||
// series match
|
||||
if (typeof(item.series.label) !== 'undefined') {
|
||||
content = content.replace(seriesPattern, item.series.label);
|
||||
@@ -411,11 +501,11 @@
|
||||
// see https://github.com/krzysu/flot.tooltip/issues/65
|
||||
var tickIndex = item.dataIndex + item.seriesIndex;
|
||||
|
||||
for (var index in item.series.xaxis[ticks]) {
|
||||
for (var xIndex 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);
|
||||
content = content.replace(xPattern, item.series.xaxis[ticks][tickIndex].label.replace(/\$/g, '$$$$'));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -423,11 +513,11 @@
|
||||
|
||||
// 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;
|
||||
for (var yIndex in item.series.yaxis.ticks) {
|
||||
if (item.series.yaxis.ticks.hasOwnProperty(yIndex)) {
|
||||
var valueY = (this.isCategoriesMode('yaxis', item)) ? item.series.yaxis.ticks[yIndex].label : item.series.yaxis.ticks[yIndex].v;
|
||||
if (valueY === y) {
|
||||
content = content.replace(yPattern, item.series.yaxis.ticks[index].label);
|
||||
content = content.replace(yPattern, item.series.yaxis.ticks[yIndex].label.replace(/\$/g, '$$$$'));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -443,9 +533,6 @@
|
||||
content = content.replace(yPatternWithoutPrecision, item.series.yaxis.tickFormatter(y, item.series.yaxis).replace(/\$/g, '$$'));
|
||||
}
|
||||
|
||||
if (customText)
|
||||
content = content.replace(customTextPattern, customText);
|
||||
|
||||
return content;
|
||||
};
|
||||
|
||||
@@ -493,12 +580,12 @@
|
||||
|
||||
// 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);
|
||||
return ($.inArray('axisLabels', this.plotPlugins) !== -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');
|
||||
return ($.inArray('tickRotor',this.plotPlugins) !== -1 && typeof item.series.xaxis.rotatedTicks !== 'undefined');
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
Reference in New Issue
Block a user