diff options
Diffstat (limited to 'templates/stats/stock.html')
-rw-r--r-- | templates/stats/stock.html | 83 |
1 files changed, 83 insertions, 0 deletions
diff --git a/templates/stats/stock.html b/templates/stats/stock.html new file mode 100644 index 0000000..710bf60 --- /dev/null +++ b/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> |