/*
 * Route Navigation
 *
 * Copyright: (c) 2009 九州旅客鉄道株式会社
 *
 * Depends Script:
 *	js/jQuery/jquery.js (1.3.2)
 *	js/jQuery/ui.core.js (1.6rc6)
 *	js/jQuery/ui.draggable.js (1.6rc6)
 *	js/jQuery/ui.sortable.js (1.6rc6)
 *	js/dialog.js
 *	js/mail.js
 */

var _holderTitle,
	_holderSpot = new Array(),
	_spotItems = new Object();

var routenavi = {
	jQuery: $,

	settings: {
		limit_cnt: 10,
		view_cnt: 5,
		slide_num: 5,
		slide_def_left: 0,
		slide_own_width: 131
	},

	selectors: {
		rn_area: 'routenavi-area',
		rn_slider: 'routenavi-slider',
		rn_container: 'routenavi-container',
		rn_list: 'routenavi-list',
		rn_own: 'routenavi-own',
		rn_sortable: 'routenavi-sortable',
		rn_handle: 'routenavi-handle',
		rn_num: 'routenavi-num',
		rn_remove: 'routenavi-remove',
		rn_placeholder: 'routenavi-placeholder',
		rn_empty: 'routenavi-empty',
		rn_btn_left: 'routenavi-left-btn',
		rn_btn_right: 'routenavi-right-btn',
		rn_hidden: 'routenavi-hidden'
	},

/* objects~ */
	_path: false,
	_ready: false,
	_action: false,
	_print_flg: false,
	_hostname: '',
	_position: 0,
	_imageNum: {},
	_imageOther: {},
	_imageThumbs: {},
/* ~objects */

/* action~ */
	init: function(path) {
		this._path = path;
		mail.init(path);
		if (location.protocol != 'http:') this._hostname = 'http://' + location.hostname;
		var hash_arr = new Array();
		if (hash_arr = location.hash.match(/^#print_(spot||event)_(\d+?)$/)) this._print_flg = hash_arr[1] + '_' + hash_arr[2];
		this.getSpotItems();
	},

	slide: function(direction) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._action) {
			var $rn_btn_left = $('#' + selectors.rn_btn_left),
				$rn_btn_right = $('#' + selectors.rn_btn_right);
			if (direction == 'left') {
				var $rn_btn = $rn_btn_left,
					move_position = - settings.slide_num;
			} else if (direction == 'right') {
				var $rn_btn = $rn_btn_right,
					move_position = settings.slide_num;
			}
			if ($rn_btn && !$rn_btn.hasClass('off')) {
				routenavi.disableAction();
				$rn_list = $('#' + selectors.rn_list);
				routenavi._position += move_position;
				routenavi.refreshBtn();
				routenavi.moveSlider(500, function() {
					routenavi.setSortable();
					routenavi.enableAction();
				});
			}
		}
	},

	add: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._ready) {
			routenavi.disableAction();
			var holderSpotLen = _holderSpot.length;
			if ($.inArray(spot_id, _holderSpot) != -1) {
				dialog.alert('注   意', '既にこのスポットは選択されています。', function(r) {
					if (r) routenavi.enableAction();
				});
			} else if (holderSpotLen >= settings.limit_cnt) {
				dialog.alert('注   意', '既にスポットが' + settings.limit_cnt + '個選択されています。', function(r) {
					if (r) routenavi.enableAction();
				});
			} else {
				dialog.confirm('確   認', 'このスポットを追加しますか？', function(r) {
					if (r) {
						var query = '&spot_id[]=' + spot_id;
						routenavi._ready = false;
						routenavi.ajax('add', function() {
							var holderSpotLen = _holderSpot.length;
							if (holderSpotLen > 1) {
								var rn_own_html = routenavi.setSpot(spot_id, holderSpotLen),
									speed;
								if (routenavi._position > holderSpotLen || routenavi._position + settings.view_cnt < holderSpotLen) {
									speed = 500;
									routenavi._position = Math.floor((holderSpotLen - 1) / settings.view_cnt) * settings.view_cnt;
								} else {
									speed = 0;
									routenavi._position = routenavi._position;
								}
								routenavi.refreshBtn();
								routenavi.moveSlider(speed, function() {
									var $rn_empty = $('#' + selectors.rn_empty + '_' + holderSpotLen);
									routenavi.fadeOutSelector($rn_empty, function() {
										$rn_empty.replaceWith($(rn_own_html).css({opacity: 0}));
										var $rn_own = $('#' + selectors.rn_own + '_' + spot_id),
											$rn_remove = $('#' + selectors.rn_remove + '_' + spot_id);
										$rn_remove.mousedown(function(e) {
											e.stopPropagation();
										});
										routenavi.fadeInSelector($rn_own, function() {
											routenavi.setSortable();
											routenavi.enableAction();
										});
									});
								});
							} else {
								routenavi.fadeOutContainer(function() {
									routenavi.setImages();
								});
							}
						}, false, query);
					} else {
						routenavi.enableAction();
					}
				});
			}
		}
	},

	replace: function(plan_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._ready) {
			routenavi.disableAction();
			dialog.confirm('確&nbsp;&nbsp;&nbsp;認', '保存しているスポットを削除して、<br />この旅ルートのスポットと入れ替えてもよろしいですか？', function(r) {
				if (r) {
					routenavi._ready = false;
					var query = '&plan_id[]=' + plan_id,
						holderSpotLen = _holderSpot.length;
					routenavi.ajax('replace', function() {
						if (holderSpotLen > 0) {
							var speed;
							if (routenavi._position > 0) speed = 500;
								else speed = 0;
							routenavi._position = 0;
							routenavi.moveSlider(speed, function() {
								routenavi.fadeOutContainer(function() {
									routenavi.setImages();
								});
							});
						} else {
							routenavi.fadeOutContainer(function() {
								routenavi.setImages();
							});
						}
					}, false, query);
				} else {
					routenavi.enableAction();
				}
			});
		}
	},

	remove: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._action) {
			routenavi.disableAction();
			if (spot_id) {
				dialog.confirm('確&nbsp;&nbsp;&nbsp;認', 'このスポットを削除しますか？', function(r) {
					if (r) {
						var query = '&spot_id[]=' + spot_id;
						routenavi.ajax('remove', function() {
							var holderSpotLen = _holderSpot.length;
							if (holderSpotLen > 0) {
								var $rn_own = $('#' + selectors.rn_own + '_' + spot_id),
									rn_empty_html = '<li id="' + selectors.rn_empty + '_' + (holderSpotLen + 1) + '" class="' + selectors.rn_empty + ' fix2j">Empty</li>';
								routenavi.fadeOutSelector($rn_own, function() {
									$rn_own.remove();
									routenavi.refreshNumber();
									if (holderSpotLen < settings.limit_cnt - 1) {
										var $target_rn_empty = $('#' + selectors.rn_empty + '_' + (holderSpotLen + 2));
										$target_rn_empty.before(rn_empty_html);
									} else {
										var $rn_list = $('#' + selectors.rn_list);
										$rn_list.append(rn_empty_html);
									}
									var speend;
									if (routenavi._position < holderSpotLen) {
										speend = 0;
									} else {
										speend = 500;
										routenavi._position -= settings.slide_num;
									}
									routenavi.refreshBtn();
									routenavi.moveSlider(speend, function() {
										routenavi.setSortable();
										routenavi.enableAction();
									});
								});
							} else {
								routenavi.fadeOutContainer(function() {
									routenavi.setImages();
								});
							}
						}, false, query);
					} else {
						routenavi.enableAction();
					}
				});
			} else {
				dialog.confirm('確&nbsp;&nbsp;&nbsp;認', 'すべてのスポットを削除しますか？', function(r) {
					if (r) {
						routenavi.ajax('remove', function() {
							routenavi.fadeOutContainer(function() {
								routenavi.setImages();
							});
						});
					} else {
						routenavi.enableAction();
					}
				});
			}
		}
	},

	print: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._ready) {
			if (routenavi.checkPrint(spot_id)) window.print();
		}
	},

	ticket: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._ready) {
			var spot_id_arr = new Array();
			if (spot_id_arr = spot_id.match(/^(spot||event)_(\d+?)$/)) {
				var contents = spot_id_arr[1],
					id = spot_id_arr[2],
					uri = routenavi._hostname + routenavi._path + contents + '/' + id + '.html#print_' + spot_id;
				location.href = uri;
			}
		}
	},

	comment: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._ready) {
			var spot_id_arr = new Array();
			if (spot_id_arr = spot_id.match(/^(spot)_(\d+?)$/)) {
				var contents = spot_id_arr[1],
					id = spot_id_arr[2],
					uri = routenavi._hostname + routenavi._path + 'comment/form.php?id=' + id,
					width = 600,
					height = 480
					option = [
						'left=0',
						'top=0',
						'toolbar=no',
						'location=no',
						'directories=no',
						'status=no',
						'menubar=no',
						'scrollbars=yes',
						'favorites=no',
						'resizable=yes'
					];
				window.open(uri, spot_id, 'width=' + width + ',height=' + height + ',' + String(option)).focus();
			}
		}
	},

	mail: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (routenavi._ready) {
			routenavi.disableAction();
			var spot_arr = new Array();
			if (spot_arr = spot_id.match(/^(spot||event||plan)_(\d+?)$/)) {
				var timeout = 60000,
					uri = routenavi._path + spot_arr[1] + '/ajax_title.php?mode=routenavi&id=' + spot_arr[2],
					title = false;
				$.ajax({
					cache: false,
					dataType: 'script',
					timeout: timeout,
					type: 'GET',
					url: uri,
					dataFilter: function(d) {
						try {
							eval(d);
							var message = title + "\r" + '<http://' + location.hostname + routenavi._path + spot_arr[1] + '/' + spot_arr[2] + '.html' + '>';
							mail.set('routenavi', message, function() {
								routenavi.enableAction();
							});
						} catch(e) {
							routenavi.ajaxError();
						}
					},
					error: function() {
						routenavi.ajaxError();
					}
				});
			}
		}
	},
/* ~action */

	ajax: function(action, success, error, query) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var timeout = 60000,
			uri = routenavi._path + 'myguide/ajax_' + action + '.php?mode=routenavi';
		if (action == 'get' || action == 'add' || action == 'replace' || action == 'remove' || action == 'sort') {
			uri += query ? query : '';
			$.ajax({
				cache: false,
				dataType: 'script',
				timeout: timeout,
				type: 'GET',
				url: uri,
				dataFilter: function(d) {
					try {
						eval(d);
						if ($.isFunction(success)) success();
					} catch(e) {
						routenavi.ajaxError(action, error);
					}
				},
				error: function() {
					routenavi.ajaxError(action, error);
				}
			});
		} else {
			if ($.isFunction(error)) error();
		}
	},

	ajaxError: function(action, fn) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var err_msg = '通信エラーが発生しました。<br />ページの更新を行うか、時間がたってからもう一度接続してください。<br />ご迷惑をおかけして、申し訳ございません。';
		if ($.isFunction(fn)) fn();
		if (action != 'get' && $.isFunction(dialog.alert)) {
			routenavi.disableAction();
			dialog.alert('注&nbsp;&nbsp;&nbsp;意', err_msg, function(r) {
				if (r) routenavi.enableAction();
			});
		} else {
			var $rn_container = $('#' + selectors.rn_container),
				rn_container_html = '<p class="error fix2j">' + err_msg + '</p>';
			$rn_container.removeClass('loading').css({opacity: 0, position: 'relative'}).html(rn_container_html);
			routenavi.fadeInContainer();
		}
	},

	enableAction: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_list = $('#' + selectors.rn_list);
		routenavi._ready = true;
		routenavi._action = true;
		$rn_list.sortable('enable');
	},

	disableAction: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_list = $('#' + selectors.rn_list);
		routenavi._action = false;
		$rn_list.sortable('disable');
	},

	getSpotItems: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		routenavi.ajax('get', function() {
			routenavi.setImages();
		});
	},

	checkPrint: function(spot_id) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var spot_arr = new Array();
		if (spot_arr = spot_id.match(/^(spot||event)_(\d+?)$/)) {
			var reg = new RegExp('\/' + spot_arr[1] + '\/' + spot_arr[2] + '\.html$');
			if (('/' + location.pathname.replace(/^\//, '')).match(reg)) return true;
		}
		return false;
	},

	setImages: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		for (var i = 1; i <= settings.limit_cnt; i ++) {routenavi._imageNum[i] = new Image(); routenavi._imageNum[i].src = routenavi._path + 'img/i_' + i + '.gif'; routenavi._imageNum[i].width = 17; routenavi._imageNum[i].height = 17;}
		routenavi._imageOther.b_remove = new Image(); routenavi._imageOther.b_remove.src = routenavi._path + 'img/b_remove.gif'; routenavi._imageOther.b_remove.width = 16; routenavi._imageOther.b_remove.height = 16;
		var holderSpotLen = _holderSpot.length,
			thumbs_loaded = 0;
		if (holderSpotLen > 0) {
			$.each(_holderSpot, function(i, spot_id) {
				var spotItem = _spotItems[spot_id];
				if (spotItem.thumbs) {
					routenavi._imageThumbs[spot_id] = new Image();
					routenavi._imageThumbs[spot_id].onload = function() {
						this.onload = null;
						thumbs_loaded ++;
						routenavi.imageLoaded(holderSpotLen, thumbs_loaded);
					}
					routenavi._imageThumbs[spot_id].src = routenavi._path + spotItem.thumbs.src; routenavi._imageThumbs[this].width = spotItem.thumbs.width; routenavi._imageThumbs[this].height = spotItem.thumbs.height;
				} else {
					thumbs_loaded ++;
					routenavi.imageLoaded(holderSpotLen, thumbs_loaded);
				}
			});
		} else {
			routenavi.setEmpty();
			routenavi._ready = true;
		}
	},

	imageLoaded: function(holderSpotLen, thumbs_loaded) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (holderSpotLen == thumbs_loaded) {
			routenavi.loadRouteNavi();
		}
	},

	loadRouteNavi: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var holderSpotLen = _holderSpot.length,
			$rn_container = $('#' + selectors.rn_container),
			rn_container_html = '<ul id="' + selectors.rn_list + '" class="clearfix">',
			num = 1;
		$.each(_holderSpot, function(i, spot_id) {
			rn_container_html += routenavi.setSpot(spot_id, num);
			num ++;
		});
		for (var i = num; i <= settings.limit_cnt; i ++) {
			rn_container_html += '<li id="' + selectors.rn_empty + '_' + i + '" class="' + selectors.rn_empty + ' fix2j">Empty</li>';
		}
		rn_container_html += '</ul>';
		$rn_container.removeClass('loading').css({opacity: 0}).html(rn_container_html);
		$.each(_holderSpot, function(i, spot_id) {
			var $rn_remove = $('#' + selectors.rn_remove + '_' + spot_id);
			$rn_remove.mousedown(function(e) {
				e.stopPropagation();
			});
		});
		routenavi.fadeInContainer(function() {
			routenavi.refreshBtn();
			routenavi.setSortable();
			routenavi.enableAction();
			if (routenavi._print_flg) {
				routenavi.print(routenavi._print_flg);
				routenavi._print_flg = false;
			}
		});
	},

	setEmpty: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_container = $('#' + selectors.rn_container),
			rn_container_html = '<p class="empty fix2j">' + 'スポットが選択されていません。' + '</p>';
		$rn_container.removeClass('loading').css({opacity: 0}).html(rn_container_html);
		routenavi.fadeInContainer(function() {
			routenavi.resetBtn();
			routenavi._ready = true;
			if (routenavi._print_flg) {
				routenavi.print(routenavi._print_flg);
				routenavi._print_flg = false;
			}
		});
	},

	fadeInContainer: function(callback) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_container = $('#' + selectors.rn_container);
		routenavi.fadeInSelector($rn_container, callback);
	},

	fadeOutContainer: function(callback) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_container = $('#' + selectors.rn_container);
		routenavi.fadeOutSelector($rn_container, callback);
	},

	fadeInSelector: function($selector, callback) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		$selector.animate(
			{opacity: 1},
			400,
			'swing',
			function() {
				if ($.isFunction(callback)) callback();
			}
		);
	},

	fadeOutSelector: function($selector, callback) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		$selector.animate(
			{opacity: 0},
			200,
			'swing',
			function() {
				if ($.isFunction(callback)) callback();
			}
		);
	},

	setSpot: function(spot_id, num) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var spotItem = _spotItems[spot_id];
		if (!routenavi._imageThumbs[spot_id] && spotItem.thumbs) {routenavi._imageThumbs[spot_id] = new Image(); routenavi._imageThumbs[spot_id].src = routenavi._path + spotItem.thumbs.src; routenavi._imageThumbs[spot_id].width = spotItem.thumbs.width; routenavi._imageThumbs[spot_id].height = spotItem.thumbs.height;}
		var i_num = '<img src="' + routenavi._imageNum[num].src + '" width="' + routenavi._imageNum[num].width + '" height="' + routenavi._imageNum[num].height + '" alt="' + num + '" id="' + selectors.rn_num + '_' + spot_id + '" />',
			rn_own_html = '<li id="' + selectors.rn_own + '_' + spot_id + '" class="' + selectors.rn_own + '">'
							+ '<div class="routenavi-handle clearfix">'
								+ '<p class="num">' + i_num + '</p>'
								+ '<p class="remove">'
									+ '<a href="#" onclick="routenavi.remove(\'' + spot_id + '\');return false;" id="' + selectors.rn_remove + '_' + spot_id + '" title="削除">'
										+ '<img src="' + routenavi._imageOther.b_remove.src + '" width="' + routenavi._imageOther.b_remove.width + '" height="' + routenavi._imageOther.b_remove.height + '" alt="削除" />'
									+ '</a>'
								+ '</p>'
							+ '</div>'
							+ '<h3 class="fix2j"><a href="' + routenavi._hostname + routenavi._path + spotItem.contents + '/' + spotItem.id + '.html' + '" title="' + spotItem.title + '">' + spotItem.d_title + '</a></h3>'
							+ '<div class="routenavi-content clearfix">'
								+ (spotItem.thumbs ? '<p class="thumbs"><a href="' + routenavi._hostname + routenavi._path + spotItem.contents + '/' + spotItem.id + '.html' + '" title="' + spotItem.title + '"><img src="' + routenavi._imageThumbs[spot_id].src + '" width="' + routenavi._imageThumbs[spot_id].width + '" height="' + routenavi._imageThumbs[spot_id].height + '" alt="' + spotItem.title + '：画像" /></a></p>' : '<p class="thumbs empty"><a href="' + routenavi._hostname + routenavi._path + spotItem.contents + '/' + spotItem.id + '.html' + '" title="' + spotItem.title + '"></a></p>')
								+ '<p class="headline fix1j">' + spotItem.d_headline + '</p>'
							+ '</div>'
						+ '</li>';
		return rn_own_html;
	},

	moveSlider: function(speed, callback) {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		if (speed > 0) {
			var $rn_list = $('#' + selectors.rn_list),
				move_point = settings.slide_def_left - (settings.slide_own_width * routenavi._position);
			$rn_list.animate(
				{marginLeft: move_point},
				speed,
				'swing',
				function() {
					if ($.isFunction(callback)) callback();
				}
			);
		} else {
			if ($.isFunction(callback)) callback();
		}
	},

	setSortable: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_list = $('#' + selectors.rn_list),
			sort_start = routenavi._position,
			sort_end = routenavi._position + settings.view_cnt;
		$rn_list.sortable('destroy');
		$.each(_holderSpot, function(i, spot_id) {
			var $rn_own = $('#' + selectors.rn_own + '_' + spot_id);
			$rn_own.removeClass(selectors.rn_sortable);
			if (sort_start <= i && sort_end > i) {
				$rn_own.addClass(selectors.rn_sortable);
			}
		});
		var $rn_sortable = $('.' + selectors.rn_sortable, '#' + selectors.rn_list);
		$rn_sortable.find('.' + selectors.rn_handle).css({cursor: 'move'}).mousedown(function() {
			$rn_sortable.css({width: ''});
			var $rn_handle = $(this);
			$rn_handle.parent().css({width: $rn_handle.parent().width()});
		}).mouseup(function() {
			var $rn_handle = $(this);
			if(!$rn_handle.parent().hasClass('dragging')) {
				$rn_handle.parent().css({width: ''});
			}
		});
		var update_flg,
			reg = new RegExp('^' + selectors.rn_own + '_');
		$rn_list.sortable({
			axis: 'x',
			connectWith: $rn_list,
			containment: 'document',
			delay: 10,
			forceHelperSize: true,
			forcePlaceholderSize: true,
			handle: '.' + selectors.rn_handle,
			helper: 'clone',
			items: $rn_sortable,
			opacity: 0.9,
			placeholder: selectors.rn_placeholder,
			revert: 300,
			start: function(e, ui) {
				$(ui.helper).addClass('dragging').addClass('helper');
				routenavi.disableAction();
			},
			stop: function(e, ui) {
				var $ui = $(ui.item);
				$ui.css({width: ''}).removeClass('dragging').removeClass('helper');
				if (update_flg) {
					var query = '';
					$('.' + selectors.rn_own, '#' + selectors.rn_list).each(function() {
						query += '&spot_id[]=' + (this.id).replace(reg, '');
					});
					routenavi.ajax('sort', function() {
						routenavi.refreshNumber();
						routenavi.enableAction();
					}, function() {
						$rn_list.sortable('cancel');
					}, query);
				} else {
					routenavi.enableAction();
				}
				update_flg = false;
			},
			update: function() {
				update_flg = true;
			}
		});
	},

	refreshBtn: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_btn_left = $('#' + selectors.rn_btn_left),
			$rn_btn_right = $('#' + selectors.rn_btn_right),
			rn_btn_left_off = $rn_btn_left.hasClass('off'),
			rn_btn_right_off = $rn_btn_right.hasClass('off'),
			holderSpotLen = _holderSpot.length;
		if (routenavi._position > 0) {
			if (rn_btn_left_off) $rn_btn_left.removeClass('off');
		} else {
			if (!rn_btn_left_off) $rn_btn_left.addClass('off');
		}
		if (routenavi._position + settings.view_cnt < holderSpotLen) {
			if (rn_btn_right_off) $rn_btn_right.removeClass('off');
		} else {
			if (!rn_btn_right_off) $rn_btn_right.addClass('off');
		}
	},

	resetBtn: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var $rn_btn_left = $('#' + selectors.rn_btn_left),
			$rn_btn_right = $('#' + selectors.rn_btn_right);
		if (!$rn_btn_left.hasClass('off')) $rn_btn_left.addClass('off');
		if (!$rn_btn_right.hasClass('off')) $rn_btn_right.addClass('off');
	},

	refreshNumber: function() {
		var routenavi = this,
			$ = this.jQuery,
			settings = this.settings,
			selectors = this.selectors;

		var reg = new RegExp('^' + selectors.rn_own + '_');
		$('.' + selectors.rn_own, '#' + selectors.rn_list).each(function(i) {
			var num = i + 1,
				spot_id = (this.id).replace(reg, ''),
				$i_num = $('#' + selectors.rn_num + '_' + spot_id);
			if (String(num) != String($i_num.attr('alt'))) {
				document.images[selectors.rn_num + '_' + spot_id].src = routenavi._imageNum[num].src;
				document.images[selectors.rn_num + '_' + spot_id].alt = num;
			}
		});
	}
}