Array.prototype.find = function(searchStr) {
  var returnArray = false;
  for (i=0; i<this.length; i++) {
    if (typeof(searchStr) == 'function') {
      if (searchStr.test(this[i])) {
        if (!returnArray) { returnArray = [] }
        returnArray.push(i);
      }
    } else {
      if (this[i]===searchStr) {
        if (!returnArray) { returnArray = [] }
        returnArray.push(i);
      }
    }
  }
  return returnArray;
}



// when the DOM is ready...
$(document).ready(function () {

var dirpth = location.href.split('.html');
	var ort = dirpth[0].split('_');
	var pageid = parseFloat(ort[1]);

	
//this array store pages with a defined arrays for background transformation
var  bg_defined_pages = [2,7,8,10,11,19,15,5];

//generic colors if no page is matched
var colorArray_0 = new Array ('#8E9686','#848C7C','#939E90','#A3ADA7','#BFC0BC','#B5B7AC','#8E9686','#848C7C','#AFB4A9');

var colorArray_2 = new Array ('#282D2E','#1F2E2A','#29362E','#333C2F');

var colorArray_7 = new Array ('#ffffff','#ededed','#C0C8C0','#ffffff');
var colorArray_8 = new Array ('#ffffff','#ededed','#C0C8C0','#ffffff');

var colorArray_10 = new Array ('#CCCCCC','#ededed','#C0C8C0','#CCCCCC');

var colorArray_11 = new Array ('#5D684D','#282A22','#232622','#5D684D');
var colorArray_5 = new Array ('#CCCCCC','#ededed','#C0C8C0','#CCCCCC');

var colorArray_19 = new Array ('#8E9686','#848C7C','#939E90','#A3ADA7','#BFC0BC','#B5B7AC','#8E9686','#A7A58E','#A7A396');
var colorArray_15 = new Array ('#8E9686','#848C7C','#939E90','#A3ADA7','#BFC0BC','#B5B7AC','#8E9686','#A6ACAE','#B2B3B5');


var colorArray_3 = new Array ('#282D2E','#1F2E2A','#29362E','#333C2F','#263128','#202C27','#243529','#292E22','#2C2E22','#5D684D','#282A22','#232622','#252722','#252722','#222622','#262C1A','#242522','#232522','#575A52','#242522','#101C14','#101C17','#101C1B','#0B2017','#101C11','#101C17','#151A15','#151A18','#262C1A','#262C1A');
var colorArray_4 = new Array ('#282D2E','#1F2E2A','#29362E','#333C2F','#263128','#202C27','#243529','#292E22','#2C2E22','#5D684D','#282A22','#232622','#252722','#252722','#222622','#262C1A','#242522','#232522','#575A52','#242522','#101C14','#101C17','#101C1B','#0B2017','#101C11','#101C17','#151A15','#151A18','#262C1A','#262C1A');

//we search for a match in page array
var colorM = bg_defined_pages.find(pageid);
 

if(colorM  != false){
 var  $colorscheme = eval('colorArray'+'_'+bg_defined_pages[colorM]+'');

 }else{
 $colorscheme = colorArray_0;
 }
   //alert( $colorscheme);
   
   
   
    var $panels = $('#slider .scrollContainer > div');
    var $container = $('#slider .scrollContainer');

    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#slider .scroll').css('overflow', 'hidden');
     var $activeslide= 0;

    // apply our left + right buttons
    var tt = $panels.length;
        //if tt = 1 we have only one panel so no need to have left and right arrows
        if(tt > 1){
    $scroll
        .before('<img class="scrollButtons left" src="../upload/upload_admin/layout/nav-arrow-horz-previous_1.png" alt="" />')
        .after('<img class="scrollButtons right" src="../upload/upload_admin/layout/nav-arrow-horz-next_1.png" alt="" />');
}
    
    // handle nav selection
    function selectNav() {
        $(this)
            .parents('ul:first')
                .find('a')
                    .removeClass('selected')
                .end()
            .end()
            .addClass('selected');
    }

    $('.navigation_sub').find('a').click(selectNav);

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
        var el = $('.navigation_sub').find('a[href$="' + data.id + '"]').get(0);//before $('#slider .navigation_sub')
        selectNav.call(el);
         
         //we split data.id -  xxxxxx_xx_xx   -  to find the numeric position of the slide
         var $split = data.id.split('_');
         $activeslide = $split[2];
         
       
         
        //alert($colorscheme);
         //color background animation
         if(parseFloat($activeslide) <$colorscheme.length-1){
         $("body").stop().animate({ backgroundColor: $colorscheme[$activeslide] }, 2000);
         }

    }

    if (window.location.hash) {
        trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation_sub a:first').click();
         $("body").stop().animate({ backgroundColor: $colorscheme[$colorscheme.length-1] }, 2000);
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow

        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '.navigation_sub a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'img.left', 
        next: 'img.right',

        // allow the scroll effect to run both directions
        axis: 'xy',

        onAfter: trigger, // our final callback

        offset: offset,

        // duration of the sliding effect
        duration: 500,

        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing'
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#slider').serialScroll(scrollOptions);

    // now apply localScroll to hook any other arbitrary links to trigger 
    // the effect
    $.localScroll(scrollOptions);

    // finally, if the URL has a hash, move the slider in to position, 
    // setting the duration to 1 because I don't want it to scroll in the
    // very first page load.  We don't always need this, but it ensures
    // the positioning is absolutely spot on when the pages loads.
    scrollOptions.duration = 1;
    $.localScroll.hash(scrollOptions);

});