$(document).ready(function () {
    var count = 1;
    var path = location.pathname;
    var country = path.split("/")[1];
    var cntry = "usa";
    var currentCount = -1;
    var lang = "en";
    var langPath = "/en/us/";
    var xmlString_from_source = document.getElementById('ctl00_mainContent_hdnFeatureContXML').getAttribute("value");
    var xml = load_xml_content_string(xmlString_from_source);


    var num = $(xml).find('item').length;
    var cycletimer = $(xml).find('rayban_hero').attr('cycletimer');
    var speed = cycletimer * 1000;
    //alert(cycletimer);
    $(xml).find('item').each(function () {
        count++;
        var src = $(this).attr('src');
        var href = $(this).attr('href');
        var type = $(this).attr('type');
        var target = $(this).attr('target');
        href = href.replace('{0}', country);
        var str = "#";
        var clickstr = href != str ? 'class="clickable"' : '';
        $('<div id="slide' + count + '"></div>').html('<a ' + clickstr + '  href="' + href + '" target="' + target + '"><img src="' + src + '" alt="" width="920" height="470"></img></a>').appendTo('#imageBkg');
        $(this).find('copy').each(function () {
            var titleFirst = $(this).find('title:first').text();
            var titleSecond = $(this).find('title:last').text();
            var subTitle = $(this).find('cta').text();
            var titleFirst_fontsize = $(this).find('title:first').attr('size');
            var titleSecond_fontsize = $(this).find('title:last').attr('size');
            var subTitle_fontsize = $(this).find('cta').attr('size');
            var titleFirst_color = $(this).find('title:first').attr('color');
            var titleSecond_color = $(this).find('title:last').attr('color');
            var subTitle_color = $(this).find('cta').attr('color');

            //SET Copy Content	

            $('<div  id="titleFirst" ></div>').html('<div   class="titleTxt"><span >' + titleFirst + '</span></div>').appendTo('#slide' + count +' a');
            $('<div  id="titleSecond" ></div>').html('<div   class="titleTxt"><span>' + titleSecond + '</span></div>').appendTo('#slide' + count + ' a');
            if (titleFirst == "") {
                $('#slide' + count + ' #titleFirst span').css('visibility', 'hidden');
             }
            if (titleSecond == "") {
                $('#slide' + count + ' #titleSecond span').css('visibility', 'hidden');
            }
            var bottomparam = titleFirst_fontsize * 1 + titleSecond_fontsize * 1 + 30;
            //SET FONT SIZE
            $('#slide' + count + ' #titleFirst span').css('fontSize', titleFirst_fontsize + 'px');
            $('#slide' + count + ' #titleSecond span').css('fontSize', titleSecond_fontsize + 'px');
            $('#slide' + count + ' #titleFirst span').css('height', (titleFirst_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleSecond span').css('height', (titleSecond_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleFirst span').css('line-height', (titleFirst_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleSecond span').css('line-height', (titleSecond_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleFirst span').css('line-height', (titleFirst_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleSecond span').css('line-height', (titleSecond_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleSecond span').css('line-height', (titleSecond_fontsize - 5) + 'px');
            $('#slide' + count + ' #titleFirst').css('bottom', bottomparam + 'px');
            $('#slide' + count + ' #titleSecond').css('bottom', bottomparam + 'px');

            //SET FONT Color
            $('#slide' + count + ' #titleFirst span').css('color', '#' + titleFirst_color);
            $('#slide' + count + ' #titleSecond span').css('color', '#' + titleSecond_color);

            if (subTitle != "") {
                $(' <div  id="subTitle" ></div>').html('<div  ><span  class="titleTxt">' + subTitle + '</span></div>').appendTo('#slide' + count + ' a');
                $('#slide' + count + ' #subTitle span').css('fontSize', subTitle_fontsize + 'px');
                $('#slide' + count + ' #subTitle span').css('color', '#' + subTitle_color);
                $('#slide' + count + ' #subTitle').css('bottom', bottomparam + 'px');

            }
            $('#pager').css('bottom', (310 - titleSecond_fontsize) + 'px');


        });
    });
    $('#imageBkg').cycle({
        fx: 'fade',
        speed: 1000,
        timeout: speed,
        before: onBefore,
        after: onAfter,
        pager: '#pager-ul',
        activePagerClass: 'selected',
        pagerAnchorBuilder: function (idx, slide) {
            return '<li><a href="#">0' + (idx + 1) + '</a></li>';
        }
    });

    function onAfter() {
        $('#titleFirst span').fadeTo("slow", 0.7)
        $('#titleSecond span').fadeTo("slow", 0.7);
        $('#subTitle span').fadeTo("slow", 0.7);
    }
    function onBefore() {
        /* $('#titleRed span').hide();
        $('#titleWhite span').hide();
        $('#subTitleWhite span').hide();*/
        if (currentCount <= count) { currentCount++; } else { currentCount = -1; }
    }
});

function load_xml_content_string(xmlData) {
    if (window.ActiveXObject) {
        //for IE
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";
        xmlDoc.loadXML(xmlData);
        return xmlDoc;
    } else if (document.implementation && document.implementation.createDocument) {
        //for Mozila
        parser = new DOMParser();
        xmlDoc = parser.parseFromString(xmlData, "text/xml");
        return xmlDoc;
    }
}