coderkun/questlab
1
0
Fork 0
Code Issues 15 Pull requests Projects Releases Wiki Activity

update Piwik to version 2.16 (fixes #91)

Browse source
This commit is contained in:
oliver 2016-04-10 18:55:57 +02:00
commit d885a4baa9
5833 changed files with 418860 additions and 226988 deletions
Download patch file Download diff file Expand all files Collapse all files

131
www/analytics/plugins/CoreVisualizations/javascripts/jqplot.js
View file

@ -1,5 +1,5 @@
/**
* Piwik - Web Analytics
* Piwik - free/libre analytics platform
*
* DataTable UI class for JqplotGraph.
*
@ -12,11 +12,21 @@
var exports = require('piwik/UI'),
DataTable = exports.DataTable,
dataTablePrototype = DataTable.prototype;
dataTablePrototype = DataTable.prototype,
getLabelFontFamily = function () {
if (!window.piwik.jqplotLabelFont) {
window.piwik.jqplotLabelFont = $('<p/>').hide().appendTo('body').css('font-family');
}
return window.piwik.jqplotLabelFont || 'Arial';
}
;
exports.getLabelFontFamily = getLabelFontFamily;
/**
* DataTable UI class for jqPlot graph datatable visualizations.
*
*
* @constructor
*/
exports.JqplotGraphDataTable = function (element) {
@ -95,7 +105,7 @@
tickOptions: {
showMark: false,
fontSize: '11px',
fontFamily: window.piwik.jqplotLabelFont || 'Arial'
fontFamily: getLabelFontFamily()
},
rendererOptions: {
drawBaseline: false
@ -104,7 +114,8 @@
axes: {
yaxis: {
tickOptions: {
formatString: '%d'
formatString: '%s',
formatter: $.jqplot.NumberFormatter
}
}
}
@ -125,7 +136,7 @@
$.each(series, function(index, value) {
if ($.isArray(value) && value[1]) {
sum = sum + value[1];
} else {
} else if (!$.isArray(value)) {
sum = sum + value;
}
});
@ -136,7 +147,7 @@
if ($.isArray(value) && value[1]) {
value = value[1];
}
percentages[valueIdx] = sum > 0 ? Math.round(100 * value / sum) : 0;
}
}
@ -263,6 +274,70 @@
loading.css({opacity: .7});
},
/**
* This method sums up total width of all tick according to currently
* set font-family, font-size and font-weight. It is achieved by
* creating span elements with ticks and adding their width.
* Rendered ticks have to be visible to get their real width. But it
* is too fast for user to notice it. If total ticks width is bigger
* than container width then half of ticks is beeing cut out and their
* width is tested again. Until their total width is smaller than chart
* div. There is a failsafe so check will be performed no more than 20
* times, which is I think more than enough. Each tick have its own
* gutter, by default width of 5 px from each side so they are more
* readable.
*
* @param $targetDiv
* @private
*/
_checkTicksWidth: function($targetDiv){
if(typeof this.jqplotParams.axes.xaxis.ticksOriginal === 'undefined' || this.jqplotParams.axes.xaxis.ticksOriginal === {}){
this.jqplotParams.axes.xaxis.ticksOriginal = this.jqplotParams.axes.xaxis.ticks.slice();
}
var ticks = this.jqplotParams.axes.xaxis.ticks = this.jqplotParams.axes.xaxis.ticksOriginal.slice();
var divWidth = $targetDiv.width();
var tickOptions = $.extend(true, {}, this.jqplotParams.axesDefaults.tickOptions, this.jqplotParams.axes.xaxis.tickOptions);
var gutter = tickOptions.gutter || 5;
var sumWidthOfTicks = Number.MAX_VALUE;
var $labelTestChamber = {};
var tick = "";
var $body = $("body");
var maxRunsFailsafe = 20;
var ticksCount = 0;
var key = 0;
while(sumWidthOfTicks > divWidth && maxRunsFailsafe > 0) {
sumWidthOfTicks = 0;
for (key = 0; key < ticks.length; key++) {
tick = ticks[key];
if (tick !== " " && tick !== "") {
$labelTestChamber = $("<span/>", {
style: 'font-size: ' + (tickOptions.fontSize || '11px') + '; font-family: ' + (tickOptions.fontFamily || 'Arial, Helvetica, sans-serif') + ';' + (tickOptions.fontWeight || 'normal') + ';' + 'clear: both; float: none;',
text: tick
}).appendTo($body);
sumWidthOfTicks += ($labelTestChamber.width() + gutter*2);
$labelTestChamber.remove();
}
}
ticksCount = 0;
if (sumWidthOfTicks > divWidth) {
for (key = 0; key < ticks.length; key++) {
tick = ticks[key];
if (tick !== " " && tick !== "") {
if (ticksCount % 2 == 1) {
ticks[key] = " ";
}
ticksCount++;
}
}
}
maxRunsFailsafe--;
}
},
/** Generic render function */
render: function () {
if (this.data.length == 0) { // sanity check
@ -285,6 +360,14 @@
// report has been displayed.
var self = this;
// before drawing a jqplot chart, check if all labels ticks will fit
// into it
if( this.param.viewDataTable === "graphBar"
|| this.param.viewDataTable === "graphVerticalBar"
|| this.param.viewDataTable === "graphEvolution" ) {
self._checkTicksWidth(target);
}
// create jqplot chart
try {
var plot = self._plot = $.jqplot(targetDivId, this.data, this.jqplotParams);
@ -302,7 +385,7 @@
// TODO: this code destroys plots when a page is switched. there must be a better way of managing memory.
if (typeof $.jqplot.visiblePlots == 'undefined') {
$.jqplot.visiblePlots = [];
$('.nav').on('piwikSwitchPage', function () {
$('#secondNavBar').on('piwikSwitchPage', function () {
for (var i = 0; i < $.jqplot.visiblePlots.length; i++) {
if ($.jqplot.visiblePlots[i] == null) {
continue;
@ -355,10 +438,10 @@
});
var popover = $(document.createElement('div'));
popover.append('<div style="font-size: 13px; margin-bottom: 10px;">'
+ lang.exportText + '</div>').append($(img));
popover.dialog({
title: lang.exportTitle,
modal: true,
@ -446,7 +529,7 @@
var axisId = this.jqplotParams.series[seriesIndex].yaxis;
var formatString = this.jqplotParams.axes[axisId].tickOptions.formatString;
return formatString.replace('%s', value);
return $.jqplot.NumberFormatter(formatString, value);
},
/**
@ -486,7 +569,7 @@
} else if (viewDataTable == 'graphVerticalBar') {
graphType = 'bar';
}
var namespace = graphType + '-graph-colors';
this.jqplotParams.seriesColors = colorManager.getColors(namespace, seriesColorNames, true);
@ -608,7 +691,6 @@ JQPlotExternalSeriesToggle.prototype = {
};
// ROW EVOLUTION SERIES TOGGLE
function RowEvolutionSeriesToggle(targetDivId, jqplotData, initiallyShowAll) {
@ -623,7 +705,7 @@ RowEvolutionSeriesToggle.prototype.attachEvents = function () {
this.seriesPickers.each(function (i) {
var el = $(this);
el.click(function (e) {
el.off('click').on('click', function (e) {
if (e.shiftKey) {
self.toggleSeries(i);
@ -665,6 +747,21 @@ RowEvolutionSeriesToggle.prototype.beforeReplot = function () {
}
};
// ------------------------------------------------------------
// PIWIK NUMBERFORMATTER PLUGIN FOR JQPLOT
// ------------------------------------------------------------
(function($){
$.jqplot.NumberFormatter = function (format, value) {
if (!$.isNumeric(value)) {
return format.replace(/%s/, value);
}
return format.replace(/%s/, NumberFormatter.formatNumber(value));
}
})(jQuery);
// ------------------------------------------------------------
// PIWIK TICKS PLUGIN FOR JQPLOT
@ -825,7 +922,6 @@ RowEvolutionSeriesToggle.prototype.beforeReplot = function () {
})(jQuery);
// ------------------------------------------------------------
// LEGEND PLUGIN FOR JQPLOT
// Render legend on canvas
@ -880,7 +976,7 @@ RowEvolutionSeriesToggle.prototype.beforeReplot = function () {
var ctx = legend.legendCanvas._ctx;
ctx.save();
ctx.font = '11px ' + (window.piwik.jqplotLabelFont || 'Arial');
ctx.font = '11px ' + require('piwik/UI').getLabelFontFamily()
// render series names
var x = 0;
@ -924,7 +1020,6 @@ RowEvolutionSeriesToggle.prototype.beforeReplot = function () {
})(jQuery);
// ------------------------------------------------------------
// SERIES PICKER
// ------------------------------------------------------------
@ -1019,7 +1114,7 @@ RowEvolutionSeriesToggle.prototype.beforeReplot = function () {
var ctx = legend.pieLegendCanvas._ctx;
ctx.save();
ctx.font = '11px ' + (window.piwik.jqplotLabelFont || 'Arial');
ctx.font = '11px ' + require('piwik/UI').getLabelFontFamily()
// render labels
var height = legend.pieLegendCanvas._elem.height();

4
www/analytics/plugins/CoreVisualizations/javascripts/jqplotBarGraph.js
View file

@ -1,5 +1,5 @@
/**
* Piwik - Web Analytics
* Piwik - free/libre analytics platform
*
* DataTable UI class for JqplotGraph/Bar.
*
@ -62,7 +62,7 @@
var percentage = '';
if (typeof this.tooltip.percentages != 'undefined') {
percentage = this.tooltip.percentages[seriesIndex][valueIndex];
percentage = ' (' + percentage + '%)';
percentage = ' (' + NumberFormatter.formatPercent(percentage) + ')';
}
var label = this.jqplotParams.axes.xaxis.labels[valueIndex];

47
www/analytics/plugins/CoreVisualizations/javascripts/jqplotEvolutionGraph.js
View file

@ -1,5 +1,5 @@
/**
* Piwik - Web Analytics
* Piwik - free/libre analytics platform
*
* DataTable UI class for JqplotGraph/Evolution.
*
@ -22,7 +22,7 @@
_setJqplotParameters: function (params) {
JqplotGraphDataTablePrototype._setJqplotParameters.call(this, params);
var defaultParams = {
axes: {
xaxis: {
@ -89,6 +89,41 @@
if (lastTick !== false && typeof self.jqplotParams.axes.xaxis.onclick != 'undefined'
&& typeof self.jqplotParams.axes.xaxis.onclick[lastTick] == 'string') {
var url = self.jqplotParams.axes.xaxis.onclick[lastTick];
if (url && -1 === url.indexOf('#')) {
var module = broadcast.getValueFromHash('module');
var action = broadcast.getValueFromHash('action');
var idGoal = broadcast.getValueFromHash('idGoal');
var idDimension = broadcast.getValueFromHash('idDimension');
var idSite = broadcast.getValueFromUrl('idSite', url);
var period = broadcast.getValueFromUrl('period', url);
var date = broadcast.getValueFromUrl('date', url);
if (module && action) {
url += '#module=' + module + '&action=' + action;
if (idSite) {
url += '&idSite=' + idSite;
}
if (idGoal) {
url += '&idGoal=' + idGoal;
}
if (idDimension) {
url += '&idDimension=' + idDimension;
}
if (period) {
url += '&period=' + period;
}
if (period) {
url += '&date=' + date;
}
}
}
piwikHelper.redirectToUrl(url);
}
})
@ -100,17 +135,19 @@
} else {
label = self.jqplotParams.axes.xaxis.ticks[tick];
}
var text = [];
for (var d = 0; d < self.data.length; d++) {
var value = self.formatY(self.data[d][tick], d);
var series = self.jqplotParams.series[d].label;
text.push('<strong>' + value + '</strong> ' + series);
text.push('<strong>' + value + '</strong> ' + piwikHelper.htmlEntities(series));
}
var content = '<h3>'+piwikHelper.htmlEntities(label)+'</h3>'+text.join('<br />');
$(this).tooltip({
track: true,
items: 'div',
content: '<h3>'+label+'</h3>'+text.join('<br />'),
content: content,
show: false,
hide: false
}).trigger('mouseover');

4
www/analytics/plugins/CoreVisualizations/javascripts/jqplotPieGraph.js
View file

@ -1,5 +1,5 @@
/**
* Piwik - Web Analytics
* Piwik - free/libre analytics platform
*
* DataTable UI class for JqplotGraph/Pie.
*
@ -67,7 +67,7 @@
var label = this.data[0][valueIndex][0];
var text = '<strong>' + percentage + '%</strong> (' + value + ' ' + series + ')';
var text = '<strong>' + NumberFormatter.formatPercent(percentage) + '</strong> (' + value + ' ' + series + ')';
$(element).tooltip({
track: true,
items: '*',

32
www/analytics/plugins/CoreVisualizations/javascripts/seriesPicker.js
View file

@ -1,5 +1,5 @@
/**
* Piwik - Web Analytics
* Piwik - free/libre analytics platform
*
* Series Picker control addition for DataTable visualizations.
*
@ -11,30 +11,30 @@
/**
* This class creates and manages the Series Picker for certain DataTable visualizations.
*
*
* To add the series picker to your DataTable visualization, create a SeriesPicker instance
* and after your visualization has been rendered, call the 'init' method.
*
*
* To customize SeriesPicker placement and behavior, you can bind callbacks to the following
* events before calling 'init':
*
*
* 'placeSeriesPicker': Triggered after the DOM element for the series picker link is created.
* You must use this event to add the link to the dataTable. YOu can also
* use this event to position the link however you want.
*
*
* Callback Signature: function () {}
*
*
* 'seriesPicked': Triggered when the user selects one or more columns/rows.
*
*
* Callback Signature: function (eventInfo, columns, rows) {}
*
*
* Events are triggered via jQuery, so you bind callbacks to them like this:
*
*
* var picker = new SeriesPicker(dataTable);
* $(picker).bind('placeSeriesPicker', function () {
* $(this.domElem).doSomething(...);
* });
*
*
* @param {dataTable} dataTable The dataTable instance to add a series picker to.
* @constructor
*/
@ -51,7 +51,7 @@
// render the picker?
this.show = !! dataTable.props.show_series_picker
&& (this.selectableColumns || this.selectableRows);
// can multiple rows we selected?
this.multiSelect = !! dataTable.props.allow_multi_select_series_picker;
@ -118,7 +118,7 @@
/**
* Returns the translation of a metric that can be selected.
*
*
* @param {String} metric The name of the metric, ie, 'nb_visits' or 'nb_actions'.
* @return {String} The metric translation. If one cannot be found, the metric itself
* is returned.
@ -272,7 +272,11 @@
$(this).trigger('seriesPicked', [columns, rows]);
// inform dashboard widget about changed parameters (to be restored on reload)
$('#' + this.dataTableId).closest('[widgetId]').trigger('setParameters', {columns: columns, rows: rows});
var UI = require('piwik/UI')
var params = {columns: columns, columns_to_display: columns,
rows: rows, rows_to_display: rows};
var tableNode = $('#' + this.dataTableId);
UI.DataTable.prototype.notifyWidgetParametersChange(tableNode, params);
}
}
@ -332,7 +336,7 @@
;
$body.prepend(popover);
var neededSpace = popover.outerWidth() + 10;
var linkOffset = pickerLink.offset();