Ext.namespace("Itransition.ChartCrafters.MarketWindow.ux");

Itransition.ChartCrafters.MarketWindow.ux.ReturnsPanel = Ext.extend(Ext.Panel, {
    autoScroll: false,
    title: 'Returns',
    border: false,

    getHandlerHtml: function (num) {
        handlerHtml = 'function oneHandler(){ ' +
            'var mTabPanel = Ext.getCmp(&quot;mainTabPanel&quot;);' +
            'mTabPanel.setActiveTab(' + num + ');' +
            '}; oneHandler();';
        return handlerHtml;
    },

    getDataFromAnchor: function(anchor, name) {
        name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
        var regexS = "[\\?&#]" + name + "=([^&#]*)";
        var regex = new RegExp(regexS);
        var results = regex.exec(anchor);
        if (results == null)
            return "";
        else
            return results[1];
    },

    optimizeSpace: function(text) {
        return text.replace(/%20/, " ");
    },

    optimizeData: function (mdata) {
        data = mdata.toString();

        if (data.indexOf('.') > 0) {
            while ((data.length - data.indexOf('.')) < 3) {
                data += "0";
            }
        } else {
            data += ".00";
        }

        return data;
    },

    getImageSrc: function (n2) {
        if (n2 > 0) {
            imgSrc = 'includes/images/green_arrow.gif';
        } else {
            imgSrc = 'includes/images/red_arrow.gif';
        }
        return imgSrc;
    },

    getPercentDiv: function (num, data) {
        var symbol = this.optimizeSpace(this.getDataFromAnchor(location.hash, 'symbol'));
        var newAnchor = '#symbol=' + symbol + '&tab=' + data.tabName;

        if ((data.periodData != -65535) && (data.periodData != "")) {
            return '<tr><td><div class="label"><a href="' + newAnchor + '" style="text-decoration:none;" onClick="' + this.getHandlerHtml(num) + '">' +
                data.periodName + ' </a></div></td><td><div class="data">' + this.optimizeData(data.periodData) +
                '%</div></td><td><div class="up"><img src="' + this.getImageSrc(data.periodData) + '" /></div></td></tr>';
        } else {
            return '<tr><td><div class="label"><a href="' + newAnchor + '" style="text-decoration:none;" onClick="' + this.getHandlerHtml(num) + '">' +
                data.periodName + '</a></div></td><td><div class="data"><span style="color:red;">N/A</span></div></td><td><div class="up">' +
                '<img style="visibility:hidden; !important" src="' + this.getImageSrc(353) + '" /></div></td></tr>';
        }
    },

    addStatisticsData: function (data) {
        try {
            statisticsHtml = '<table class="percent" cellspacing="6" align="center">';

            for (var i = 0; i < data.length; i++) {
                statisticsHtml += this.getPercentDiv(i, data[i]);
            }

            statisticsHtml += '</table>';

            this.body.update(statisticsHtml);
        } catch(ex) {
            html = '<p class="symbolName"><span style="color:red;">N/A</span></p>';
            this.body.update(html);
        }
    },

    initComponent: function() {
        Itransition.ChartCrafters.MarketWindow.ux.ReturnsPanel.superclass.initComponent.apply(this, arguments);
    },

    onRender: function() {
        Itransition.ChartCrafters.MarketWindow.ux.ReturnsPanel.superclass.onRender.apply(this, arguments);
    }
});

Ext.reg('returnspanel', Itransition.ChartCrafters.MarketWindow.ux.ReturnsPanel);