window.utils = {};
(function()
{
    
    window.utils.comicScroller = {
		"create" : function( obj )
		{
		    this._icon_path = obj.icon_path;
		    this._ul = obj.base;
		    this._comment = obj.comment;
		    this._comics = [];
		    this._column_size = 150;
		    this._loop = undefined;
		    this._init( obj.data );
		    
		    
		    return this;
		} ,

		"start" : function( )
		{
			var _ul = this._ul;
			var _comics = this._comics;
			var _comment = this._comment;

			if( _comics.length < 1 ) return false;


			this._loop = new window.utils.comicScroller.LoopDispatcher( { "target" :  this._ul , "column_size" : this._column_size  , "comment" : _comment }  );
			this._loop.setCallback( function( o )
			{
			    
			    /*$(_comment).css( { "display" : "block" } );*/
				for(var i=0 ; i < o.num ; i++)
				{
				    var tmp = _comics.shift();
				    _ul.append( tmp.obj );
				    _comics.push( tmp );
				}
				_ul.css({ "left" : "0px"  } );

			        /*
				var now = $( "p" , $("li" , _ul).get(2) );
				
				$("h3" , _comment).text( now.attr("title").subtrim(0,16) );
				$("p" , _comment).html("<b>" + now.attr("catch_copy").subtrim(0,18) + "</b><br />" + now.attr("comment").subtrim(0,42) );
				*/
		    });

		},

		
		"_init" : function( data )
		{
			var comics = this._comics ;
			var _context = this;
			var _ul = this._ul;
			var _icon_path = this._icon_path;

			_ul.html("");
			data.shuffle_fy();

			for( var i=0; i < data.length ; i++)
			{
				var li = $("<li/>");
				var p = $("<p/>").text( data[i]["title"] ).attr("title" , data[i]["title"]).attr("comment" , data[i]["introduction"]).attr(
				"catch_copy" , data[i]["catchcopy"]).attr("large" , "/icon/comic_title/large/" + data[i]["id"] ) ;
				p.css({ "background-image" : "url(" + _icon_path + "/icon/comic_title/large/" + data[i]["id"] +  ")" } );
				li.addClass("shadow");

				li.append( p );
				var comic = new window.utils.comicScroller.Comic( li );
			    comic.obj.click( function()
				{
				    _context._loop.start( $("li" , _context._ul).index( this ) -2 );
				});
				comics.push( comic );
				_ul.append( li );
			}
			this._ul.width( this._column_size * comics.length );

		}
    };

    window.utils.comicScroller.Comic = function(obj)
    {
		this.obj = obj;
    };

    window.utils.comicScroller.LoopDispatcher = function( obj )
    {
		var _loop = undefined;
		var _ul = obj.target ;
		var _size = obj.column_size;
	var _comment = obj.comment;
		var _callback = undefined;

		var _timer = undefined;
		var _create_timer = function()
		{
		    _timer = setInterval( function()
		    {
				if(!_loop) _start(1);
		    } , 3000 );

		};

		_create_timer();

		var _start = function( num )
		{
			if(_loop) return ;
			var m = 2;
			var moved = 0;
			var pos = parseInt( _ul.css("left") );
		    $(_comment).css({ "display" : "none" });
			_loop = setInterval( function()
			{

			    m+=0.5;
				moved += m;
				_ul.css({ "left" : pos - moved  + "px" } );
				if( moved > num * _size )
				{
					clearInterval( _loop );
					_loop = undefined;
					_ul.css({ "left" : pos - ( num * _size ) + "px" } );
					if(_callback){
						_callback({ "num" :  num } );
					}
				}

			} , 30 );
		};

		this.start = function(num)
		{
			clearInterval( _timer );
			_start(num);
			_create_timer();
		}

		this.setCallback = function( func )
		{
			_callback = func;
		}


    }

	window.utils.ComicPopuper = function( data )
	{
		var _comic = data.comic;
		var _genre = data.genre;
		var _div = undefined;

		
		var _createHTML = function()
		{
			var div = jQuery("<div/>").attr("id" , "comicPopper");

			var img = jQuery("<img/>").attr("src" , _comic.image_url );
			div.append(img);


			var inner = jQuery("<div/>").addClass("attributes");
	
			var title = jQuery("<h3/>").text( _comic.title );
			var genre_name = jQuery("<h4/>").addClass("genre_name").text( _genre.genre_name );
			var catchcopy = jQuery("<p/>").addClass("catchcopy").text(_comic.catchcopy );
			var introduction_title = jQuery("<p/>").addClass("introduction_title").text( "紹介文" );
			var introduction = jQuery("<p/>").addClass("introduction").text( _comic.introduction );

			inner.append( title );
			inner.append( genre_name );
			inner.append( catchcopy );
			inner.append( jQuery('<br/>') );
			inner.append( introduction_title );
			inner.append( introduction );

			div.append( inner );
			_setPosition( div );

			var p = jQuery("<p/>").css({ "clear" : "both"});
			div.append( p );

			_div = div;
		} ;
		
		jQuery(window).resize( function()
		{
			_setPosition( _div );
		});
	
		jQuery(window).scroll( function()
		{
			_setPosition( _div );
		});

		var _setPosition = function( div )
		{
			div.css({"top" : ( ( jQuery("html").attr("clientHeight") / 2 ) - 200 ) +  jQuery(document).scrollTop() + "px" , "left" : ( jQuery(document).width() / 2 ) - 250 + "px" } )
		}

		this.create = function()
		{
			_createHTML();
		}

		this.getDiv = function()
		{
			return _div;
		}
	} ;

	window.utils.FullScreenDiv = function()
	{
		var _div = jQuery("<div/>").attr("id" , "fullScreen");
		var _comic = undefined;
		this.div = _div;

		this.addComic = function( comic )
		{
			_comic = comic;
		};

		jQuery(window).resize( function()
		{
			_setPosition( _div );
		});
	
		jQuery(window).scroll( function()
		{
			_setPosition( _div );
		});

		var _setPosition = function( div )
		{
			div.css("top", jQuery(document).scrollTop() + "px");
			div.css("left", "0px");
			div.width( jQuery("html").width() ).height( jQuery("html").height() );
		}

		_div.click( function()
		{
			_div.fadeOut( function()
			{
				_div.remove();
				_comic.getDiv().remove();
			});
		});
		_setPosition( _div );
	};

Array.prototype.shuffle_fy = function() {
    var i = this.length;
    while(i){
        var j = Math.floor(Math.random()*i);
        var t = this[--i];
        this[i] = this[j];
        this[j] = t;
    }
    return this;
}

String.prototype.subtrim = function(start,end,foot)
{
    var _foot = foot ? foot : "...";
    var _str = this.toString();
    if( end - start < _str.length )
    {
	return _str.split("").slice( start , end ).join("") + _foot;
    }else
    {
	return _str;
    }
}



})();