﻿/**---------------------------------
 * prototype04.js
 * 
 * ...
 * @author	: takaaki koyama
 * @see http://www.qualt-graph.com
 * @see http://www.sph62.net
 *
 * @use jquery.js 1.4 later
 * @use jquery.backgroundPosition.js
 ----------------------------------------------------*/
 
var prototype04 ={
		name : "prototype04",
		HASH_TAG : " #prototype04",
		TWEET_LENGTH : 500,
		
		twitter : {
		 	API_JSON_URL : "http://search.twitter.com/search.json",
			parse_tweet : function(res){
				var len = res.length;
				var html = [];
				for(var i = 0; i < len; i++){
					html[i] = this.format_tweet(res[i]);
				}
				
				return html.join("");
			},
			
			format_tweet : function(tweet){
				var html = "";
				html += '<li><p>';
				html += '<a href="http://twitter.com/'+tweet.from_user+'" target="_blank"><img src="'+tweet.profile_image_url+'" alt="'+tweet.from_user+'" width="40" height="40"></a>';
				html += '<span class="tweet">'+this.linkify_tweet(tweet.text)+'</span><br />';
				html += '<a href="http://twitter.com/'+tweet.from_user+'" class="user_name" target="_blank">'+tweet.from_user+'</a> : <span class="time">'+this.relative_time(tweet.created_at)+'</spna>';
				html += '</p></li>';
				
				return html;
			},
			
			linkify_tweet : function(tweet) {
  					tweet = tweet.replace(/((ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?)/,'<a href="$1" target="_blank">$1</a>');
  					tweet = tweet.replace(/(^|\s)(@|＠)(\w+)/g,'$1<a href="http://twitter.com/$3" target="_blank">@$3</a>');
  					return tweet.replace(/(^|\s)#(\w+)/g, '$1<a href="http://twitter.com/search?q=%23$2" target="_blank">#$2</a>');
			},

			
		 	relative_time : function (time_value) {
			  var delta = parseInt(((new Date()).getTime() - (new Date(time_value)).getTime()) / 1000);
			
				if (delta < 60) {
					return 'less than a minute ago';
				} else if(delta < 120) {
					return 'about a minute ago';
				} else if(delta < (60*60)) {
					return (parseInt(delta / 60)).toString() + ' minutes ago';
				} else if(delta < (120*60)) {
					return 'about 1 hour ago';
				} else if(delta < (24*60*60)) {
					return 'about ' + (parseInt(delta / 3600)).toString() + ' hours ago';
				} else if(delta < (48*60*60)) {
					return '1 day ago';
				} else {
					return (parseInt(delta / 86400)).toString() + ' days ago';
				}
			}
		},
		
		lang_swicher : function(){
			
			var switch_lang = function(lang,no_lang){
				jQuery(".chlang_target").each(function(){
					var $t = $(this);
					if($t.attr("src") && $t.attr("src").match("_"+no_lang)){
						$t.attr("src",$t.attr("src").replace("_"+no_lang, "_"+lang))
					}
					if($t.css("background-image") && $t.css("background-image").match("_"+no_lang)){
						$t.css("background-image",$t.css("background-image").replace("_"+no_lang, "_"+lang))
					}
				});
				
				jQuery(".chlang_target_"+no_lang).hide();
				jQuery(".chlang_target_"+lang).show();
				
				jQuery(".chlang").each(function(){
					var $t = jQuery(this).find("img");
					if(this.hash == "#" + lang){
						$t.addClass("current");
						if($t.attr("src") && $t.attr("src").match(/_off/)){
							$t.attr("src",$t.attr("src").replace("_off", "_on"))
						}
					}else{
						$t.removeClass("current");
						if($t.attr("src") && $t.attr("src").match(/_on/)){
							$t.attr("src",$t.attr("src").replace("_on", "_off"))
						}
					}
				});
				
				jQuery.cookie("lang", null, { expires: -1, path: '/', domain : document.domain});
				jQuery.cookie("lang", lang, { expires: 14, path: '/', domain : document.domain});
			}
			
			jQuery(".chlang").click(function(){
				var lang = this.hash;
				var no_lang = "";
				if(lang == "#jp"){
					switch_lang("jp", "en")
				}else
				if(lang == "#en"){
					switch_lang("en", "jp")
				}
				
				return false;
			})
			
			var lang = jQuery.cookie("lang");
			if(lang == null || (lang != "jp" && lang != "en")){
				lang = "jp";
			}
			
			var no_lang = "";
			if(lang == "jp"){ 
				no_lang = "en";
			}else{	
				no_lang = "jp"
			}
			
			switch_lang(lang, no_lang);
		},
		
		
		delayCall : function(func,delay){
			if(delay == "undefined") delay = 0;
			setTimeout(func,delay)
		}
};

(function($){
	
	$(function(){
		
		prototype04.lang_swicher();
		
		//preload images
		var images = [];
		$(".chlang_target").each(function(index){
			  var $t = $(this);
				if($t.attr("src") && $t.attr("src").match(/_jp/)){
					 images[index]= new Image();
					 images[index].src = $t.attr("src").replace("_jp", "_en");
				}
				if($t.css("background-image") && $t.css("background-image").match(/_jp/)){
					 images[index]= new Image();
					 images[index].src = $t.css("background-image").replace("_jp", "_en");
				}
		});
		
		
		if($("body").hasClass("index")){
			start_index();
		}
		
	});
	
	function start_index(){
		animate(function(){
				$.ajax({
				   url : prototype04.twitter.API_JSON_URL,
				   type: 'GET',
				   data : {
					   q : prototype04.HASH_TAG,
					   rpp : prototype04.TWEET_LENGTH,
					   lang : "all"
					},
					cache : true,
					dataType: 'jsonp',
					timeout: 5000,
					error: function(err){},
					success: function(json){
							if(json.results.length == 0) return;
							
							prototype04.delayCall(function(){
								var html = prototype04.twitter.parse_tweet(json.results);
								$("#twitter dd ul").append(html);
							})
							
							prototype04.delayCall(function(){							
								tw = 0;
								pos = $("#twitter dd").width();
								
								$("#twitter dd ul li").each(function(){
									var w = $(this).width();
									if(w<280){w = 280;}
									$(this).css('width',w+"px");
									tw +=w;
								})
							},50);
							
							prototype04.delayCall(function(){
								$("#twitter dd ul").width(tw).css({"left" : pos+"px"});						
								$("#tweet_flow").animate({
										'height' : '120px'
									},{
										easing : "easeInOutExpo",
										duration : 1000,
										complete : move_tweet_flow
								})
							},100);
					}
				})
			});
	}
	
	var timer;
	function move_tweet_flow(){
		timer = setInterval(update,1000/50);
		$("#tweet_flow li").mouseover(function(){
				clearInterval(timer);
		}).mouseout(function(){
			timer = setInterval(update,1000/50);
		})
	}
	
	var pos = 0,speed = 2, tw = 0;
	function update(){
		pos -= speed;
		if(pos < -tw){
			pos = $("#twitter dd").width();
			$("#twitter dd ul").animate({"left" : pos+"px"},{duration : 0, queue : false});
		}else{
			$("#twitter dd ul").animate({"left" : "-="+speed+"px"},{duration : 0, queue:false});
		}
	}
	
	function animate(callback){
		$("#logo").delay(300).animate({"background-position" : "(0 0)" },{easing : "easeInOutExpo",duration : 800 });
		$("#catch_copy").delay(350).animate({"background-position" : "(0 0)"},{easing : "easeInOutExpo", duration : 800});
		$("#schedule").delay(800).animate({"background-position" : "(0 0)"	},{easing : "easeInOutExpo",duration : 1000});
		$("#location").delay(950).animate({"background-position" : "(0 0)"},{easing : "easeInOutExpo", duration : 1000});
		$("#design_hub").delay(1100).animate({"background-position" : "(0 0)"},{easing : "easeInOutExpo",duration : 1000,
				complete : function(){
					callback();
					//setTimeout(loop,5000);
				}
		});
		
	}
	
	function loop(){
		setTimeout(loop,10000+5000*Math.random());
		swing("#logo",150,100);
	}
	
	function swing(target,delay,call){
		var $t = $(target);
		$t.delay(delay).animate({
				"background-position" : "("+$t.width()+"px 0)"
				},{
					easing : "easeInExpo",
					duration : 1200,
					complete : function(){
						setTimeout(function(){
							$t.animate({"background-position" : "( -" + $t.width() +"px 0)"},{duration : 0})
								.animate({"background-position" : "(0 0)"},{easing : "easeOutExpo", duration : 1200});
						},call);
					}
		})
	}

})(jQuery)
