/*---------------------main jquery for site--------------------*/
$(document).ready(function(){
$(function() {
    var currentPosition = 0;
  var slideWidth = 780;
  var slides = $('.slide');
  var numberOfSlides = slides.length;

  // Remove scrollbar in JS
  $('#slidesContainer').css('overflow', 'hidden');

  // Wrap all .slides with #slideInner div
  slides
    .wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });

  // Set #slideInner width equal to total width of all slides
  $('#slideInner').css('width', slideWidth * numberOfSlides);

  // Insert controls in the DOM
  $('#slideshow')
    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    .append('<span class="control" id="rightControl">Clicking moves right</span>');

  // Hide left arrow control on first load
  manageControls(currentPosition);

  // Create event listeners for .controls clicks
  $('.control')
    .bind('click', function(){
    // Determine new position
	currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
    
	// Hide / show controls
    manageControls(currentPosition);
    // Move slideInner using margin-left
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
  });

  // manageControls: Hides and Shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
	if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
	// Hide right arrow if position is last slide
    if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  }
    
//--------------contact info---------------------------
    
$(function() {
var currentPosition = 0;
  var slideWidth = 500;
  var slides = $('.slide2');
  var numberOfSlides = slides.length;

  // Remove scrollbar in JS
  $('#contactContainer').css('overflow', 'hidden');

  // Wrap all .slides with #slideInner div
  slides
    .wrapAll('<div id="slideInner2"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });

  // Set #slideInner width equal to total width of all slides
  $('#slideInner2').css('width', slideWidth * numberOfSlides);

  // Insert controls in the DOM
  $('#contact-info')
    .prepend('<span class="control2" id="leftControl">Clicking moves left</span>')
    .append('<span class="control2" id="rightControl">Clicking moves right</span>');

  // Hide left arrow control on first load
  manageControls(currentPosition);

  // Create event listeners for .controls clicks
  $('.control2')
    .bind('click', function(){
    // Determine new position
	currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
    
	// Hide / show controls
    manageControls(currentPosition);
    // Move slideInner using margin-left
    $('#slideInner2').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
  });

  // manageControls: Hides and Shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
	if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
	// Hide right arrow if position is last slide
    if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  }    
    
});	

//------------------------------------Socialise Icons-----------------------------------------

    $("#socialise img").hover(function(){
	    $(this).animate({'margin-top':'2px'},{queue:false, duration:300, easing: 'easeOutQuad'});
	},
	function() { //on hover out...
		//Fade the image to full opacity
		$(this).animate({'margin-top':'10px'},{queue:false, duration:300, easing: 'easeOutQuad'});
    });
    
    //----------------Contact Sliding Panel--------------------
    $(".btn").click(function(){
		$("#panel").slideToggle({easing: 'easeInOutQuad', duration:800})  
		$(this).toggleClass("active"); return false;
	});
    //-------------------Downloads sliding panel----------------------------------
    $(".download-btn").click(function(){
		$(".downloads").slideToggle({easing: 'easeInOutQuad', duration:800})  
		$(this).toggleClass("active"); return false;
	});
    //--------------portfolio sliding panels-------------------------------------
    $(".portfolio-btn1").click(function(){
		$("#portfolio-panel1").slideToggle("slow")
	});
  //------------------Navigation dripping lines-----------------
       $(".linkbg").hover(function(){
		$(this).stop().animate({height:'32px'},{queue:false, duration:300, easing: 'easeOutQuad'});
		$('.linkbg[id="active"]').stop().animate({height:'32px'},{queue:false, duration:300, easing: 'easeOutQuad'});
		
     },
     function() { //on hover out...
		//Fade the image to full opacity
		
		$(this).stop().animate({height:'20px'},{queue:false, duration:300, easing: 'easeOutQuad'});
		$('.linkbg[id="active"]').stop().animate({height:'32px'},{queue:false, duration:300, easing: 'easeOutQuad'});
    });
  
//-----------------------Contact form ------------------------    
    
$.fn.search = function() {
	return this.focus(function() {
		if( this.value == this.defaultValue ) {
			this.value = "";
		}
	}).blur(function() {
		if( !this.value.length ) {
			this.value = this.defaultValue;
		}
	});
};
$(".email").search();
$(".comment").search();
$(".name").search();
$(".email2").search();
$(".name2").search();

$(".username").search();
$(".password").search();


//------------------------portfolio rollovers--------------------
$(document).ready(function(){  
jQuery.easing.def = "easeInOutQuad";
$('.boxgrid.captionfull').hover(function(){
    $(".roll-over", this).stop().animate({'opacity':'0'}, 700);
    $(".cover", this).stop().animate({top:'115px'},{queue:false, duration:500});
}, function() {
    $(".roll-over", this).stop().animate({'opacity':'1'}, 700);
    $(".cover", this).stop().animate({top:'220px'},{queue:false, duration:500});
});
});

//-------------------------portfolio Filter------------------------

$("#filter").val(1);
$("#filter2").val(1);
$("#filter3").val(1);

$('ul#portfolio-thumbs li.hidden').hide();
function disableLink(e) {
    // cancels the event
    e.preventDefault();

    return false;
}
	$('#filter').change(function() {
		$("#filter2").val(1);
		$("#filter3").val(1);
		$("#filter option").css('outline','none');
		$('#filter option .current').removeClass('current');
		$("#filter option:selected").parent().addClass('current');

		var filterVal = $("#filter option:selected").text().toLowerCase().replace(' ','-');

		if(filterVal == 'all-work') {
			$('ul#portfolio-thumbs li.hidden').fadeIn('fast').removeClass('hidden');
		} else {
			$('ul#portfolio-thumbs li').each(function() {
				if(!$(this).hasClass(filterVal)) {
					$(this).fadeOut(4).addClass('hidden');
				} else {
					$(this).fadeIn(4).removeClass('hidden');
				}
			});
		}

		return false;
	});
	
	$('#filter2').change(function() {
		$("#filter").val(1);
		$("#filter3").val(1);
		$("#filter2 option:selected").css('outline','none');
		$('#filter2 option .current').removeClass('current');
		$("#filter2 option:selected").parent().addClass('current');

		var filterVal = $("#filter2 option:selected").text().toLowerCase().replace(' ','-').replace(' ','-').replace(' ','-');

		if(filterVal == 'all-disciplines') {
			$('ul#portfolio-thumbs li.hidden').fadeIn('fast').removeClass('hidden');
		} else {
			$('ul#portfolio-thumbs li').each(function() {
				if(!$(this).hasClass(filterVal)) {
					$(this).fadeOut(4).addClass('hidden');
				} else {
					$(this).fadeIn(4).removeClass('hidden');
				}
			});
		}

		return false;
	});
	
	$('#filter3').change(function() {
		$("#filter").val(1);
		$("#filter2").val(1);
		$("#filter3 option:selected").css('outline','none');
		$('#filter3 option .current').removeClass('current');
		$("#filter3 option:selected").parent().addClass('current');

		var filterVal = $("#filter3 option:selected").text().toLowerCase().replace(' ','-').replace(' ','-').replace(' ','-');

		if(filterVal == 'all-sectors') {
			$('ul#portfolio-thumbs li.hidden').fadeIn('fast').removeClass('hidden');
		} else {
			$('ul#portfolio-thumbs li').each(function() {
				if(!$(this).hasClass(filterVal)) {
					$(this).fadeOut(4).addClass('hidden');
				} else {
					$(this).fadeIn(4).removeClass('hidden');
				}
			});
		}

		return false;
	});

function formatTitle(title, currentArray, currentIndex, currentOpts) {
    return '<div id="image-title">' + 'Image ' + (currentIndex + 1) + ' of ' + currentArray.length + (title && title.length ? ' <a href="http://' + title + '" target="_blank">' + title + '</a>' : '' ) + '</div>';
}

$(".screens").fancybox({
	'titlePosition'         : 'inside',
	'titleFormat'		: formatTitle
    });
$('#commentform').validate();
//--------------------------banner slide-------------
$("#content2").showcase({
    css: {
	width: "680px",
	height: "260px",
	"float" : "right",
	border : "solid #96b519 1px",
	"background-color" : "#131313"
	},
    animation: { interval: 5000,
                stopOnHover: true,
                easefunction: "easeOutExpo",
                speed: 1200 },
    images: [
    { url:"images/DigitalDesign.png", link:"webdesign.php", description: "Web design and Development, E-Marketing, SEO, Flash, Content Managed Websites and more..." },
    { url:"images/identityblocked.png", link:"branding.php", description: "Brand Design and Management, Brand Guidelines, Re-brands, Signage and Display Graphics and more..."},
    { url:"images/creative-design.png", link:"graphic-design.php", description: "Brochures, Catalogs, Folders, Stationary, Illustration, Packaging, Photography and more..." },
    { url:"images/advertisingDesign.png", link:"advertising.php", description: "Magazine Adverts, Point of Sale, Outdoor Media, E-flyers, Direct Mail and more..." }
    
    
    ],
    navigator: {
	autoHide:"true",
        position: "bottom-right",
        css: { padding:"0px",
               margin: "0px 5px 5px 0px" },
        showNumber: false,
        item: {
            css: {  height:"12px",
                    "line-height":"12px",
                    width:"12px",
                    "-moz-border-radius": "10px",
                    "-webkit-border-radius": "10px",
                    backgroundColor: "#96b519",
                    borderColor:"#96b519",
		    color:"#111",
                    margin: "2px",
                    "text-align": "center",
                    "vertical-align": "middle"},
		
            cssHover: {
                backgroundColor: "#333",
                borderColor: "#aaa" },
            cssSelected: {
                backgroundColor: "#222",
		color:"white",
                borderColor: "#aaa" }
        }
    },
    titleBar: { css: { background: "#222", "z-index" : "100", "padding-left": "20px", height:"20px", "font-weight":"normal", opacity: "0.85" } }
});
//----------------------------portfolio slideshow----------

});
});