// ==UserScript==
// @name 淘宝天猫图片打包下载,历史价格
// @namespace https://hlelf.com/
// @version 0.2.1
// @description 淘宝主图,主图视频,详情图打包下载。【说明】请先将页面下拉到最后,确认所有详情图完全显示后再点击右下侧的按钮,否则会获取不到图片资源,如果有视频,请等到视频加载后再进行操作。
// @author lelf
// @match *://item.taobao.com/*
// @match *://detail.tmall.com/*
// @connect www.gwdang.com
// @require https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js
// @require https://cdn.bootcss.com/materialize/1.0.0-rc.2/js/materialize.min.js
// @require https://cdn.bootcss.com/jszip/3.2.2/jszip.min.js
// @require https://cdn.jsdelivr.net/npm/[email protected]/dist/FileSaver.min.js
// @require https://cdn.bootcss.com/jszip-utils/0.1.0/jszip-utils.min.js
// @require https://code.highcharts.com/highcharts.js
// @resource lelf-materialcss https://cdn.jsdelivr.net/gh/lelf2005/cdn/material.css?v=20200111
// @license GPL License
// @run-at document-end
// @grant GM_addStyle
// @grant GM_getResourceText
// @grant GM_xmlhttpRequest
// ==/UserScript==
(function() {
'use strict';
var $ = $ || window.$;
var materialcss = GM_getResourceText('lelf-materialcss');
GM_addStyle(materialcss);
addMenu();
var zipImgs;
var zipDetailImgs;
function addMenu() {
var sidenav = '<div class="fixed-action-btn">'+
'<a class="btn-floating btn-large red">'+
'<div class="lelf-icon-menu"></div>'+
'</a>'+
'<ul>'+
'<li><a id="lelf_tb" class="btn-floating green waves-effect waves-light modal-trigger" href="#lelf_modal2" title="下载图片点这里"><div class="lelf-icon-download"></div></a></li>'+
'<li><a id="lelf_price" class="btn-floating green waves-effect waves-light modal-trigger" href="#lelf_modal_price" title="历史价格"><div class="lelf-icon-chart"></div></a></li>'+
'</ul>'+
'</div>';
$("body").append(sidenav);
$('.fixed-action-btn').floatingActionButton({
hoverEnabled: false
});
$("#lelf_tb").click(function(){
getTBPics();
$('#lelf_modal2').modal();
});
$("#lelf_price").click(function(){
getHistoryPrice();
$('#lelf_modal_price').modal();
});
}
function getTBPics(){
zipImgs = [];
zipDetailImgs = [];
var imgHtml = '';
var imgSrc = '';
var detailImgSrc = '';
var detailImgHtml = '';
var mainVideo = $("video").find("source");
var isBlobVideo = false;
var mainVideoHtml = '';
if(mainVideo.length > 0){
mainVideoHtml = '<div class="row"><video class="responsive-video" controls><source src="'+mainVideo[0].src+'" type="video/mp4"></video></div>';
zipImgs.push(mainVideo[0].src);
}else if($("video").length > 0){
mainVideoHtml = '<div class="row">这个视频隐藏了真实地址,暂时无法解析。</div>';
}
var mainImg = $("#J_UlThumb").find("img");
for(var i =0; i< mainImg.length;i++){
imgSrc = mainImg[i].src;
if(imgSrc.lastIndexOf("webp")>-1){
imgSrc = imgSrc.substring(0, imgSrc.lastIndexOf('_', imgSrc.lastIndexOf('_') - 1));
}else{
imgSrc = imgSrc.substring(0, imgSrc.lastIndexOf("_"));
}
zipImgs.push(imgSrc);
imgHtml += '<div class="col s2"><img class="materialboxed" width="100" src="'+imgSrc+'"></div>';
}
var detailImg = $("#description > .content").find("img");
for(var k =0; k< detailImg.length;k++){
if(detailImg[k].getAttribute("data-ks-lazyload") !== null){
detailImgSrc = detailImg[k].getAttribute("data-ks-lazyload");
}else{
detailImgSrc = detailImg[k].src;
}
var theImage = new Image();
theImage.src = detailImgSrc;
if(theImage.width > 100 ){
detailImgHtml += '<div class="col s12"><img class="materialboxed" width="100%" src="'+detailImgSrc+'"></div>';
zipDetailImgs.push(detailImgSrc);
}
}
addTBHtml(mainVideoHtml,imgHtml,detailImgHtml);
$('.materialboxed').materialbox();
}
function addTBHtml(video,imgs,detailImgs){
var isAdded = $("#lelf_modal2");
if(isAdded.length > 0){
isAdded.remove();
}
var s = ' <div id="lelf_modal2" class="modal modal-fixed-footer">'+
' <div class="modal-content">'+
' <h4 class="h4">打包下载工具</h4>'+
'<div class="row">'+
' <div class="col s12">'+
' <ul class="tabs">'+
' <li class="tab col s2"><a class="active" href="#main_pics">主图</a></li>'+
' <li class="tab col s2"><a href="#detail_pics">详情图</a></li>'+
' </ul>'+
' </div>'+
' <div id="main_pics" class="col s12">'+video+'<div class="row">'+imgs+'</div></div>'+
' <div id="detail_pics" class="col s12">'+detailImgs+'</div>'+
' </div>'+
' </div>'+
' <div class="modal-footer">'+
' <a href="#!" id="lelf-msg" class="modal-close waves-effect waves-green btn-flat"></a>'+
' <a id="lelf_tbpic_download" class="waves-effect waves-light btn">下载</a>'+
' <a href="#!" class="modal-close waves-effect waves-green btn-flat">关闭</a>'+
' </div>'+
' </div>';
$("body").append(s);
var instance = M.Tabs.init($('.tabs'), '{}');
$('.tabs').tabs('updateTabIndicator');
$("#lelf_tbpic_download").click(function(){
var zip = new JSZip();
var mainImgs = zip.folder("main");
var detailImgs = zip.folder("detail");
var suffix = '';
var totalAssets = zipImgs.length + zipDetailImgs.length;
var currentAsset = 0;
for(var i=0;i<zipImgs.length;i++){
suffix = zipImgs[i].substring(zipImgs[i].lastIndexOf(".") + 1, zipImgs[i].length);
mainImgs.file(i.toString()+'.'+suffix, urlToPromise(zipImgs[i]), {binary:true});
currentAsset++;
$("#lelf-msg").text("处理中:"+currentAsset+"/"+totalAssets);
}
for(var j=0;j<zipDetailImgs.length;j++){
suffix = zipDetailImgs[j].substring(zipDetailImgs[j].lastIndexOf(".") + 1, zipDetailImgs[j].length);
detailImgs.file(j.toString()+'.'+suffix, urlToPromise(zipDetailImgs[j]), {binary:true});
currentAsset++;
$("#lelf-msg").text("处理中:"+currentAsset+"/"+totalAssets);
}
var itemId = window.location.href.split("id=")[1].split('&')[0];
if(itemId === null && itemId.toString().length<0){
itemId="unknown";
}
zip.generateAsync({type:"blob"})
.then(function callback(blob) {
$("#lelf-msg").text("打包中:"+currentAsset+"/"+totalAssets);
saveAs(blob, itemId+".zip");
$("#lelf-msg").text("已完成:"+currentAsset+"/"+totalAssets);
});
});
}
function getHistoryPrice(){
var isAdded = $("#lelf_modal_price");
if(isAdded.length > 0){
isAdded.remove();
}
var s = ' <div id="lelf_modal_price" class="modal modal-fixed-footer">'+
' <div class="modal-content">'+
' <h4 class="h4">历史价格</h4>'+
'<div class="row">'+
' <div class="col s12">'+
' <div id="max_min_price"></div>'+
' <div id="chart_price" style="width:100%; height:350px;"></div>'+
' </div>'+
' </div>'+
' </div>'+
' <div class="modal-footer">'+
' <a href="#!" class="modal-close waves-effect waves-green btn-flat">关闭</a>'+
' </div>'+
' </div>';
$("body").append(s);
var dp_id = window.location.href.split("id=")[1].split('&')[0];
GM_xmlhttpRequest({
method: 'GET',
url: 'https://www.gwdang.com/trend/data_www?dp_id='+dp_id+'&show_prom=true&v=2&get_coupon=1&price=',
onload: response => {
var rsp = JSON.parse(response.responseText);
var seriesData = [];
var maxPrice = [];
var minPrice = [];
if(rsp.is_ban == 1){
$("#max_min_price").html("请稍后再试");
}else{
var d = rsp.series[0].data;
maxPrice = [rsp.series[0].max_stamp*1000,rsp.series[0].max/100];
minPrice = [rsp.series[0].min_stamp*1000,rsp.series[0].min/100];
$.each(d,function (index,element) {
seriesData.push([element.x*1000,element.y/100]);
})
$("#max_min_price").html("<span style='color:red'>最高: "+maxPrice[1]+" 元 ("+formatDate(maxPrice[0])+")</span> <span style='color:green'>最低: "+minPrice[1]+" 元 ("+formatDate(minPrice[0])+")</span>");
////
Highcharts.chart('chart_price', {
chart: {
type: 'line'
},
title: {
text: ''
},
xAxis: {
type: 'datetime',
labels: {
formatter:function(){
return formatDate(this.value);
}
}
},
yAxis: {
title: {
text: ''
}
},
tooltip: {
formatter : function (){
var s = '<span>'+formatDate(this.x)+':'+this.y+'元</span>';
return s;
}
},
legend: {
enabled: false
},
plotOptions: {
series: {
marker: {
enabled: true
},
step: 'left'
}
},
credits: {
enabled: false
},
series: [{
name: "历史价格",
data: seriesData
}],
responsive: {
rules: [{
condition: {
maxWidth: 500
},
chartOptions: {
plotOptions: {
series: {
marker: {
radius: 2.5
}
}
}
}
}]
}
}); ////
}
}
});
}
function urlToPromise(url) {
return new Promise(function(resolve, reject) {
JSZipUtils.getBinaryContent(url, function (err, data) {
if(err) {
reject(err);
} else {
resolve(data);
}
});
});
}
function formatDate(date) {
var d = new Date(date),
month = '' + (d.getMonth() + 1),
day = '' + d.getDate(),
year = d.getFullYear();
if (month.length < 2){month = '0' + month;}
if (day.length < 2){day = '0' + day;}
return [year, month, day].join('-');
}
// Your code here...
})();