AutoPagerize_Console

AutoPagerizeをサポートするボタン
当前为 2015-02-22 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name        AutoPagerize_Console
// @namespace   phodra
// @description AutoPagerizeをサポートするボタン
// @include     http://*
// @include     https://*
// @version     2.1
// @grant       none
// ==/UserScript==
 
(function (){
	var ap;
	var $pagenow, $pagemax;
	var $pagelist, $pageitem;
	var scTop, timer;
 
	// 初期化
	var AP_Init = function()
	{
		ap = {
			'page': 0,
			'seam': [0]
		};
		scTop = document.documentElement.scrollTop;
		
		var $header = document.createElement("div");
		$header.id = "ap_header";
		with( $header.style )
		{
			position = 'fixed';
			top = '50px';
			right = '0px';
			opacity = '0.8';
			fontSize = '14px';
			zIndex = '999';
			userSelect = 'none';
			MozUserSelect = 'none';
			WebkitUserSelect = 'none';
		}
		document.body.appendChild($header);
 
		var $page = document.createElement("div");
		$pagenow = document.createElement("span");
		$pagemax = document.createElement("span");
		$pagenow.innerHTML = $pagemax.innerHTML = "1";
		$page.appendChild($pagenow);
		$page.appendChild( document.createTextNode(" / "));
		$page.appendChild($pagemax);
 
		with( $page.style )
		{
			cursor = 'pointer';
			textAlign = 'right';
			backgroundColor = 'white';
			padding = '0px 2px';
			marginBottom = '5px';
		}
		$page.addEventListener(
			'mouseover' , function()
			{
				$pagelist.style.display = '';
			}
		);
		$page.addEventListener(
			'mouseout' , function()
			{
				$pagelist.style.display = 'none';
			}
		);
		$header.appendChild($page);
 
		$pagelist = document.createElement("ol");
		with( $pagelist.style )
		{
			backgroundColor = 'white';
			listStyleType = 'none';
			position = 'absolute';
			zIndex = '2';
			top = '0px';
			right = '0px';
			display = 'none';
		}
		$page.appendChild($pagelist);
 
		
		$pageitem = document.createElement("li");
		$pageitem.className = "ap_pageitem";
		$pageitem.innerHTML = "1";
		with( $pageitem.style )
		{
			const MGN = 2;
			backgroundColor = 'white';
			cursor = 'pointer';
			textAlign = 'center';
			boxSizing = 'border-box';
			border = 'outset 1px white';
			margin = MGN +'px';
			padding = '0px 5px';
			minWidth = $page.offsetWidth-MGN*2 + 'px';
		}
		PageItem_AddEvent($pageitem);
		$pagelist.appendChild($pageitem);
 
 
 
		const AP_BTN = 'ap_button';
		// 移動ボタンのスタイル
		var $mb_style = document.createElement("style");
		$mb_style.setAttribute( 'type', "text/css");
		$mb_style.innerHTML =
			"." + AP_BTN +"{ \
				cursor: pointer; \
				background-color: white; \
				text-align: center; \
				position: relative; \
				width: 20px; \
				margin: 2px 0px 2px auto; \
				padding: 2px; \
				box-sizing: border-box; \
				border: solid 1px white; \
			}" +
			"." + AP_BTN + ":hover{ \
				border: outset 1px gray; \
			} " +
			"." + AP_BTN + ":active{ \
				border: inset 1px gray; \
			}";
		document.head.appendChild($mb_style);
		
		// 最上部へ移動
		var $ptop = document.createElement("div");
		$ptop.className = AP_BTN;
		$ptop.innerHTML = "↑";
		$ptop.setAttribute('alt', "Scroll Top");
		$ptop.addEventListener(
			'click', function()
			{
				PageScroll(0);
			}
		);
		
		// 最下部へ移動
		var $pbtm = document.createElement("div");
		$pbtm.className = AP_BTN;
		$pbtm.innerHTML = "↓";
		$pbtm.setAttribute('alt', "Scroll Bottom");
		$pbtm.addEventListener(
			'click', function()
			{
				PageScroll( document.body.clientHeight-window.innerHeight );
			}
		);
		
		// AutoPagerizeのページ移動
		//  前のページ
		var $ap_prev = document.createElement("div");
		$ap_prev.className = AP_BTN;
		$ap_prev.innerHTML = "△";
		$ap_prev.setAttribute( 'alt', "Scroll Prev Page");
		$ap_prev.addEventListener(
			'click', function()
			{
				PageScroll( scTop==ap.seam[ap.page]?
					ap.seam[ap.page-1]: ap.seam[ap.page]
				);
			}
		);
 
		// 次のページ
		var $ap_next = document.createElement("div");
		$ap_next.className = AP_BTN;
		$ap_next.innerHTML = "▽";
		$ap_next.setAttribute( 'alt', "Scroll Next Page");
		$ap_next.addEventListener(
			'click', function()
			{
				PageScroll( ap.page+1<ap.seam.length?
						ap.seam[ap.page+1]:
						document.body.clientHeight-window.innerHeight
				);
			}
		);
 
		$header.appendChild($ptop);
		$header.appendChild($ap_prev);
		$header.appendChild($ap_next);
		$header.appendChild($pbtm);
 
		// ウィンドウのスクロールが発生した時
		window.addEventListener(
			'scroll', function()
			{
				scTop = document.documentElement.scrollTop;
				for( var i=ap.seam.length-1; i>=0; i-- )
				{
					if( scTop >= ap.seam[i]-1 )
					{
						if( ap.page != i )
						{
							ap.page = i;
							$pagenow.innerHTML = i+1;
						}
						break;
					}
				}
			}
		);
	};
	var PageScroll = function(target, bearing)
	{
		clearTimeout(timer);
		if( target==scTop ) return;
		if( bearing==null ) bearing = target-scTop;
		
		var y = (target-scTop)/5;
		window.scrollBy( 0,
			bearing>0? Math.ceil(y):
			bearing<0? Math.floor(y): 0
		);
		timer = setTimeout(
			function()
			{
				PageScroll( target, bearing);
			}, 10
		);
 
		if( (bearing<0 && target>=scTop) ||
			(bearing>0 && target<=scTop) )
		{
			window.scrollTo( 0, target);
			clearTimeout(timer);
		}
 
	};
	var PageItem_AddEvent = function($elm)
	{
		$elm.addEventListener(
			'click', function()
			{
				var num = this.innerHTML-1;
				PageScroll(
					num>=0 && num<ap.seam.length?
					ap.seam[num]: 0
				);
			}
		);
		$elm.addEventListener(
			'dblclick', function()
			{
				var num = this.innerHTML-2;
				window.location = num>=0?
				document.getElementsByClassName("autopagerize_link")[num].href:
				window.location;
			}
		);
	};
 
	// ページを継ぎ足した時、継ぎ目の位置を記録する
	var AP_SeamLine = function()
	{
		var $ap_sep = document.getElementsByClassName("autopagerize_page_separator");
		var len = $ap_sep.length;
		var offsety = 0, elm = $ap_sep[len-1];
		do
		{
			offsety += elm.offsetTop || 0;
			elm = elm.offsetParent;
		}while(elm);
		ap.seam[len] = offsety;
 
		$pagemax.innerHTML = len+1;
		
		var $new_pageitem = $pageitem.cloneNode(true);
		$new_pageitem.innerHTML = len+1;
		PageItem_AddEvent($new_pageitem);
		$pagelist.appendChild($new_pageitem);
	};
	
	if( window.AutoPagerize )
	{
		console.log( 'window.AutoPagerize' );
		// 初期化
		AP_Init();
		// 継ぎ足した時
		AutoPagerize.addFilter(AP_SeamLine);
	}else
	{
//		document.addEventListener(
//			'GM_AutoPagerizeLoaded',
//			function()
//			{
//				AP_Init();
//			}
//		);
		document.addEventListener(
			'GM_AutoPagerizeNextPageLoaded',
			function()
			{
				if( ap==null ) AP_Init();
				AP_SeamLine();
			}
		);
		
	}
 
})();