alahouze/accountant
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Commented, cleaned up...

Browse Source
This commit is contained in:
Alexis Lahouze 2013-01-13 13:47:27 +01:00
parent b5e8850aa8
commit 2bc65a3f93
1 changed files with 53 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
src/html/js/entries.js
View File

@ -341,97 +341,120 @@ var ListViewModel = function() {
};
};
// Function to draw the sold evolution chart.
drawChart = function(entries, element) {
// clear previous chart
// Clear previous chart
$(element).html("");
if(entries && entries.length > 0) {
var chartValues = [[], []];
chartValues[0] = entries;
// Prepare for today vertical line.
var today = new Date();
today.setHours(0);
today.setMinutes(0);
// Find first and last days to set limits of the x axis.
var day = 24 * 60 * 60 * 1000;
var firstDate = new Date(Date.parse(entries[0][0]).valueOf() - day).format('yyyy-mm-dd');
var lastDate = new Date(Date.parse(entries[entries.length -1][0]).valueOf() + day).format('yyyy-mm-dd');
// plot chart
window.chart = $.jqplot(element.id, chartValues, {
// Plot chart, and store it in a window parameter for resize callback (need to be done better than it...)
window.chart = $.jqplot(element.id, [entries], {
// Title of the chart
title: "Évolution du solde",
axes:{
// Parameters for the date axis
xaxis:{
autoscale: true,
// Date rendere for this axis
renderer:$.jqplot.DateAxisRenderer,
// Limits
min: firstDate,
max: lastDate,
tickOptions: {formatString: "%F"}
// Tick options
tickOptions: {
// Format date for x axis.
formatString: "%F"
}
},
// Parameters for the value axis
yaxis: {
autoscale: true,
}
},
// Highlighter parameters
highlighter: {
show:true,
show: true,
yvalues: 4,
formatString:'<table class="jqplot-highlighter"><tr><td>date:</td><td>%s</td></tr><tr><td>open:</td><td>%s</td></tr><tr><td>hi:</td><td>%s</td></tr><tr><td>low:</td><td>%s</td></tr><tr><td>close:</td><td>%s</td></tr></table>'
formatString: '<table class="jqplot-highlighter"><tr><td>date:</td><td>%s</td></tr><tr><td>open:</td><td>%s</td></tr><tr><td>hi:</td><td>%s</td></tr><tr><td>low:</td><td>%s</td></tr><tr><td>close:</td><td>%s</td></tr></table>'
},
// Series parameters
series: [{
// We use the OHLC (open, high, low, close) rendered.
renderer:$.jqplot.OHLCRenderer,
color: "blue",
lineWidth: 3,
rendererOptions:{}
}],
// To display horizontal (0) and vertical (today) lines
canvasOverlay: {
show: true,
objects: [{
dashedHorizontalLine: {
objects: [
// Red horizontal line for 0 limit
{dashedHorizontalLine: {
name: "zero",
y: 0,
lineWidth: 1,
color: "red",
shadow: false
}},
// Gray vertical line for today
{ dashedVerticalLine: {
name: "today",
x: today,
lineWidth: 1,
color: "gray",
shadow: false
}}]
}}
]
}
});
} else {
// Reset chart to null to avoid redraw of a non existing chart in resize callback.
window.chart = null;
}
};
// Function to draw the expense category pie chart.
drawPieChart = function(entries, element) {
// clear previous chart
// Clear previous chart
$(element).html("");
if(entries && entries.length > 0) {
var chartValues = [[]];
chartValues[0] = entries;
// plot chart
window.pieChart = $.jqplot(element.id, chartValues, {
// Plot chart, and store it in a window parameter for resize callback (need to be done better than it...)
window.pieChart = $.jqplot(element.id, [entries], {
// Title of the chart
title: "D&eacute;penses",
// Series parameters.
seriesDefaults: {
// Pie chart renderer
renderer: $.jqplot.PieRenderer,
rendererOptions: {
showDataLabels: true
}
},
// Legend parameters.
legend: {
show: true,
location: 'e'
},
// Highlighter parameters;
highlighter: {
show: true,
formatString:'%s: %s',
@ -440,10 +463,12 @@ drawPieChart = function(entries, element) {
}
});
} else {
// Reset chart to null to avoid redraw of a non existing chart in resize callback.
window.pieChart = null;
}
};
// Chart binding to redraw the chart on entries update.
ko.bindingHandlers.chart = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
// empty - left as placeholder if needed later
@ -453,12 +478,12 @@ ko.bindingHandlers.chart = {
var unwrap = ko.utils.unwrapObservable;
var dataSource = valueAccessor();
//var entries = dataSource ? unwrap(dataSource) : null;
var entries = dataSource ? unwrap(dataSource) : null;
drawChart(entries, element);
}
};
// Pie chart binding to redraw expense chart on entries update.
ko.bindingHandlers.pieChart = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
// empty - left as placeholder if needed later
@ -468,16 +493,17 @@ ko.bindingHandlers.pieChart = {
var unwrap = ko.utils.unwrapObservable;
var dataSource = valueAccessor();
//var entries = dataSource ? unwrap(dataSource) : null;
var entries = dataSource ? unwrap(dataSource) : null;
drawPieChart(entries, element);
}
};
// Default AJAX error handler.
$(document).ajaxError(function(event, xhr, settings) {
message("error", "Error.", xhr.statusText);
});
// Resize callback.
$(window).resize(function() {
if(window.chart) {
window.chart.replot({resetAxes: true});
@ -488,8 +514,10 @@ $(window).resize(function() {
}
});
// ViewModal instanciation.
var viewModel = new ListViewModel();
ko.applyBindings(viewModel);
// Load accounts after page initialization.
$(viewModel.loadAccounts);