// for older broswer
$(function(){
	if ($.browser.msie && $.browser.version < 8) {;$('#ieDiv').css('display', 'block');}
	//if ($.browser.opera){$('#operaDiv').css('display', 'block');}
});


// animated menu
(function ($) {
			 if (!$.browser.msie && !$.browser.opera) {                
        $.fn.cross = function (options) {
            return this.each(function (i) { 
                // cache the copy of jQuery(this) - the start image
                var $$ = $(this);
                
                // get the target from the backgroundImage + regexp
                var target = $$.css('backgroundImage').replace(/^url|[\(\)'"]/g, '');
 
                // nice long chain: wrap img element in span
                $$.wrap('<span style="position: relative;"></span>')
                    // change selector to parent - i.e. newly created span
                    .parent()
                    // prepend a new image inside the span
                    .prepend('<img>')
                    // change the selector to the newly created image
                    .find(':first-child')
                    // set the image to the target
                    .attr('src', target);
 
                // the CSS styling of the start image needs to be handled
                // differently for different browsers
                if ($.browser.mozilla) {
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : '',
                        'top' : this.offsetTop
                    });
                }else { // Safari
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : ''
                    });
                }
 
                // similar effect as single image technique, except using .animate 
                // which will handle the fading up from the right opacity for us
                $$.hover(function () {
                    $$.stop().animate({
                        opacity: 0
                    }, 200);
                }, function () {
                    $$.stop().animate({
                        opacity: 1
                    }, 200);
                });
            });
        };
		} 
        
    })(jQuery);
    
    // note that this uses the .bind('load') on the window object, rather than $(document).ready() 
    // because .ready() fires before the images have loaded, but we need to fire *after* because
    // our code relies on the dimensions of the images already in place.
    $(window).bind('load', function () {
        $('img.fade').cross();
});
	
	
// filtering
$(document).ready(function() {
var filterVal = 'nyasaker';

			$('ul#portfolio li').each(function() {
				if(!$(this).hasClass(filterVal)) {
					$(this).addClass('hidden');
				} else {
					$(this).removeClass('hidden');
				}
			});

	$('#mainSelect').change(function() {
		
		var filterVal = $('#mainSelect :selected').text().toLowerCase().replace(' ','').replace('/','');
	
		if(filterVal == 'allasaker') {
			$('ul#portfolio li.hidden').removeClass('hidden');
		} else {
			$('ul#portfolio li').each(function() {
				if(!$(this).hasClass(filterVal)) {
					$(this).addClass('hidden');
				} else {
					$(this).removeClass('hidden');
				}
			});
		}
		
		return false;
	});
});


// object animations
 $(document).ready(function(){
    $("ul#portfolio li").hover(function() {
    $(this).stop().animate({borderTopColor: "#74768F",borderBottomColor: "#74768F",borderLeftColor: "#74768F",borderRightColor: "#74768F"}, 300);
},function() {
    $(this).stop().animate({borderTopColor: "#dedede",borderBottomColor: "#dedede",borderLeftColor: "#dedede",borderRightColor: "#dedede"}, 300);
});

  });

// fancybox
$(document).ready(function() {
	$("a#fancy").fancybox({
		'titlePosition'		: 'inside',
		'transitionIn'		: 'fade',
		'transitionOut'		: 'none'
	});
	$("#iframe").fancybox({
		'width'				: '60%',
		'height'			: '90%',
        'transitionIn'		: 'fade',
		'transitionOut'		: 'none',
		'type'				: 'iframe'
	});
});