Ext.define('TP.chart.NumericAxis', {
    extend: 'Ext.chart.axis.Numeric',
    alias:  'axis.tp_numeric',
    constructor: function(config) {
        this.callParent([config]);
        this._getRange = this.getRange;
        this.getRange = function() {
            var range = this._getRange();
            range.max = Math.floor(range.max/10)*10+10;
            return(range);
        }
        this.type = 'Numeric';
    }
});

Ext.define('TP.chart.TimeAxis', {
    extend: 'Ext.chart.axis.Numeric',
    alias:  'axis.tp_time',
    constructor: function(config) {
        this.callParent([config]);
        this._calcEnds = this.calcEnds;
        this.calcEnds = function() {
            var me = this;
            range = me.getRange(),
            min   = range.min,
            max   = range.max,
            steps = me.majorTickSteps + 1;
            if(min.getTime) { min = min.getTime(); }
            var step  = (max-min)/steps;
            out = {from:min, to:max, step:step, steps:steps};
            return(out);
        }
        this.type = 'Numeric';
    }
});

Ext.define('TP.PanletChart', {
    extend: 'TP.Panlet',

    title:  'chart',
    width:  640,
    height: 260,
    initComponent: function() {
        this.callParent();
        this.xdata.nr_dots = 60;

        this.loader = {
            autoLoad: false,
            renderer: 'data',
            scope:    this,
            url:      '',
            ajaxOptions: { method: 'POST' },
            loading:  false,
            listeners: {
                'beforeload': function(This, options, eOpts) {
                    if(this.loading) {
                        return false;
                    }
                    this.loading = true;
                    return true;
                }
            },
            renderer: function(loader, response, active) {
                // prevents loosing focus of form elements
                return true;
            },
            callback: function(This, success, response, options) {
                This.loading = false;
                var data = TP.getResponse(this, response);
                var row;
                if(data) {
                    row = data;
                    if(this.getData) {
                        row = this.getData(data);
                    }
                }
                if(row) {
                    var last = this.store.data.last();
                    if(last != undefined) {
                        row.nr = last.get('nr') + 1;
                    } else {
                        row.nr = 1;
                    }
                    row.date  = new Date();
                    row.empty = '';
                    this.store.loadRawData(row, true);
                    if(this.updated_callback) {
                        this.updated_callback(this);
                    }
                } else {
                    var row = {date: new Date(), empty:''};
                    this.store.loadRawData(row, true);
                }
            }
        };

        this.refreshHandler = function() {
            TP.defaultSiteRefreshHandler(this);
        },

        this.addListener('afterrender', function() {
            this.refreshHandler();
        });

        this.addListener('hide', function() {
            this.chart.hide();
        });
        this.addListener('show', function() {
            if(this.updated_callback) {
                this.updated_callback(this);
            }
            this.chart.show();
            // restoreZoom helps refreshing the chart after hiding
            this.chart.restoreZoom();
        });

        this.down('form').add({
            fieldLabel: 'History',
            xtype:      'textfield',
            name:       'nr_dots'
        });
    }
});
