var MenuChart = function () {
this.chartApi = {};
this.init();
};
/**
* Require the api and bootstrap the menu.
*
* @return {[type]} [description]
*/
MenuChart.prototype.init = function () {
require(["/idms/idms/widget/main.js"], function (main) {
require(
['jquery', "ChartWidget/Component/Api/ChartApi"], // what to require
function ($, chartApi) {
// on success callback
this.jq = $;
this.tooltip = $('
');
$('body').append(this.tooltip);
this.chartPosY = 0;
this.mountainGrey = new Array( false, false, false, false );
this.dayOfWeek = new Array('Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag');
this.monthName = new Array('Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember');
var mainChart = this.jq('#tnt-main-chart [data-tnt-widget]').get(0);
var smallChart1 = this.jq('#tnt-small-chart1 [data-tnt-widget]').get(0);
var smallChart2 = this.jq('#tnt-small-chart2 [data-tnt-widget]').get(0);
var smallChart3 = this.jq('#tnt-small-chart3 [data-tnt-widget]').get(0);
if (chartApi.registry.length === 0) {
chartApi.on('ready', function (args) {
switch (args.chart.rootEl) {
case mainChart:
this.chartApi['#tnt-main-chart'] = chartApi.get(mainChart);
this.bindEvents('#tnt-main-chart');
break;
case smallChart1:
this.chartApi['#tnt-small-chart1'] = chartApi.get(smallChart1);
this.bindEvents('#tnt-small-chart1');
break;
case smallChart2:
this.chartApi['#tnt-small-chart2'] = chartApi.get(smallChart2);
this.bindEvents('#tnt-small-chart2');
break;
case smallChart3:
this.chartApi['#tnt-small-chart3'] = chartApi.get(smallChart3);
this.bindEvents('#tnt-small-chart3');
break;
}
}.bind(this));
} else {
this.chartApi = chartApi.get(mainChart);
this.bindEvents('#tnt-main-chart');
this.chartApi = chartApi.get(smallChart1);
this.bindEvents('#tnt-small-chart1');
this.chartApi = chartApi.get(smallChart2);
this.bindEvents('#tnt-small-chart2');
this.chartApi = chartApi.get(smallChart3);
this.bindEvents('#tnt-small-chart3');
}
}.bind(this),
function (error) {
// on error callback
console.error("Api Failed");
}.bind(this)
);
}.bind(this), function () {
console.error("Main Failed");
});
};
/**
* Register all the menu listeners.
*/
MenuChart.prototype.bindEvents = function (chartContainerID) {
this.jq(chartContainerID +' .chart-indexes').on('change', this.onIndexChange.bind(this, chartContainerID));
this.jq(chartContainerID +' .chart-timespan li').on('click', this.onTimeSpanChange.bind(this, chartContainerID));
if (chartContainerID == '#tnt-main-chart') {
// Activate vertical cursor
this.chartApi[chartContainerID].setCursorMode('vertical-line');
this.jq(chartContainerID +' button').on('click', function() {
var oStart = new Date();
var oEnd = new Date();
oStart.setDate(oStart.getDate() - 1);
var sFrom = $('#dateFrom').val();
var sTo = $('#dateTo').val();
aFrom = sFrom.split('.');
aTo = sTo.split('.');
if (aFrom.length==3)
{
var oNow = new Date();
if (aFrom[0]>=1 && aFrom[0]<=31 && aFrom[1]>=1 && aFrom[1]<=12 && aFrom[2]>=1970 && aFrom[2]<=oNow.getFullYear())
{
oStart.setDate(aFrom[0]);
oStart.setMonth(aFrom[1]-1);
oStart.setYear(aFrom[2]);
}
}
if (aTo.length==3)
{
var oNow = new Date();
if (aTo[0]>=1 && aTo[0]<=31 && aTo[1]>=1 && aTo[1]<=12 && aTo[2]>=1970 && aTo[2]<=oNow.getFullYear())
{
oEnd.setDate(aTo[0]);
oEnd.setMonth(aTo[1]-1);
oEnd.setYear(aTo[2]);
}
}
var bIntraday = (aFrom.toString()==aTo.toString());
if ((this.mountainGrey[0]==false && !bIntraday) || (this.mountainGrey[0]==true && bIntraday))
{
this.chartApi[chartContainerID].toggle('Mountain');
this.chartApi[chartContainerID].toggle('Mountain Grey');
this.chartApi[chartContainerID].toggle('Straight Line Series');
this.mountainGrey[0] = !this.mountainGrey[0];
}
this.chartApi[chartContainerID].setRange(oStart, oEnd);
return false;
}.bind(this));
this.chartApi[chartContainerID].chart.on('canvas:hover', this.onCanvasHover.bind(this));
this.chartApi[chartContainerID].chart.on('canvas:leave', function () {
this.tooltip.hide();
/*
this.priceline.hide();
*/
}.bind(this));
}
};
/**
* Change Notation
*/
MenuChart.prototype.onIndexChange = function (chartContainerID, e) {
e.preventDefault();
var notation = e.currentTarget.value;
this.chartApi[chartContainerID].setIdNotation(notation);
var url = '/idms/www/marktdaten_analysen.html?AJAX=1®ION='+$('#IDMS_REGION').val()+'&ID_NOTATION='+notation;
idmsJSONRequest = $.ajax({
url: url,
dataType: 'html',
success: function (data) {
$('#idms_ajax_header').html(data);
}
});
};
/**
* Handle hover on canvas
*/
MenuChart.prototype.onCanvasHover = function (e) {
if (this.chartPosY==0) {
this.chartPosY = $('#tnt-main-chart canvas').position().top;
}
if (e.hasOwnProperty('samples')) {
var sample = e.samples;
if (sample.hasOwnProperty('Historical Data')) {
var data = sample['Historical Data'];
this.showTooltip(data, e.originalEvent);
}
}
};
/**
* Show the tooltip
*/
MenuChart.prototype.showTooltip = function (data, e) {
this.tooltip.find('#chart-tooltip-date').text(this.dayOfWeek[data.date.getDay()]+', '+data.date.getDate()+'. '+this.monthName[data.date.getMonth()]);
this.tooltip.find('#chart-tooltip-time').text(((data.date.getHours()<10)?'0':'')+data.date.getHours()+':'+((data.date.getMinutes()<10)?'0':'')+data.date.getMinutes());
this.tooltip.find('#chart-tooltip-last').text(this.numberFormat(data.values.LAST,2,',','.'));
this.tooltip.find('#chart-tooltip-volume').text(this.numberFormat(data.values.TOTAL_VOLUME,0,',','.')+' Stk.');
this.tooltip.css({top: e.pageY + 20, left: e.pageX + 20}).show();
};
/**
* Change the time span in context
*
*/
MenuChart.prototype.onTimeSpanChange = function (chartContainerID, e) {
e.preventDefault();
var dataTimeSpan = e.currentTarget.getAttribute('data-timespan');
var iMountainPos = 0;
switch (chartContainerID)
{
case '#tnt-small-chart1':
iMountainPos = 1;
break;
case '#tnt-small-chart2':
iMountainPos = 2;
break;
case '#tnt-small-chart3':
iMountainPos = 3;
break;
}
if ((this.mountainGrey[iMountainPos]==false && dataTimeSpan!='1D') || (this.mountainGrey[iMountainPos]==true && dataTimeSpan=='1D'))
{
this.chartApi[chartContainerID].toggle('Mountain');
this.chartApi[chartContainerID].toggle('Mountain Grey');
this.chartApi[chartContainerID].toggle('Straight Line Series');
this.mountainGrey[iMountainPos] = !this.mountainGrey[iMountainPos];
}
if (dataTimeSpan === 'MAX') {
var oStart = this.chartApi[chartContainerID].chart.minHistoryDate,
oEnd = new Date();
this.chartApi[chartContainerID].setRange(oStart, oEnd);
} else {
var timeSpan = dataTimeSpan.match(/[a-zA-Z]+|[0-9]+/g);
this.chartApi[chartContainerID].setRangeOffset(timeSpan[0], timeSpan[1]);
}
if (chartContainerID != '#tnt-main-chart') {
$(chartContainerID+' .chart-timespan li').removeClass('current');
$(e.currentTarget).addClass('current');
}
};
MenuChart.prototype.numberFormat = function( number, decimals, dec_point, thousands_sep ) {
number = (number + '').replace(/[^0-9+\-Ee.]/g, '');
var n = !isFinite(+number) ? 0 : +number,
prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
s = '',
toFixedFix = function (n, prec)
{
var k = Math.pow(10, prec);
return '' + Math.round(n * k) / k;
};
s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
if (s[0].length > 3)
{
s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
}
if ((s[1] || '').length < prec)
{
s[1] = s[1] || '';
s[1] += new Array(prec - s[1].length + 1).join('0');
}
return s.join(dec);
};
new MenuChart();