jQuery.fn.extend({
    selectbox:function(options){
        return this.each(function(){
            new jQuery.SelectBox(this,options)
            })
        }
    });
jQuery.SelectBox=function(selectobj,options){
    var opt=options||{};

    opt.inputType=opt.inputType||"input";
    opt.inputClass=opt.inputClass||"selectbox";
    opt.containerClass=opt.containerClass||"selectbox-wrapper";
    opt.hoverClass=opt.hoverClass||"current";
    opt.currentClass=opt.currentClass||"selected";
    opt.groupClass=opt.groupClass||"groupname";
    opt.maxHeight=opt.maxHeight||200;
    opt.loopnoStep=opt.loopnoStep||false;
    opt.onChangeCallback=opt.onChangeCallback||false;
    opt.onChangeParams=opt.onChangeParams||false;
    opt.debug=opt.debug||false;
    var elm_id=selectobj.id;
    var active=0;
    var inFocus=false;
    var hasfocus=0;
    var $select=jQuery(selectobj);
    var $container=setupContainer(opt);
    var $input=setupInput(opt);
    $select.hide().before($input).before($container);
    init();
    $input.click(function(){
        if(!inFocus){
            $container.toggle()
            }
        }).focus(function(){
    if($container.not(':visible')){
        inFocus=true;
        $container.show()
        }
    }).keydown(function(event){
    switch(event.keyCode){
        case 38:
            event.preventDefault();
            moveSelect(-1);
            break;
        case 40:
            event.preventDefault();
            moveSelect(1);
            break;
        case 13:
            event.preventDefault();
            $('li.'+opt.hoverClass).trigger('click');
            break;
        case 27:
            hideMe();
            break
            }
        }).blur(function(){
    if($container.is(':visible')&&hasfocus>0){
        if(opt.debug)console.log('container visible and has focus')
            }else{
        if((jQuery.browser.msie&&jQuery.browser.version.substr(0,1)<8)||jQuery.browser.safari){
            if(document.activeElement.getAttribute('id').indexOf('_container')==-1){
                hideMe()
                }else{
                $input.focus()
                }
            }else{
        hideMe()
        }
    }
});
function hideMe(){
    hasfocus=0;
    $container.hide()
    }
    function init(){
    $container.append(getSelectOptions($input.attr('id'))).hide();
    var width=$input.css('width');
    if($container.height()>opt.maxHeight){
        $container.width(parseInt(width)+parseInt($input.css('paddingRight'))+parseInt($input.css('paddingLeft')));
        $container.height(opt.maxHeight)
        }else $container.width(width)
        }
        function setupContainer(options){
    var container=document.createElement("div");
    $container=jQuery(container);
    $container.attr('id',elm_id+'_container');
    $container.addClass(options.containerClass);
    $container.css('display','none');
    return $container
    }
    function setupInput(options){
    if(opt.inputType=="span"){
        var input=document.createElement("span");
        var $input=jQuery(input);
        $input.attr("id",elm_id+"_input");
        $input.addClass(options.inputClass);
        $input.attr("tabIndex",$select.attr("tabindex"))
        }else{
        var input=document.createElement("input");
        var $input=jQuery(input);
        $input.attr("id",elm_id+"_input");
        $input.attr("type","text");
        $input.addClass(options.inputClass);
        $input.attr("autocomplete","off");
        $input.attr("readonly","readonly");
        $input.attr("tabIndex",$select.attr("tabindex"));
        $input.css("width",$select.css("width"))
        }
        return $input
    }
    function moveSelect(step){
    var lis=jQuery("li",$container);
    if(!lis||lis.length==0)return false;
    firstchoice=0;
    while($(lis[firstchoice]).hasClass(opt.groupClass))firstchoice++;
    active+=step;
    if($(lis[active]).hasClass(opt.groupClass))active+=step;
    if(active<firstchoice){
        (opt.loopnoStep?active=lis.size()-1:active=lis.size())
        }else if(opt.loopnoStep&&active>lis.size()-1){
        active=firstchoice
        }else if(active>lis.size()){
        active=firstchoice
        }
        scroll(lis,active);
    lis.removeClass(opt.hoverClass);
    jQuery(lis[active]).addClass(opt.hoverClass)
    }
    function scroll(list,active){
    var el=jQuery(list[active]).get(0);
    var list=$container.get(0);
    if(el.offsetTop+el.offsetHeight>list.scrollTop+list.clientHeight){
        list.scrollTop=el.offsetTop+el.offsetHeight-list.clientHeight
        }else if(el.offsetTop<list.scrollTop){
        list.scrollTop=el.offsetTop
        }
    }
function setCurrent(){
    var li=jQuery("li."+opt.currentClass,$container).get(0);
    var ar=(''+li.id).split('_');
    var el=ar[ar.length-1];
    if(opt.onChangeCallback){
        $select.get(0).selectedIndex=$('li',$container).index(li);
        opt.onChangeParams={
            selectedVal:$select.val()
            };

        opt.onChangeCallback(opt.onChangeParams)
        }else{
        $select.val(el);
        $select.change()
        }
        if(opt.inputType=='span')$input.html($(li).html());else $input.val($(li).html());
    return true
    }
    function getCurrentSelected(){
    return $select.val()
    }
    function getCurrentValue(){
    return $input.val()
    }
    function getSelectOptions(parentid){
    var select_options=new Array();
    var ul=document.createElement('ul');
    select_options=$select.children('option');
    if(select_options.length==0){
        var select_optgroups=new Array();
        select_optgroups=$select.children('optgroup');
        for(x=0;x<select_optgroups.length;x++){
            select_options=$("#"+select_optgroups[x].id).children('option');
            var li=document.createElement('li');
            li.setAttribute('id',parentid+'_'+$(this).val());
            li.innerHTML=$("#"+select_optgroups[x].id).attr('label');
            li.className=opt.groupClass;
            ul.appendChild(li);
            select_options.each(function(){
                var li=document.createElement('li');
                li.setAttribute('id',parentid+'_'+$(this).val());
                li.innerHTML=$(this).html();
                if($(this).is(':selected')){
                    $input.html($(this).html());
                    $(li).addClass(opt.currentClass)
                    }
                    ul.appendChild(li);
                $(li).mouseover(function(event){
                    hasfocus=1;
                    if(opt.debug)console.log('over on : '+this.id);
                    jQuery(event.target,$container).addClass(opt.hoverClass)
                    }).mouseout(function(event){
                    hasfocus=-1;
                    if(opt.debug)console.log('out on : '+this.id);
                    jQuery(event.target,$container).removeClass(opt.hoverClass)
                    }).click(function(event){
                    var fl=$('li.'+opt.hoverClass,$container).get(0);
                    if(opt.debug)console.log('click on :'+this.id);
                    $('li.'+opt.currentClass,$container).removeClass(opt.currentClass);
                    $(this).addClass(opt.currentClass);
                    setCurrent();
                    $select.get(0).blur();
                    hideMe()
                    })
                })
            }
        }else select_options.each(function(){
    var li=document.createElement('li');
    li.setAttribute('id',parentid+'_'+$(this).val());
    li.innerHTML=$(this).html();
    if($(this).is(':selected')){
        $input.val($(this).html());
        $(li).addClass(opt.currentClass)
        }
        ul.appendChild(li);
    $(li).mouseover(function(event){
        hasfocus=1;
        if(opt.debug)console.log('over on : '+this.id);
        jQuery(event.target,$container).addClass(opt.hoverClass)
        }).mouseout(function(event){
        hasfocus=-1;
        if(opt.debug)console.log('out on : '+this.id);
        jQuery(event.target,$container).removeClass(opt.hoverClass)
        }).click(function(event){
        var fl=$('li.'+opt.hoverClass,$container).get(0);
        if(opt.debug)console.log('click on :'+this.id);
        $('li.'+opt.currentClass,$container).removeClass(opt.currentClass);
        $(this).addClass(opt.currentClass);
        setCurrent();
        $select.get(0).blur();
        hideMe()
        })
    });
return ul
}
};

$(document).ready(function(){
    $('#myselectbox').selectbox({
        onChangeCallback:myFunction
    });
    function myFunction(args){
        $('span.change').append(args.selectedVal)
        }
        $('#myselectbox1').selectbox({
        inputClass:'selectbox1'
    });
    $(".main_image .desc").show();
    $(".main_image .block").animate({
        opacity:0.85
    },1);

$(".main_image .desc").show(); //Show Banner
$(".main_image .block").animate({ opacity: 0.65 }, 1 ); //Set Opacity
$(".image_thumb ul li:first").addClass('active'); //Add the active class (highlights the very first list item by default)

//runs function on click
$(".image_thumb ul li").click(function () {
$active = $(this);
slideSwitchClick();
})
.hover(function(){ //Hover effects on list-item
(this).addClass("hover"); //Add class “hover” on hover
}, function() {
$(this).removeClass("hover"); //Remove class “hover” on hover out
});

//runs function, set timer here
$(function() {
setInterval( 'slideSwitchTimed()', 6000 );
});

});

function slideSwitchTimed() {
$active = $('.image_thumb ul li.active').next();
if ( $active.length == 0 ) $active = $('.image_thumb ul li:first'); //goes back to start when finishes
slideSwitch();
}

function slideSwitchClick() {
slideSwitch();
}

function slideSwitch() {
var $prev = $('.image_thumb ul li.active');

//Show active list-item
$prev.removeClass('active');
$active.addClass('active');

//Set Variables
var imgAlt = $active.find('img').attr("alt"); //Get Alt Tag of Image
var imgTitle = $active.find('a').attr("href"); //Get Main Image URL
var imgDesc = $active.find('.block').html(); //Get HTML of the “block” container
var imgDescHeight = $(".main_image").find('.block').height(); //Find the height of the “block”

if ($(this).is(".active")) { //If the list item is active/selected, then…
return false; // Don’t click through – Prevents repetitive animations on active/selected list-item
} else { //If not active then…
//Animate the Description
$(".main_image img").animate({ opacity: 0}, 250 );
$(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() {
$(".main_image .block").html(imgDesc).animate({ opacity: 0.85, marginBottom: "0" }, 250 );
$(".main_image img").attr({ src: imgTitle , alt: imgAlt}).animate({ opacity: 1}, 250 );
});
}
return false;
}


