/*
 * $id          : hannanxp.js
 * $description : custom js for hannanxp.net, v2.0
 * $author      : Hannan Gigih Prastawa
 * $contact     : hannanxp@gmail.com
 */
 
/* DIMENSION */
(function($){$.dimensions = {version: '@VERSION'};
// Create innerHeight, innerWidth, outerHeight and outerWidth methods
$.each( [ 'Height', 'Width' ], function(i, name){
	// innerHeight and innerWidth
	$.fn[ 'inner' + name ] = function() {
		if (!this[0]) return;
		var torl = name == 'Height' ? 'Top'    : 'Left',  // top or left
		    borr = name == 'Height' ? 'Bottom' : 'Right'; // bottom or right
		
		return num(this, name.toLowerCase()) + num(this, 'padding' + torl) + num(this, 'padding' + borr);
	};
	
	// outerHeight and outerWidth
	$.fn[ 'outer' + name ] = function(options) {
		if (!this[0]) return;
		
		var torl = name == 'Height' ? 'Top'    : 'Left',  // top or left
		    borr = name == 'Height' ? 'Bottom' : 'Right'; // bottom or right
		
		options = $.extend({ margin: false }, options || {});
		
		return num(this, name.toLowerCase())
				+ num(this, 'border' + torl + 'Width') + num(this, 'border' + borr + 'Width')
				+ num(this, 'padding' + torl) + num(this, 'padding' + borr)
				+ (options.margin ? (num(this, 'margin' + torl) + num(this, 'margin' + borr)) : 0);
	};
});

// Create scrollLeft and scrollTop methods
$.each( ['Left', 'Top'], function(i, name) {
	$.fn[ 'scroll' + name ] = function(val) {
		if (!this[0]) return;
		
		return val != undefined ?
		
			// Set the scroll offset
			this.each(function() {
				this == window || this == document ?
					window.scrollTo( 
						name == 'Left' ? val : $(window)[ 'scrollLeft' ](),
						name == 'Top'  ? val : $(window)[ 'scrollTop'  ]()
					) :
					this[ 'scroll' + name ] = val;
			}) :
			
			// Return the scroll offset
			this[0] == window || this[0] == document ?
				self[ (name == 'Left' ? 'pageXOffset' : 'pageYOffset') ] ||
					$.boxModel && document.documentElement[ 'scroll' + name ] ||
					document.body[ 'scroll' + name ] :
				this[0][ 'scroll' + name ];
	};
});

$.fn.extend({
	position: function() {
		var left = 0, top = 0, elem = this[0], offset, parentOffset, offsetParent, results;
		
		if (elem) {
			// Get *real* offsetParent
			offsetParent = this.offsetParent();
			
			// Get correct offsets
			offset       = this.offset();
			parentOffset = offsetParent.offset();
			
			// Subtract element margins
			offset.top  -= num(elem, 'marginTop');
			offset.left -= num(elem, 'marginLeft');
			
			// Add offsetParent borders
			parentOffset.top  += num(offsetParent, 'borderTopWidth');
			parentOffset.left += num(offsetParent, 'borderLeftWidth');
			
			// Subtract the two offsets
			results = {
				top:  offset.top  - parentOffset.top,
				left: offset.left - parentOffset.left
			};
		}
		
		return results;
	},
	
	offsetParent: function() {
		var offsetParent = this[0].offsetParent;
		while ( offsetParent && (!/^body|html$/i.test(offsetParent.tagName) && $.css(offsetParent, 'position') == 'static') )
			offsetParent = offsetParent.offsetParent;
		return $(offsetParent);
	}
});

function num(el, prop) {
	return parseInt($.css(el.jquery?el[0]:el,prop))||0;
};

})($);
 
/* MOUSE WHELL */
(function($){$.fn.extend({mousewheel:function(f){if(!f.guid)f.guid=$.event.guid++;if(!$.event._mwCache)$.event._mwCache=[];return this.each(function(){if(this._mwHandlers)return this._mwHandlers.push(f);else this._mwHandlers=[];this._mwHandlers.push(f);var s=this;this._mwHandler=function(e){e=$.event.fix(e||window.event);$.extend(e,this._mwCursorPos||{});var delta=0,returnValue=true;if(e.wheelDelta)delta=e.wheelDelta/120;if(e.detail)delta=-e.detail/3;if(window.opera)delta=-e.wheelDelta;for(var i=0;i<s._mwHandlers.length;i++)if(s._mwHandlers[i])if(s._mwHandlers[i].call(s,e,delta)===false){returnValue=false;e.preventDefault();e.stopPropagation();}return returnValue;};if($.browser.mozilla&&!this._mwFixCursorPos){this._mwFixCursorPos=function(e){this._mwCursorPos={pageX:e.pageX,pageY:e.pageY,clientX:e.clientX,clientY:e.clientY};};$(this).bind('mousemove',this._mwFixCursorPos);}if(this.addEventListener)if($.browser.mozilla)this.addEventListener('DOMMouseScroll',this._mwHandler,false);else this.addEventListener('mousewheel',this._mwHandler,false);else
this.onmousewheel=this._mwHandler;$.event._mwCache.push($(this));});},unmousewheel:function(f){return this.each(function(){if(f&&this._mwHandlers){for(var i=0;i<this._mwHandlers.length;i++)if(this._mwHandlers[i]&&this._mwHandlers[i].guid==f.guid)delete this._mwHandlers[i];}else{if($.browser.mozilla&&!this._mwFixCursorPos)$(this).unbind('mousemove',this._mwFixCursorPos);if(this.addEventListener)if($.browser.mozilla)this.removeEventListener('DOMMouseScroll',this._mwHandler,false);else this.removeEventListener('mousewheel',this._mwHandler,false);else
this.onmousewheel=null;this._mwHandlers=this._mwHandler=this._mwFixCursorPos=this._mwCursorPos=null;}});}});$(window).one('unload',function(){var els=$.event._mwCache||[];for(var i=0;i<els.length;i++)els[i].unmousewheel();});})($);

/* SCROLL */
$.jScrollPane={active:[]};$.fn.jScrollPane=function(settings){settings=$.extend({scrollbarWidth:10,scrollbarMargin:5,wheelSpeed:18,showArrows:false,arrowSize:0,animateTo:false,dragMinHeight:1,dragMaxHeight:99999,animateInterval:100,animateStep:3,maintainPosition:true},settings);return this.each(function(){var $this=$(this);if($(this).parent().is('.jScrollPaneContainer')){var currentScrollPosition=settings.maintainPosition?$this.offset({relativeTo:$(this).parent()[0]}).top:0;var $c=$(this).parent();var paneWidth=$c.innerWidth();var paneHeight=$c.outerHeight();var trackHeight=paneHeight;if($c.unmousewheel){$c.unmousewheel()}$('>.jScrollPaneTrack, >.jScrollArrowUp, >.jScrollArrowDown',$c).remove();$this.css({'top':0})}else{var currentScrollPosition=0;this.originalPadding=$this.css('paddingTop')+' '+$this.css('paddingRight')+' '+$this.css('paddingBottom')+' '+$this.css('paddingLeft');this.originalSidePaddingTotal=(parseInt($this.css('paddingLeft'))||0)+(parseInt($this.css('paddingRight'))||0);var paneWidth=$this.innerWidth();var paneHeight=$this.innerHeight();var trackHeight=paneHeight;$this.wrap($('<div></div>').attr({'className':'jScrollPaneContainer'}).css({'height':paneHeight+'px','width':paneWidth+'px'}));$(document).bind('emchange',function(e,cur,prev){$this.jScrollPane(settings)})}var p=this.originalSidePaddingTotal;$this.css({'height':'auto','width':paneWidth-settings.scrollbarWidth-settings.scrollbarMargin-p+'px','paddingRight':settings.scrollbarMargin+'px'});var contentHeight=$this.outerHeight();var percentInView=paneHeight/contentHeight;if(percentInView<.99){var $container=$this.parent();$container.append($('<div></div>').attr({'className':'jScrollPaneTrack'}).css({'width':settings.scrollbarWidth+'px'}).append($('<div></div>').attr({'className':'jScrollPaneDrag'}).css({'width':settings.scrollbarWidth+'px'}).append($('<div></div>').attr({'className':'jScrollPaneDragTop'}).css({'width':settings.scrollbarWidth+'px'}),$('<div></div>').attr({'className':'jScrollPaneDragBottom'}).css({'width':settings.scrollbarWidth+'px'}))));var $track=$('>.jScrollPaneTrack',$container);var $drag=$('>.jScrollPaneTrack .jScrollPaneDrag',$container);if(settings.showArrows){var currentArrowButton;var currentArrowDirection;var currentArrowInterval;var currentArrowInc;var whileArrowButtonDown=function(){if(currentArrowInc>4||currentArrowInc%4==0){positionDrag(dragPosition+currentArrowDirection*mouseWheelMultiplier)}currentArrowInc++};var onArrowMouseUp=function(event){$('body').unbind('mouseup',onArrowMouseUp);currentArrowButton.removeClass('jScrollActiveArrowButton');clearInterval(currentArrowInterval)};var onArrowMouseDown=function(){$('body').bind('mouseup',onArrowMouseUp);currentArrowButton.addClass('jScrollActiveArrowButton');currentArrowInc=0;whileArrowButtonDown();currentArrowInterval=setInterval(whileArrowButtonDown,100)};$container.append($('<a></a>').attr({'href':'javascript:;','className':'jScrollArrowUp'}).css({'width':settings.scrollbarWidth+'px'}).html('Scroll up').bind('mousedown',function(){currentArrowButton=$(this);currentArrowDirection=-1;onArrowMouseDown();this.blur();return false}),$('<a></a>').attr({'href':'javascript:;','className':'jScrollArrowDown'}).css({'width':settings.scrollbarWidth+'px'}).html('Scroll down').bind('mousedown',function(){currentArrowButton=$(this);currentArrowDirection=1;onArrowMouseDown();this.blur();return false}));if(settings.arrowSize){trackHeight=paneHeight-settings.arrowSize-settings.arrowSize;$track.css({'height':trackHeight+'px',top:settings.arrowSize+'px'})}else{var topArrowHeight=$('>.jScrollArrowUp',$container).height();settings.arrowSize=topArrowHeight;trackHeight=paneHeight-topArrowHeight-$('>.jScrollArrowDown',$container).height();$track.css({'height':trackHeight+'px',top:topArrowHeight+'px'})}}var $pane=$(this).css({'position':'absolute','overflow':'visible'});var currentOffset;var maxY;var mouseWheelMultiplier;var dragPosition=0;var dragMiddle=percentInView*paneHeight/2;var getPos=function(event,c){var p=c=='X'?'Left':'Top';return event['page'+c]||(event['client'+c]+(document.documentElement['scroll'+p]||document.body['scroll'+p]))||0};var ignoreNativeDrag=function(){return false};var initDrag=function(){ceaseAnimation();currentOffset=$drag.offset(false);currentOffset.top-=dragPosition;maxY=trackHeight-$drag[0].offsetHeight;mouseWheelMultiplier=2*settings.wheelSpeed*maxY/contentHeight};var onStartDrag=function(event){initDrag();dragMiddle=getPos(event,'Y')-dragPosition-currentOffset.top;$('body').bind('mouseup',onStopDrag).bind('mousemove',updateScroll);if($.browser.msie){$('body').bind('dragstart',ignoreNativeDrag).bind('selectstart',ignoreNativeDrag)}return false};var onStopDrag=function(){$('body').unbind('mouseup',onStopDrag).unbind('mousemove',updateScroll);dragMiddle=percentInView*paneHeight/2;if($.browser.msie){$('body').unbind('dragstart',ignoreNativeDrag).unbind('selectstart',ignoreNativeDrag)}};var positionDrag=function(destY){destY=destY<0?0:(destY>maxY?maxY:destY);dragPosition=destY;$drag.css({'top':destY+'px'});var p=destY/maxY;$pane.css({'top':((paneHeight-contentHeight)*p)+'px'});$this.trigger('scroll')};var updateScroll=function(e){positionDrag(getPos(e,'Y')-currentOffset.top-dragMiddle)};var dragH=Math.max(Math.min(percentInView*(paneHeight-settings.arrowSize*2),settings.dragMaxHeight),settings.dragMinHeight);$drag.css({'height':dragH+'px'}).bind('mousedown',onStartDrag);var trackScrollInterval;var trackScrollInc;var trackScrollMousePos;var doTrackScroll=function(){if(trackScrollInc>8||trackScrollInc%4==0){positionDrag((dragPosition-((dragPosition-trackScrollMousePos)/2)))}trackScrollInc++};var onStopTrackClick=function(){clearInterval(trackScrollInterval);$('body').unbind('mouseup',onStopTrackClick).unbind('mousemove',onTrackMouseMove)};var onTrackMouseMove=function(event){trackScrollMousePos=getPos(event,'Y')-currentOffset.top-dragMiddle};var onTrackClick=function(event){initDrag();onTrackMouseMove(event);trackScrollInc=0;$('body').bind('mouseup',onStopTrackClick).bind('mousemove',onTrackMouseMove);trackScrollInterval=setInterval(doTrackScroll,100);doTrackScroll()};$track.bind('mousedown',onTrackClick);if($container.mousewheel){$container.mousewheel(function(event,delta){initDrag();ceaseAnimation();var d=dragPosition;positionDrag(dragPosition-delta*mouseWheelMultiplier);var dragOccured=d!=dragPosition;return!dragOccured},false)}var _animateToPosition;var _animateToInterval;function animateToPosition(){var diff=(_animateToPosition-dragPosition)/settings.animateStep;if(diff>1||diff<-1){positionDrag(dragPosition+diff)}else{positionDrag(_animateToPosition);ceaseAnimation()}}var ceaseAnimation=function(){if(_animateToInterval){clearInterval(_animateToInterval);delete _animateToPosition}};var scrollTo=function(pos,preventAni){if(typeof pos=="string"){$e=$(pos,this);if(!$e.length)return;pos=$e.offset({relativeTo:this}).top}ceaseAnimation();var destDragPosition=-pos/(paneHeight-contentHeight)*maxY;if(!preventAni||settings.animateTo){_animateToPosition=destDragPosition;_animateToInterval=setInterval(animateToPosition,settings.animateInterval)}else{positionDrag(destDragPosition)}};$this[0].scrollTo=scrollTo;$this[0].scrollBy=function(delta){var currentPos=-parseInt($pane.css('top'))||0;scrollTo(currentPos+delta)};initDrag();scrollTo(-currentScrollPosition,true);$.jScrollPane.active.push($this[0])}else{$this.css({'height':paneHeight+'px','width':paneWidth-this.originalSidePaddingTotal+'px','padding':this.originalPadding})}})};$(window).bind('unload',function(){var els=$.jScrollPane.active;for(var i=0;i<els.length;i++){els[i].scrollTo=els[i].scrollBy=null}});

/* HANNANXP */
$(function(){
	var page_active = 0;
	var fc_icon = 0; // belum ada yg diclick
	var port_data = ""; // data from ajax request
	function icon_hover(icon, parama, timea, paramb, timeb, textmenu) {
		icon.hover(
		  function () {
			$(this).css({backgroundColor: "#9BC1A6"});
			$(this).animate(parama, timea );
			textmenu.css({visibility: "visible",opacity:"0"});
			textmenu.animate({opacity: "1"}, timea + 200);
		  }, 
		  function () {
			$(this).animate(paramb, timeb );
			textmenu.animate({opacity: "0"}, timeb);
			$(this).queue(function(){
				$(this).css({backgroundColor: ""});
				textmenu.css({visibility: "hidden"});
				$(this).dequeue();
			});
			
		  }
		);
	}
	
	function icon_hover_in(icon, parama, timea) {
		icon.css({backgroundColor: "#9BC1A6", opacity:"1"});
		icon.animate(parama, timea );		
	}
	
	function icon_hover_out(icon, paramb, timeb) {
		icon.animate(paramb, timeb );
		icon.queue(function(){
			icon.css({backgroundColor: ""});
			icon.dequeue();
		});
	}

	function show_thepage(icona, iconb,thepage,paramicon) {
		icona.click(function(){
			if (!fc_icon) {
				$("#welcome").animate({opacity:"0"},1500);
			}				 
			iconb.css({visibility: "visible"});
			iconb.animate({ top: "380px",left: "430px"}, 1500 );
			iconb.queue(function(){
				iconb.css(paramicon);
				if (page_active) {
					page_active.animate({opacity:"0"},600);
					page_active.queue(function(){
						$(this).hide();
						$(this).dequeue();
					});	
				}
				thepage.queue(function(){
					var h;
					
					if (thepage.attr("id") == "page_portfolio") {
						h = "350px";
						if (port_data == "") {
							port_data = 1;
							page_portfolio_first_click();
							/*
							$.get("portfolio.php",{type:"xml"},function(data){
								//alert(data);							 	
								
								render_page_portofolio(data);
							});
							*/
						}
						
					} else {
						h = "300px";
					}				   
					thepage.css({	top: "380px",
											left: "425px",
											height:"30px",
											width:"50px",
											fontSize:"1px",
											visibility:"visible"});
					thepage.animate({ top: "220px",
												left: "200px",
												height: h,
												width: "500px",
												fontSize:"12px",
												opacity: "1"
												}, 
											1000 );
					page_active = thepage;
					$(this).dequeue();
				});   				
				$(this).dequeue();
			});
		});
	}
	
	function render_page_portofolio(data) {	
		$("item",data).each(function(){
			var e = $(this);						 
			$("#ct").append("<div class=\"pi\">"
				+ "<div class=\"pi_t\">"+ $("title",e).html() +"</div>"			
				+ "<p class=\"pi_p\"><img class=\"pi_i\" alt=\"\" height=\"150\" width=\"200\" src=\""+ $("pic",e).html() +"\">"
				+  $("desc",e).html() +"<br/>"
				+ "URL: <a target=\"_blank\" href=\""+ $("url",e).html() +"\">"+ $("url",e).html() +"</a><br/>"
				+ "Date Created: " +  $("date",e).html()
				+ "</div>"		
			);
		});
	}
	
	$("#logoxp").css({visibility:"visible",opacity:"0"});
	$("#logoxp").animate({opacity: "1"}, 3000 );
	$("#logoxp").queue(function(){
		$("#icon_profile").css({visibility:"visible",opacity:"0"});
		$("#icon_profile").animate({opacity: "1"}, 600 );
		$("#icon_profile").queue(function(){
			$("#icon_skill").css({visibility:"visible",opacity:"0"});
			$("#icon_skill").animate({opacity: "1"}, 600 );
			$("#icon_skill").queue(function(){
				$("#icon_portfolio").css({visibility:"visible",opacity:"0"});
				$("#icon_portfolio").animate({opacity: "1"}, 600 );
					
				$(this).dequeue();
			});	
			$(this).dequeue();
		});								  
		$(this).dequeue();
	});
	$("#welcome").css({visibility:"visible",opacity:"0"});
	$("#welcome").animate({opacity: "1"}, 6000 );
	
	$("#icon_profile2").css({opacity:"0.2"});
	$("#icon_skill2").css({opacity:"0.2"});
	$("#icon_portfolio2").css({opacity:"0.2"});
	
	icon_hover($("#icon_profile"),{top:"265px",left:"25px",borderWidth:"5px"},300,{top:"270px",left:"30px",borderWidth:"0px"},300,$("#menu_profile"));
	icon_hover($("#icon_skill"),{top:"335px",left:"25px",borderWidth:"5px"},300,{top:"340px",left:"30px",borderWidth:"0px"},300,$("#menu_skill"));
	icon_hover($("#icon_portfolio"),{top:"405px",left:"25px",borderWidth:"5px"},300,{top:"410px",left:"30px",borderWidth:"0px"},300,$("#menu_portfolio"));
	
	show_thepage($("#icon_profile"), $("#icon_profile2"),$("#page_profile"),{top: "265px", left: "25px", visibility: "hidden"});
	show_thepage($("#icon_skill"), $("#icon_skill2"),$("#page_skill"),{top: "335px", left: "25px", visibility: "hidden"});
	show_thepage($("#icon_portfolio"), $("#icon_portfolio2"),$("#page_portfolio"),{top: "405px", left: "25px", visibility: "hidden"});
	
	$(".close_page").click(function(){
		page_active.animate({opacity:"0"},600);
		$("#welcome").animate({opacity:"1"},6000);	
		page_active.queue(function(){
			$(this).hide();
			$(this).dequeue();
		});	
	});
	
	/*
	$(".pi_t").hover(function(){
			$(this).css({background:"#328043"});
		},function(){
			$(this).css({background:"#9BC1A6"});
		}
	);
	
	$(".pi_t").toggle(function(){			
			var i = $(this).next().children("img");
			var s = $(this).next().children("span");
			$(this).next().show(600);	
			$(this).parent().animate({height:"180px"},600);  
			if (i.attr("src") != s.html()) {
				i.attr("src",s.html());
			}
		},function(){
			$(this).next().hide(600);
			$(this).parent().animate({height:"22px"},600);
		}
	);
	*/
	function page_portfolio_first_click(){
		$(".pi_t").each(function(i){
			var i = $(this).next().children("img");
			var s = $(this).next().children("span");
			if (i.attr("src") != s.html()) {
				i.attr("src",s.html());
			}					 
		});
	}
	
	$('#ct').jScrollPane({showArrows:true,scrollbarMargin:5});
	if ($.browser.msie) {
		//$('#ct').css({width:"485px"});	
		$(".pi_t").css({width:"465px"});
	} else {
			
	}
	
	
	
	//$("#page_portfolio").css({visibility:"visible",left:"200px",top:"200px",width:"500px",height:"360px",fontSize:"12px"});
	//$("#page_skill").css({visibility:"visible",left:"200px",top:"200px",width:"500px",height:"300px",fontSize:"12px"});
});