给花瓣的图加上“下载”按钮，方便下载
目前為
// ==UserScript==
// @name 花瓣 - 添加下载按钮
// @namespace http://tampermonkey.net/
// @version 0.1
// @description 给花瓣的图加上“下载”按钮，方便下载
// @author 潘志城_Neo
// @match *://huaban.com/*
// @match *://hbimg.huabanimg.com/*
// @grant GM_download
// @require https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js
// ==/UserScript==
/*
*://huaban.com/* 页面：
1.给每张图片添加了直接下载的按钮。
2.预览页面添加直接下载按钮。
*://hbimg.huabanimg.com/* 页面：
1.添加旋转和缩放快捷键。
*/
(function () {
'use strict';
//全局变量 - 图片的名字
//window.file_name = "test";
//给每张图片添加“大图”按钮
function huaban() {
var all_img_link = $('.layer-view').each(function (i, o) {
//检测是不是已经添加用来备注的标签，如果没有就添加
if ($(o).siblings(".actions").children(".Neo_btn_added_div").children(".Neo_btn_added").length > 0) {} else {
let img_link = $(o).children("img").attr("src");
let file_name = $(o).siblings(".description").attr("data-formatted");
if (file_name == "undefined" || file_name =="" || file_name == undefined) {
file_name = img_link.split("_fw")[0].split("com/")[1]
}
//把图片链接和名字拼起来，用{split}分隔开
img_link ="https:" + img_link.split("_fw")[0] + "{split}" + file_name;
//获取图片所在div的高度，减去40之后就是图片的top
let top_px = 'top:' + ($(o).children(".cover").height()-40)+"px";
//！！！重点！！！button的onclick事件不要写到标签里面，要用jq来绑定(看本函数的最后面)
$(o).siblings(".actions").append("<div class='Neo_btn_added_div' style=" + top_px + " ><button class='Neo_btn_added btn btn14 rbtn' style='color:#ffffff ;background-color:#1AB37D;border:0px solid red; position:relative;top:100%'>下载</button></div>");
$(o).siblings(".actions").children(".Neo_btn_added_div").children(".Neo_btn_added").attr("title",img_link)
};
});
//新标签打开大图
//window.NeoFile = function (img_info) {
function NeoFile(img_info) {
//图片链接
let url = img_info.split("{split}")[0];
//图片名称
let name = img_info.split("{split}")[1];
if (name == "undefined" || name =="") {
name = url.split("com/")[1]
}
//替换文件名中不能有的字符
let sign_list = ["\\*","\\'",'\\"',"<",">","\\?","\\.","\\|","\\/"]
for(let i=0 ; i< sign_list.length; i++){
var reg = "/"+sign_list[i]+"/g";
name = name.replace(eval(reg),"_");
}
//启用油猴的增强下载函数，可跨域
GM_download(url,name)
}
//给按钮绑定onclick事件
//$(".Neo_btn_added").click(function(){NeoFile(this.title)}) //如果直接绑的话，会绑定多次，造成点击一次执行多次的问题
//先解绑再重新绑定
$(".Neo_btn_added").off("click").on("click",function(){NeoFile(this.title)})
};
//！程序入口！ 每秒运行一次
let interval = setInterval(function () {
//获取当前网页链接
let current_url = document.URL;
//如果当前页面是“大图页面”的话，就添加一些操作快捷键
if (current_url.includes("huabanimg")) {
//这个页面不需要循环执行
clearInterval(interval);
$(document).ready(function() {
$("body").append("<div style='position:fixed;bottom:15px; left:5px; color:#ccc'>快捷键：缩放(a、s)； 旋转(q、w)；下载并关闭(enter)</div>")
var current_deg = 0
//按键执行的操作
document.onkeydown = function (event) {
var e = event || window.event || arguments.callee.caller.arguments[0];
//逆时针旋转90度 q
if (e && e.keyCode == 81 ) {
current_deg = (current_deg-90)%360
console.log(current_deg)
$("img").css("transform","rotate("+current_deg+"deg)")
}
//顺时针旋转90度 w
if (e && e.keyCode == 87 ) {
current_deg = (current_deg+90)%360
console.log(current_deg)
$("img").css("transform","rotate("+current_deg+"deg)")
}
//尺寸增加20% s
if (e && e.keyCode == 83 ) {
// $("img").css("max-height","19999px")
//$("img").css("max-width","700px")
$("img").attr("width",$("img").attr("width")*1.2)
$("img").attr("height","auto")
}
//尺寸减少20% a
if (e && e.keyCode == 65 ) {
$("img").attr("width",$("img").attr("width")*0.8)
$("img").attr("height","auto")
}
//下载图片并关闭 enter
if (e && e.keyCode == 13 ) {
var a = document.createElement("a");
a.target = "_blank"
a.download = document.title
a.href = $("img").attr("src");
$("body").append(a); // 修复firefox中无法触发click
a.click();
$(a).remove();
}
}
});
//如果当前页面是“预览页面”的话，就添加一个esc快捷键
} else if (current_url.includes("huaban.com/pins")) {
//获取图片的链接-s
var img_link = "";
//因为有些图片有源网址，图片的前面会多了一层a标签，所以要判断一下。
if ($(".like-btn").siblings(".Neo_btn_added_div").length > 0) {} else {
if ($("#baidu_image_holder").children("img").length > 0) {
img_link = $("#baidu_image_holder").children("img").attr("src");
} else {
img_link = $("#baidu_image_holder").children("a").children("img").attr("src");
}
img_link = "https:" + img_link.split("_fw")[0];
//获取图片的链接-e
//获取图片名称
var img_name = $(".info-piece").children(".description").text()
//按钮标题
var title = img_link+"{split}"+img_name
//添加下载按钮
$(".like-btn").after('<span class="Neo_btn_added_div repin-btn btn rbtn" style="background-color:#1AB37D; border:0px solid red;" ><span class="text">下载 <span class="num"></span></span></span>');
$(".Neo_btn_added_div").attr("title",title)
//新标签打开大图
//window.NeoFile1 = function (img_info) {
function NeoFile_previewPage (img_info) {
//function Neo_downloadFile(img_link) {
let url = img_info.split("{split}")[0];
let name = img_info.split("{split}")[1];
if (name == "undefined" || name =="") {
name = url.split("com/")[1]
}
//替换文件名中不能有的字符
let sign_list = ["\\*","\\'",'\\"',"<",">","\\?","\\.","\\|","\\/"]
for(let i=0 ; i< sign_list.length; i++){
var reg = "/"+sign_list[i]+"/g";
name = name.replace(eval(reg),"_");
}
//console.log(url,name)
//启用油猴的增强下载函数，可跨域
GM_download(url,name)
}
//给按钮绑定onclick事件
//$(".Neo_btn_added").click(function(){NeoFile(this.title)}) //如果直接绑的话，会绑定多次
//先解绑再重新绑定
$(".Neo_btn_added_div").off("click").on("click",function(){NeoFile_previewPage(this.title)})
};
//如果当前页面是“花瓣的其他页面”的话，就启动huaban()程序(用于给每张图片添加“下载”按钮
} else {
huaban();
}
}, 1000);
})();