Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/chengdong0421/GB_tampermonkey
https://github.com/chengdong0421/GB_tampermonkey
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/chengdong0421/GB_tampermonkey
- Owner: chengdong0421
- Created: 2022-05-03T07:49:04.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-04T03:40:41.000Z (12 months ago)
- Last Synced: 2024-06-27T09:34:05.925Z (5 months ago)
- Language: JavaScript
- Size: 13.7 KB
- Stars: 216
- Watchers: 4
- Forks: 56
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# GB_tampermonkey
## tampermonkey脚本
### 作用：拼接在线预览时响应回来的图片并生成pdf文件
### 用法：启用脚本后，会在预览界面左上角生成两个按钮，先点击左边“获取页面”按钮，稍等，再点击“下载pdf”按钮
### 缺点：生成的pdf文件稍大，生成过程比较耗内存，页数过多的标准可能没法使用
## 代码写的比较粗糙，见谅。
2022.11.05
已找到原因，脚本里缺少引入jQuery的语句（ // @require https://code.jquery.com/jquery-3.6.0.min.js ）。现在已经添上，应该可以正常显示按钮了。有不能显示按钮的，请大家重新安装一下脚本试试（当然，也可以用下面手动执行代码的方法）。
2022.11.04
有人反馈预览页面不显示按钮了，经测试，确实如此。
不过目前脚本功能是好的，但不知道是不是网站屏蔽了油猴还是其他什么原因，脚本不能自动运行。但是可以通过手动执行的方法来运行这个脚本，方法如下：
1. 复制以下代码；
2. 在预览界面，按Ctrl+Shift+I 调出调试工具（这是谷歌Chrome浏览器的快捷方式，其他浏览器不知道是不是这个）；
3. 选择第二个页签（Console）(如下图)，鼠标在下面 > 处点一下，把代码粘贴在光标处，按回车运行代码。这样按钮就出来了。
$("head").append('');
let my_script=`
function px2Num(px) {
return Number(px.split("px")[0].toString());
}
function getPages(){
if( $("canvas[id^=canvas_]").length > 0 ) {
$("canvas[id^=canvas_]").delete();
}
var baseurl = "http://c.gb688.cn/bzgk/gb/";
var pagecount = $("div.page").length;
var pages = new Array(pagecount);
var pagebg = new Array(pagecount);
var title = $("title").text().split("|")[1].toString().trim();
var pheight = $("#0").css("height");
var pwidth = $("#0").css("width");
$(".page").each(function(i, elem) {
if (elem.hasAttribute("bg")) {
pagebg[i] = elem.getAttribute("bg");
} else {
pagebg[i] = $(elem).children("span").first().css("background-image").split('"')[
1].split(/\\//).slice(-1)[0];
}
});
//拼合图片
$(".page").each(function(i, elem) {
var canvasclone = $("canvas#canvas").clone();
canvasclone.attr("id","canvas_"+i).css("background-color","#FFFFFFFF");
$("#newimg").append(canvasclone);
var canvas = document.getElementById('canvas_'+i);
var ctx = canvas.getContext('2d');
ctx.fillStyle="white";
ctx.fillRect(0,0,px2Num(pwidth), px2Num(pheight));
$("#imgContainer").append("<img id=img_" + i + " src='" + baseurl+pagebg[i] + "' />")
var image = document.getElementById('img_'+i);
image.addEventListener('load', e => {
$(elem).children("span").each(function(j,s){
ctx.drawImage(image, -px2Num($(s).css("background-position-x")), -px2Num($(s).css("background-position-y")), 119, 168,
$(s).attr("class").split('-')[1]*119, $(s).attr("class").split('-')[2]*168, 119, 168);
});
});
});
}
function isimgComplete(imgs){
//$("img[id^=img_]")
flag = true;
for(i=0;i<imgs.length;i++){
flag=flag && imgs[i].complete;
}
return flag;
}
function downloadPDF(){
if( $("canvas[id^=canvas_]").length == 0 ) {
alert("请先点击获取页面！");
return;
}
var images = $("img[id^=img_]");
//alert(isimgComplete(images));
if(!isimgComplete(images)){
alert("页面尚未提取完，稍后再试");
return;
}
var pheight = $("#0").css("height");
var pwidth = $("#0").css("width");
const { jsPDF } = window.jspdf;
const pdf = new jsPDF('p','px',[px2Num(pwidth), px2Num(pheight)]);
var title = $("title").text().split("|")[1].toString().trim();
let [imgX, imgY] = [595.28, 841.89];
let imgHeight = imgX / (px2Num(pwidth) / px2Num(pheight));
$("canvas[id^=canvas_]").each(function(i,e){
pdf.addImage(document.getElementById('canvas_'+i).toDataURL('image/jpeg'), 'jpeg', 0, 0, px2Num(pwidth), px2Num(pheight), '', 'MEDDIUM');
//pdf.addImage(document.getElementById('canvas_'+i).toDataURL('image/png'), 'jpeg', 0, 0, imgX, imgHeight, '', 'SLOW');
pdf.addPage();
});
let targetPage = pdf.internal.getNumberOfPages();
pdf.deletePage(targetPage); // 删除最后一页
pdf.save(title + ".pdf");
}
function downloadPDF0(){
while($("canvas[id^=canvas_]").length < $(".page").length){
setTimeout(function(){
},1000);
}
}
`;
let source_img = `
![]()
`;
let style = `
#canvas_container {
position: fixed;
height: 30px;
width: 150px;
top: 50px;
left: 10px;
border: 1px;
/*background-color: #00ff0099;*/
border-radius: 3px;
}
`;
$("head").append(style);
$("body").append(source_img);
$("body").append(my_script);