REGION_RANGE = 12;
REGION_USERS = 10;
REGION_SIZE = [FUKIDASI_SIZE[0] * REGION_RANGE, FUKIDASI_SIZE[1] * REGION_USERS];

/**
 *	左右	無限(日付移動)
 *	上下	顔の分だけ
 */
WithFriendsTimetable = Class.create();
Object.extend(WithFriendsTimetable.prototype, TimetableManager.prototype);
Object.extend(WithFriendsTimetable.prototype, {
	initialize: function() {
		this.region_size = REGION_SIZE;
		TimetableManager.prototype.initialize.call(this);
		this.ajax_content = true;
		this.scroller.set_horizontal_infinite(true);
		
		if(!window.location.search) {
			this.baseDate = new Date();
		} else {
			var	t = window.location.search.substr(1).split('-', 3);
			this.baseDate = new Date(t[0], t[1] - 1, t[2]);
			this.baseDate.setHours(23);
		}
		this.baseDate.setUTCMinutes(0);
		this.baseDate.setUTCSeconds(0);
		this.baseDate.setUTCMilliseconds(0);
		
		this.set_date_string();
		
		this.date_offset = 0;
	},
	
	on_page_load: function() {
		this.set_hour_origin(this.baseDate.getHours());
		TimetableManager.prototype.on_page_load.call(this);
    
		this.set_height(this.leftEl.scrollHeight);
		this.scroller.set_vertical_scroll([0, this.leftEl.scrollHeight]);
	},
	
	create_region_url: function(x, y) {
		var	endTime = this.baseDate.clone();
		endTime.setHours(endTime.getHours() - x*REGION_RANGE);
		endTime.setDate(endTime.getDate() - this.date_offset);
		
		var	beginTime = endTime.clone();
		beginTime.setHours(beginTime.getHours() - REGION_RANGE);

		request_url = [
      './fragments/with_friends',
			'?begin=', date_to_24oclock(beginTime), 
			'&end=', date_to_24oclock(endTime), 
			'&user=', y*REGION_USERS, '-'
    ]

    if(window.CUSTOM_ORDER) {
      user_ids = this.enum_left_user_ids(y*REGION_USERS, (y+1)*REGION_USERS);
      request_url.push('&user_ids=', user_ids.join(','));
    }
    return request_url.join('');
	},
	
	enum_left_user_ids: function(start, end) {
    return this.leftEl.select('div.buddy').slice(start, end).map(function(x) {
      return x.select('.user_id')[0].innerHTML;
    });
  },
	
	/**
	 *	左側の顔リストを更新する。
	 */
	update_left_caption: function() {
    return;
    
		if(this.leftEl.updating)
			return;
		
		this.leftEl.updating = true;
		this.request = new Ajax.Updater(
			this.leftEl,
			'./fragments/with_friends_left', {
			method: 'get',
			onComplete: this.on_complete_update_left_caption.bind(this),
			onException: this.on_fail_update_left_caption.bind(this)
		});
	},
	
	on_complete_update_left_caption: function(transport, json) {
		this.leftEl.updating = false;
		this.leftEl.last_modified = json.last_modified;
		
		this.set_height(this.leftEl.scrollHeight);
		this.scroller.set_vertical_scroll([0, this.leftEl.scrollHeight]);

		// 現在のRegionをクリップ
		var	self = this;

		this.get_regions().each(function(regionEl) {
			var	bottom = regionEl.offsetTop + regionEl.offsetHeight;
			if(bottom>self.leftEl.scrollHeight) {
				regionEl.style.height = (self.leftEl.scrollHeight - regionEl.offsetTop) + 'px';
			}
		});

		// last_modifiedが空だったら、まだ更新中なので、5秒後にまたおいでください
		if(!json.last_modified) {
			window.setTimeout(this.update_left_caption.bind(this), 5 * 1000);
		} else {
			var	x = $('loading');
			if(x)
				x.parentNode.removeChild(x);
				
			x = $('crawling');
			if(x) {
				///	crawlingの白いもわもわがぐるぐるしてたら、消して、全部を更新
				x.parentNode.removeChild(x);
				this.refresh();
			}
		}
	},
	on_fail_update_left_caption: function(exception) {
		this.leftEl.updating = false;
	},

	/**
	 *	
	 */
	on_before_create_region: function(x, y) {
		if(y<0)
			return false;
		if(this.leftEl.scrollHeight) {
			if(y * REGION_SIZE[1] > this.leftEl.scrollHeight)
				return false;
		}
		return true;
	},
	on_after_create_region: function(regionEl) {
		///	下側をクリップ
		if(this.scroller.vertical_range) {
			var	bottom = regionEl.offsetTop + regionEl.offsetHeight;
			if(bottom>this.leftEl.scrollHeight) {
				regionEl.style.height = (this.leftEl.scrollHeight - regionEl.offsetTop) + 'px';
			}
		}
	},

	/**
	 *	左のキャプションと、リージョンの最終更新時刻を比べて、違っていたら全部を更新
	 */
	on_update_region: function(regionEl, json) {
		if(json.last_modified && this.leftEl.last_modified &&
		   json.last_modified!=this.leftEl.last_modified) {
			//alert(json.last_modified + ' -> ' + this.leftEl.last_modified);
			this.refresh();
		}
	},
	
	/**
	 *	Viewが更新されたときの呼ばれる　スクロールしたときとか
	 */
	on_update_view: function() {
		var	dateEl = $('date-current');
		var	left = Math.min(this.topEl.scrollLeft, DAY_WIDTH - dateEl.offsetWidth);
		dateEl.style.left = left + 'px';
		
		Element.setStyle(dateEl, {
			'opacity': left==0 ? 1 : 0.75
		});
	},
	
	/**
	 *	日付変更線を超えたときの処理
	 *	@param advance true: 次の日, false: 前の日
	 */
	on_change_date: function(advance) {
		this.date_offset += advance ? 1 : -1;
		this.baseDate.setDate(this.baseDate.getDate() + (advance ? 1 : -1));
		this.set_date_string();
	},
	
	/**
	 *	日付エレメントを設定する
	 */
	set_date_string: function() {
		var	tomorrow = this.baseDate.clone();
		var	yesterday = this.baseDate.clone();

		yesterday.setDate(this.baseDate.getDate() - 1);
		tomorrow.setDate(this.baseDate.getDate() + 1);
		
		///	table-contorollerの日付
		var	anchor;
		
/*
		$('today').innerHTML = date_to_human(this.baseDate);

		anchor = $('to_tomorrow').getElementsByTagName('A')[0];
		anchor.innerHTML = '&laquo; ' + date_to_human(tomorrow);
		anchor.href = '?'+date_to_24oclock(tomorrow, true);

		anchor = $('to_yesterday').getElementsByTagName('A')[0];
		anchor.innerHTML = date_to_human(yesterday) + ' &raquo;';
		anchor.href = '?'+date_to_24oclock(yesterday, true);
*/	
		///	top-captionの日付
		$('date-current').innerHTML = date_to_human(this.baseDate);
		$('date-prev').innerHTML = date_to_human(yesterday);
		
		conver_to_imagenumeric('date-current');
		conver_to_imagenumeric('date-prev');
	}
});
