$(document).ready(function() {
    /*jQuery('ul.accordion, ul.accordion ul').acc({
        speed: 400,
        active: 'selected',
        list: '.children()',
        opener: 'a.opener',
        slide: '.slide'
    });*/
    //$('.iselected').click();    
    /*
    $('ul.accordion').accordion({
    active: ".selected",
    autoHeight: false,
    header: ".opener",
    collapsible: true,
    event: "click"
    });

	$('ul.accordion2').accordion({
    autoHeight: false,
    header: ".opener",
    collapsible: true,
    fillSpace: true,
    event: "click"
    });
    */

});
jQuery.fn.acc = function(_options) {
    var _options = jQuery.extend({
        speed: 400,
        active: 'active',
        list: '.children()',
        opener: 'a.opener',
        slide: 'div.slide'
    }, _options);

    return this.each(function() {
        var _list = eval('jQuery(this)' + _options.list);
        var _active = _options.active;
        var _speed = _options.speed;
        var _a = _list.index(_list.filter('.' + _active + ':eq(0)'));
        if (_a != -1) _list.removeClass(_active).eq(_a).addClass(_active);
        for (var i = 0; i < _list.length; i++) {
            _list.eq(i).data('btn', _list.eq(i).children(_options.opener).eq(0));
            _list.eq(i).data('box', _list.eq(i).children(_options.slide).eq(0));
            if (i == _a) _list.eq(i).data('box').css('display', 'block');
            else _list.eq(i).data('box').css('display', 'none');
            _list.eq(i).data('btn').data('ind', i);
            _list.eq(i).data('btn').click(function() {
                if (_list.eq(jQuery(this).data('ind')).data('box').length != 0) {
                    changeEl(jQuery(this).data('ind'));
                    if ($(this).attr('href') == '#')
                        return false;
                }
            });
        }
        var anim_f = true;
        var a_h, ind_h, _k;
        function changeEl(_ind) {
            if (anim_f) {
                anim_f = false;
                if (_a == _ind) {
                    _list.eq(_a).removeClass(_active).data('box').animate({ height: 0 }, {
                        duration: _speed,
                        complete: function() {
                            jQuery(this).css({ display: 'none', height: 'auto' });
                            _a = -1;
                            anim_f = true;
                            removeLevels();
                        }
                    });
                }
                else {
                    _list.eq(_ind).data('box').css('display', 'block');
                    ind_h = _list.eq(_ind).data('box').outerHeight();
                    _list.eq(_ind).data('box').height(0);
                    if (_a != -1) {
                        a_h = _list.eq(_a).removeClass(_active).data('box').outerHeight();
                        _k = a_h / ind_h;
                    }
                    _list.eq(_ind).addClass(_active).data('box').animate({ height: ind_h }, {
                        duration: _speed,
                        step: function(t_h) {
                            if (_a != -1) _list.eq(_a).data('box').height(a_h - t_h * _k);
                        },
                        complete: function() {
                            _list.eq(_ind).data('box').height('auto');
                            if (_a != -1) _list.eq(_a).data('box').css({ display: 'none', height: 'auto' });
                            _a = _ind;
                            anim_f = true;
                            removeLevels();
                        }
                    });
                }
            }
        }
    });
}

function removeLevels(){
	$('ul.accordion').eq(0).children('li').each(function(){
		if(!$(this).hasClass('selected')){
			var _cont = $(this).find('div.slide').find('li.selected');
			_cont.each(function(){
				if($(this).hasClass('selected')){
					$(this).find('a.opener').click();
				}
			});
		}
	});
}

function openCaseStudy(casestudyid) {
    $('#casestudy').fadeIn();
    $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
    
    var popuptopmargin = ($('#casestudy').height() + 10) / 2;
    var popupleftmargin = ($('#casestudy').width() + 10) / 2;
     
    $('#casestudy').css({
        'margin-top': -popuptopmargin,
        'margin-left': -popupleftmargin
    });

    $.ajax({
        url: '/Ajax/AjaxCaseStudies.aspx?action=' + casestudyid, //slide&casestudyid=' + casestudyid,
        cache: false,
        success: function(data) {
            $('#casestudy').html(data);

            $('#screen').serialScroll({
                target: '#sections',
                items: 'li', // Selector to the items ( relative to the matched elements, '#sections' in this case )
                prev: 'img.prev', // Selector to the 'prev' button (absolute!, meaning it's relative to the document)
                next: 'img.next', // Selector to the 'next' button (absolute too)
                axis: 'x', // The default is 'y' scroll on both ways
                navigation: '#navigation a',
                duration: 700, // Length of the animation (if you scroll 2 axes and use queue, then each axis take half this time)
                force: true, // Force a scroll to the element specified by 'start' (some browsers don't reset on refreshes)
                cycle: false, // Cycle endlessly ( constant velocity, true is the default )

                //queue:false,// We scroll on both axes, scroll both at the same time.
                //event:'click',// On which event to react (click is the default, you probably won't need to specify it)
                //stop:false,// Each click will stop any previous animations of the target. (false by default)
                //lock:true, // Ignore events if already animating (true by default)		
                //start: 0, // On which element (index) to begin ( 0 is the default, redundant in this case )		
                //cycle:true,// Cycle endlessly ( constant velocity, true is the default )
                //step:1, // How many items to scroll each time ( 1 is the default, no need to specify )
                //jump:false, // If true, items become clickable (or w/e 'event' is, and when activated, the pane scrolls to them)
                //lazy:false,// (default) if true, the plugin looks for the items on each event(allows AJAX or JS content, or reordering)
                //interval:1000, // It's the number of milliseconds to automatically go to the next
                //constant:true, // constant speed

                onBefore: function(e, elem, $pane, $items, pos) {
                    /**
                    * 'this' is the triggered element 
                    * e is the event object
                    * elem is the element we'll be scrolling to
                    * $pane is the element being scrolled
                    * $items is the items collection at this moment
                    * pos is the position of elem in the collection
                    * if it returns false, the event will be ignored
                    */
                    if ($items.length == (pos + 1)) {
                        $(".next").click(function() {
                            $('#casestudy').fadeOut();
                            $('#fade').fadeOut();
                        });
                    }
                    //those arguments with a $ are jqueryfied, elem isn't.
                    e.preventDefault();
                    if (this.blur)
                        this.blur();
                },
                onAfter: function(elem) {
                    //'this' is the element being scrolled ($pane) not jqueryfied
                }
            });

            $('#screen-close a').click(function() {
                $('#casestudy').fadeOut();
                $('#fade').fadeOut();
            });

            Cufon.replace('#casestudy .header h3', { fontFamily: 'ITC Avant Garde Gothic Std Extra Light' });
        }
    });
}