mirror of
https://github.com/DMOJ/online-judge.git
synced 2024-11-25 16:32:37 +08:00
Remove non-DMOJ resources from main repo
This commit is contained in:
parent
10bfaef91a
commit
caf25fcc95
@ -1,303 +0,0 @@
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var root = this,
|
||||
Chart = root.Chart,
|
||||
helpers = Chart.helpers;
|
||||
|
||||
|
||||
var defaultConfig = {
|
||||
//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
|
||||
scaleBeginAtZero : true,
|
||||
|
||||
//Boolean - Whether grid lines are shown across the chart
|
||||
scaleShowGridLines : true,
|
||||
|
||||
//String - Colour of the grid lines
|
||||
scaleGridLineColor : "rgba(0,0,0,.05)",
|
||||
|
||||
//Number - Width of the grid lines
|
||||
scaleGridLineWidth : 1,
|
||||
|
||||
//Boolean - Whether to show horizontal lines (except X axis)
|
||||
scaleShowHorizontalLines: true,
|
||||
|
||||
//Boolean - Whether to show vertical lines (except Y axis)
|
||||
scaleShowVerticalLines: true,
|
||||
|
||||
//Boolean - If there is a stroke on each bar
|
||||
barShowStroke : true,
|
||||
|
||||
//Number - Pixel width of the bar stroke
|
||||
barStrokeWidth : 2,
|
||||
|
||||
//Number - Spacing between each of the X value sets
|
||||
barValueSpacing : 5,
|
||||
|
||||
//Number - Spacing between data sets within X values
|
||||
barDatasetSpacing : 1,
|
||||
|
||||
//String - A legend template
|
||||
legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].fillColor%>\"><%if(datasets[i].label){%><%=datasets[i].label%><%}%></span></li><%}%></ul>"
|
||||
|
||||
};
|
||||
|
||||
|
||||
Chart.Type.extend({
|
||||
name: "Bar",
|
||||
defaults : defaultConfig,
|
||||
initialize: function(data){
|
||||
|
||||
//Expose options as a scope variable here so we can access it in the ScaleClass
|
||||
var options = this.options;
|
||||
|
||||
this.ScaleClass = Chart.Scale.extend({
|
||||
offsetGridLines : true,
|
||||
calculateBarX : function(datasetCount, datasetIndex, barIndex){
|
||||
//Reusable method for calculating the xPosition of a given bar based on datasetIndex & width of the bar
|
||||
var xWidth = this.calculateBaseWidth(),
|
||||
xAbsolute = this.calculateX(barIndex) - (xWidth/2),
|
||||
barWidth = this.calculateBarWidth(datasetCount);
|
||||
|
||||
return xAbsolute + (barWidth * datasetIndex) + (datasetIndex * options.barDatasetSpacing) + barWidth/2;
|
||||
},
|
||||
calculateBaseWidth : function(){
|
||||
return (this.calculateX(1) - this.calculateX(0)) - (2*options.barValueSpacing);
|
||||
},
|
||||
calculateBarWidth : function(datasetCount){
|
||||
//The padding between datasets is to the right of each bar, providing that there are more than 1 dataset
|
||||
var baseWidth = this.calculateBaseWidth() - ((datasetCount - 1) * options.barDatasetSpacing);
|
||||
|
||||
return (baseWidth / datasetCount);
|
||||
}
|
||||
});
|
||||
|
||||
this.datasets = [];
|
||||
|
||||
//Set up tooltip events on the chart
|
||||
if (this.options.showTooltips){
|
||||
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
|
||||
var activeBars = (evt.type !== 'mouseout') ? this.getBarsAtEvent(evt) : [];
|
||||
|
||||
this.eachBars(function(bar){
|
||||
bar.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
helpers.each(activeBars, function(activeBar){
|
||||
activeBar.fillColor = activeBar.highlightFill;
|
||||
activeBar.strokeColor = activeBar.highlightStroke;
|
||||
});
|
||||
this.showTooltip(activeBars);
|
||||
});
|
||||
}
|
||||
|
||||
//Declare the extension of the default point, to cater for the options passed in to the constructor
|
||||
this.BarClass = Chart.Rectangle.extend({
|
||||
strokeWidth : this.options.barStrokeWidth,
|
||||
showStroke : this.options.barShowStroke,
|
||||
ctx : this.chart.ctx
|
||||
});
|
||||
|
||||
//Iterate through each of the datasets, and build this into a property of the chart
|
||||
helpers.each(data.datasets,function(dataset,datasetIndex){
|
||||
|
||||
var datasetObject = {
|
||||
label : dataset.label || null,
|
||||
fillColor : dataset.fillColor,
|
||||
strokeColor : dataset.strokeColor,
|
||||
bars : []
|
||||
};
|
||||
|
||||
this.datasets.push(datasetObject);
|
||||
|
||||
helpers.each(dataset.data,function(dataPoint,index){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
datasetObject.bars.push(new this.BarClass({
|
||||
value : dataPoint,
|
||||
label : data.labels[index],
|
||||
datasetLabel: dataset.label,
|
||||
strokeColor : dataset.strokeColor,
|
||||
fillColor : dataset.fillColor,
|
||||
highlightFill : dataset.highlightFill || dataset.fillColor,
|
||||
highlightStroke : dataset.highlightStroke || dataset.strokeColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
},this);
|
||||
|
||||
this.buildScale(data.labels);
|
||||
|
||||
this.BarClass.prototype.base = this.scale.endPoint;
|
||||
|
||||
this.eachBars(function(bar, index, datasetIndex){
|
||||
helpers.extend(bar, {
|
||||
width : this.scale.calculateBarWidth(this.datasets.length),
|
||||
x: this.scale.calculateBarX(this.datasets.length, datasetIndex, index),
|
||||
y: this.scale.endPoint
|
||||
});
|
||||
bar.save();
|
||||
}, this);
|
||||
|
||||
this.render();
|
||||
},
|
||||
update : function(){
|
||||
this.scale.update();
|
||||
// Reset any highlight colours before updating.
|
||||
helpers.each(this.activeElements, function(activeElement){
|
||||
activeElement.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
|
||||
this.eachBars(function(bar){
|
||||
bar.save();
|
||||
});
|
||||
this.render();
|
||||
},
|
||||
eachBars : function(callback){
|
||||
helpers.each(this.datasets,function(dataset, datasetIndex){
|
||||
helpers.each(dataset.bars, callback, this, datasetIndex);
|
||||
},this);
|
||||
},
|
||||
getBarsAtEvent : function(e){
|
||||
var barsArray = [],
|
||||
eventPosition = helpers.getRelativePosition(e),
|
||||
datasetIterator = function(dataset){
|
||||
barsArray.push(dataset.bars[barIndex]);
|
||||
},
|
||||
barIndex;
|
||||
|
||||
for (var datasetIndex = 0; datasetIndex < this.datasets.length; datasetIndex++) {
|
||||
for (barIndex = 0; barIndex < this.datasets[datasetIndex].bars.length; barIndex++) {
|
||||
if (this.datasets[datasetIndex].bars[barIndex].inRange(eventPosition.x,eventPosition.y)){
|
||||
helpers.each(this.datasets, datasetIterator);
|
||||
return barsArray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return barsArray;
|
||||
},
|
||||
buildScale : function(labels){
|
||||
var self = this;
|
||||
|
||||
var dataTotal = function(){
|
||||
var values = [];
|
||||
self.eachBars(function(bar){
|
||||
values.push(bar.value);
|
||||
});
|
||||
return values;
|
||||
};
|
||||
|
||||
var scaleOptions = {
|
||||
templateString : this.options.scaleLabel,
|
||||
height : this.chart.height,
|
||||
width : this.chart.width,
|
||||
ctx : this.chart.ctx,
|
||||
textColor : this.options.scaleFontColor,
|
||||
fontSize : this.options.scaleFontSize,
|
||||
fontStyle : this.options.scaleFontStyle,
|
||||
fontFamily : this.options.scaleFontFamily,
|
||||
valuesCount : labels.length,
|
||||
beginAtZero : this.options.scaleBeginAtZero,
|
||||
integersOnly : this.options.scaleIntegersOnly,
|
||||
calculateYRange: function(currentHeight){
|
||||
var updatedRanges = helpers.calculateScaleRange(
|
||||
dataTotal(),
|
||||
currentHeight,
|
||||
this.fontSize,
|
||||
this.beginAtZero,
|
||||
this.integersOnly
|
||||
);
|
||||
helpers.extend(this, updatedRanges);
|
||||
},
|
||||
xLabels : labels,
|
||||
font : helpers.fontString(this.options.scaleFontSize, this.options.scaleFontStyle, this.options.scaleFontFamily),
|
||||
lineWidth : this.options.scaleLineWidth,
|
||||
lineColor : this.options.scaleLineColor,
|
||||
showHorizontalLines : this.options.scaleShowHorizontalLines,
|
||||
showVerticalLines : this.options.scaleShowVerticalLines,
|
||||
gridLineWidth : (this.options.scaleShowGridLines) ? this.options.scaleGridLineWidth : 0,
|
||||
gridLineColor : (this.options.scaleShowGridLines) ? this.options.scaleGridLineColor : "rgba(0,0,0,0)",
|
||||
padding : (this.options.showScale) ? 0 : (this.options.barShowStroke) ? this.options.barStrokeWidth : 0,
|
||||
showLabels : this.options.scaleShowLabels,
|
||||
display : this.options.showScale
|
||||
};
|
||||
|
||||
if (this.options.scaleOverride){
|
||||
helpers.extend(scaleOptions, {
|
||||
calculateYRange: helpers.noop,
|
||||
steps: this.options.scaleSteps,
|
||||
stepValue: this.options.scaleStepWidth,
|
||||
min: this.options.scaleStartValue,
|
||||
max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth)
|
||||
});
|
||||
}
|
||||
|
||||
this.scale = new this.ScaleClass(scaleOptions);
|
||||
},
|
||||
addData : function(valuesArray,label){
|
||||
//Map the values array for each of the datasets
|
||||
helpers.each(valuesArray,function(value,datasetIndex){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
this.datasets[datasetIndex].bars.push(new this.BarClass({
|
||||
value : value,
|
||||
label : label,
|
||||
datasetLabel: this.datasets[datasetIndex].label,
|
||||
x: this.scale.calculateBarX(this.datasets.length, datasetIndex, this.scale.valuesCount+1),
|
||||
y: this.scale.endPoint,
|
||||
width : this.scale.calculateBarWidth(this.datasets.length),
|
||||
base : this.scale.endPoint,
|
||||
strokeColor : this.datasets[datasetIndex].strokeColor,
|
||||
fillColor : this.datasets[datasetIndex].fillColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
this.scale.addXLabel(label);
|
||||
//Then re-render the chart.
|
||||
this.update();
|
||||
},
|
||||
removeData : function(){
|
||||
this.scale.removeXLabel();
|
||||
//Then re-render the chart.
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
dataset.bars.shift();
|
||||
},this);
|
||||
this.update();
|
||||
},
|
||||
reflow : function(){
|
||||
helpers.extend(this.BarClass.prototype,{
|
||||
y: this.scale.endPoint,
|
||||
base : this.scale.endPoint
|
||||
});
|
||||
var newScaleProps = helpers.extend({
|
||||
height : this.chart.height,
|
||||
width : this.chart.width
|
||||
});
|
||||
this.scale.update(newScaleProps);
|
||||
},
|
||||
draw : function(ease){
|
||||
var easingDecimal = ease || 1;
|
||||
this.clear();
|
||||
|
||||
var ctx = this.chart.ctx;
|
||||
|
||||
this.scale.draw(easingDecimal);
|
||||
|
||||
//Draw all the bars for each dataset
|
||||
helpers.each(this.datasets,function(dataset,datasetIndex){
|
||||
helpers.each(dataset.bars,function(bar,index){
|
||||
if (bar.hasValue()){
|
||||
bar.base = this.scale.endPoint;
|
||||
//Transition then draw
|
||||
bar.transition({
|
||||
x : this.scale.calculateBarX(this.datasets.length, datasetIndex, index),
|
||||
y : this.scale.calculateY(bar.value),
|
||||
width : this.scale.calculateBarWidth(this.datasets.length)
|
||||
}, easingDecimal).draw();
|
||||
}
|
||||
},this);
|
||||
|
||||
},this);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}).call(this);
|
File diff suppressed because it is too large
Load Diff
@ -1,190 +0,0 @@
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var root = this,
|
||||
Chart = root.Chart,
|
||||
//Cache a local reference to Chart.helpers
|
||||
helpers = Chart.helpers;
|
||||
|
||||
var defaultConfig = {
|
||||
//Boolean - Whether we should show a stroke on each segment
|
||||
segmentShowStroke : true,
|
||||
|
||||
//String - The colour of each segment stroke
|
||||
segmentStrokeColor : "#fff",
|
||||
|
||||
//Number - The width of each segment stroke
|
||||
segmentStrokeWidth : 2,
|
||||
|
||||
//The percentage of the chart that we cut out of the middle.
|
||||
percentageInnerCutout : 50,
|
||||
|
||||
//Number - Amount of animation steps
|
||||
animationSteps : 100,
|
||||
|
||||
//String - Animation easing effect
|
||||
animationEasing : "easeOutBounce",
|
||||
|
||||
//Boolean - Whether we animate the rotation of the Doughnut
|
||||
animateRotate : true,
|
||||
|
||||
//Boolean - Whether we animate scaling the Doughnut from the centre
|
||||
animateScale : false,
|
||||
|
||||
//String - A legend template
|
||||
legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"><%if(segments[i].label){%><%=segments[i].label%><%}%></span></li><%}%></ul>"
|
||||
|
||||
};
|
||||
|
||||
Chart.Type.extend({
|
||||
//Passing in a name registers this chart in the Chart namespace
|
||||
name: "Doughnut",
|
||||
//Providing a defaults will also register the deafults in the chart namespace
|
||||
defaults : defaultConfig,
|
||||
//Initialize is fired when the chart is initialized - Data is passed in as a parameter
|
||||
//Config is automatically merged by the core of Chart.js, and is available at this.options
|
||||
initialize: function(data){
|
||||
|
||||
//Declare segments as a static property to prevent inheriting across the Chart type prototype
|
||||
this.segments = [];
|
||||
this.outerRadius = (helpers.min([this.chart.width,this.chart.height]) - this.options.segmentStrokeWidth/2)/2;
|
||||
|
||||
this.SegmentArc = Chart.Arc.extend({
|
||||
ctx : this.chart.ctx,
|
||||
x : this.chart.width/2,
|
||||
y : this.chart.height/2
|
||||
});
|
||||
|
||||
//Set up tooltip events on the chart
|
||||
if (this.options.showTooltips){
|
||||
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
|
||||
var activeSegments = (evt.type !== 'mouseout') ? this.getSegmentsAtEvent(evt) : [];
|
||||
|
||||
helpers.each(this.segments,function(segment){
|
||||
segment.restore(["fillColor"]);
|
||||
});
|
||||
helpers.each(activeSegments,function(activeSegment){
|
||||
activeSegment.fillColor = activeSegment.highlightColor;
|
||||
});
|
||||
this.showTooltip(activeSegments);
|
||||
});
|
||||
}
|
||||
this.calculateTotal(data);
|
||||
|
||||
helpers.each(data,function(datapoint, index){
|
||||
if (!datapoint.color) {
|
||||
datapoint.color = 'hsl(' + (360 * index / data.length) + ', 100%, 50%)';
|
||||
}
|
||||
this.addData(datapoint, index, true);
|
||||
},this);
|
||||
|
||||
this.render();
|
||||
},
|
||||
getSegmentsAtEvent : function(e){
|
||||
var segmentsArray = [];
|
||||
|
||||
var location = helpers.getRelativePosition(e);
|
||||
|
||||
helpers.each(this.segments,function(segment){
|
||||
if (segment.inRange(location.x,location.y)) segmentsArray.push(segment);
|
||||
},this);
|
||||
return segmentsArray;
|
||||
},
|
||||
addData : function(segment, atIndex, silent){
|
||||
var index = atIndex !== undefined ? atIndex : this.segments.length;
|
||||
this.segments.splice(index, 0, new this.SegmentArc({
|
||||
value : segment.value,
|
||||
outerRadius : (this.options.animateScale) ? 0 : this.outerRadius,
|
||||
innerRadius : (this.options.animateScale) ? 0 : (this.outerRadius/100) * this.options.percentageInnerCutout,
|
||||
fillColor : segment.color,
|
||||
highlightColor : segment.highlight || segment.color,
|
||||
showStroke : this.options.segmentShowStroke,
|
||||
strokeWidth : this.options.segmentStrokeWidth,
|
||||
strokeColor : this.options.segmentStrokeColor,
|
||||
startAngle : Math.PI * 1.5,
|
||||
circumference : (this.options.animateRotate) ? 0 : this.calculateCircumference(segment.value),
|
||||
label : segment.label
|
||||
}));
|
||||
if (!silent){
|
||||
this.reflow();
|
||||
this.update();
|
||||
}
|
||||
},
|
||||
calculateCircumference : function(value) {
|
||||
if ( this.total > 0 ) {
|
||||
return (Math.PI*2)*(value / this.total);
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
calculateTotal : function(data){
|
||||
this.total = 0;
|
||||
helpers.each(data,function(segment){
|
||||
this.total += Math.abs(segment.value);
|
||||
},this);
|
||||
},
|
||||
update : function(){
|
||||
this.calculateTotal(this.segments);
|
||||
|
||||
// Reset any highlight colours before updating.
|
||||
helpers.each(this.activeElements, function(activeElement){
|
||||
activeElement.restore(['fillColor']);
|
||||
});
|
||||
|
||||
helpers.each(this.segments,function(segment){
|
||||
segment.save();
|
||||
});
|
||||
this.render();
|
||||
},
|
||||
|
||||
removeData: function(atIndex){
|
||||
var indexToDelete = (helpers.isNumber(atIndex)) ? atIndex : this.segments.length-1;
|
||||
this.segments.splice(indexToDelete, 1);
|
||||
this.reflow();
|
||||
this.update();
|
||||
},
|
||||
|
||||
reflow : function(){
|
||||
helpers.extend(this.SegmentArc.prototype,{
|
||||
x : this.chart.width/2,
|
||||
y : this.chart.height/2
|
||||
});
|
||||
this.outerRadius = (helpers.min([this.chart.width,this.chart.height]) - this.options.segmentStrokeWidth/2)/2;
|
||||
helpers.each(this.segments, function(segment){
|
||||
segment.update({
|
||||
outerRadius : this.outerRadius,
|
||||
innerRadius : (this.outerRadius/100) * this.options.percentageInnerCutout
|
||||
});
|
||||
}, this);
|
||||
},
|
||||
draw : function(easeDecimal){
|
||||
var animDecimal = (easeDecimal) ? easeDecimal : 1;
|
||||
this.clear();
|
||||
helpers.each(this.segments,function(segment,index){
|
||||
segment.transition({
|
||||
circumference : this.calculateCircumference(segment.value),
|
||||
outerRadius : this.outerRadius,
|
||||
innerRadius : (this.outerRadius/100) * this.options.percentageInnerCutout
|
||||
},animDecimal);
|
||||
|
||||
segment.endAngle = segment.startAngle + segment.circumference;
|
||||
|
||||
segment.draw();
|
||||
if (index === 0){
|
||||
segment.startAngle = Math.PI * 1.5;
|
||||
}
|
||||
//Check to see if it's the last segment, if not get the next and update the start angle
|
||||
if (index < this.segments.length-1){
|
||||
this.segments[index+1].startAngle = segment.endAngle;
|
||||
}
|
||||
},this);
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
Chart.types.Doughnut.extend({
|
||||
name : "Pie",
|
||||
defaults : helpers.merge(defaultConfig,{percentageInnerCutout : 0})
|
||||
});
|
||||
|
||||
}).call(this);
|
@ -1,504 +0,0 @@
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var root = this,
|
||||
Chart = root.Chart,
|
||||
helpers = Chart.helpers;
|
||||
|
||||
|
||||
var defaultConfig = {
|
||||
//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
|
||||
scaleBeginAtZero : true,
|
||||
|
||||
//Boolean - Whether grid lines are shown across the chart
|
||||
scaleShowGridLines : true,
|
||||
|
||||
//String - Colour of the grid lines
|
||||
scaleGridLineColor : "rgba(0,0,0,.05)",
|
||||
|
||||
//Number - Width of the grid lines
|
||||
scaleGridLineWidth : 1,
|
||||
|
||||
//Boolean - Whether to show horizontal lines (except X axis)
|
||||
scaleShowHorizontalLines: true,
|
||||
|
||||
//Boolean - Whether to show vertical lines (except Y axis)
|
||||
scaleShowVerticalLines: true,
|
||||
|
||||
//Boolean - If there is a stroke on each bar
|
||||
barShowStroke : true,
|
||||
|
||||
//Number - Pixel width of the bar stroke
|
||||
barStrokeWidth : 2,
|
||||
|
||||
//Number - Spacing between each of the X value sets
|
||||
barValueSpacing : 5,
|
||||
|
||||
//Number - Spacing between data sets within X values
|
||||
barDatasetSpacing : 1,
|
||||
|
||||
//String - A legend template
|
||||
legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].fillColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>"
|
||||
|
||||
};
|
||||
|
||||
Chart.HorizontalRectangle = Chart.Element.extend({
|
||||
draw : function(){
|
||||
var ctx = this.ctx,
|
||||
halfHeight = this.height/2,
|
||||
top = this.y - halfHeight,
|
||||
bottom = this.y + halfHeight,
|
||||
right = this.left - (this.left - this.x),
|
||||
halfStroke = this.strokeWidth / 2;
|
||||
|
||||
// Canvas doesn't allow us to stroke inside the width so we can
|
||||
// adjust the sizes to fit if we're setting a stroke on the line
|
||||
if (this.showStroke){
|
||||
top += halfStroke;
|
||||
bottom -= halfStroke;
|
||||
right += halfStroke;
|
||||
}
|
||||
|
||||
ctx.beginPath();
|
||||
|
||||
ctx.fillStyle = this.fillColor;
|
||||
ctx.strokeStyle = this.strokeColor;
|
||||
ctx.lineWidth = this.strokeWidth;
|
||||
|
||||
// It'd be nice to keep this class totally generic to any rectangle
|
||||
// and simply specify which border to miss out.
|
||||
ctx.moveTo(this.left, top);
|
||||
ctx.lineTo(right, top);
|
||||
ctx.lineTo(right, bottom);
|
||||
ctx.lineTo(this.left, bottom);
|
||||
ctx.fill();
|
||||
if (this.showStroke){
|
||||
ctx.stroke();
|
||||
}
|
||||
},
|
||||
inRange : function(chartX,chartY){
|
||||
return (chartX >= this.left && chartX <= this.x && chartY >= (this.y - this.height/2) && chartY <= (this.y + this.height/2));
|
||||
}
|
||||
});
|
||||
|
||||
Chart.Type.extend({
|
||||
name: "HorizontalBar",
|
||||
defaults : defaultConfig,
|
||||
initialize: function(data){
|
||||
|
||||
//Expose options as a scope variable here so we can access it in the ScaleClass
|
||||
var options = this.options;
|
||||
|
||||
this.ScaleClass = Chart.Scale.extend({
|
||||
offsetGridLines : true,
|
||||
calculateBarX : function(datasetCount, datasetIndex, barIndex){
|
||||
//Reusable method for calculating the xPosition of a given bar based on datasetIndex & width of the bar
|
||||
var xWidth = this.calculateBaseWidth(),
|
||||
xAbsolute = this.calculateX(barIndex) - (xWidth/2),
|
||||
barWidth = this.calculateBarWidth(datasetCount);
|
||||
|
||||
return xAbsolute + (barWidth * datasetIndex) + (datasetIndex * options.barDatasetSpacing) + barWidth/2;
|
||||
},
|
||||
calculateBaseWidth : function(){
|
||||
return (this.calculateX(1) - this.calculateX(0)) - (2*options.barValueSpacing);
|
||||
},
|
||||
calculateBarWidth : function(datasetCount){
|
||||
//The padding between datasets is to the right of each bar, providing that there are more than 1 dataset
|
||||
var baseWidth = this.calculateBaseWidth() - ((datasetCount - 1) * options.barDatasetSpacing);
|
||||
|
||||
return (baseWidth / datasetCount);
|
||||
},
|
||||
|
||||
calculateBaseHeight : function(){
|
||||
return ((this.endPoint - this.startPoint) / this.yLabels.length) - (2*options.barValueSpacing);
|
||||
},
|
||||
calculateBarHeight : function(datasetCount){
|
||||
//The padding between datasets is to the right of each bar, providing that there are more than 1 dataset
|
||||
var baseHeight = this.calculateBaseHeight() - ((datasetCount) * options.barDatasetSpacing);
|
||||
|
||||
return (baseHeight / datasetCount);
|
||||
},
|
||||
|
||||
calculateXInvertXY : function(value) {
|
||||
var scalingFactor = (this.width - Math.round(this.xScalePaddingLeft) - this.xScalePaddingRight) / (this.max - this.min);
|
||||
return Math.round(this.xScalePaddingLeft) + (scalingFactor * (value - this.min));
|
||||
},
|
||||
|
||||
calculateYInvertXY : function(index){
|
||||
return index * ((this.startPoint - this.endPoint) / (this.yLabels.length));
|
||||
},
|
||||
|
||||
calculateBarY : function(datasetCount, datasetIndex, barIndex){
|
||||
//Reusable method for calculating the yPosition of a given bar based on datasetIndex & height of the bar
|
||||
var yHeight = this.calculateBaseHeight(),
|
||||
yAbsolute = (this.endPoint + this.calculateYInvertXY(barIndex) - (yHeight / 2)) - 5,
|
||||
barHeight = this.calculateBarHeight(datasetCount);
|
||||
if (datasetCount > 1) yAbsolute = yAbsolute + (barHeight * (datasetIndex - 1)) - (datasetIndex * options.barDatasetSpacing) + barHeight/2;
|
||||
return yAbsolute;
|
||||
},
|
||||
|
||||
buildCalculatedLabels : function() {
|
||||
this.calculatedLabels = [];
|
||||
|
||||
var stepDecimalPlaces = helpers.getDecimalPlaces(this.stepValue);
|
||||
|
||||
for (var i=0; i<=this.steps; i++){
|
||||
this.calculatedLabels.push(helpers.template(this.templateString,{value:(this.min + (i * this.stepValue)).toFixed(stepDecimalPlaces)}));
|
||||
}
|
||||
},
|
||||
|
||||
buildYLabels : function(){
|
||||
this.buildYLabelCounter = (typeof this.buildYLabelCounter === 'undefined') ? 0 : this.buildYLabelCounter + 1;
|
||||
this.buildCalculatedLabels();
|
||||
if(this.buildYLabelCounter === 0) this.yLabels = this.xLabels;
|
||||
this.xLabels = this.calculatedLabels;
|
||||
this.yLabelWidth = (this.display && this.showLabels) ? helpers.longestText(this.ctx,this.font,this.yLabels) : 0;
|
||||
},
|
||||
|
||||
calculateX : function(index){
|
||||
var isRotated = (this.xLabelRotation > 0),
|
||||
innerWidth = this.width - (this.xScalePaddingLeft + this.xScalePaddingRight),
|
||||
valueWidth = innerWidth/(this.steps - ((this.offsetGridLines) ? 0 : 1)),
|
||||
valueOffset = (valueWidth * index) + this.xScalePaddingLeft;
|
||||
|
||||
if (this.offsetGridLines){
|
||||
valueOffset += (valueWidth/2);
|
||||
}
|
||||
|
||||
return Math.round(valueOffset);
|
||||
},
|
||||
|
||||
draw : function(){
|
||||
var ctx = this.ctx,
|
||||
yLabelGap = (this.endPoint - this.startPoint) / this.yLabels.length,
|
||||
xStart = Math.round(this.xScalePaddingLeft);
|
||||
if (this.display){
|
||||
ctx.fillStyle = this.textColor;
|
||||
ctx.font = this.font;
|
||||
helpers.each(this.yLabels,function(labelString,index){
|
||||
var yLabelCenter = this.endPoint - (yLabelGap * index),
|
||||
linePositionY = Math.round(yLabelCenter),
|
||||
drawHorizontalLine = this.showHorizontalLines;
|
||||
|
||||
yLabelCenter -= yLabelGap / 2;
|
||||
|
||||
ctx.textAlign = "right";
|
||||
ctx.textBaseline = "middle";
|
||||
if (this.showLabels){
|
||||
ctx.fillText(labelString,xStart - 10,yLabelCenter);
|
||||
}
|
||||
|
||||
if (index === 0 && !drawHorizontalLine) {
|
||||
drawHorizontalLine = true;
|
||||
}
|
||||
if (drawHorizontalLine){
|
||||
ctx.beginPath();
|
||||
}
|
||||
if (index > 0){
|
||||
// This is a grid line in the centre, so drop that
|
||||
ctx.lineWidth = this.gridLineWidth;
|
||||
ctx.strokeStyle = this.gridLineColor;
|
||||
} else {
|
||||
// This is the first line on the scale
|
||||
ctx.lineWidth = this.lineWidth;
|
||||
ctx.strokeStyle = this.lineColor;
|
||||
}
|
||||
|
||||
linePositionY += helpers.aliasPixel(ctx.lineWidth);
|
||||
|
||||
if(drawHorizontalLine){
|
||||
ctx.moveTo(xStart, linePositionY);
|
||||
ctx.lineTo(this.width, linePositionY);
|
||||
ctx.stroke();
|
||||
ctx.closePath();
|
||||
}
|
||||
|
||||
ctx.lineWidth = this.lineWidth;
|
||||
ctx.strokeStyle = this.lineColor;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(xStart - 5, linePositionY);
|
||||
ctx.lineTo(xStart, linePositionY);
|
||||
ctx.stroke();
|
||||
ctx.closePath();
|
||||
|
||||
},this);
|
||||
|
||||
helpers.each(this.xLabels,function(label,index){
|
||||
var width = this.calculateX(1) - this.calculateX(0);
|
||||
var xPos = this.calculateX(index) + helpers.aliasPixel(this.lineWidth) - (width / 2),
|
||||
// Check to see if line/bar here and decide where to place the line
|
||||
linePos = this.calculateX(index - (this.offsetGridLines ? 0.5 : 0)) + helpers.aliasPixel(this.lineWidth),
|
||||
isRotated = (this.xLabelRotation > 0);
|
||||
|
||||
ctx.beginPath();
|
||||
|
||||
if (index > 0){
|
||||
// This is a grid line in the centre, so drop that
|
||||
ctx.lineWidth = this.gridLineWidth;
|
||||
ctx.strokeStyle = this.gridLineColor;
|
||||
} else {
|
||||
// This is the first line on the scale
|
||||
ctx.lineWidth = this.lineWidth;
|
||||
ctx.strokeStyle = this.lineColor;
|
||||
}
|
||||
ctx.moveTo(linePos,this.endPoint);
|
||||
ctx.lineTo(linePos,this.startPoint - 3);
|
||||
ctx.stroke();
|
||||
ctx.closePath();
|
||||
|
||||
|
||||
ctx.lineWidth = this.lineWidth;
|
||||
ctx.strokeStyle = this.lineColor;
|
||||
|
||||
|
||||
// Small lines at the bottom of the base grid line
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(linePos,this.endPoint);
|
||||
ctx.lineTo(linePos,this.endPoint + 5);
|
||||
ctx.stroke();
|
||||
ctx.closePath();
|
||||
|
||||
ctx.save();
|
||||
ctx.translate(xPos,(isRotated) ? this.endPoint + 12 : this.endPoint + 8);
|
||||
ctx.rotate(helpers.radians(this.xLabelRotation)*-1);
|
||||
ctx.font = this.font;
|
||||
ctx.textAlign = (isRotated) ? "right" : "center";
|
||||
ctx.textBaseline = (isRotated) ? "middle" : "top";
|
||||
ctx.fillText(label, 0, 0);
|
||||
ctx.restore();
|
||||
},this);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
this.datasets = [];
|
||||
|
||||
//Set up tooltip events on the chart
|
||||
if (this.options.showTooltips){
|
||||
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
|
||||
var activeBars = (evt.type !== 'mouseout') ? this.getBarsAtEvent(evt) : [];
|
||||
|
||||
this.eachBars(function(bar){
|
||||
bar.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
helpers.each(activeBars, function(activeBar){
|
||||
activeBar.fillColor = activeBar.highlightFill;
|
||||
activeBar.strokeColor = activeBar.highlightStroke;
|
||||
});
|
||||
this.showTooltip(activeBars);
|
||||
});
|
||||
}
|
||||
|
||||
//Declare the extension of the default point, to cater for the options passed in to the constructor
|
||||
this.BarClass = Chart.HorizontalRectangle.extend({
|
||||
strokeWidth : this.options.barStrokeWidth,
|
||||
showStroke : this.options.barShowStroke,
|
||||
ctx : this.chart.ctx
|
||||
});
|
||||
|
||||
//Iterate through each of the datasets, and build this into a property of the chart
|
||||
helpers.each(data.datasets,function(dataset,datasetIndex){
|
||||
|
||||
var datasetObject = {
|
||||
label : dataset.label || null,
|
||||
fillColor : dataset.fillColor,
|
||||
strokeColor : dataset.strokeColor,
|
||||
bars : []
|
||||
};
|
||||
|
||||
this.datasets.push(datasetObject);
|
||||
|
||||
helpers.each(dataset.data,function(dataPoint,index){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
datasetObject.bars.push(new this.BarClass({
|
||||
value : dataPoint,
|
||||
label : data.labels[index],
|
||||
datasetLabel: dataset.label,
|
||||
strokeColor : dataset.strokeColor,
|
||||
fillColor : dataset.fillColor,
|
||||
highlightFill : dataset.highlightFill || dataset.fillColor,
|
||||
highlightStroke : dataset.highlightStroke || dataset.strokeColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
},this);
|
||||
|
||||
this.buildScale(data.labels);
|
||||
|
||||
this.BarClass.prototype.left = Math.round(this.scale.xScalePaddingLeft);
|
||||
|
||||
this.eachBars(function(bar, index, datasetIndex){
|
||||
helpers.extend(bar, {
|
||||
x: Math.round(this.scale.xScalePaddingLeft),
|
||||
y : this.scale.calculateBarY(this.datasets.length, datasetIndex, index),
|
||||
height : this.scale.calculateBarHeight(this.datasets.length)
|
||||
});
|
||||
bar.save();
|
||||
}, this);
|
||||
|
||||
this.render();
|
||||
},
|
||||
update : function(){
|
||||
this.scale.update();
|
||||
// Reset any highlight colours before updating.
|
||||
helpers.each(this.activeElements, function(activeElement){
|
||||
activeElement.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
|
||||
this.eachBars(function(bar){
|
||||
bar.save();
|
||||
});
|
||||
this.render();
|
||||
},
|
||||
eachBars : function(callback){
|
||||
helpers.each(this.datasets,function(dataset, datasetIndex){
|
||||
helpers.each(dataset.bars, callback, this, datasetIndex);
|
||||
},this);
|
||||
},
|
||||
getBarsAtEvent : function(e){
|
||||
var barsArray = [],
|
||||
eventPosition = helpers.getRelativePosition(e),
|
||||
datasetIterator = function(dataset){
|
||||
barsArray.push(dataset.bars[barIndex]);
|
||||
},
|
||||
barIndex;
|
||||
|
||||
for (var datasetIndex = 0; datasetIndex < this.datasets.length; datasetIndex++) {
|
||||
for (barIndex = 0; barIndex < this.datasets[datasetIndex].bars.length; barIndex++) {
|
||||
if (this.datasets[datasetIndex].bars[barIndex].inRange(eventPosition.x,eventPosition.y)){
|
||||
helpers.each(this.datasets, datasetIterator);
|
||||
return barsArray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return barsArray;
|
||||
},
|
||||
buildScale : function(labels){
|
||||
var self = this;
|
||||
|
||||
var dataTotal = function(){
|
||||
var values = [];
|
||||
self.eachBars(function(bar){
|
||||
values.push(bar.value);
|
||||
});
|
||||
return values;
|
||||
};
|
||||
|
||||
var scaleOptions = {
|
||||
templateString : this.options.scaleLabel,
|
||||
height : this.chart.height,
|
||||
width : this.chart.width,
|
||||
ctx : this.chart.ctx,
|
||||
textColor : this.options.scaleFontColor,
|
||||
fontSize : this.options.scaleFontSize,
|
||||
fontStyle : this.options.scaleFontStyle,
|
||||
fontFamily : this.options.scaleFontFamily,
|
||||
valuesCount : labels.length,
|
||||
beginAtZero : this.options.scaleBeginAtZero,
|
||||
integersOnly : this.options.scaleIntegersOnly,
|
||||
calculateYRange: function(currentHeight){
|
||||
var updatedRanges = helpers.calculateScaleRange(
|
||||
dataTotal(),
|
||||
currentHeight,
|
||||
this.fontSize,
|
||||
this.beginAtZero,
|
||||
this.integersOnly
|
||||
);
|
||||
helpers.extend(this, updatedRanges);
|
||||
},
|
||||
xLabels : labels,
|
||||
font : helpers.fontString(this.options.scaleFontSize, this.options.scaleFontStyle, this.options.scaleFontFamily),
|
||||
lineWidth : this.options.scaleLineWidth,
|
||||
lineColor : this.options.scaleLineColor,
|
||||
showHorizontalLines : this.options.scaleShowHorizontalLines,
|
||||
showVerticalLines : this.options.scaleShowVerticalLines,
|
||||
gridLineWidth : (this.options.scaleShowGridLines) ? this.options.scaleGridLineWidth : 0,
|
||||
gridLineColor : (this.options.scaleShowGridLines) ? this.options.scaleGridLineColor : "rgba(0,0,0,0)",
|
||||
padding : (this.options.showScale) ? 0 : (this.options.barShowStroke) ? this.options.barStrokeWidth : 0,
|
||||
showLabels : this.options.scaleShowLabels,
|
||||
display : this.options.showScale
|
||||
};
|
||||
|
||||
if (this.options.scaleOverride){
|
||||
helpers.extend(scaleOptions, {
|
||||
calculateYRange: helpers.noop,
|
||||
steps: this.options.scaleSteps,
|
||||
stepValue: this.options.scaleStepWidth,
|
||||
min: this.options.scaleStartValue,
|
||||
max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth)
|
||||
});
|
||||
}
|
||||
|
||||
this.scale = new this.ScaleClass(scaleOptions);
|
||||
},
|
||||
addData : function(valuesArray,label){
|
||||
//Map the values array for each of the datasets
|
||||
helpers.each(valuesArray,function(value,datasetIndex){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
this.datasets[datasetIndex].bars.push(new this.BarClass({
|
||||
value : value,
|
||||
label : label,
|
||||
x: this.scale.calculateBarX(this.datasets.length, datasetIndex, this.scale.valuesCount+1),
|
||||
y: this.scale.endPoint,
|
||||
width : this.scale.calculateBarWidth(this.datasets.length),
|
||||
base : this.scale.endPoint,
|
||||
strokeColor : this.datasets[datasetIndex].strokeColor,
|
||||
fillColor : this.datasets[datasetIndex].fillColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
this.scale.addXLabel(label);
|
||||
//Then re-render the chart.
|
||||
this.update();
|
||||
},
|
||||
removeData : function(){
|
||||
this.scale.removeXLabel();
|
||||
//Then re-render the chart.
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
dataset.bars.shift();
|
||||
},this);
|
||||
this.update();
|
||||
},
|
||||
reflow : function(){
|
||||
helpers.extend(this.BarClass.prototype,{
|
||||
y: this.scale.endPoint,
|
||||
base : this.scale.endPoint
|
||||
});
|
||||
var newScaleProps = helpers.extend({
|
||||
height : this.chart.height,
|
||||
width : this.chart.width
|
||||
});
|
||||
|
||||
this.scale.update(newScaleProps);
|
||||
},
|
||||
draw : function(ease){
|
||||
var easingDecimal = ease || 1;
|
||||
this.clear();
|
||||
|
||||
var ctx = this.chart.ctx;
|
||||
|
||||
this.scale.draw(easingDecimal);
|
||||
|
||||
//Draw all the bars for each dataset
|
||||
helpers.each(this.datasets,function(dataset,datasetIndex){
|
||||
helpers.each(dataset.bars,function(bar,index){
|
||||
if (bar.hasValue()){
|
||||
bar.left = Math.round(this.scale.xScalePaddingLeft);
|
||||
//Transition then draw
|
||||
bar.transition({
|
||||
x : this.scale.calculateXInvertXY(bar.value),
|
||||
y : this.scale.calculateBarY(this.datasets.length, datasetIndex, index),
|
||||
height : this.scale.calculateBarHeight(this.datasets.length)
|
||||
}, easingDecimal).draw();
|
||||
}
|
||||
},this);
|
||||
|
||||
},this);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}).call(this);
|
@ -1,383 +0,0 @@
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var root = this,
|
||||
Chart = root.Chart,
|
||||
helpers = Chart.helpers;
|
||||
|
||||
var defaultConfig = {
|
||||
|
||||
///Boolean - Whether grid lines are shown across the chart
|
||||
scaleShowGridLines : true,
|
||||
|
||||
//String - Colour of the grid lines
|
||||
scaleGridLineColor : "rgba(0,0,0,.05)",
|
||||
|
||||
//Number - Width of the grid lines
|
||||
scaleGridLineWidth : 1,
|
||||
|
||||
//Boolean - Whether to show horizontal lines (except X axis)
|
||||
scaleShowHorizontalLines: true,
|
||||
|
||||
//Boolean - Whether to show vertical lines (except Y axis)
|
||||
scaleShowVerticalLines: true,
|
||||
|
||||
//Boolean - Whether the line is curved between points
|
||||
bezierCurve : true,
|
||||
|
||||
//Number - Tension of the bezier curve between points
|
||||
bezierCurveTension : 0.4,
|
||||
|
||||
//Boolean - Whether to show a dot for each point
|
||||
pointDot : true,
|
||||
|
||||
//Number - Radius of each point dot in pixels
|
||||
pointDotRadius : 4,
|
||||
|
||||
//Number - Pixel width of point dot stroke
|
||||
pointDotStrokeWidth : 1,
|
||||
|
||||
//Number - amount extra to add to the radius to cater for hit detection outside the drawn point
|
||||
pointHitDetectionRadius : 20,
|
||||
|
||||
//Boolean - Whether to show a stroke for datasets
|
||||
datasetStroke : true,
|
||||
|
||||
//Number - Pixel width of dataset stroke
|
||||
datasetStrokeWidth : 2,
|
||||
|
||||
//Boolean - Whether to fill the dataset with a colour
|
||||
datasetFill : true,
|
||||
|
||||
//String - A legend template
|
||||
legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].strokeColor%>\"><%if(datasets[i].label){%><%=datasets[i].label%><%}%></span></li><%}%></ul>",
|
||||
|
||||
//Boolean - Whether to horizontally center the label and point dot inside the grid
|
||||
offsetGridLines : false
|
||||
|
||||
};
|
||||
|
||||
|
||||
Chart.Type.extend({
|
||||
name: "Line",
|
||||
defaults : defaultConfig,
|
||||
initialize: function(data){
|
||||
//Declare the extension of the default point, to cater for the options passed in to the constructor
|
||||
this.PointClass = Chart.Point.extend({
|
||||
offsetGridLines : this.options.offsetGridLines,
|
||||
strokeWidth : this.options.pointDotStrokeWidth,
|
||||
radius : this.options.pointDotRadius,
|
||||
display: this.options.pointDot,
|
||||
hitDetectionRadius : this.options.pointHitDetectionRadius,
|
||||
ctx : this.chart.ctx,
|
||||
inRange : function(mouseX){
|
||||
return (Math.pow(mouseX-this.x, 2) < Math.pow(this.radius + this.hitDetectionRadius,2));
|
||||
}
|
||||
});
|
||||
|
||||
this.datasets = [];
|
||||
|
||||
//Set up tooltip events on the chart
|
||||
if (this.options.showTooltips){
|
||||
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
|
||||
var activePoints = (evt.type !== 'mouseout') ? this.getPointsAtEvent(evt) : [];
|
||||
this.eachPoints(function(point){
|
||||
point.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
helpers.each(activePoints, function(activePoint){
|
||||
activePoint.fillColor = activePoint.highlightFill;
|
||||
activePoint.strokeColor = activePoint.highlightStroke;
|
||||
});
|
||||
this.showTooltip(activePoints);
|
||||
});
|
||||
}
|
||||
|
||||
//Iterate through each of the datasets, and build this into a property of the chart
|
||||
helpers.each(data.datasets,function(dataset){
|
||||
|
||||
var datasetObject = {
|
||||
label : dataset.label || null,
|
||||
fillColor : dataset.fillColor,
|
||||
strokeColor : dataset.strokeColor,
|
||||
pointColor : dataset.pointColor,
|
||||
pointStrokeColor : dataset.pointStrokeColor,
|
||||
points : []
|
||||
};
|
||||
|
||||
this.datasets.push(datasetObject);
|
||||
|
||||
|
||||
helpers.each(dataset.data,function(dataPoint,index){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
datasetObject.points.push(new this.PointClass({
|
||||
value : dataPoint,
|
||||
label : data.labels[index],
|
||||
datasetLabel: dataset.label,
|
||||
strokeColor : dataset.pointStrokeColor,
|
||||
fillColor : dataset.pointColor,
|
||||
highlightFill : dataset.pointHighlightFill || dataset.pointColor,
|
||||
highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
this.buildScale(data.labels);
|
||||
|
||||
|
||||
this.eachPoints(function(point, index){
|
||||
helpers.extend(point, {
|
||||
x: this.scale.calculateX(index),
|
||||
y: this.scale.endPoint
|
||||
});
|
||||
point.save();
|
||||
}, this);
|
||||
|
||||
},this);
|
||||
|
||||
|
||||
this.render();
|
||||
},
|
||||
update : function(){
|
||||
this.scale.update();
|
||||
// Reset any highlight colours before updating.
|
||||
helpers.each(this.activeElements, function(activeElement){
|
||||
activeElement.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
this.eachPoints(function(point){
|
||||
point.save();
|
||||
});
|
||||
this.render();
|
||||
},
|
||||
eachPoints : function(callback){
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
helpers.each(dataset.points,callback,this);
|
||||
},this);
|
||||
},
|
||||
getPointsAtEvent : function(e){
|
||||
var pointsArray = [],
|
||||
eventPosition = helpers.getRelativePosition(e);
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
helpers.each(dataset.points,function(point){
|
||||
if (point.inRange(eventPosition.x,eventPosition.y)) pointsArray.push(point);
|
||||
});
|
||||
},this);
|
||||
return pointsArray;
|
||||
},
|
||||
buildScale : function(labels){
|
||||
var self = this;
|
||||
|
||||
var dataTotal = function(){
|
||||
var values = [];
|
||||
self.eachPoints(function(point){
|
||||
values.push(point.value);
|
||||
});
|
||||
|
||||
return values;
|
||||
};
|
||||
|
||||
var scaleOptions = {
|
||||
templateString : this.options.scaleLabel,
|
||||
height : this.chart.height,
|
||||
width : this.chart.width,
|
||||
ctx : this.chart.ctx,
|
||||
textColor : this.options.scaleFontColor,
|
||||
offsetGridLines : this.options.offsetGridLines,
|
||||
fontSize : this.options.scaleFontSize,
|
||||
fontStyle : this.options.scaleFontStyle,
|
||||
fontFamily : this.options.scaleFontFamily,
|
||||
valuesCount : labels.length,
|
||||
beginAtZero : this.options.scaleBeginAtZero,
|
||||
integersOnly : this.options.scaleIntegersOnly,
|
||||
calculateYRange : function(currentHeight){
|
||||
var updatedRanges = helpers.calculateScaleRange(
|
||||
dataTotal(),
|
||||
currentHeight,
|
||||
this.fontSize,
|
||||
this.beginAtZero,
|
||||
this.integersOnly
|
||||
);
|
||||
helpers.extend(this, updatedRanges);
|
||||
},
|
||||
xLabels : labels,
|
||||
font : helpers.fontString(this.options.scaleFontSize, this.options.scaleFontStyle, this.options.scaleFontFamily),
|
||||
lineWidth : this.options.scaleLineWidth,
|
||||
lineColor : this.options.scaleLineColor,
|
||||
showHorizontalLines : this.options.scaleShowHorizontalLines,
|
||||
showVerticalLines : this.options.scaleShowVerticalLines,
|
||||
gridLineWidth : (this.options.scaleShowGridLines) ? this.options.scaleGridLineWidth : 0,
|
||||
gridLineColor : (this.options.scaleShowGridLines) ? this.options.scaleGridLineColor : "rgba(0,0,0,0)",
|
||||
padding: (this.options.showScale) ? 0 : this.options.pointDotRadius + this.options.pointDotStrokeWidth,
|
||||
showLabels : this.options.scaleShowLabels,
|
||||
display : this.options.showScale
|
||||
};
|
||||
|
||||
if (this.options.scaleOverride){
|
||||
helpers.extend(scaleOptions, {
|
||||
calculateYRange: helpers.noop,
|
||||
steps: this.options.scaleSteps,
|
||||
stepValue: this.options.scaleStepWidth,
|
||||
min: this.options.scaleStartValue,
|
||||
max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth)
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
this.scale = new Chart.Scale(scaleOptions);
|
||||
},
|
||||
addData : function(valuesArray,label){
|
||||
//Map the values array for each of the datasets
|
||||
|
||||
helpers.each(valuesArray,function(value,datasetIndex){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
this.datasets[datasetIndex].points.push(new this.PointClass({
|
||||
value : value,
|
||||
label : label,
|
||||
datasetLabel: this.datasets[datasetIndex].label,
|
||||
x: this.scale.calculateX(this.scale.valuesCount+1),
|
||||
y: this.scale.endPoint,
|
||||
strokeColor : this.datasets[datasetIndex].pointStrokeColor,
|
||||
fillColor : this.datasets[datasetIndex].pointColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
this.scale.addXLabel(label);
|
||||
//Then re-render the chart.
|
||||
this.update();
|
||||
},
|
||||
removeData : function(){
|
||||
this.scale.removeXLabel();
|
||||
//Then re-render the chart.
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
dataset.points.shift();
|
||||
},this);
|
||||
this.update();
|
||||
},
|
||||
reflow : function(){
|
||||
var newScaleProps = helpers.extend({
|
||||
height : this.chart.height,
|
||||
width : this.chart.width
|
||||
});
|
||||
this.scale.update(newScaleProps);
|
||||
},
|
||||
draw : function(ease){
|
||||
var easingDecimal = ease || 1;
|
||||
this.clear();
|
||||
|
||||
var ctx = this.chart.ctx;
|
||||
|
||||
// Some helper methods for getting the next/prev points
|
||||
var hasValue = function(item){
|
||||
return item.value !== null;
|
||||
},
|
||||
nextPoint = function(point, collection, index){
|
||||
return helpers.findNextWhere(collection, hasValue, index) || point;
|
||||
},
|
||||
previousPoint = function(point, collection, index){
|
||||
return helpers.findPreviousWhere(collection, hasValue, index) || point;
|
||||
};
|
||||
|
||||
if (!this.scale) return;
|
||||
this.scale.draw(easingDecimal);
|
||||
|
||||
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
var pointsWithValues = helpers.where(dataset.points, hasValue);
|
||||
|
||||
//Transition each point first so that the line and point drawing isn't out of sync
|
||||
//We can use this extra loop to calculate the control points of this dataset also in this loop
|
||||
|
||||
helpers.each(dataset.points, function(point, index){
|
||||
if (point.hasValue()){
|
||||
point.transition({
|
||||
y : this.scale.calculateY(point.value),
|
||||
x : this.scale.calculateX(index)
|
||||
}, easingDecimal);
|
||||
}
|
||||
},this);
|
||||
|
||||
|
||||
// Control points need to be calculated in a separate loop, because we need to know the current x/y of the point
|
||||
// This would cause issues when there is no animation, because the y of the next point would be 0, so beziers would be skewed
|
||||
if (this.options.bezierCurve){
|
||||
helpers.each(pointsWithValues, function(point, index){
|
||||
var tension = (index > 0 && index < pointsWithValues.length - 1) ? this.options.bezierCurveTension : 0;
|
||||
point.controlPoints = helpers.splineCurve(
|
||||
previousPoint(point, pointsWithValues, index),
|
||||
point,
|
||||
nextPoint(point, pointsWithValues, index),
|
||||
tension
|
||||
);
|
||||
|
||||
// Prevent the bezier going outside of the bounds of the graph
|
||||
|
||||
// Cap puter bezier handles to the upper/lower scale bounds
|
||||
if (point.controlPoints.outer.y > this.scale.endPoint){
|
||||
point.controlPoints.outer.y = this.scale.endPoint;
|
||||
}
|
||||
else if (point.controlPoints.outer.y < this.scale.startPoint){
|
||||
point.controlPoints.outer.y = this.scale.startPoint;
|
||||
}
|
||||
|
||||
// Cap inner bezier handles to the upper/lower scale bounds
|
||||
if (point.controlPoints.inner.y > this.scale.endPoint){
|
||||
point.controlPoints.inner.y = this.scale.endPoint;
|
||||
}
|
||||
else if (point.controlPoints.inner.y < this.scale.startPoint){
|
||||
point.controlPoints.inner.y = this.scale.startPoint;
|
||||
}
|
||||
},this);
|
||||
}
|
||||
|
||||
|
||||
//Draw the line between all the points
|
||||
ctx.lineWidth = this.options.datasetStrokeWidth;
|
||||
ctx.strokeStyle = dataset.strokeColor;
|
||||
ctx.beginPath();
|
||||
|
||||
helpers.each(pointsWithValues, function(point, index){
|
||||
if (index === 0){
|
||||
ctx.moveTo(point.x, point.y);
|
||||
}
|
||||
else{
|
||||
if(this.options.bezierCurve){
|
||||
var previous = previousPoint(point, pointsWithValues, index);
|
||||
|
||||
ctx.bezierCurveTo(
|
||||
previous.controlPoints.outer.x,
|
||||
previous.controlPoints.outer.y,
|
||||
point.controlPoints.inner.x,
|
||||
point.controlPoints.inner.y,
|
||||
point.x,
|
||||
point.y
|
||||
);
|
||||
}
|
||||
else{
|
||||
ctx.lineTo(point.x,point.y);
|
||||
}
|
||||
}
|
||||
}, this);
|
||||
|
||||
if (this.options.datasetStroke) {
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
if (this.options.datasetFill && pointsWithValues.length > 0){
|
||||
//Round off the line by going to the base of the chart, back to the start, then fill.
|
||||
ctx.lineTo(pointsWithValues[pointsWithValues.length - 1].x, this.scale.endPoint);
|
||||
ctx.lineTo(pointsWithValues[0].x, this.scale.endPoint);
|
||||
ctx.fillStyle = dataset.fillColor;
|
||||
ctx.closePath();
|
||||
ctx.fill();
|
||||
}
|
||||
|
||||
//Now draw the points over the line
|
||||
//A little inefficient double looping, but better than the line
|
||||
//lagging behind the point positions
|
||||
helpers.each(pointsWithValues,function(point){
|
||||
point.draw();
|
||||
});
|
||||
},this);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}).call(this);
|
@ -1,250 +0,0 @@
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var root = this,
|
||||
Chart = root.Chart,
|
||||
//Cache a local reference to Chart.helpers
|
||||
helpers = Chart.helpers;
|
||||
|
||||
var defaultConfig = {
|
||||
//Boolean - Show a backdrop to the scale label
|
||||
scaleShowLabelBackdrop : true,
|
||||
|
||||
//String - The colour of the label backdrop
|
||||
scaleBackdropColor : "rgba(255,255,255,0.75)",
|
||||
|
||||
// Boolean - Whether the scale should begin at zero
|
||||
scaleBeginAtZero : true,
|
||||
|
||||
//Number - The backdrop padding above & below the label in pixels
|
||||
scaleBackdropPaddingY : 2,
|
||||
|
||||
//Number - The backdrop padding to the side of the label in pixels
|
||||
scaleBackdropPaddingX : 2,
|
||||
|
||||
//Boolean - Show line for each value in the scale
|
||||
scaleShowLine : true,
|
||||
|
||||
//Boolean - Stroke a line around each segment in the chart
|
||||
segmentShowStroke : true,
|
||||
|
||||
//String - The colour of the stroke on each segment.
|
||||
segmentStrokeColor : "#fff",
|
||||
|
||||
//Number - The width of the stroke value in pixels
|
||||
segmentStrokeWidth : 2,
|
||||
|
||||
//Number - Amount of animation steps
|
||||
animationSteps : 100,
|
||||
|
||||
//String - Animation easing effect.
|
||||
animationEasing : "easeOutBounce",
|
||||
|
||||
//Boolean - Whether to animate the rotation of the chart
|
||||
animateRotate : true,
|
||||
|
||||
//Boolean - Whether to animate scaling the chart from the centre
|
||||
animateScale : false,
|
||||
|
||||
//String - A legend template
|
||||
legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"><%if(segments[i].label){%><%=segments[i].label%><%}%></span></li><%}%></ul>"
|
||||
};
|
||||
|
||||
|
||||
Chart.Type.extend({
|
||||
//Passing in a name registers this chart in the Chart namespace
|
||||
name: "PolarArea",
|
||||
//Providing a defaults will also register the deafults in the chart namespace
|
||||
defaults : defaultConfig,
|
||||
//Initialize is fired when the chart is initialized - Data is passed in as a parameter
|
||||
//Config is automatically merged by the core of Chart.js, and is available at this.options
|
||||
initialize: function(data){
|
||||
this.segments = [];
|
||||
//Declare segment class as a chart instance specific class, so it can share props for this instance
|
||||
this.SegmentArc = Chart.Arc.extend({
|
||||
showStroke : this.options.segmentShowStroke,
|
||||
strokeWidth : this.options.segmentStrokeWidth,
|
||||
strokeColor : this.options.segmentStrokeColor,
|
||||
ctx : this.chart.ctx,
|
||||
innerRadius : 0,
|
||||
x : this.chart.width/2,
|
||||
y : this.chart.height/2
|
||||
});
|
||||
this.scale = new Chart.RadialScale({
|
||||
display: this.options.showScale,
|
||||
fontStyle: this.options.scaleFontStyle,
|
||||
fontSize: this.options.scaleFontSize,
|
||||
fontFamily: this.options.scaleFontFamily,
|
||||
fontColor: this.options.scaleFontColor,
|
||||
showLabels: this.options.scaleShowLabels,
|
||||
showLabelBackdrop: this.options.scaleShowLabelBackdrop,
|
||||
backdropColor: this.options.scaleBackdropColor,
|
||||
backdropPaddingY : this.options.scaleBackdropPaddingY,
|
||||
backdropPaddingX: this.options.scaleBackdropPaddingX,
|
||||
lineWidth: (this.options.scaleShowLine) ? this.options.scaleLineWidth : 0,
|
||||
lineColor: this.options.scaleLineColor,
|
||||
lineArc: true,
|
||||
width: this.chart.width,
|
||||
height: this.chart.height,
|
||||
xCenter: this.chart.width/2,
|
||||
yCenter: this.chart.height/2,
|
||||
ctx : this.chart.ctx,
|
||||
templateString: this.options.scaleLabel,
|
||||
valuesCount: data.length
|
||||
});
|
||||
|
||||
this.updateScaleRange(data);
|
||||
|
||||
this.scale.update();
|
||||
|
||||
helpers.each(data,function(segment,index){
|
||||
this.addData(segment,index,true);
|
||||
},this);
|
||||
|
||||
//Set up tooltip events on the chart
|
||||
if (this.options.showTooltips){
|
||||
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
|
||||
var activeSegments = (evt.type !== 'mouseout') ? this.getSegmentsAtEvent(evt) : [];
|
||||
helpers.each(this.segments,function(segment){
|
||||
segment.restore(["fillColor"]);
|
||||
});
|
||||
helpers.each(activeSegments,function(activeSegment){
|
||||
activeSegment.fillColor = activeSegment.highlightColor;
|
||||
});
|
||||
this.showTooltip(activeSegments);
|
||||
});
|
||||
}
|
||||
|
||||
this.render();
|
||||
},
|
||||
getSegmentsAtEvent : function(e){
|
||||
var segmentsArray = [];
|
||||
|
||||
var location = helpers.getRelativePosition(e);
|
||||
|
||||
helpers.each(this.segments,function(segment){
|
||||
if (segment.inRange(location.x,location.y)) segmentsArray.push(segment);
|
||||
},this);
|
||||
return segmentsArray;
|
||||
},
|
||||
addData : function(segment, atIndex, silent){
|
||||
var index = atIndex || this.segments.length;
|
||||
|
||||
this.segments.splice(index, 0, new this.SegmentArc({
|
||||
fillColor: segment.color,
|
||||
highlightColor: segment.highlight || segment.color,
|
||||
label: segment.label,
|
||||
value: segment.value,
|
||||
outerRadius: (this.options.animateScale) ? 0 : this.scale.calculateCenterOffset(segment.value),
|
||||
circumference: (this.options.animateRotate) ? 0 : this.scale.getCircumference(),
|
||||
startAngle: Math.PI * 1.5
|
||||
}));
|
||||
if (!silent){
|
||||
this.reflow();
|
||||
this.update();
|
||||
}
|
||||
},
|
||||
removeData: function(atIndex){
|
||||
var indexToDelete = (helpers.isNumber(atIndex)) ? atIndex : this.segments.length-1;
|
||||
this.segments.splice(indexToDelete, 1);
|
||||
this.reflow();
|
||||
this.update();
|
||||
},
|
||||
calculateTotal: function(data){
|
||||
this.total = 0;
|
||||
helpers.each(data,function(segment){
|
||||
this.total += segment.value;
|
||||
},this);
|
||||
this.scale.valuesCount = this.segments.length;
|
||||
},
|
||||
updateScaleRange: function(datapoints){
|
||||
var valuesArray = [];
|
||||
helpers.each(datapoints,function(segment){
|
||||
valuesArray.push(segment.value);
|
||||
});
|
||||
|
||||
var scaleSizes = (this.options.scaleOverride) ?
|
||||
{
|
||||
steps: this.options.scaleSteps,
|
||||
stepValue: this.options.scaleStepWidth,
|
||||
min: this.options.scaleStartValue,
|
||||
max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth)
|
||||
} :
|
||||
helpers.calculateScaleRange(
|
||||
valuesArray,
|
||||
helpers.min([this.chart.width, this.chart.height])/2,
|
||||
this.options.scaleFontSize,
|
||||
this.options.scaleBeginAtZero,
|
||||
this.options.scaleIntegersOnly
|
||||
);
|
||||
|
||||
helpers.extend(
|
||||
this.scale,
|
||||
scaleSizes,
|
||||
{
|
||||
size: helpers.min([this.chart.width, this.chart.height]),
|
||||
xCenter: this.chart.width/2,
|
||||
yCenter: this.chart.height/2
|
||||
}
|
||||
);
|
||||
|
||||
},
|
||||
update : function(){
|
||||
this.calculateTotal(this.segments);
|
||||
|
||||
helpers.each(this.segments,function(segment){
|
||||
segment.save();
|
||||
});
|
||||
|
||||
this.reflow();
|
||||
this.render();
|
||||
},
|
||||
reflow : function(){
|
||||
helpers.extend(this.SegmentArc.prototype,{
|
||||
x : this.chart.width/2,
|
||||
y : this.chart.height/2
|
||||
});
|
||||
this.updateScaleRange(this.segments);
|
||||
this.scale.update();
|
||||
|
||||
helpers.extend(this.scale,{
|
||||
xCenter: this.chart.width/2,
|
||||
yCenter: this.chart.height/2
|
||||
});
|
||||
|
||||
helpers.each(this.segments, function(segment){
|
||||
segment.update({
|
||||
outerRadius : this.scale.calculateCenterOffset(segment.value)
|
||||
});
|
||||
}, this);
|
||||
|
||||
},
|
||||
draw : function(ease){
|
||||
var easingDecimal = ease || 1;
|
||||
//Clear & draw the canvas
|
||||
this.clear();
|
||||
helpers.each(this.segments,function(segment, index){
|
||||
segment.transition({
|
||||
circumference : this.scale.getCircumference(),
|
||||
outerRadius : this.scale.calculateCenterOffset(segment.value)
|
||||
},easingDecimal);
|
||||
|
||||
segment.endAngle = segment.startAngle + segment.circumference;
|
||||
|
||||
// If we've removed the first segment we need to set the first one to
|
||||
// start at the top.
|
||||
if (index === 0){
|
||||
segment.startAngle = Math.PI * 1.5;
|
||||
}
|
||||
|
||||
//Check to see if it's the last segment, if not get the next and update the start angle
|
||||
if (index < this.segments.length - 1){
|
||||
this.segments[index+1].startAngle = segment.endAngle;
|
||||
}
|
||||
segment.draw();
|
||||
}, this);
|
||||
this.scale.draw();
|
||||
}
|
||||
});
|
||||
|
||||
}).call(this);
|
@ -1,346 +0,0 @@
|
||||
(function(){
|
||||
"use strict";
|
||||
|
||||
var root = this,
|
||||
Chart = root.Chart,
|
||||
helpers = Chart.helpers;
|
||||
|
||||
|
||||
|
||||
Chart.Type.extend({
|
||||
name: "Radar",
|
||||
defaults:{
|
||||
//Boolean - Whether to show lines for each scale point
|
||||
scaleShowLine : true,
|
||||
|
||||
//Boolean - Whether we show the angle lines out of the radar
|
||||
angleShowLineOut : true,
|
||||
|
||||
//Boolean - Whether to show labels on the scale
|
||||
scaleShowLabels : false,
|
||||
|
||||
// Boolean - Whether the scale should begin at zero
|
||||
scaleBeginAtZero : true,
|
||||
|
||||
//String - Colour of the angle line
|
||||
angleLineColor : "rgba(0,0,0,.1)",
|
||||
|
||||
//Number - Pixel width of the angle line
|
||||
angleLineWidth : 1,
|
||||
|
||||
//String - Point label font declaration
|
||||
pointLabelFontFamily : "'Arial'",
|
||||
|
||||
//String - Point label font weight
|
||||
pointLabelFontStyle : "normal",
|
||||
|
||||
//Number - Point label font size in pixels
|
||||
pointLabelFontSize : 10,
|
||||
|
||||
//String - Point label font colour
|
||||
pointLabelFontColor : "#666",
|
||||
|
||||
//Boolean - Whether to show a dot for each point
|
||||
pointDot : true,
|
||||
|
||||
//Number - Radius of each point dot in pixels
|
||||
pointDotRadius : 3,
|
||||
|
||||
//Number - Pixel width of point dot stroke
|
||||
pointDotStrokeWidth : 1,
|
||||
|
||||
//Number - amount extra to add to the radius to cater for hit detection outside the drawn point
|
||||
pointHitDetectionRadius : 20,
|
||||
|
||||
//Boolean - Whether to show a stroke for datasets
|
||||
datasetStroke : true,
|
||||
|
||||
//Number - Pixel width of dataset stroke
|
||||
datasetStrokeWidth : 2,
|
||||
|
||||
//Boolean - Whether to fill the dataset with a colour
|
||||
datasetFill : true,
|
||||
|
||||
//String - A legend template
|
||||
legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].strokeColor%>\"><%if(datasets[i].label){%><%=datasets[i].label%><%}%></span></li><%}%></ul>"
|
||||
|
||||
},
|
||||
|
||||
initialize: function(data){
|
||||
this.PointClass = Chart.Point.extend({
|
||||
strokeWidth : this.options.pointDotStrokeWidth,
|
||||
radius : this.options.pointDotRadius,
|
||||
display: this.options.pointDot,
|
||||
hitDetectionRadius : this.options.pointHitDetectionRadius,
|
||||
ctx : this.chart.ctx
|
||||
});
|
||||
|
||||
this.datasets = [];
|
||||
|
||||
this.buildScale(data);
|
||||
|
||||
//Set up tooltip events on the chart
|
||||
if (this.options.showTooltips){
|
||||
helpers.bindEvents(this, this.options.tooltipEvents, function(evt){
|
||||
var activePointsCollection = (evt.type !== 'mouseout') ? this.getPointsAtEvent(evt) : [];
|
||||
|
||||
this.eachPoints(function(point){
|
||||
point.restore(['fillColor', 'strokeColor']);
|
||||
});
|
||||
helpers.each(activePointsCollection, function(activePoint){
|
||||
activePoint.fillColor = activePoint.highlightFill;
|
||||
activePoint.strokeColor = activePoint.highlightStroke;
|
||||
});
|
||||
|
||||
this.showTooltip(activePointsCollection);
|
||||
});
|
||||
}
|
||||
|
||||
//Iterate through each of the datasets, and build this into a property of the chart
|
||||
helpers.each(data.datasets,function(dataset){
|
||||
|
||||
var datasetObject = {
|
||||
label: dataset.label || null,
|
||||
fillColor : dataset.fillColor,
|
||||
strokeColor : dataset.strokeColor,
|
||||
pointColor : dataset.pointColor,
|
||||
pointStrokeColor : dataset.pointStrokeColor,
|
||||
points : []
|
||||
};
|
||||
|
||||
this.datasets.push(datasetObject);
|
||||
|
||||
helpers.each(dataset.data,function(dataPoint,index){
|
||||
//Add a new point for each piece of data, passing any required data to draw.
|
||||
var pointPosition;
|
||||
if (!this.scale.animation){
|
||||
pointPosition = this.scale.getPointPosition(index, this.scale.calculateCenterOffset(dataPoint));
|
||||
}
|
||||
datasetObject.points.push(new this.PointClass({
|
||||
value : dataPoint,
|
||||
label : data.labels[index],
|
||||
datasetLabel: dataset.label,
|
||||
x: (this.options.animation) ? this.scale.xCenter : pointPosition.x,
|
||||
y: (this.options.animation) ? this.scale.yCenter : pointPosition.y,
|
||||
strokeColor : dataset.pointStrokeColor,
|
||||
fillColor : dataset.pointColor,
|
||||
highlightFill : dataset.pointHighlightFill || dataset.pointColor,
|
||||
highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
},this);
|
||||
|
||||
this.render();
|
||||
},
|
||||
eachPoints : function(callback){
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
helpers.each(dataset.points,callback,this);
|
||||
},this);
|
||||
},
|
||||
|
||||
getPointsAtEvent : function(evt){
|
||||
var mousePosition = helpers.getRelativePosition(evt),
|
||||
fromCenter = helpers.getAngleFromPoint({
|
||||
x: this.scale.xCenter,
|
||||
y: this.scale.yCenter
|
||||
}, mousePosition);
|
||||
|
||||
var anglePerIndex = (Math.PI * 2) /this.scale.valuesCount,
|
||||
pointIndex = Math.round((fromCenter.angle - Math.PI * 1.5) / anglePerIndex),
|
||||
activePointsCollection = [];
|
||||
|
||||
// If we're at the top, make the pointIndex 0 to get the first of the array.
|
||||
if (pointIndex >= this.scale.valuesCount || pointIndex < 0){
|
||||
pointIndex = 0;
|
||||
}
|
||||
|
||||
if (fromCenter.distance <= this.scale.drawingArea){
|
||||
helpers.each(this.datasets, function(dataset){
|
||||
activePointsCollection.push(dataset.points[pointIndex]);
|
||||
});
|
||||
}
|
||||
|
||||
return activePointsCollection;
|
||||
},
|
||||
|
||||
buildScale : function(data){
|
||||
this.scale = new Chart.RadialScale({
|
||||
display: this.options.showScale,
|
||||
fontStyle: this.options.scaleFontStyle,
|
||||
fontSize: this.options.scaleFontSize,
|
||||
fontFamily: this.options.scaleFontFamily,
|
||||
fontColor: this.options.scaleFontColor,
|
||||
showLabels: this.options.scaleShowLabels,
|
||||
showLabelBackdrop: this.options.scaleShowLabelBackdrop,
|
||||
backdropColor: this.options.scaleBackdropColor,
|
||||
backgroundColors: this.options.scaleBackgroundColors,
|
||||
backdropPaddingY : this.options.scaleBackdropPaddingY,
|
||||
backdropPaddingX: this.options.scaleBackdropPaddingX,
|
||||
lineWidth: (this.options.scaleShowLine) ? this.options.scaleLineWidth : 0,
|
||||
lineColor: this.options.scaleLineColor,
|
||||
angleLineColor : this.options.angleLineColor,
|
||||
angleLineWidth : (this.options.angleShowLineOut) ? this.options.angleLineWidth : 0,
|
||||
// Point labels at the edge of each line
|
||||
pointLabelFontColor : this.options.pointLabelFontColor,
|
||||
pointLabelFontSize : this.options.pointLabelFontSize,
|
||||
pointLabelFontFamily : this.options.pointLabelFontFamily,
|
||||
pointLabelFontStyle : this.options.pointLabelFontStyle,
|
||||
height : this.chart.height,
|
||||
width: this.chart.width,
|
||||
xCenter: this.chart.width/2,
|
||||
yCenter: this.chart.height/2,
|
||||
ctx : this.chart.ctx,
|
||||
templateString: this.options.scaleLabel,
|
||||
labels: data.labels,
|
||||
valuesCount: data.datasets[0].data.length
|
||||
});
|
||||
|
||||
this.scale.setScaleSize();
|
||||
this.updateScaleRange(data.datasets);
|
||||
this.scale.buildYLabels();
|
||||
},
|
||||
updateScaleRange: function(datasets){
|
||||
var valuesArray = (function(){
|
||||
var totalDataArray = [];
|
||||
helpers.each(datasets,function(dataset){
|
||||
if (dataset.data){
|
||||
totalDataArray = totalDataArray.concat(dataset.data);
|
||||
}
|
||||
else {
|
||||
helpers.each(dataset.points, function(point){
|
||||
totalDataArray.push(point.value);
|
||||
});
|
||||
}
|
||||
});
|
||||
return totalDataArray;
|
||||
})();
|
||||
|
||||
|
||||
var scaleSizes = (this.options.scaleOverride) ?
|
||||
{
|
||||
steps: this.options.scaleSteps,
|
||||
stepValue: this.options.scaleStepWidth,
|
||||
min: this.options.scaleStartValue,
|
||||
max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth)
|
||||
} :
|
||||
helpers.calculateScaleRange(
|
||||
valuesArray,
|
||||
helpers.min([this.chart.width, this.chart.height])/2,
|
||||
this.options.scaleFontSize,
|
||||
this.options.scaleBeginAtZero,
|
||||
this.options.scaleIntegersOnly
|
||||
);
|
||||
|
||||
helpers.extend(
|
||||
this.scale,
|
||||
scaleSizes
|
||||
);
|
||||
|
||||
},
|
||||
addData : function(valuesArray,label){
|
||||
//Map the values array for each of the datasets
|
||||
this.scale.valuesCount++;
|
||||
helpers.each(valuesArray,function(value,datasetIndex){
|
||||
var pointPosition = this.scale.getPointPosition(this.scale.valuesCount, this.scale.calculateCenterOffset(value));
|
||||
this.datasets[datasetIndex].points.push(new this.PointClass({
|
||||
value : value,
|
||||
label : label,
|
||||
datasetLabel: this.datasets[datasetIndex].label,
|
||||
x: pointPosition.x,
|
||||
y: pointPosition.y,
|
||||
strokeColor : this.datasets[datasetIndex].pointStrokeColor,
|
||||
fillColor : this.datasets[datasetIndex].pointColor
|
||||
}));
|
||||
},this);
|
||||
|
||||
this.scale.labels.push(label);
|
||||
|
||||
this.reflow();
|
||||
|
||||
this.update();
|
||||
},
|
||||
removeData : function(){
|
||||
this.scale.valuesCount--;
|
||||
this.scale.labels.shift();
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
dataset.points.shift();
|
||||
},this);
|
||||
this.reflow();
|
||||
this.update();
|
||||
},
|
||||
update : function(){
|
||||
this.eachPoints(function(point){
|
||||
point.save();
|
||||
});
|
||||
this.reflow();
|
||||
this.render();
|
||||
},
|
||||
reflow: function(){
|
||||
helpers.extend(this.scale, {
|
||||
width : this.chart.width,
|
||||
height: this.chart.height,
|
||||
size : helpers.min([this.chart.width, this.chart.height]),
|
||||
xCenter: this.chart.width/2,
|
||||
yCenter: this.chart.height/2
|
||||
});
|
||||
this.updateScaleRange(this.datasets);
|
||||
this.scale.setScaleSize();
|
||||
this.scale.buildYLabels();
|
||||
},
|
||||
draw : function(ease){
|
||||
var easeDecimal = ease || 1,
|
||||
ctx = this.chart.ctx;
|
||||
this.clear();
|
||||
this.scale.draw();
|
||||
|
||||
helpers.each(this.datasets,function(dataset){
|
||||
|
||||
//Transition each point first so that the line and point drawing isn't out of sync
|
||||
helpers.each(dataset.points,function(point,index){
|
||||
if (point.hasValue()){
|
||||
point.transition(this.scale.getPointPosition(index, this.scale.calculateCenterOffset(point.value)), easeDecimal);
|
||||
}
|
||||
},this);
|
||||
|
||||
|
||||
|
||||
//Draw the line between all the points
|
||||
ctx.lineWidth = this.options.datasetStrokeWidth;
|
||||
ctx.strokeStyle = dataset.strokeColor;
|
||||
ctx.beginPath();
|
||||
helpers.each(dataset.points,function(point,index){
|
||||
if (index === 0){
|
||||
ctx.moveTo(point.x,point.y);
|
||||
}
|
||||
else{
|
||||
ctx.lineTo(point.x,point.y);
|
||||
}
|
||||
},this);
|
||||
ctx.closePath();
|
||||
ctx.stroke();
|
||||
|
||||
ctx.fillStyle = dataset.fillColor;
|
||||
if(this.options.datasetFill){
|
||||
ctx.fill();
|
||||
}
|
||||
//Now draw the points over the line
|
||||
//A little inefficient double looping, but better than the line
|
||||
//lagging behind the point positions
|
||||
helpers.each(dataset.points,function(point){
|
||||
if (point.hasValue()){
|
||||
point.draw();
|
||||
}
|
||||
});
|
||||
|
||||
},this);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}).call(this);
|
File diff suppressed because it is too large
Load Diff
@ -1,742 +0,0 @@
|
||||
/*!
|
||||
* clipboard.js v1.5.12
|
||||
* https://zenorocha.github.io/clipboard.js
|
||||
*
|
||||
* Licensed MIT © Zeno Rocha
|
||||
*/
|
||||
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.Clipboard = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
|
||||
var matches = require('matches-selector');
|
||||
|
||||
module.exports = function (element, selector, checkYoSelf) {
|
||||
var parent = checkYoSelf ? element : element.parentNode;
|
||||
|
||||
while (parent && parent !== document) {
|
||||
if (matches(parent, selector)) return parent;
|
||||
parent = parent.parentNode
|
||||
}
|
||||
}
|
||||
|
||||
},{"matches-selector":5}],2:[function(require,module,exports){
|
||||
var closest = require('closest');
|
||||
|
||||
/**
|
||||
* Delegates event to a selector.
|
||||
*
|
||||
* @param {Element} element
|
||||
* @param {String} selector
|
||||
* @param {String} type
|
||||
* @param {Function} callback
|
||||
* @param {Boolean} useCapture
|
||||
* @return {Object}
|
||||
*/
|
||||
function delegate(element, selector, type, callback, useCapture) {
|
||||
var listenerFn = listener.apply(this, arguments);
|
||||
|
||||
element.addEventListener(type, listenerFn, useCapture);
|
||||
|
||||
return {
|
||||
destroy: function() {
|
||||
element.removeEventListener(type, listenerFn, useCapture);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Finds closest match and invokes callback.
|
||||
*
|
||||
* @param {Element} element
|
||||
* @param {String} selector
|
||||
* @param {String} type
|
||||
* @param {Function} callback
|
||||
* @return {Function}
|
||||
*/
|
||||
function listener(element, selector, type, callback) {
|
||||
return function(e) {
|
||||
e.delegateTarget = closest(e.target, selector, true);
|
||||
|
||||
if (e.delegateTarget) {
|
||||
callback.call(element, e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = delegate;
|
||||
|
||||
},{"closest":1}],3:[function(require,module,exports){
|
||||
/**
|
||||
* Check if argument is a HTML element.
|
||||
*
|
||||
* @param {Object} value
|
||||
* @return {Boolean}
|
||||
*/
|
||||
exports.node = function(value) {
|
||||
return value !== undefined
|
||||
&& value instanceof HTMLElement
|
||||
&& value.nodeType === 1;
|
||||
};
|
||||
|
||||
/**
|
||||
* Check if argument is a list of HTML elements.
|
||||
*
|
||||
* @param {Object} value
|
||||
* @return {Boolean}
|
||||
*/
|
||||
exports.nodeList = function(value) {
|
||||
var type = Object.prototype.toString.call(value);
|
||||
|
||||
return value !== undefined
|
||||
&& (type === '[object NodeList]' || type === '[object HTMLCollection]')
|
||||
&& ('length' in value)
|
||||
&& (value.length === 0 || exports.node(value[0]));
|
||||
};
|
||||
|
||||
/**
|
||||
* Check if argument is a string.
|
||||
*
|
||||
* @param {Object} value
|
||||
* @return {Boolean}
|
||||
*/
|
||||
exports.string = function(value) {
|
||||
return typeof value === 'string'
|
||||
|| value instanceof String;
|
||||
};
|
||||
|
||||
/**
|
||||
* Check if argument is a function.
|
||||
*
|
||||
* @param {Object} value
|
||||
* @return {Boolean}
|
||||
*/
|
||||
exports.fn = function(value) {
|
||||
var type = Object.prototype.toString.call(value);
|
||||
|
||||
return type === '[object Function]';
|
||||
};
|
||||
|
||||
},{}],4:[function(require,module,exports){
|
||||
var is = require('./is');
|
||||
var delegate = require('delegate');
|
||||
|
||||
/**
|
||||
* Validates all params and calls the right
|
||||
* listener function based on its target type.
|
||||
*
|
||||
* @param {String|HTMLElement|HTMLCollection|NodeList} target
|
||||
* @param {String} type
|
||||
* @param {Function} callback
|
||||
* @return {Object}
|
||||
*/
|
||||
function listen(target, type, callback) {
|
||||
if (!target && !type && !callback) {
|
||||
throw new Error('Missing required arguments');
|
||||
}
|
||||
|
||||
if (!is.string(type)) {
|
||||
throw new TypeError('Second argument must be a String');
|
||||
}
|
||||
|
||||
if (!is.fn(callback)) {
|
||||
throw new TypeError('Third argument must be a Function');
|
||||
}
|
||||
|
||||
if (is.node(target)) {
|
||||
return listenNode(target, type, callback);
|
||||
}
|
||||
else if (is.nodeList(target)) {
|
||||
return listenNodeList(target, type, callback);
|
||||
}
|
||||
else if (is.string(target)) {
|
||||
return listenSelector(target, type, callback);
|
||||
}
|
||||
else {
|
||||
throw new TypeError('First argument must be a String, HTMLElement, HTMLCollection, or NodeList');
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds an event listener to a HTML element
|
||||
* and returns a remove listener function.
|
||||
*
|
||||
* @param {HTMLElement} node
|
||||
* @param {String} type
|
||||
* @param {Function} callback
|
||||
* @return {Object}
|
||||
*/
|
||||
function listenNode(node, type, callback) {
|
||||
node.addEventListener(type, callback);
|
||||
|
||||
return {
|
||||
destroy: function() {
|
||||
node.removeEventListener(type, callback);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Add an event listener to a list of HTML elements
|
||||
* and returns a remove listener function.
|
||||
*
|
||||
* @param {NodeList|HTMLCollection} nodeList
|
||||
* @param {String} type
|
||||
* @param {Function} callback
|
||||
* @return {Object}
|
||||
*/
|
||||
function listenNodeList(nodeList, type, callback) {
|
||||
Array.prototype.forEach.call(nodeList, function(node) {
|
||||
node.addEventListener(type, callback);
|
||||
});
|
||||
|
||||
return {
|
||||
destroy: function() {
|
||||
Array.prototype.forEach.call(nodeList, function(node) {
|
||||
node.removeEventListener(type, callback);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Add an event listener to a selector
|
||||
* and returns a remove listener function.
|
||||
*
|
||||
* @param {String} selector
|
||||
* @param {String} type
|
||||
* @param {Function} callback
|
||||
* @return {Object}
|
||||
*/
|
||||
function listenSelector(selector, type, callback) {
|
||||
return delegate(document.body, selector, type, callback);
|
||||
}
|
||||
|
||||
module.exports = listen;
|
||||
|
||||
},{"./is":3,"delegate":2}],5:[function(require,module,exports){
|
||||
|
||||
/**
|
||||
* Element prototype.
|
||||
*/
|
||||
|
||||
var proto = Element.prototype;
|
||||
|
||||
/**
|
||||
* Vendor function.
|
||||
*/
|
||||
|
||||
var vendor = proto.matchesSelector
|
||||
|| proto.webkitMatchesSelector
|
||||
|| proto.mozMatchesSelector
|
||||
|| proto.msMatchesSelector
|
||||
|| proto.oMatchesSelector;
|
||||
|
||||
/**
|
||||
* Expose `match()`.
|
||||
*/
|
||||
|
||||
module.exports = match;
|
||||
|
||||
/**
|
||||
* Match `el` to `selector`.
|
||||
*
|
||||
* @param {Element} el
|
||||
* @param {String} selector
|
||||
* @return {Boolean}
|
||||
* @api public
|
||||
*/
|
||||
|
||||
function match(el, selector) {
|
||||
if (vendor) return vendor.call(el, selector);
|
||||
var nodes = el.parentNode.querySelectorAll(selector);
|
||||
for (var i = 0; i < nodes.length; ++i) {
|
||||
if (nodes[i] == el) return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
},{}],6:[function(require,module,exports){
|
||||
function select(element) {
|
||||
var selectedText;
|
||||
|
||||
if (element.nodeName === 'INPUT' || element.nodeName === 'TEXTAREA') {
|
||||
element.focus();
|
||||
element.setSelectionRange(0, element.value.length);
|
||||
|
||||
selectedText = element.value;
|
||||
}
|
||||
else {
|
||||
if (element.hasAttribute('contenteditable')) {
|
||||
element.focus();
|
||||
}
|
||||
|
||||
var selection = window.getSelection();
|
||||
var range = document.createRange();
|
||||
|
||||
range.selectNodeContents(element);
|
||||
selection.removeAllRanges();
|
||||
selection.addRange(range);
|
||||
|
||||
selectedText = selection.toString();
|
||||
}
|
||||
|
||||
return selectedText;
|
||||
}
|
||||
|
||||
module.exports = select;
|
||||
|
||||
},{}],7:[function(require,module,exports){
|
||||
function E () {
|
||||
// Keep this empty so it's easier to inherit from
|
||||
// (via https://github.com/lipsmack from https://github.com/scottcorgan/tiny-emitter/issues/3)
|
||||
}
|
||||
|
||||
E.prototype = {
|
||||
on: function (name, callback, ctx) {
|
||||
var e = this.e || (this.e = {});
|
||||
|
||||
(e[name] || (e[name] = [])).push({
|
||||
fn: callback,
|
||||
ctx: ctx
|
||||
});
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
once: function (name, callback, ctx) {
|
||||
var self = this;
|
||||
function listener () {
|
||||
self.off(name, listener);
|
||||
callback.apply(ctx, arguments);
|
||||
};
|
||||
|
||||
listener._ = callback
|
||||
return this.on(name, listener, ctx);
|
||||
},
|
||||
|
||||
emit: function (name) {
|
||||
var data = [].slice.call(arguments, 1);
|
||||
var evtArr = ((this.e || (this.e = {}))[name] || []).slice();
|
||||
var i = 0;
|
||||
var len = evtArr.length;
|
||||
|
||||
for (i; i < len; i++) {
|
||||
evtArr[i].fn.apply(evtArr[i].ctx, data);
|
||||
}
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
off: function (name, callback) {
|
||||
var e = this.e || (this.e = {});
|
||||
var evts = e[name];
|
||||
var liveEvents = [];
|
||||
|
||||
if (evts && callback) {
|
||||
for (var i = 0, len = evts.length; i < len; i++) {
|
||||
if (evts[i].fn !== callback && evts[i].fn._ !== callback)
|
||||
liveEvents.push(evts[i]);
|
||||
}
|
||||
}
|
||||
|
||||
// Remove event from queue to prevent memory leak
|
||||
// Suggested by https://github.com/lazd
|
||||
// Ref: https://github.com/scottcorgan/tiny-emitter/commit/c6ebfaa9bc973b33d110a84a307742b7cf94c953#commitcomment-5024910
|
||||
|
||||
(liveEvents.length)
|
||||
? e[name] = liveEvents
|
||||
: delete e[name];
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
module.exports = E;
|
||||
|
||||
},{}],8:[function(require,module,exports){
|
||||
(function (global, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define(['module', 'select'], factory);
|
||||
} else if (typeof exports !== "undefined") {
|
||||
factory(module, require('select'));
|
||||
} else {
|
||||
var mod = {
|
||||
exports: {}
|
||||
};
|
||||
factory(mod, global.select);
|
||||
global.clipboardAction = mod.exports;
|
||||
}
|
||||
})(this, function (module, _select) {
|
||||
'use strict';
|
||||
|
||||
var _select2 = _interopRequireDefault(_select);
|
||||
|
||||
function _interopRequireDefault(obj) {
|
||||
return obj && obj.__esModule ? obj : {
|
||||
'default': obj
|
||||
};
|
||||
}
|
||||
|
||||
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
|
||||
return typeof obj;
|
||||
} : function (obj) {
|
||||
return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj;
|
||||
};
|
||||
|
||||
function _classCallCheck(instance, Constructor) {
|
||||
if (!(instance instanceof Constructor)) {
|
||||
throw new TypeError("Cannot call a class as a function");
|
||||
}
|
||||
}
|
||||
|
||||
var _createClass = function () {
|
||||
function defineProperties(target, props) {
|
||||
for (var i = 0; i < props.length; i++) {
|
||||
var descriptor = props[i];
|
||||
descriptor.enumerable = descriptor.enumerable || false;
|
||||
descriptor.configurable = true;
|
||||
if ("value" in descriptor) descriptor.writable = true;
|
||||
Object.defineProperty(target, descriptor.key, descriptor);
|
||||
}
|
||||
}
|
||||
|
||||
return function (Constructor, protoProps, staticProps) {
|
||||
if (protoProps) defineProperties(Constructor.prototype, protoProps);
|
||||
if (staticProps) defineProperties(Constructor, staticProps);
|
||||
return Constructor;
|
||||
};
|
||||
}();
|
||||
|
||||
var ClipboardAction = function () {
|
||||
/**
|
||||
* @param {Object} options
|
||||
*/
|
||||
|
||||
function ClipboardAction(options) {
|
||||
_classCallCheck(this, ClipboardAction);
|
||||
|
||||
this.resolveOptions(options);
|
||||
this.initSelection();
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines base properties passed from constructor.
|
||||
* @param {Object} options
|
||||
*/
|
||||
|
||||
|
||||
ClipboardAction.prototype.resolveOptions = function resolveOptions() {
|
||||
var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
|
||||
|
||||
this.action = options.action;
|
||||
this.emitter = options.emitter;
|
||||
this.target = options.target;
|
||||
this.text = options.text;
|
||||
this.trigger = options.trigger;
|
||||
|
||||
this.selectedText = '';
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.initSelection = function initSelection() {
|
||||
if (this.text) {
|
||||
this.selectFake();
|
||||
} else if (this.target) {
|
||||
this.selectTarget();
|
||||
}
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.selectFake = function selectFake() {
|
||||
var _this = this;
|
||||
|
||||
var isRTL = document.documentElement.getAttribute('dir') == 'rtl';
|
||||
|
||||
this.removeFake();
|
||||
|
||||
this.fakeHandlerCallback = function () {
|
||||
return _this.removeFake();
|
||||
};
|
||||
this.fakeHandler = document.body.addEventListener('click', this.fakeHandlerCallback) || true;
|
||||
|
||||
this.fakeElem = document.createElement('textarea');
|
||||
// Prevent zooming on iOS
|
||||
this.fakeElem.style.fontSize = '12pt';
|
||||
// Reset box model
|
||||
this.fakeElem.style.border = '0';
|
||||
this.fakeElem.style.padding = '0';
|
||||
this.fakeElem.style.margin = '0';
|
||||
// Move element out of screen horizontally
|
||||
this.fakeElem.style.position = 'absolute';
|
||||
this.fakeElem.style[isRTL ? 'right' : 'left'] = '-9999px';
|
||||
// Move element to the same position vertically
|
||||
this.fakeElem.style.top = (window.pageYOffset || document.documentElement.scrollTop) + 'px';
|
||||
this.fakeElem.setAttribute('readonly', '');
|
||||
this.fakeElem.value = this.text;
|
||||
|
||||
document.body.appendChild(this.fakeElem);
|
||||
|
||||
this.selectedText = (0, _select2['default'])(this.fakeElem);
|
||||
this.copyText();
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.removeFake = function removeFake() {
|
||||
if (this.fakeHandler) {
|
||||
document.body.removeEventListener('click', this.fakeHandlerCallback);
|
||||
this.fakeHandler = null;
|
||||
this.fakeHandlerCallback = null;
|
||||
}
|
||||
|
||||
if (this.fakeElem) {
|
||||
document.body.removeChild(this.fakeElem);
|
||||
this.fakeElem = null;
|
||||
}
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.selectTarget = function selectTarget() {
|
||||
this.selectedText = (0, _select2['default'])(this.target);
|
||||
this.copyText();
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.copyText = function copyText() {
|
||||
var succeeded = undefined;
|
||||
|
||||
try {
|
||||
succeeded = document.execCommand(this.action);
|
||||
} catch (err) {
|
||||
succeeded = false;
|
||||
}
|
||||
|
||||
this.handleResult(succeeded);
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.handleResult = function handleResult(succeeded) {
|
||||
if (succeeded) {
|
||||
this.emitter.emit('success', {
|
||||
action: this.action,
|
||||
text: this.selectedText,
|
||||
trigger: this.trigger,
|
||||
clearSelection: this.clearSelection.bind(this)
|
||||
});
|
||||
} else {
|
||||
this.emitter.emit('error', {
|
||||
action: this.action,
|
||||
trigger: this.trigger,
|
||||
clearSelection: this.clearSelection.bind(this)
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.clearSelection = function clearSelection() {
|
||||
if (this.target) {
|
||||
this.target.blur();
|
||||
}
|
||||
|
||||
window.getSelection().removeAllRanges();
|
||||
};
|
||||
|
||||
ClipboardAction.prototype.destroy = function destroy() {
|
||||
this.removeFake();
|
||||
};
|
||||
|
||||
_createClass(ClipboardAction, [{
|
||||
key: 'action',
|
||||
set: function set() {
|
||||
var action = arguments.length <= 0 || arguments[0] === undefined ? 'copy' : arguments[0];
|
||||
|
||||
this._action = action;
|
||||
|
||||
if (this._action !== 'copy' && this._action !== 'cut') {
|
||||
throw new Error('Invalid "action" value, use either "copy" or "cut"');
|
||||
}
|
||||
},
|
||||
get: function get() {
|
||||
return this._action;
|
||||
}
|
||||
}, {
|
||||
key: 'target',
|
||||
set: function set(target) {
|
||||
if (target !== undefined) {
|
||||
if (target && (typeof target === 'undefined' ? 'undefined' : _typeof(target)) === 'object' && target.nodeType === 1) {
|
||||
if (this.action === 'copy' && target.hasAttribute('disabled')) {
|
||||
throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');
|
||||
}
|
||||
|
||||
if (this.action === 'cut' && (target.hasAttribute('readonly') || target.hasAttribute('disabled'))) {
|
||||
throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes');
|
||||
}
|
||||
|
||||
this._target = target;
|
||||
} else {
|
||||
throw new Error('Invalid "target" value, use a valid Element');
|
||||
}
|
||||
}
|
||||
},
|
||||
get: function get() {
|
||||
return this._target;
|
||||
}
|
||||
}]);
|
||||
|
||||
return ClipboardAction;
|
||||
}();
|
||||
|
||||
module.exports = ClipboardAction;
|
||||
});
|
||||
|
||||
},{"select":6}],9:[function(require,module,exports){
|
||||
(function (global, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define(['module', './clipboard-action', 'tiny-emitter', 'good-listener'], factory);
|
||||
} else if (typeof exports !== "undefined") {
|
||||
factory(module, require('./clipboard-action'), require('tiny-emitter'), require('good-listener'));
|
||||
} else {
|
||||
var mod = {
|
||||
exports: {}
|
||||
};
|
||||
factory(mod, global.clipboardAction, global.tinyEmitter, global.goodListener);
|
||||
global.clipboard = mod.exports;
|
||||
}
|
||||
})(this, function (module, _clipboardAction, _tinyEmitter, _goodListener) {
|
||||
'use strict';
|
||||
|
||||
var _clipboardAction2 = _interopRequireDefault(_clipboardAction);
|
||||
|
||||
var _tinyEmitter2 = _interopRequireDefault(_tinyEmitter);
|
||||
|
||||
var _goodListener2 = _interopRequireDefault(_goodListener);
|
||||
|
||||
function _interopRequireDefault(obj) {
|
||||
return obj && obj.__esModule ? obj : {
|
||||
'default': obj
|
||||
};
|
||||
}
|
||||
|
||||
function _classCallCheck(instance, Constructor) {
|
||||
if (!(instance instanceof Constructor)) {
|
||||
throw new TypeError("Cannot call a class as a function");
|
||||
}
|
||||
}
|
||||
|
||||
function _possibleConstructorReturn(self, call) {
|
||||
if (!self) {
|
||||
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
||||
}
|
||||
|
||||
return call && (typeof call === "object" || typeof call === "function") ? call : self;
|
||||
}
|
||||
|
||||
function _inherits(subClass, superClass) {
|
||||
if (typeof superClass !== "function" && superClass !== null) {
|
||||
throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
|
||||
}
|
||||
|
||||
subClass.prototype = Object.create(superClass && superClass.prototype, {
|
||||
constructor: {
|
||||
value: subClass,
|
||||
enumerable: false,
|
||||
writable: true,
|
||||
configurable: true
|
||||
}
|
||||
});
|
||||
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
|
||||
}
|
||||
|
||||
var Clipboard = function (_Emitter) {
|
||||
_inherits(Clipboard, _Emitter);
|
||||
|
||||
/**
|
||||
* @param {String|HTMLElement|HTMLCollection|NodeList} trigger
|
||||
* @param {Object} options
|
||||
*/
|
||||
|
||||
function Clipboard(trigger, options) {
|
||||
_classCallCheck(this, Clipboard);
|
||||
|
||||
var _this = _possibleConstructorReturn(this, _Emitter.call(this));
|
||||
|
||||
_this.resolveOptions(options);
|
||||
_this.listenClick(trigger);
|
||||
return _this;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines if attributes would be resolved using internal setter functions
|
||||
* or custom functions that were passed in the constructor.
|
||||
* @param {Object} options
|
||||
*/
|
||||
|
||||
|
||||
Clipboard.prototype.resolveOptions = function resolveOptions() {
|
||||
var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
|
||||
|
||||
this.action = typeof options.action === 'function' ? options.action : this.defaultAction;
|
||||
this.target = typeof options.target === 'function' ? options.target : this.defaultTarget;
|
||||
this.text = typeof options.text === 'function' ? options.text : this.defaultText;
|
||||
};
|
||||
|
||||
Clipboard.prototype.listenClick = function listenClick(trigger) {
|
||||
var _this2 = this;
|
||||
|
||||
this.listener = (0, _goodListener2['default'])(trigger, 'click', function (e) {
|
||||
return _this2.onClick(e);
|
||||
});
|
||||
};
|
||||
|
||||
Clipboard.prototype.onClick = function onClick(e) {
|
||||
var trigger = e.delegateTarget || e.currentTarget;
|
||||
|
||||
if (this.clipboardAction) {
|
||||
this.clipboardAction = null;
|
||||
}
|
||||
|
||||
this.clipboardAction = new _clipboardAction2['default']({
|
||||
action: this.action(trigger),
|
||||
target: this.target(trigger),
|
||||
text: this.text(trigger),
|
||||
trigger: trigger,
|
||||
emitter: this
|
||||
});
|
||||
};
|
||||
|
||||
Clipboard.prototype.defaultAction = function defaultAction(trigger) {
|
||||
return getAttributeValue('action', trigger);
|
||||
};
|
||||
|
||||
Clipboard.prototype.defaultTarget = function defaultTarget(trigger) {
|
||||
var selector = getAttributeValue('target', trigger);
|
||||
|
||||
if (selector) {
|
||||
return document.querySelector(selector);
|
||||
}
|
||||
};
|
||||
|
||||
Clipboard.prototype.defaultText = function defaultText(trigger) {
|
||||
return getAttributeValue('text', trigger);
|
||||
};
|
||||
|
||||
Clipboard.prototype.destroy = function destroy() {
|
||||
this.listener.destroy();
|
||||
|
||||
if (this.clipboardAction) {
|
||||
this.clipboardAction.destroy();
|
||||
this.clipboardAction = null;
|
||||
}
|
||||
};
|
||||
|
||||
return Clipboard;
|
||||
}(_tinyEmitter2['default']);
|
||||
|
||||
/**
|
||||
* Helper function to retrieve attribute value.
|
||||
* @param {String} suffix
|
||||
* @param {Element} element
|
||||
*/
|
||||
function getAttributeValue(suffix, element) {
|
||||
var attribute = 'data-clipboard-' + suffix;
|
||||
|
||||
if (!element.hasAttribute(attribute)) {
|
||||
return;
|
||||
}
|
||||
|
||||
return element.getAttribute(attribute);
|
||||
}
|
||||
|
||||
module.exports = Clipboard;
|
||||
});
|
||||
|
||||
},{"./clipboard-action":8,"good-listener":4,"tiny-emitter":7}]},{},[9])(9)
|
||||
});
|
@ -1,164 +0,0 @@
|
||||
.tooltipped:after {
|
||||
position: absolute;
|
||||
z-index: 1000000;
|
||||
display: none;
|
||||
padding: 5px 8px;
|
||||
font: normal normal 11px/1.5 Helvetica,arial,nimbussansl,liberationsans,freesans,clean,sans-serif,"Segoe UI Emoji","Segoe UI Symbol";
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
text-shadow: none;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: break-word;
|
||||
white-space: pre;
|
||||
pointer-events: none;
|
||||
content: attr(aria-label);
|
||||
background: rgba(0,0,0,0.8);
|
||||
border-radius: 3px;
|
||||
-webkit-font-smoothing: subpixel-antialiased
|
||||
}
|
||||
|
||||
.tooltipped:before {
|
||||
position: absolute;
|
||||
z-index: 1000001;
|
||||
display: none;
|
||||
width: 0;
|
||||
height: 0;
|
||||
color: rgba(0,0,0,0.8);
|
||||
pointer-events: none;
|
||||
content: "";
|
||||
border: 5px solid transparent
|
||||
}
|
||||
|
||||
.tooltipped:hover:before,.tooltipped:hover:after,.tooltipped:active:before,.tooltipped:active:after,.tooltipped:focus:before,.tooltipped:focus:after {
|
||||
display: inline-block;
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
.tooltipped-multiline:hover:after,.tooltipped-multiline:active:after,.tooltipped-multiline:focus:after {
|
||||
display: table-cell
|
||||
}
|
||||
|
||||
.tooltipped-s:after,.tooltipped-se:after,.tooltipped-sw:after {
|
||||
top: 100%;
|
||||
right: 50%;
|
||||
margin-top: 5px
|
||||
}
|
||||
|
||||
.tooltipped-s:before,.tooltipped-se:before,.tooltipped-sw:before {
|
||||
top: auto;
|
||||
right: 50%;
|
||||
bottom: -5px;
|
||||
margin-right: -5px;
|
||||
border-bottom-color: rgba(0,0,0,0.8)
|
||||
}
|
||||
|
||||
.tooltipped-se:after {
|
||||
right: auto;
|
||||
left: 50%;
|
||||
margin-left: -15px
|
||||
}
|
||||
|
||||
.tooltipped-sw:after {
|
||||
margin-right: -15px
|
||||
}
|
||||
|
||||
.tooltipped-n:after,.tooltipped-ne:after,.tooltipped-nw:after {
|
||||
right: 50%;
|
||||
bottom: 100%;
|
||||
margin-bottom: 5px
|
||||
}
|
||||
|
||||
.tooltipped-n:before,.tooltipped-ne:before,.tooltipped-nw:before {
|
||||
top: -5px;
|
||||
right: 50%;
|
||||
bottom: auto;
|
||||
margin-right: -5px;
|
||||
border-top-color: rgba(0,0,0,0.8)
|
||||
}
|
||||
|
||||
.tooltipped-ne:after {
|
||||
right: auto;
|
||||
left: 50%;
|
||||
margin-left: -15px
|
||||
}
|
||||
|
||||
.tooltipped-nw:after {
|
||||
margin-right: -15px
|
||||
}
|
||||
|
||||
.tooltipped-s:after,.tooltipped-n:after {
|
||||
transform: translateX(50%)
|
||||
}
|
||||
|
||||
.tooltipped-w:after {
|
||||
right: 100%;
|
||||
bottom: 50%;
|
||||
margin-right: 5px;
|
||||
-webkit-transform: translateY(50%);
|
||||
-ms-transform: translateY(50%);
|
||||
transform: translateY(50%)
|
||||
}
|
||||
|
||||
.tooltipped-w:before {
|
||||
top: 50%;
|
||||
bottom: 50%;
|
||||
left: -5px;
|
||||
margin-top: -5px;
|
||||
border-left-color: rgba(0,0,0,0.8)
|
||||
}
|
||||
|
||||
.tooltipped-e:after {
|
||||
bottom: 50%;
|
||||
left: 100%;
|
||||
margin-left: 5px;
|
||||
-webkit-transform: translateY(50%);
|
||||
-ms-transform: translateY(50%);
|
||||
transform: translateY(50%)
|
||||
}
|
||||
|
||||
.tooltipped-e:before {
|
||||
top: 50%;
|
||||
right: -5px;
|
||||
bottom: 50%;
|
||||
margin-top: -5px;
|
||||
border-right-color: rgba(0,0,0,0.8)
|
||||
}
|
||||
|
||||
.tooltipped-multiline:after {
|
||||
width: -webkit-max-content;
|
||||
width: -moz-max-content;
|
||||
width: max-content;
|
||||
max-width: 250px;
|
||||
word-break: break-word;
|
||||
word-wrap: normal;
|
||||
white-space: pre-line;
|
||||
border-collapse: separate
|
||||
}
|
||||
|
||||
.tooltipped-multiline.tooltipped-s:after,.tooltipped-multiline.tooltipped-n:after {
|
||||
right: auto;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%)
|
||||
}
|
||||
|
||||
.tooltipped-multiline.tooltipped-w:after,.tooltipped-multiline.tooltipped-e:after {
|
||||
right: 100%
|
||||
}
|
||||
|
||||
@media screen and (min-width: 0\0) {
|
||||
.tooltipped-multiline:after {
|
||||
width:250px
|
||||
}
|
||||
}
|
||||
|
||||
.tooltipped-sticky:before,.tooltipped-sticky:after {
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.tooltipped-sticky.tooltipped-multiline:after {
|
||||
display: table-cell
|
||||
}
|
@ -1,18 +0,0 @@
|
||||
function showTooltip(elem, msg) {
|
||||
elem.setAttribute('class', 'btn-clipboard tooltipped tooltipped-s');
|
||||
elem.setAttribute('aria-label', msg);
|
||||
}
|
||||
function fallbackMessage(action) {
|
||||
var actionMsg = '';
|
||||
var actionKey = (action === 'cut' ? 'X' : 'C');
|
||||
if (/iPhone|iPad/i.test(navigator.userAgent)) {
|
||||
actionMsg = 'No support :(';
|
||||
}
|
||||
else if (/Mac/i.test(navigator.userAgent)) {
|
||||
actionMsg = 'Press ⌘-' + actionKey + ' to ' + action;
|
||||
}
|
||||
else {
|
||||
actionMsg = 'Press Ctrl-' + actionKey + ' to ' + action;
|
||||
}
|
||||
return actionMsg;
|
||||
}
|
@ -187,3 +187,29 @@ window.register_update_relative = function (get_times, show_relative, interval)
|
||||
|
||||
return update_relative_time;
|
||||
};
|
||||
|
||||
// Placeholder polyfill
|
||||
$('input[placeholder]').each(function() {
|
||||
if ($(this).val() == '') {
|
||||
|
||||
$(this).val($(this).attr('placeholder'));
|
||||
$(this).focus(function() {
|
||||
if ($(this).val() == $(this).attr('placeholder')) $(this).val('');
|
||||
|
||||
});
|
||||
$(this).blur(function() {
|
||||
if ($(this).val() == '') {
|
||||
$(this).val($(this).attr('placeholder'));
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('form').submit(function(evt) {
|
||||
$('input[placeholder]').each(function() {
|
||||
if ($(this).attr('placeholder') == $(this).val()) {
|
||||
$(this).val('');
|
||||
}
|
||||
});
|
||||
evt.preventDefault();
|
||||
});
|
||||
|
8
resources/featherlight.min.css
vendored
8
resources/featherlight.min.css
vendored
@ -1,8 +0,0 @@
|
||||
/**
|
||||
* Featherlight - ultra slim jQuery lightbox
|
||||
* Version 1.2.1 - http://noelboss.github.io/featherlight/
|
||||
*
|
||||
* Copyright 2015, Noël Raoul Bossart (http://www.noelboss.com)
|
||||
* MIT Licensed.
|
||||
**/
|
||||
@media all{.featherlight{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2;text-align:center;white-space:nowrap;cursor:pointer;background:#333;background:rgba(0,0,0,0)}.featherlight:last-of-type{background:rgba(0,0,0,.8)}.featherlight:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-.25em}.featherlight .featherlight-content{position:relative;text-align:left;vertical-align:middle;display:inline-block;overflow:auto;padding:25px 25px 0;border-bottom:25px solid transparent;min-width:30%;margin-left:5%;margin-right:5%;max-height:95%;background:#fff;cursor:auto;white-space:normal}.featherlight .featherlight-inner{display:block}.featherlight .featherlight-close-icon{position:absolute;z-index:9999;top:0;right:0;line-height:25px;width:25px;cursor:pointer;text-align:center;font:Arial,sans-serif;background:#fff;background:rgba(255,255,255,.3);color:#000}.featherlight .featherlight-image{width:100%}.featherlight-iframe .featherlight-content{border-bottom:0;padding:0}.featherlight iframe{border:0}}@media only screen and (max-width:1024px){.featherlight .featherlight-content{margin-left:10px;margin-right:10px;max-height:98%;padding:10px 10px 0;border-bottom:10px solid transparent}}
|
8
resources/featherlight.min.js
vendored
8
resources/featherlight.min.js
vendored
File diff suppressed because one or more lines are too long
117
resources/jquery-cookie.js
vendored
117
resources/jquery-cookie.js
vendored
@ -1,117 +0,0 @@
|
||||
/**
|
||||
* jQuery Cookie Plugin v1.4.1
|
||||
* https://github.com/carhartl/jquery-cookie
|
||||
*
|
||||
* Copyright 2013 Klaus Hartl
|
||||
* Released under the MIT license
|
||||
*/
|
||||
(function (factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof exports === 'object') {
|
||||
// CommonJS
|
||||
factory(require('jquery'));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
}(function ($) {
|
||||
|
||||
var pluses = /\+/g;
|
||||
|
||||
function encode(s) {
|
||||
return config.raw ? s : encodeURIComponent(s);
|
||||
}
|
||||
|
||||
function decode(s) {
|
||||
return config.raw ? s : decodeURIComponent(s);
|
||||
}
|
||||
|
||||
function stringifyCookieValue(value) {
|
||||
return encode(config.json ? JSON.stringify(value) : String(value));
|
||||
}
|
||||
|
||||
function parseCookieValue(s) {
|
||||
if (s.indexOf('"') === 0) {
|
||||
// This is a quoted cookie as according to RFC2068, unescape...
|
||||
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
|
||||
}
|
||||
|
||||
try {
|
||||
// Replace server-side written pluses with spaces.
|
||||
// If we can't decode the cookie, ignore it, it's unusable.
|
||||
// If we can't parse the cookie, ignore it, it's unusable.
|
||||
s = decodeURIComponent(s.replace(pluses, ' '));
|
||||
return config.json ? JSON.parse(s) : s;
|
||||
} catch(e) {}
|
||||
}
|
||||
|
||||
function read(s, converter) {
|
||||
var value = config.raw ? s : parseCookieValue(s);
|
||||
return $.isFunction(converter) ? converter(value) : value;
|
||||
}
|
||||
|
||||
var config = $.cookie = function (key, value, options) {
|
||||
|
||||
// Write
|
||||
|
||||
if (value !== undefined && !$.isFunction(value)) {
|
||||
options = $.extend({}, config.defaults, options);
|
||||
|
||||
if (typeof options.expires === 'number') {
|
||||
var days = options.expires, t = options.expires = new Date();
|
||||
t.setTime(+t + days * 864e+5);
|
||||
}
|
||||
|
||||
return (document.cookie = [
|
||||
encode(key), '=', stringifyCookieValue(value),
|
||||
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
|
||||
options.path ? '; path=' + options.path : '',
|
||||
options.domain ? '; domain=' + options.domain : '',
|
||||
options.secure ? '; secure' : ''
|
||||
].join(''));
|
||||
}
|
||||
|
||||
// Read
|
||||
|
||||
var result = key ? undefined : {};
|
||||
|
||||
// To prevent the for loop in the first place assign an empty array
|
||||
// in case there are no cookies at all. Also prevents odd result when
|
||||
// calling $.cookie().
|
||||
var cookies = document.cookie ? document.cookie.split('; ') : [];
|
||||
|
||||
for (var i = 0, l = cookies.length; i < l; i++) {
|
||||
var parts = cookies[i].split('=');
|
||||
var name = decode(parts.shift());
|
||||
var cookie = parts.join('=');
|
||||
|
||||
if (key && key === name) {
|
||||
// If second argument (value) is a function it's a converter...
|
||||
result = read(cookie, value);
|
||||
break;
|
||||
}
|
||||
|
||||
// Prevent storing a cookie that we couldn't decode.
|
||||
if (!key && (cookie = read(cookie)) !== undefined) {
|
||||
result[name] = cookie;
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
config.defaults = {};
|
||||
|
||||
$.removeCookie = function (key, options) {
|
||||
if ($.cookie(key) === undefined) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Must not alter options, thus extending a fresh object...
|
||||
$.cookie(key, '', $.extend({}, options, { expires: -1 }));
|
||||
return !$.cookie(key);
|
||||
};
|
||||
|
||||
}));
|
@ -1,56 +0,0 @@
|
||||
/**
|
||||
* jQuery Unveil
|
||||
* A very lightweight jQuery plugin to lazy load images
|
||||
* http://luis-almeida.github.com/unveil
|
||||
*
|
||||
* Licensed under the MIT license.
|
||||
* Copyright 2013 Luís Almeida
|
||||
* https://github.com/luis-almeida
|
||||
*/
|
||||
|
||||
;(function($) {
|
||||
|
||||
$.fn.unveil = function(threshold, callback) {
|
||||
|
||||
var $w = $(window),
|
||||
th = threshold || 0,
|
||||
retina = window.devicePixelRatio > 1,
|
||||
attrib = retina? "data-src-retina" : "data-src",
|
||||
images = this,
|
||||
loaded;
|
||||
|
||||
this.one("unveil", function() {
|
||||
var source = this.getAttribute(attrib);
|
||||
source = source || this.getAttribute("data-src");
|
||||
if (source) {
|
||||
this.setAttribute("src", source);
|
||||
if (typeof callback === "function") callback.call(this);
|
||||
}
|
||||
});
|
||||
|
||||
function unveil() {
|
||||
var inview = images.filter(function() {
|
||||
var $e = $(this);
|
||||
if ($e.is(":hidden")) return;
|
||||
|
||||
var wt = $w.scrollTop(),
|
||||
wb = wt + $w.height(),
|
||||
et = $e.offset().top,
|
||||
eb = et + $e.height();
|
||||
|
||||
return eb >= wt - th && et <= wb + th;
|
||||
});
|
||||
|
||||
loaded = inview.trigger("unveil");
|
||||
images = images.not(loaded);
|
||||
}
|
||||
|
||||
$w.on("scroll.unveil resize.unveil lookup.unveil", unveil);
|
||||
|
||||
unveil();
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
})(window.jQuery || window.Zepto);
|
3973
resources/moment.js
3973
resources/moment.js
File diff suppressed because it is too large
Load Diff
@ -1,24 +0,0 @@
|
||||
$('input[placeholder]').each(function() {
|
||||
if ($(this).val() == '') {
|
||||
|
||||
$(this).val($(this).attr('placeholder'));
|
||||
$(this).focus(function() {
|
||||
if ($(this).val() == $(this).attr('placeholder')) $(this).val('');
|
||||
|
||||
});
|
||||
$(this).blur(function() {
|
||||
if ($(this).val() == '') {
|
||||
$(this).val($(this).attr('placeholder'));
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('form').submit(function(evt) {
|
||||
$('input[placeholder]').each(function() {
|
||||
if ($(this).attr('placeholder') == $(this).val()) {
|
||||
$(this).val('');
|
||||
}
|
||||
});
|
||||
evt.preventDefault();
|
||||
});
|
File diff suppressed because it is too large
Load Diff
@ -1,44 +0,0 @@
|
||||
.map-inset {
|
||||
padding-bottom: 50%;
|
||||
background-size: cover !important;
|
||||
position: relative;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.map-wrap {
|
||||
padding: 1px;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.map-inset span {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
margin: -3px 0 0 -3px;
|
||||
background: #fff;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #4e7cad;
|
||||
}
|
||||
|
||||
.map-inset span.active {
|
||||
background: #4e7cad;
|
||||
}
|
||||
|
||||
.map-inset .map-axis-x {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
border-left: 1px solid rgba(78, 124, 173, 0.5);
|
||||
width: 0;
|
||||
transition: left 100ms ease-out;
|
||||
}
|
||||
|
||||
.map-inset .map-axis-y {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
border-top: 1px solid rgba(78, 124, 173, 0.5);
|
||||
height: 0;
|
||||
transition: top 100ms ease-out;
|
||||
}
|
@ -1,90 +0,0 @@
|
||||
window.timezone_picker = function ($map, $field, json_data) {
|
||||
var $axisX = $map.find('.map-axis-x'),
|
||||
$axisY = $map.find('.map-axis-y'),
|
||||
width = $map.outerWidth(),
|
||||
height = $map.outerHeight(),
|
||||
lastCenter,
|
||||
centers = [];
|
||||
|
||||
$(window).resize(function () {
|
||||
width = $map.outerWidth();
|
||||
height = $map.outerHeight();
|
||||
}).resize();
|
||||
|
||||
function changeCenter(center) {
|
||||
if (center === lastCenter) {
|
||||
return;
|
||||
}
|
||||
if (lastCenter) {
|
||||
lastCenter.deactivate();
|
||||
}
|
||||
center.activate();
|
||||
lastCenter = center;
|
||||
}
|
||||
|
||||
function Center(data) {
|
||||
this.name = data.name;
|
||||
this.x = (180 + data['long']) / 360;
|
||||
this.y = (90 - data.lat) / 180;
|
||||
this.dom = $('<span>').appendTo($map).css({
|
||||
left: this.x * 100 + '%',
|
||||
top: this.y * 100 + '%'
|
||||
});
|
||||
if (this.name === $field.val())
|
||||
changeCenter(this);
|
||||
}
|
||||
|
||||
Center.prototype = {
|
||||
distSqr: function (x, y) {
|
||||
var dx = this.x - x,
|
||||
dy = this.y - y;
|
||||
return dx * dx + dy * dy;
|
||||
},
|
||||
activate: function () {
|
||||
$field.val(this.name);
|
||||
$axisX.css('left', this.x * 100 + '%');
|
||||
$axisY.css('top', this.y * 100 + '%');
|
||||
},
|
||||
deactivate: function () {
|
||||
this.dom.removeClass('active');
|
||||
}
|
||||
};
|
||||
|
||||
$.getJSON(json_data).then(function (data) {
|
||||
for (var name in data.zones)
|
||||
centers.push(new Center(data.zones[name]));
|
||||
});
|
||||
|
||||
$map.click(function (e) {
|
||||
var offset = $(this).offset(),
|
||||
x = e.pageX - offset.left,
|
||||
y = e.pageY - offset.top,
|
||||
px = x / width,
|
||||
py = y / height,
|
||||
dist,
|
||||
closestDist = 100,
|
||||
closestCenter,
|
||||
i;
|
||||
|
||||
for (i = 0; i < centers.length; i++) {
|
||||
dist = centers[i].distSqr(px, py);
|
||||
if (dist < closestDist) {
|
||||
closestCenter = centers[i];
|
||||
closestDist = dist;
|
||||
}
|
||||
}
|
||||
|
||||
if (closestCenter) {
|
||||
changeCenter(closestCenter);
|
||||
}
|
||||
});
|
||||
|
||||
$field.change(function(e) {
|
||||
var tz = $(this).val();
|
||||
for (var i = 0; i < centers.length; i++)
|
||||
if (centers[i].name == tz) {
|
||||
changeCenter(centers[i]);
|
||||
break;
|
||||
}
|
||||
})
|
||||
};
|
File diff suppressed because one or more lines are too long
@ -1,4 +1,3 @@
|
||||
<!-- save this file as unselectable.htc and remember where you put it -->
|
||||
<public:component lightweight="true">
|
||||
<public:attach event="ondocumentready" onevent="unselectable()"/>
|
||||
<script type="text/javascript">
|
||||
|
@ -58,7 +58,7 @@ html(lang=LANGUAGE_CODE)
|
||||
link(rel='stylesheet', href='{% static "style.css" %}')
|
||||
if PYGMENT_THEME
|
||||
link(rel='stylesheet', href='{% static PYGMENT_THEME %}')
|
||||
link(rel='stylesheet', href='{% static "libs/font-awesome.css" %}')
|
||||
link(rel='stylesheet', href='{% static "libs/libs/fontawesome/font-awesome.css" %}')
|
||||
else
|
||||
- compress css
|
||||
link(rel='stylesheet', href='{% static "style.css" %}')
|
||||
@ -73,9 +73,9 @@ html(lang=LANGUAGE_CODE)
|
||||
- autoescape off
|
||||
- inlinei18n LANGUAGE_CODE
|
||||
script(src='{% static "libs/jquery-1.11.2.min.js" %}')
|
||||
script(src='{% static "jquery-cookie.js" %}')
|
||||
script(src='{% static "libs/jquery-cookie.js" %}')
|
||||
script(src='{% static "common.js" %}')
|
||||
script(src='{% static "jquery.unveil.js" %}')
|
||||
script(src='{% static "libs/jquery.unveil.js" %}')
|
||||
script.
|
||||
$(function () { $('img.unveil').unveil(200); });
|
||||
else
|
||||
@ -83,9 +83,9 @@ html(lang=LANGUAGE_CODE)
|
||||
- autoescape off
|
||||
- inlinei18n LANGUAGE_CODE
|
||||
script(src=JQUERY_JS)
|
||||
script(src='{% static "jquery-cookie.js" %}')
|
||||
script(src='{% static "libs/jquery-cookie.js" %}')
|
||||
script(src='{% static "common.js" %}')
|
||||
script(src='{% static "jquery.unveil.js" %}')
|
||||
script(src='{% static "libs/jquery.unveil.js" %}')
|
||||
script.
|
||||
$(function () { $('img.unveil').unveil(200); });
|
||||
block js_media
|
||||
|
@ -1,11 +1,10 @@
|
||||
- load compress
|
||||
- load staticfiles
|
||||
|
||||
script(type='text/javascript', src='{% static "moment.js" %}')
|
||||
script(src='{% static "featherlight.min.js" %}', type='text/javascript')
|
||||
script(type='text/javascript', src='{% static "libs/moment.js" %}')
|
||||
script(src='{% static "featherlight/libs/featherlight/featherlight.min.js" %}', type='text/javascript')
|
||||
|
||||
- compress js
|
||||
script(src='{% static "placeholder-compat.js" %}', type='text/javascript')
|
||||
| #{comment_form.media.js}
|
||||
|
||||
script(type='text/javascript').
|
||||
|
@ -1,7 +1,7 @@
|
||||
- load compress
|
||||
- load staticfiles
|
||||
|
||||
link(href='{% static "featherlight.min.css" %}', type='text/css', rel='stylesheet', media='all')
|
||||
link(href='{% static "libs/featherlight/featherlight.min.css" %}', type='text/css', rel='stylesheet', media='all')
|
||||
|
||||
- compress css
|
||||
| #{comment_form.media.css}
|
||||
|
@ -8,7 +8,7 @@ block meta
|
||||
meta(name='description', content="The {{ SITE_NAME }}'s contest list - past, present, and future.")
|
||||
|
||||
block js_media
|
||||
script(src='{% static "featherlight.min.js" %}', type='text/javascript')
|
||||
script(src='{% static "libs/featherlight/featherlight.min.js" %}', type='text/javascript')
|
||||
script(type='text/javascript').
|
||||
$(document).ready(function () {
|
||||
$('.time-remaining').each(function () {
|
||||
@ -19,7 +19,7 @@ block js_media
|
||||
});
|
||||
|
||||
block media
|
||||
link(href='{% static "featherlight.min.css" %}', type='text/css', rel='stylesheet', media='all')
|
||||
link(href='{% static "libs/featherlight/featherlight.min.css" %}', type='text/css', rel='stylesheet', media='all')
|
||||
|
||||
block header
|
||||
div(style='float: right; margin-top: 0.9em; font-size: 1.3em;')
|
||||
|
@ -1,5 +1,5 @@
|
||||
- load staticfiles
|
||||
script(src='{% static "tablesorter.js" %}', type='text/javascript')
|
||||
script(src='{% static "libs/tablesorter.js" %}', type='text/javascript')
|
||||
script(type='text/javascript').
|
||||
$(document).ready(function () {
|
||||
var table = $("#judge-status");
|
||||
|
@ -5,7 +5,7 @@ extends base
|
||||
- load i18n
|
||||
|
||||
block js_media
|
||||
script(src='{% static "tablesorter.js" %}', type='text/javascript')
|
||||
script(src='{% static "libs/tablesorter.js" %}', type='text/javascript')
|
||||
script(type='text/javascript').
|
||||
$(document).ready(function () {
|
||||
var table = $("#judge-status");
|
||||
|
@ -4,7 +4,7 @@ extends base
|
||||
- load i18n
|
||||
|
||||
block js_media
|
||||
script(src='{% static "tablesorter.js" %}', type='text/javascript')
|
||||
script(src='{% static "libs/tablesorter.js" %}', type='text/javascript')
|
||||
script(type='text/javascript').
|
||||
$(document).ready(function () {
|
||||
$("#organization-table").tablesorter();
|
||||
|
@ -49,7 +49,7 @@ block js_media
|
||||
});
|
||||
|
||||
if IN_CONTEST
|
||||
script(src='{% static "tablesorter.js" %}', type='text/javascript')
|
||||
script(src='{% static "libs/tablesorter.js" %}', type='text/javascript')
|
||||
script(type='text/javascript').
|
||||
$(function() {
|
||||
$.tablesorter.addParser({
|
||||
|
@ -3,7 +3,7 @@ extends base
|
||||
- load i18n
|
||||
|
||||
block media
|
||||
link(rel='stylesheet', href='{% static "timezone-map.css" %}')
|
||||
link(rel='stylesheet', href='{% static "libs/timezone-map/timezone-map.css" %}')
|
||||
| #{form.media.css}
|
||||
style.
|
||||
.map-inset { background: url('#{TIMEZONE_MAP}') 50% 50% }
|
||||
@ -28,12 +28,12 @@ block body
|
||||
div.map-axis-y
|
||||
|
||||
block bodyend
|
||||
script(type='text/javascript', src='{% static "timezone-picker.js" %}')
|
||||
script(type='text/javascript', src='{% static "libs/timezone-map/timezone-picker.js" %}')
|
||||
script(type='text/javascript').
|
||||
$(function () {
|
||||
$('#open-map').featherlight({
|
||||
afterOpen: function () {
|
||||
timezone_picker($('.featherlight-inner .map-inset'), $('#id_timezone'), '{% static "timezone-picker.json" %}');
|
||||
timezone_picker($('.featherlight-inner .map-inset'), $('#id_timezone'), '{% static "libs/timezone-map/libs/timezone-map/timezone-picker.json" %}');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
@ -24,7 +24,7 @@ block js_media
|
||||
| window.show_problem = 1;
|
||||
else
|
||||
| window.show_problem = 0;
|
||||
script(type='text/javascript', src='{% static "moment.js" %}')
|
||||
script(type='text/javascript', src='{% static "libs/moment.js" %}')
|
||||
if has_select2
|
||||
script(type='text/javascript', src='{{ SELECT2_JS_URL }}')
|
||||
script.
|
||||
|
@ -1,13 +1,13 @@
|
||||
- load compress
|
||||
- load staticfiles
|
||||
- compress js
|
||||
script(src='{% static "featherlight.min.js" %}', type='text/javascript', charset='utf-8')
|
||||
script(type='text/javascript', src='{% static "timezone-picker.js" %}')
|
||||
script(src='{% static "featherlight/libs/featherlight/featherlight.min.js" %}', type='text/javascript', charset='utf-8')
|
||||
script(type='text/javascript', src='{% static "libs/timezone-map/timezone-picker.js" %}')
|
||||
script(type='text/javascript').
|
||||
$(function () {
|
||||
$('#open-map').featherlight({
|
||||
afterOpen: function () {
|
||||
timezone_picker($('.featherlight-inner .map-inset'), $('#id_timezone'), '{% static "timezone-picker.json" %}');
|
||||
timezone_picker($('.featherlight-inner .map-inset'), $('#id_timezone'), '{% static "libs/timezone-map/libs/timezone-map/timezone-picker.json" %}');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
@ -4,8 +4,8 @@
|
||||
if TIMEZONE_BG
|
||||
style.
|
||||
.map-wrap { background: #{TIMEZONE_BG} }
|
||||
link(rel='stylesheet', href='{% static "timezone-map.css" %}')
|
||||
link(type='text/css', rel='stylesheet', href='{% static "featherlight.min.css" %}')
|
||||
link(rel='stylesheet', href='{% static "libs/timezone-map/timezone-map.css" %}')
|
||||
link(type='text/css', rel='stylesheet', href='{% static "libs/featherlight/featherlight.min.css" %}')
|
||||
style.
|
||||
.map-inset { background: url('#{TIMEZONE_MAP}') 50% 50% }
|
||||
.map-wrap { display: none }
|
||||
|
Loading…
Reference in New Issue
Block a user