diff options
Diffstat (limited to 'data/templates/stats')
-rw-r--r-- | data/templates/stats/index.html | 19 | ||||
-rw-r--r-- | data/templates/stats/profit_per_day.html | 80 | ||||
-rw-r--r-- | data/templates/stats/profit_per_product.html | 42 | ||||
-rw-r--r-- | data/templates/stats/profit_per_weekday.html | 30 | ||||
-rw-r--r-- | data/templates/stats/stock.html | 83 |
5 files changed, 254 insertions, 0 deletions
diff --git a/data/templates/stats/index.html b/data/templates/stats/index.html new file mode 100644 index 0000000..987c90f --- /dev/null +++ b/data/templates/stats/index.html @@ -0,0 +1,19 @@ +<h2>Statistics</h2> + +<div style="display:block"> + <table class="table table-bordered table-striped"> + <tr><th>Number of Articles</th><td>{{{NUMBER_OF_ARTICLES}}}</td></tr> + <tr><th>Number of Users</th><td>{{{NUMBER_OF_USERS}}}</td></tr> + <tr><th>Stock Value</th><td>{{{STOCK_VALUE}}}</td></tr> + <tr><th>Total Sales</th><td>{{{TOTAL_SALES}}}</td></tr> + <tr><th>Total Profit</th><td>{{{TOTAL_PROFIT}}}</td></tr> + <tr><th>Sales Today</th><td>{{{SALES_TODAY}}}</td></tr> + <tr><th>Profit Today</th><td>{{{PROFIT_TODAY}}}</td></tr> + <tr><th>Sales this Month</th><td>{{{SALES_THIS_MONTH}}}</td></tr> + <tr><th>Profit this Month</th><td>{{{PROFIT_THIS_MONTH}}}</td></tr> + <tr><th>Avg. Sales/Day</th><td>{{{SALES_PER_DAY}}}</td></tr> + <tr><th>Avg. Profit/Day</th><td>{{{PROFIT_PER_DAY}}}</td></tr> + <tr><th>Avg. Sales/Month</th><td>{{{SALES_PER_MONTH}}}</td></tr> + <tr><th>Avg. Profit/Month</th><td>{{{PROFIT_PER_MONTH}}}</td></tr> + </table> +</div> diff --git a/data/templates/stats/profit_per_day.html b/data/templates/stats/profit_per_day.html new file mode 100644 index 0000000..5af05dc --- /dev/null +++ b/data/templates/stats/profit_per_day.html @@ -0,0 +1,80 @@ + <div id="placeholder" style="width:800px;height:400px;float: left;"></div> + <div style="float: left;"> + <button id="resetzoom" class="btn">Reset Zoom</button> + <br><br> + <ul id="overviewLegend"> + </ul> + </div> + +<script type="text/javascript"> +$(function () { + var datasets = {{{DATA}}}; + + // hard-code color indices to prevent them from shifting as + // countries are turned on/off + var i = 0, choiceContainer = $("#overviewLegend"); + + $.each(datasets, function(key, val) { + val.color = i; + ++i; + l = val.label; + var li = $('<li />').appendTo(choiceContainer); + + $('<input name="' + key + '" id="' + key + '" type="checkbox" checked="checked" />').appendTo(li); + $('<label>', { + text: l, + 'for': l + }).appendTo(li); + }); + + choiceContainer.find("input").click(plotAccordingToChoices); + + function plotAccordingToChoices() { + var data = []; + + choiceContainer.find("input:checked").each(function () { + var key = $(this).attr("name"); + if (key && datasets[key]) + data.push(datasets[key]); + }); + + var options = { + legend: { + show: true + }, + series: { + lines: { show: true }, + points: { show: true} + }, + yaxis: { + mode: "money", + tickDecimals: 2, + tickFormatter: function suffixFormatter(val, axis) { + return val.toFixed(axis.tickDecimals) + "€" + } + }, + xaxis: { + mode: "time", + timeformat: "%y-%0m-%0d" + }, + zoom: { + interactive: true + }, + pan: { + interactive: true + } + } + + if (data.length > 0) + $.plot($("#placeholder"), data, options); + } + + plotAccordingToChoices(); + + $("#resetzoom").click(function(eventObject) { plotAccordingToChoices(); }); + + $('.legendColorBox > div').each(function(i){ + $(this).clone().prependTo(choiceContainer.find("li").eq(i)); + }); +}); +</script> diff --git a/data/templates/stats/profit_per_product.html b/data/templates/stats/profit_per_product.html new file mode 100644 index 0000000..7d8b50f --- /dev/null +++ b/data/templates/stats/profit_per_product.html @@ -0,0 +1,42 @@ +<h1>Profit per Product (members only)</h1> +<div id="profit_per_product" style="width:800px;height:400px;float: left;"></div> +<div id="profit_per_product_info" style="clear: left;"></div> + +<script type="text/javascript"> +function pieHover(event, pos, obj) { + if(!obj) return; + + percent = parseFloat(obj.series.percent).toFixed(2); + $("#profit_per_product_info").html('<span style="font-weight:bold; color: "'+obj.series.color+'">'+obj.series.label+' ('+obj.series.data[0][1]+'€ / '+percent+'%)</span>'); +} + +$(function () { + var data = {{{DATA}}}; + + var options = { + legend: { + show: true + }, + series: { + pie: { + show: true, + combine: { + color: '#999', + threshold: 0.01 + } + } + }, + grid: { + hoverable: true, + clickable: true + } + } + + if (data.length > 0) + $.plot($("#profit_per_product"), data, options); + else + $.plot($("#profit_per_product"), [], options); + + $("#profit_per_product").bind("plothover", pieHover); +}); +</script> diff --git a/data/templates/stats/profit_per_weekday.html b/data/templates/stats/profit_per_weekday.html new file mode 100644 index 0000000..d9f3e43 --- /dev/null +++ b/data/templates/stats/profit_per_weekday.html @@ -0,0 +1,30 @@ +<h1>Profit per Weekday (last 8 weeks, members only)</h1> +<div id="placeholder" style="width:800px;height:400px;float: left;"></div> + +<script type="text/javascript"> +$(function () { + var data = {{{DATA}}}; + + var options = { + legend: { + show: false + }, + series: { + pie: { + show: true, + label: { + show: true, + formatter: function(label, series) { + return "<div style=\"font-size:x-small;text-align:center;padding:2px;color:"+series.color+";\">"+label+"<br/>"+series.data[0][1]+"€ ("+Math.round(series.percent)+"%)</div>"; + } + } + } + } + } + + if (data.length > 0) + $.plot($("#placeholder"), data, options); + else + $.plot($("#placeholder"), [], options); +}); +</script> diff --git a/data/templates/stats/stock.html b/data/templates/stats/stock.html new file mode 100644 index 0000000..710bf60 --- /dev/null +++ b/data/templates/stats/stock.html @@ -0,0 +1,83 @@ + <div id="placeholder" style="width:800px;height:400px;float: left;"></div> + <div style="float: left;"> + <button id="resetzoom" class="btn">Reset Zoom</button> + <br><br> + <ul id="overviewLegend"> + </ul> + </div> + +<script type="text/javascript"> +$(function () { + var datasets = {{{DATA}}}; + + // hard-code color indices to prevent them from shifting as + // countries are turned on/off + var i = 0, choiceContainer = $("#overviewLegend"); + + $.each(datasets, function(key, val) { + val.color = i; + ++i; + l = val.label; + var li = $('<li />').appendTo(choiceContainer); + + $('<input name="' + key + '" id="' + key + '" class="pcheckbox" type="checkbox" checked="checked"/>').appendTo(li); + $('<label>', { + text: l, + 'for': l + }).appendTo(li); + }); + + choiceContainer.find("input").click(plotAccordingToChoices); + + function plotAccordingToChoices() { + var data = []; + + choiceContainer.find("input:checked").each(function () { + var key = $(this).attr("name"); + if (key && datasets[key]) + data.push(datasets[key]); + }); + + var options = { + legend: { + show: true + }, + yaxis: { + mode: "amount", + min: 0 + }, + xaxis: { + mode: "time", + timeformat: "%y-%0m-%0d" + }, + zoom: { + interactive: true + }, + pan: { + interactive: true + } + } + + if (data.length > 0) + $.plot($("#placeholder"), data, options); + } + + /* first rendering to get colors */ + plotAccordingToChoices(); + + $('.legendColorBox > div').each(function(i){ + $(this).clone().prependTo(choiceContainer.find("li").eq(i)); + }); + + $("#resetzoom").click(function(eventObject) { plotAccordingToChoices(); }); + + /* uncheck all */ + choiceContainer.find("input").attr('checked', false); + + /* enable Club Mate 0.5 */ + $('input[name=product_4029764001807]').attr('checked', true) + + /* rerendering without all those graphs */ + plotAccordingToChoices(); +}); +</script> |