AutoPagerizeをサポートするボタン
目前為
// ==UserScript==
// @name AutoPagerize_Console
// @namespace phodra
// @description AutoPagerizeをサポートするボタン
// @include http://*
// @include https://*
// @version 1.0
// @grant none
// @require http://code.jquery.com/jquery-2.1.1.min.js
// ==/UserScript==
(function (){
var ap;
var $pagenow, $pagemax;
var $pagelist, $pageitem;
// 初期化
var AP_Init = function()
{
ap = {
'page': 0,
'seam': [0]
};
var $header = $("<div id='ap_header' />");
$header.css(
{
'position': 'fixed',
'top': 50,
'right': 0,
'opacity': '0.8',
'font-size': '14px',
'user-select': 'none',
}
);
$("body").append($header);
var $page = $("<div />");
$pagenow = $("<span>1<span/>");
$pagemax = $("<span>1<span/>");
$page.append($pagenow);
$page.append(" / ");
$page.append($pagemax);
$page.css(
{
'cursor': 'pointer',
'text-align': 'right',
'background-color': 'white',
'padding': '0px 2px',
'margin-bottom': '5px'
}
);
$page.hover(
function()
{
$pagelist.show();
},
function()
{
$pagelist.hide();
}
);
$header.append($page);
$pagelist = $("<ol />");
$pagelist.css(
{
'background-color': 'white',
'list-style-type': 'none',
'position': 'absolute',
'z-index': '2',
'top': '0px',
'right': '0px',
'display': 'none'
}
);
$page.append($pagelist);
$pageitem = $("<li class='ap_pageitem' />");
$pageitem.text("1");
$pageitem.css(
{
'background-color': 'white',
'cursor': 'pointer',
'margin': '2px',
'padding': '0px 5px',
'min-width': $page.width(),
'white-space': 'nowrap',
'text-align': 'center',
'box-sizing': 'border-box',
'border': 'outset 1px white',
}
);
$pageitem.on(
{
'click': function(e)
{
var num = $(".ap_pageitem").index($(this));
$("html,body").animate(
{ 'scroll-top':
num>=0 && num<ap.seam.length?
ap.seam[num]: 0
}, 500
);
},
'dblclick': function(e)
{
var num = $(".ap_pageitem").index($(this));
window.location = num>0?
$(".autopagerize_link").eq(num).attr("href"):
window.location;
}
}
);
$pagelist.append($pageitem);
const AP_BTN = 'ap_button';
var move_div = "<div class='"+ AP_BTN +"' />";
// 移動ボタンのスタイル
var AP_BTN_Style =
"." + 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; \
}";
var mb_style = $("<style type='text/css' />");
mb_style.append(AP_BTN_Style);
$("head").append(mb_style);
// 最上部へ移動
var $ptop = $(move_div);
$ptop.attr( 'alt', 'Scroll Top');
$ptop.text("↑");
$ptop.click( function(e)
{
$("html,body").animate(
{ 'scroll-top': 0
}, 500
);
}
);
// 最下部へ移動
var $pbtm = $(move_div);
$pbtm.text("↓");
$pbtm.attr( 'alt', 'Scroll Bottom');
$pbtm.click( function(e)
{
$("html,body").animate(
{ 'scroll-top':
$(document).height() -$(window).height()
}, 500
);
}
);
// AutoPagerizeのページ移動
// 前のページ
var $ap_prev = $(move_div)
$ap_prev.text("△");
$ap_prev.attr( 'alt', 'Scroll Prev Page');
$ap_prev.click( function(e)
{
$("html,body").animate(
{ 'scroll-top':
scTop==ap.seam[ap.page]?
ap.seam[ap.page-1]: ap.seam[ap.page]
}, 500
);
}
);
// 次のページ
var $ap_next = $(move_div);
$ap_next.text("▽");
$ap_next.attr( 'alt', 'Scroll Next Page');
$ap_next.click( function(e)
{
$("html,body").animate(
{ 'scroll-top':
ap.page+1<ap.seam.length?
ap.seam[ap.page+1]:
$(document).height() -$(window).height()
}, 500
);
}
);
$header.append($ptop);
$header.append($ap_prev);
$header.append($ap_next);
$header.append($pbtm);
};
// ページを継ぎ足した時、継ぎ目の位置を記録する
var AP_SeamLine = function()
{
var $ap_sep = $(".autopagerize_page_separator");
var $ap_sep_last = $ap_sep.eq(-1);
ap.seam[$ap_sep.index($ap_sep_last)+1] =
parseInt($ap_sep_last.offset().top);
var num = ap.seam.length;
$pagemax.text(num);
var $new_pageitem = $pageitem.clone(true);
$new_pageitem.text(num);
$pagelist.append($new_pageitem);
};
if( window.AutoPagerize )
{
console.log( 'window.AutoPagerize' );
// 初期化
AP_Init();
// 継ぎ足した時
AutoPagerize.addFilter(AP_SeamLine);
}else
{
$(document).on(
{
'GM_AutoPagerizeLoaded': function(e){
// console.log(e);
// AP_Init();
},
'GM_AutoPagerizeNextPageLoaded': function(){
if( ap==null ) AP_Init();
AP_SeamLine();
}
}
);
}
var scTop = $(window).scrollTop();
// ウィンドウのスクロールが発生した時
$(window).scroll( function(e)
{
scTop = $(window).scrollTop();
// AutoPagerize
for( var i=ap.seam.length-1; i>=0; i-- )
{
if( scTop >= ap.seam[i]-1 )
{
if( ap.page != i )
{
ap.page = i;
$pagenow.text(i+1);
}
break;
}
}
}
);
})();