Ext.BLANK_IMAGE_URL = 'Includes/Images/ext2.1/themes/default/s.gif';
Ext.namespace('Itransition.ChartCrafters.MarketWindow');

var marketWindowHandlerUrl = 'Handlers/MarketWindow.ashx';

Ext.onReady(function() {
    var clientWidth = document.documentElement.clientWidth;
    var clientHeight = document.documentElement.clientHeight;

    function getDataFromWindowLocation(name) {
        name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
        var regexS = "[\\?&]" + name + "=([^&#]*)";
        var regex = new RegExp(regexS);
        var results = regex.exec(window.location.href);
        if (results == null)
            return "";
        else
            return results[1];
    }

    function getDataFromAnchor(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];
    }

    function optimizeSpace(text) {
        return text.replace(/%20/, " ");
    }

    function successHandler(response, options) {
        var mwGuid = options.options.mwGuid;
        var raTitlePath = 'Includes/Images/user-images/rel_articles_title.gif';
        var responseResult = Ext.util.JSON.decode(response.responseText).result;
        var logScaled = Ext.util.JSON.decode(response.responseText).marketWindowConfig.LogScaled;
        var fontScaled = Ext.util.JSON.decode(response.responseText).marketWindowConfig.FontScaled;
        var chartsWidth = Ext.util.JSON.decode(response.responseText).marketWindowConfig.ChartsWidth;
        var chartsHeight = Ext.util.JSON.decode(response.responseText).marketWindowConfig.ChartsHeight;

        var locale = Ext.util.JSON.decode(response.responseText).culture;
        // append locale script to the head
        if (locale === 'ja-JP') {
            setJapanLanguage();
            raTitlePath = 'Includes/Images/user-images/rel_articles_title_ja.gif';
        } else {
            setEnglishLanguage();
            raTitlePath = 'Includes/Images/user-images/rel_articles_title.gif';
        }

        if (responseResult) {
            var marketWindowConfig = Ext.util.JSON.decode(response.responseText).marketWindowConfig;
            var tabs = marketWindowConfig.Tabs;
            var mainPanel;

            function openImageTabs(symbolGuid) {
                var mTabPanel = Ext.getCmp('mainTabPanel');
                var defaultTab = optimizeSpace(getDataFromAnchor(location.hash, 'tab'));

                if (mTabPanel.items.length > 0) {
                    mTabPanel.items.each(function(item) {
                        mTabPanel.remove(item);
                    });
                    mainPanel.doLayout();
                }

                for (var k = 0; k < tabs.length; k++) {
                    var newTab = new Itransition.ChartCrafters.MarketWindow.ux.TabPanelItem({
                        id: tabs[k].Id + '-tab',
                        symbolGuid: symbolGuid,
                        mwGuid: mwGuid,
                        isDefault: tabs[k].Default,
                        title: tabs[k].Name,
                        templateGuid: getTemplateGuid(tabs[k].TemplateId),
                        period: tabs[k].Period,
                        imageWidth: chartsWidth,
                        imageHeight: chartsHeight,
                        logScaled: logScaled,
                        fontScaled: fontScaled
                    });

                    if (defaultTab == '' && tabs[k].Default) {
                        defaultTab = tabs[k].Name;
                    }

                    mTabPanel.add(newTab);
                }

                if (defaultTab == '') {
                    mTabPanel.setActiveTab(0);
                } else {
                    for (var i = 0; i < mTabPanel.items.length; i++) {
                        if (defaultTab == mTabPanel.items.items[i].title) {
                            mTabPanel.setActiveTab(i);
                            break;
                        }
                    }
                }

                mainPanel.doLayout();
            }

            function getTemplateGuid(templateId) {
                for (var j = 0; j < marketWindowConfig.Templates.length; j++) {
                    if (marketWindowConfig.Templates[j].Id == templateId) {
                        return marketWindowConfig.Templates[j].Guid;
                    }
                }
            }

            function loadRelatedArticles(ra) {
                if (marketWindowConfig.DisplayRelatedLinks) {
                    var raPanel = Ext.get('ra-south-panel');

                    var size = 41;

                    if (getDataFromWindowLocation('resizable') == 'true') {
                        size = 150;
                    }

                    if (!marketWindowConfig.DisplayBanners) {
                        size += 129;
                    }

                    var raHtml = '';

                    for (var i = 0; i < ra.length; i++) {
                        var raText = ra[i].Title;
                        if (raText.length > size) {
                            var s = raText.substring(0, size);
                            var ind = s.lastIndexOf(' ');
                            raText = s.substring(0, ind) + '...';
                            if ((raText.length - raText.indexOf('...')) > 3) {
                                raText = raText.substring(0, raText.indexOf('...') + 3);
                            }
                        }
                        var p = '<p style="font-size:11px;font-family:arial,tahoma,helvetica,sans-serif;padding-bottom:5px;">' +
                        '<a href="' + ra[i].Url + '" id="' + ra[i].Title + '" target="_blank" >' + raText + '</a></p>';

                        raHtml += p;
                    }
                    raPanel.dom.innerHTML = raHtml;

                    mainPanel.doLayout();
                }
            }

            function addStatistics(data, description) {
                returnsPanel.addStatisticsData(data);

                infoPanel.addInformation(description);
            }

            function getImageTabsSrc(symbolGuid, mwGuid, yearIndex, width, height, logScaled, fontScaled, templateGuid, period) {
                var imgSrc = 'Handlers/Charts.ashx?symbolGuid=' + symbolGuid + '&mwGuid=' + mwGuid + '&width=' + width + '&height=' + height + '&logScaled=' + logScaled +
                '&fontScaled=' + fontScaled + '&templateGuid=' + templateGuid + '&period=' + period;

                return imgSrc;
            }

            function getDataFromText(text, name) {
                name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
                var regexS = "[\\?&#]" + name + "=([^&#]*)";
                var regex = new RegExp(regexS);
                var results = regex.exec(text);
                if (results == null)
                    return "";
                else
                    return results[1];
            }

            function resizeHandler() {
                var mTabPanel = Ext.getCmp('mainTabPanel');

                var mW = document.documentElement.clientWidth >= 890 ? document.documentElement.clientWidth : 980;
                var mH = document.documentElement.clientHeight >= 600 ? document.documentElement.clientHeight : 600;

                mainPanel.setSize(mW, mH);
                mainPanel.setPosition(0, 0);
                mainPanel.doLayout();

                if (mTabPanel.items.length > 0) {
                    mainPanel.doLayout();

                    var mImg1 = Ext.get('1yrImg');
                    var mImg3 = Ext.get('3yrImg');
                    var mImg5 = Ext.get('5yrImg');

                    if (mImg1) {
                        var imgSrc = mImg1.dom.src;

                        symbolGuid = getDataFromText(imgSrc, 'symbolGuid');
                        mwGuid = getDataFromText(imgSrc, 'mwGuid');

                        var tabw = mTabPanel.getInnerWidth() - 10;
                        var tabh = mTabPanel.getInnerHeight() - 40;

                        mImg1.dom.src = getImageTabsSrc(symbolGuid, mwGuid, 1, tabw, tabh);
                        mImg3.dom.src = getImageTabsSrc(symbolGuid, mwGuid, 3, tabw, tabh);
                        mImg5.dom.src = getImageTabsSrc(symbolGuid, mwGuid, 5, tabw, tabh);

                        mainPanel.doLayout();
                    }
                }

                if (marketWindowConfig.DisplayRelatedLinks) {
                    if (marketWindowConfig.DisplayBanners) {
                        raPanel.setWidth(document.documentElement.clientWidth - 634);
                    } else {
                        raPanel.setWidth(document.documentElement.clientWidth - 7);
                    }
                }

                Ext.Element.get('content-body').center(document.body);
            }

            window.onresize = function() {
                if (getDataFromWindowLocation('resizable') == 'true') {
                    resizeHandler();
                }
            };

            var topPanel;
            var bottomPanel;
            var categoriesPanel;
            var returnsPanel;
            var infoPanel;
            var raPanel;
            var bannerPanel;

            var doLayout = false;

            var bannerCode = '<p><img src="Includes/Images/no-banner.png" alt="No banner available" /></p>';
            if (marketWindowConfig.GenerateBanners && marketWindowConfig.GenerateBannerPage != '') {
                var bannerPageSrc = marketWindowConfig.GenerateBannerPage;
                var bannerCode = '<IFRAME scrolling="no" src="' + bannerPageSrc + '" width="100%" height="100%" frameborder="0">Your browser doesn\'t support iframe.</IFRAME>';
            }
            else {
                try {
                    bannerCode = Ext.util.JSON.decode(response.responseText).Banner.Code;
	    bannerCode = '<div style="padding-top:15px;">' + bannerCode + '</div>'
                }
                catch (Exception) { }
            }

            mainPanel = new Ext.Panel({
                layout: 'border',
                id: 'main-panel',
                renderTo: 'content-body',
                width: clientWidth,
                height: clientHeight,
                border: false,
                items: [
                topPanel = new Itransition.ChartCrafters.MarketWindow.ux.TopPanel({
                    region: 'north',
                    height: 75,
                    id: 'northPanel',
                    bodyStyle: 'vertical-align:middle; background:none repeat scroll 0%;!important',
                    mainLogoPath: 'Includes/Images/user-images/' + marketWindowConfig.LogoURL,
                    mainLogoLink: marketWindowConfig.MainLogoLink,
                    mainLogoAlt: marketWindowConfig.MainLogoAlt,
                    mainLogoVisibility: (marketWindowConfig.DisplayLogo ? 'visible' : 'hidden'),
                    additionalLogoPath: 'Includes/Images/user-images/' + marketWindowConfig.AdditionalLogoUrl,
                    additionalLogoLink: marketWindowConfig.AdditionalLogoLink,
                    additionalLogoAlt: marketWindowConfig.AdditionalLogoAlt,
                    additionalLogoVisibility: (marketWindowConfig.DisplayAdditionalLogo ? 'visible' : 'hidden')
                }),
                bottomPanel = new Ext.Panel({
                    region: 'south',
                    id: 'south-panel',
                    bodyStyle: 'background:white;',
                    split: false,
                    height: 130,
                    layout: 'border',
                    title: '',
                    items: [
                        raPanel = new Itransition.ChartCrafters.MarketWindow.ux.RAPanel({
                            region: 'west',
                            id: 'ra-panel',
                            title: '',
                            raTitlePath: raTitlePath
                        }),
                        bannerPanel = new Itransition.ChartCrafters.MarketWindow.ux.BannerPanel({
                            region: 'center',
                            id: 'banner-panel',
                            title: '',
                            bannerCode: bannerCode//Ext.util.JSON.decode(response.responseText).Banner.Code
                        })
                    ]
                }),
                rightPanel = new Ext.Panel({
                    region: 'east',
                    id: 'east-panel',
                    collapsible: true,
                    split: false,
                    width: 165,
                    layout: 'border',
                    items: [
                    returnsPanel = new Itransition.ChartCrafters.MarketWindow.ux.ReturnsPanel({
                        region: 'north',
                        id: 'east-top',
                        split: true,
                        height: (tabs.length * 35),
                        collapsible: false
                    }),
                    infoPanel = new Itransition.ChartCrafters.MarketWindow.ux.InformationPanel({
                        region: 'center',
                        id: 'east-bottom',
                        split: true,
                        collapsible: false
                    })
                    ]
                }),
                categoriesPanel = new Itransition.ChartCrafters.MarketWindow.ux.CategoriesPanel({
                    region: 'west',
                    id: 'west-panel',
                    split: false,
                    width: 150,
                    collapsible: false,
                    mwGuid: marketWindowConfig.Guid,
                    layout: 'accordion',
                    categories: marketWindowConfig.Categories,
                    layoutConfig: {
                        animate: true
                    }
                }),
                new Ext.TabPanel({
                    region: 'center',
                    id: 'mainTabPanel',
                    deferredRender: false,
                    border: false,
                    activeTab: 0,
                    enableTabScroll: true
                })
                ]
            });

            var dHeight = 0;

            document.title = marketWindowConfig.PageTitle;

            if (marketWindowConfig.DisplayLogo || marketWindowConfig.DisplayAdditionalLogo) { //additional
                topPanel.setVisible(true);
            } else {
                topPanel.setVisible(false);
            }

            if (!marketWindowConfig.DisplayBanners && !marketWindowConfig.DisplayRelatedLinks) {
                bottomPanel.setVisible(false);
            } else {
                bottomPanel.setVisible(true);

                if (marketWindowConfig.DisplayBanners) {
                    bannerPanel.setVisible(true);
                } else {
                    bannerPanel.setVisible(false);
                }

                if (marketWindowConfig.DisplayRelatedLinks) {
                    raPanel.setVisible(true);

                    if (getDataFromWindowLocation('resizable') == 'true') {
                        if (marketWindowConfig.DisplayBanners) {
                            raPanel.setWidth(document.documentElement.clientWidth - 634);
                        } else {
                            raPanel.setWidth(document.documentElement.clientWidth - 7);
                        }
                    } else {
                        if (marketWindowConfig.DisplayBanners) {
                            raPanel.setWidth(242);
                        } else {
                            raPanel.setWidth(883);
                        }
                    }
                } else {
                    raPanel.setVisible(false);
                }
            }

            if (dHeight > 0) {
                var h = mainPanel.height - dHeight;
                mainPanel.setHeight(h);
            }

            mainPanel.on('afterlayout',
                function(container) {
                    if (!doLayout) {
                        var activeSymbol = optimizeSpace(getDataFromAnchor(location.hash, 'symbol'));

                        for (var index = 0; index < marketWindowConfig.Categories.length; index++) {
                            var item = marketWindowConfig.Categories[index];

                            if (activeSymbol != "") {
                                for (var i = 0; i < item.Symbols.length; i++) {
                                    if (item.Symbols[i].Guid == activeSymbol) {
                                        Ext.getCmp('west-panel').items.items[item.Position].expand();
                                        doLayout = true;
                                    }
                                }
                            } else {
                                if (item.Active) {
                                    Ext.getCmp('west-panel').items.items[item.Position].expand();
                                    doLayout = true;
                                }
                            }
                        }
                    }
                }, this);

            mainPanel.doLayout();
            categoriesPanel.on('openImageTabs', openImageTabs, this);
            categoriesPanel.on('loadRelatedArticles', loadRelatedArticles, this);
            categoriesPanel.on('addStatistics', addStatistics, this);

            if (getDataFromWindowLocation('resizable') == 'true') {
                resizeHandler();
            } else {
                Ext.Element.get('content-body').setWidth(clientWidth);
                Ext.Element.get('content-body').setHeight(clientHeight);
            }

            Ext.Element.get('content-body').center(document.body);

            mainPanel.doLayout();
        }
    }

    function failureHandler(response) {
        var result = Ext.util.JSON.decode(response.responseText);

        Ext.get('loading').remove();
        Ext.get('loading-mask').fadeOut({
            remove: true
        });

        Ext.MessageBox.alert('Error',
        'Error happened while trying to load data.\nError message:'
        + result.error);
    }

    Ext.Ajax.request({
        url: marketWindowHandlerUrl,
        success: successHandler,
        failure: failureHandler,
        scope: this,
        params: {
            method: 'GetMarketWindow',
            id: getDataFromWindowLocation('guid')
        },
        options: {
            mwGuid: getDataFromWindowLocation('guid')
        }
    });
});

Ext.EventManager.onWindowResize(function() {
    Ext.Element.get('content-body').center(document.body);
});