868 lines
29 KiB
JavaScript
868 lines
29 KiB
JavaScript
|
||
document.write("<script src='../../../js20/qfstatH5.js'></script>");
|
||
document.write("<script src='../../../js20/poster/posterShare.js'></script>");
|
||
document.write("<script src='../../../js20/bigHaiBao.js?v=1'></script>");
|
||
var swiper =null;
|
||
// 以下参数根据需求进行配置
|
||
var BMListModeType = 2; // 版面列表显示类型。1:左侧弹出 2：居中显示
|
||
var calendarMode = 1; //1：传统日历 2：列表日历需要配合自定义json日历数据
|
||
var ifMaxShowDate = false;//是否开启过滤日期（开启：true,关闭：false）
|
||
var MaxshowData = 10; //最多能看7天
|
||
var pageDirection = "horizontal"; // 版面图滑动 horizontal横向滚动，vertical竖向滚动
|
||
var layoutStyle = "festival" //版面图样式 routine:常规， festival：节日，solemn：庄严
|
||
var HaiBaoType = "single"; //single:单版模板 multi:多版模式，多版面时：需要加载：document.write("<script src='../../../js20/poster/posterShare.js'></script>"); @import url("../js20/poster/posterShare.css");
|
||
|
||
// 主程序
|
||
|
||
var month = getDate("month");//获取当前月份
|
||
$('img[usemap]').rwdImageMaps();//设置图片热区
|
||
|
||
|
||
|
||
$(function () {
|
||
// var wrapWidth=document.body.clientWidth-36;
|
||
// var imgWidth=$('.paperMap')[0].offsetWidth,imgHeight=$('.paperMap')[0].offsetHeight;
|
||
// var wrapHeight=(wrapWidth*imgHeight)/imgWidth
|
||
// console.log(wrapHeight)
|
||
// $('.newpaper').css('height',wrapHeight)
|
||
// return false
|
||
//if (layoutStyle == "routine") {
|
||
// $('.contWrapper').css("background", "#FFF");
|
||
// $('.headBox').css("background", "#F0F0F0");
|
||
//} else if (layoutStyle == "festival") {
|
||
// $('.contWrapper').css("background", "url(../../../image20/festival.png) no-repeat")
|
||
// $('.contWrapper').css("background-size", "100% 100%");
|
||
// $('.headBox').css("background", "#F0F0F0");
|
||
//} else if (layoutStyle == "solemn") {
|
||
// $('body').css("filter", "grayscale(1)");
|
||
// $('.headBox').css("background", "#F0F0F0");
|
||
//}
|
||
if (!DateMaxDiff(1)) {
|
||
alert("对不起，只能查看最新七天数据！");
|
||
//location.href = "../../../paperindex.htm";
|
||
return;
|
||
}
|
||
|
||
// 模式2初始化年份日历
|
||
if (calendarMode == 2) {
|
||
initYearList();
|
||
}
|
||
|
||
//$($('.articleList .listWrap .item')[0]).toggleClass('itemActive');
|
||
// Initialize Swiper
|
||
swiper = new Swiper('.swiper-container', {
|
||
//zoom: true,
|
||
direction: pageDirection,//horizontal横向滚动，vertical竖向滚动
|
||
initialSlide: getURLParams() ? getURLParams(): 0,//默认显示第几个
|
||
//loop : true,//循环滚动
|
||
on: {
|
||
init: function (swiper) {
|
||
console.log('init');
|
||
// $('body').css('opacity',1)
|
||
|
||
pinchZoom();
|
||
//autoChangeTitle(true);
|
||
//alert($('img.pichmask').height())
|
||
// $('img.pichmask').css("height", $(".swiper-wrapper").height());
|
||
},
|
||
slideChangeTransitionEnd: function (swiper) {
|
||
//console.log(swiper);
|
||
var index=swiper.activeIndex;
|
||
//$("#dataIndex").val(index);
|
||
window.dispatchEvent(new CustomEvent('dataIndexChanged', { detail: index }));
|
||
//动态显示页面title信息
|
||
//autoChangeTitle(false);
|
||
new RTP.PinchZoom($('.swiper-slide.swiper-slide-active .pinch-zoom'), { maxZoom: 4 });
|
||
},
|
||
}
|
||
});
|
||
|
||
//$('.newpaper').ready(function(){
|
||
// setTimeout(function(){
|
||
// $(".posterMask").removeClass('active');
|
||
// },10);
|
||
//})
|
||
$('.contWrapper').ready(function(){
|
||
//setTimeout(function(){$(".posterMask").removeClass('active');},1000);
|
||
setTimeout(function(){$('body').css('opacity',1);},500);
|
||
//$('body').css('opacity',1);
|
||
})
|
||
//版面放大的区域与图片自适应显示区域一致
|
||
// $('img.pichmask').load(function(){
|
||
// alert($('img.pichmask').height())
|
||
// })
|
||
// $('img.pichmask').css("height", $(".swiper-wrapper").height());
|
||
|
||
//日历实例化
|
||
$('.form_date').datetimepicker({
|
||
pickerPosition: "top-right",
|
||
bootcssVer: 3,
|
||
format: "yyyy-mm-dd",
|
||
language: "zh-CN",
|
||
weekStart: 1,
|
||
autoclose: 1,
|
||
startView: 2,
|
||
minView: 2,
|
||
forceParse: 0,
|
||
viewSelect: "month",
|
||
initialDate: getDate("day"),
|
||
}).on("show", function (ev) {
|
||
displayDate(month);
|
||
//$(".datetimepicker-days th.switch").addClass("disabled");
|
||
}).on('changeDate', function (ev) {
|
||
var date = new Date(ev.date.valueOf());
|
||
var year = date.getFullYear();
|
||
var month = date.getMonth() + 1;
|
||
month = month < 10 ? ("0" + month) : month;
|
||
var day = date.getDate();
|
||
day = day < 10 ? ("0" + day) : day;
|
||
var url = "http://csdzb.hschool.com.cn/h5/#/?date="+`${year}-${month}-${day}`;
|
||
|
||
//var curDate = year+""+appendZero(month)+""+appendZero(day);
|
||
//if (curDate<=20191231){
|
||
// location.href = "https://epaper.guanhai.com.cn/qdrb/"+curDate;
|
||
//}
|
||
console.log(url)
|
||
//var isUseful = checkUrl(url);
|
||
//console.log(isUseful)
|
||
//if (isUseful) {
|
||
location.href = url;
|
||
//}
|
||
hideAll();
|
||
//$('.mask').removeClass('active');
|
||
});
|
||
//导航栏日期显示
|
||
// $('body .datetimeBtn').text(getDate("day"));
|
||
// 底部按钮切换
|
||
$('.footerWrap').on('click', '.item', function () {
|
||
//$(this).toggleClass('active');
|
||
//$(this).parent('.item').siblings('.item').find('.text').removeClass('active');
|
||
$('.mask').toggleClass('active');
|
||
// 版面列表显示
|
||
var btn=$(this).children()[1];
|
||
|
||
if (btn.classList.contains('layoutBtn')) {
|
||
if (BMListModeType == 1) {
|
||
$('.layoutStyleOne').toggleClass('active');
|
||
} else if (BMListModeType == 2) {
|
||
$('.layoutStyleTwo').toggleClass('active');
|
||
$(".cancelBox").show()
|
||
}
|
||
}
|
||
// 版面文章目录显示
|
||
if (btn.classList.contains('articleBtn')) {
|
||
$('.articleList').toggleClass('active');
|
||
$(".cancelBox").show();
|
||
}
|
||
//日历显示
|
||
if (btn.classList.contains('datetimeBtn')) {
|
||
showDate();
|
||
}
|
||
// 跳转下载页面
|
||
//if (btn.classList.contains('synthesis')) {
|
||
// // window.location.href='synthesis.html';
|
||
// // $('.mask').removeClass('active');
|
||
// $('.synthPage').addClass('active');
|
||
// synthBox();
|
||
//}
|
||
|
||
//更多显示的弹层
|
||
if (btn.classList.contains('more')) {
|
||
$(this).siblings('.exareBox').toggleClass('active');
|
||
}
|
||
})
|
||
|
||
// 点击遮罩
|
||
$('.contWrapper .mask').on('click', function () {
|
||
hideAll();
|
||
})
|
||
|
||
// 点击取消按钮
|
||
$('.contWrapper .cancelBox').on('click', function () {
|
||
hideAll();
|
||
})
|
||
|
||
// 点击总览页面
|
||
// $('.zonglan').on('click', function () {
|
||
// var rqStr = window.location.href.match(/(\d{4}-\d{2})\/(\d{2})/i);
|
||
// var zonglanUrl = "index_"+rqStr[1]+"-"+rqStr[2]+".htm";
|
||
// window.location.href = zonglanUrl;
|
||
// })
|
||
|
||
//文章目录显示样式
|
||
// $('.articleList .item a').on('click', function () {
|
||
// $(this).addClass('active').siblings().removeClass('active');
|
||
// $(this).parents('.item').siblings('.item').find('a').removeClass('active')
|
||
// })
|
||
|
||
//给版面目录页面加上高亮（样式一）
|
||
// var curUrl = window.location.href;
|
||
// $('.layoutList a').each(function (i, elem) {
|
||
// if ($(elem).attr('href') == curUrl) {
|
||
// $(elem).addClass('active').siblings().removeClass('active');
|
||
// }
|
||
// });
|
||
//给版面目录页面加上高亮（样式二）
|
||
// $('.layoutList .listWrapBox .listWrap').each(function (i, elem) {
|
||
// if (curUrl.includes($(elem).children('a').attr('href'))) {
|
||
// $(elem).addClass('action').siblings().removeClass('action');
|
||
// }
|
||
// });
|
||
// 点击版面
|
||
// $('.layoutList .listWrapBox .listWrap').on('click', function (e) {
|
||
// location.href = $(this).children('a').attr('href')
|
||
// })
|
||
|
||
//监听切换月份
|
||
var i = 0;
|
||
// 选择您想要监听子节点变动的元素
|
||
var targetNode = document.querySelector('.datetimepicker-days tbody');
|
||
// 创建一个观察者实例并传入回调函数
|
||
var observer = new MutationObserver(function(mutations) {
|
||
mutations.forEach(function(mutation) {
|
||
if (mutation.type === 'childList') {
|
||
if (i == 5) {
|
||
var date = $(".datetimepicker-days thead th.switch").text().split(" ");
|
||
switch (date[0]) {
|
||
case "一月":
|
||
month = date[1] + "-01";
|
||
break;
|
||
case "二月":
|
||
month = date[1] + "-02";
|
||
break;
|
||
case "三月":
|
||
month = date[1] + "-03";
|
||
break;
|
||
case "四月":
|
||
month = date[1] + "-04";
|
||
break;
|
||
case "五月":
|
||
month = date[1] + "-05";
|
||
break;
|
||
case "六月":
|
||
month = date[1] + "-06";
|
||
break;
|
||
case "七月":
|
||
month = date[1] + "-07";
|
||
break;
|
||
case "八月":
|
||
month = date[1] + "-08";
|
||
break;
|
||
case "九月":
|
||
month = date[1] + "-09";
|
||
break;
|
||
case "十月":
|
||
month = date[1] + "-10";
|
||
break;
|
||
case "十一月":
|
||
month = date[1] + "-11";
|
||
break;
|
||
case "十二月":
|
||
month = date[1] + "-12";
|
||
break;
|
||
}
|
||
displayDate(month);
|
||
i = -1;
|
||
}
|
||
i++;
|
||
}
|
||
});
|
||
});
|
||
|
||
// 配置观察选项:
|
||
// 子节点的添加或删除将触发观察者的回调
|
||
var config = { attributes: false, childList: true, subtree: true };
|
||
// 传入目标节点和观察选项
|
||
observer.observe(targetNode, config);
|
||
|
||
|
||
//点击分享按钮
|
||
$('.synthesis').on('click', function () {
|
||
if(HaiBaoType=="single"){//单版分享
|
||
$('.mask').toggleClass('active');
|
||
$('.synthPage').addClass('active');
|
||
//synthBox();
|
||
bigHaibao();
|
||
}else if (HaiBaoType=="multi"){ //多版分享
|
||
var poster = POSTER('paperMap').show('');
|
||
}
|
||
});
|
||
|
||
//关闭下载图片的弹层
|
||
$('.synthPage').on('click', '.closeBtn', function () {
|
||
$('.synthPage').html('');
|
||
$('.synthPage,.mask,.synthesis').removeClass('active');
|
||
|
||
});
|
||
|
||
var currentSwiperZoom = [];
|
||
var currentSwiperZoom2 = [];
|
||
//存储页面所有图片原始的缩放比例
|
||
window.onload = function () {
|
||
$('.swiper-slide').find('.pinch-zoom').each(function () {
|
||
currentSwiperZoom2.push({ zoomhtml: $(this)[0].outerHTML });
|
||
});
|
||
new RTP.PinchZoom($('.swiper-slide.swiper-slide-active .pinch-zoom'), { maxZoom: 4 });
|
||
//$('.swiper-slide').find('.pinch-zoom').each(function(){
|
||
//currentSwiperZoom.push({transform:$(this)[0].style.transform,transformOrigin:$(this)[0].style.transformOrigin});
|
||
//})
|
||
}
|
||
//点击除了已有的元素之外的区域缩小放大
|
||
$('body').click(function (e) {
|
||
var target = $(e.target);
|
||
if (!target.is('.imgBoxCont *') && !target.is('.footerWrap *') && !target.is('.newsText1 *') && !target.is('.synthesis') && !target.is('.layoutList *') && !target.is('.articleList *') && !target.is('.text') && !target.is('.synthPage *') && !target.is('.mask') && currentSwiperZoom2.length != 0) {
|
||
//不是点击指定区域执行的操作
|
||
var scaleIndex = getURLParams() ? getURLParams() : 0
|
||
$('.swiper-slide.swiper-slide-active .pinch-zoom-container').remove();
|
||
$('.swiper-slide.swiper-slide-active .imgBoxCont').append(currentSwiperZoom2[scaleIndex].zoomhtml)
|
||
new RTP.PinchZoom($('.swiper-slide.swiper-slide-active .pinch-zoom'), { maxZoom: 4 });
|
||
}
|
||
});
|
||
|
||
//xml判断图片加载情况
|
||
xmlhttpAction();
|
||
|
||
})
|
||
|
||
//图片放大初始化
|
||
function pinchZoom() {
|
||
window.z_drag = 0;
|
||
$('div.pinch-zoom').each(function (v, i) {
|
||
new RTP.PinchZoom($(this), { maxZoom: 4 });
|
||
$(this).on('pz_zoomstart', function () {
|
||
window.z_drag = 1
|
||
});
|
||
|
||
$(this).on('pz_dragstart', function () {
|
||
window.z_drag = 1
|
||
});
|
||
|
||
$(this).on('pz_zoomend', function () {
|
||
setTimeout(function () {
|
||
window.z_drag = 0
|
||
}, 500);
|
||
});
|
||
$(this).on('pz_dragend', function () {
|
||
setTimeout(function () {
|
||
window.z_drag = 0
|
||
}, 500);
|
||
});
|
||
});
|
||
}
|
||
|
||
//xml判断图片加载情况
|
||
function xmlhttpAction() {
|
||
var xmlhttp;
|
||
if (window.XMLHttpRequest) {
|
||
// code for IE7+, Firefox, Chrome, Opera, Safari
|
||
xmlhttp = new XMLHttpRequest();
|
||
} else {
|
||
// code for IE6, IE5
|
||
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
|
||
}
|
||
xmlhttp.abort();
|
||
//停止继续加载页面，相当于点击stop按钮。
|
||
if (!!(window.attachEvent && !window.opera)) {
|
||
console.log('ie')
|
||
//alert('ie')
|
||
//document.execCommand("stop");// code for IE
|
||
} else {
|
||
console.log('chrome');
|
||
//alert('chrome');
|
||
$('.swiper-wrapper .swiper-slide').each(function (i, v) {
|
||
//console.log($(v).children('.pinch-zoom'))
|
||
if (!$(v).find('.paperMap')[0].complete) {
|
||
if (i == 0) {
|
||
//alert($(v).find('.pinch-zoom')[0].clientHeight,$(v).find('.paperMap')[0].clientHeight);
|
||
console.log('[[[[[', $(v).find('.pinch-zoom')[0].clientHeight, $(v).find('.paperMap')[0].clientHeight)
|
||
}
|
||
$(v).find('.paperMap').attr('src', $(v).find('.paperMap')[0].src)
|
||
}
|
||
})
|
||
/**
|
||
* stops window loading
|
||
* code for Firefox, Chrome, Opera, Safari
|
||
*/
|
||
//window.stop();
|
||
}
|
||
|
||
}
|
||
|
||
|
||
//判断图片是否加载完成
|
||
function ImgLoad(imgsys, id) {
|
||
console.log('加载：', imgsys, imgsys.attr('id'))
|
||
let img = imgsys;
|
||
let imgId = imgsys.attr('id');
|
||
if (img && img.length != 0) {
|
||
console.log('加载完成之后：', img, $("img#" + imgId).parent('.pinch-zoom'));
|
||
|
||
let transform2d = "scale(" + img[0].naturalWidth / img.context.clientWidth + ", " + img[0].naturalHeight / img.context.clientHeight + ") " + "translate(0px, 0px) !important";
|
||
$("img#" + imgId).parent('.pinch-zoom').css({
|
||
"-webkit-transform": transform2d,
|
||
"-o-transform": transform2d,
|
||
"-ms-transform": transform2d,
|
||
"-moz-transform": transform2d,
|
||
transform: transform2d
|
||
});
|
||
} else {
|
||
setTimeout(function () { ImgLoad() }, 300);
|
||
}
|
||
}
|
||
|
||
// 日历相关设置
|
||
//显示日期
|
||
function showDate() {
|
||
if (calendarMode == 1) {
|
||
$('.form_date').datetimepicker('update');
|
||
$(".form_date").datetimepicker("show");
|
||
$(".cancelBox").show()
|
||
} else if (calendarMode == 2) {
|
||
$("#Datefour").animate({ bottom: "48" }, "normal");
|
||
}
|
||
}
|
||
//隐藏日期
|
||
function hideDate() {
|
||
if (calendarMode == 1) {
|
||
$(".form_date").val(getDate("day"));
|
||
$(".form_date").datetimepicker("hide");
|
||
} else if (calendarMode == 2) {
|
||
$("#Datefour").animate({ bottom: "-100%" }, "normal");
|
||
}
|
||
}
|
||
|
||
//获取当前页日期
|
||
function getDate(str) {
|
||
var activeDate = $('#activeDate').val();
|
||
console.log('获取当前页日期',activeDate);
|
||
activeDate = new Date(activeDate);
|
||
var initYear = activeDate.getFullYear();
|
||
var initMonth = activeDate.getMonth() + 1;
|
||
var initDay = activeDate.getDate();
|
||
// var url = location.href;
|
||
// var re = /(\d{4})\-(\d{2})\/(\d{2})/;
|
||
// var r = url.match(re);
|
||
//精确到日
|
||
if (str == "day") {
|
||
var date = initYear + "-" + initMonth + "-" + initDay;
|
||
//精确到月
|
||
} else if (str == "month") {
|
||
var date = initYear + "-" + initMonth;
|
||
}
|
||
return date
|
||
}
|
||
|
||
//获取当前月份报纸xml数据
|
||
function getPaper(date) {
|
||
console.log(date);
|
||
//var myXmlUrl = `/h5/public/static/data/${date}.json`;
|
||
//var myXmlUrl = "../../../html5/" + date + "/navi.xml?time=" + Date.parse(new Date());
|
||
var data = { 'day': [], 'url': [] };
|
||
$.ajax({
|
||
data:{'date':date},
|
||
url: "http://csdzb.hschool.com.cn/api/dzb/date/index",
|
||
type: 'POST',
|
||
dataType: 'json',
|
||
async: false,
|
||
timeout: 1000,
|
||
success: function (xml) {
|
||
console.log(xml)
|
||
var date = new Array();
|
||
var day = new Array();
|
||
var url = new Array();
|
||
// $(xml).find("date").each(function () {
|
||
// date.push($(this).text());
|
||
// day.push(parseInt($(this).text().split("-")[2]))
|
||
// });
|
||
// $(xml).find("url").each(function () {
|
||
// url.push($(this).text());
|
||
// });
|
||
xml.data.forEach(function (item) {
|
||
date.push(item.datetime);
|
||
day.push(parseInt(item.datetime.split("-")[2]));
|
||
});
|
||
data = {"day": day, "url": url, "date": date};
|
||
//data = { "day": day, "url": url }
|
||
}
|
||
});
|
||
//console.log('获取当前月份报纸xml数据:',date)
|
||
return data
|
||
}
|
||
|
||
//需要黑色显示的日期数组
|
||
function displayDate(date) {
|
||
var data = getPaper(date);
|
||
var day = 1, count = 0, count2 = 0;
|
||
$(".datetimepicker-days .day").each(function (i) {
|
||
if (parseInt($(this).text()) > day) {
|
||
$(this).html("");
|
||
count++
|
||
} else {
|
||
day = parseInt($(this).text()) + 1;
|
||
if ((i > 20) && (parseInt($(this).text()) < 14)) {
|
||
$(this).html("").removeClass("active");
|
||
count2++;
|
||
}
|
||
}
|
||
});
|
||
if (count == 7) { $(".datetimepicker-days tr:eq(2)").hide(); }
|
||
if (count2 >= 7) { $(".datetimepicker-days tr:eq(7)").hide(); }
|
||
|
||
$(".datetimepicker-days .day").each(function () {
|
||
var index = data["day"].indexOf(parseInt($(this).text()))
|
||
if (index == -1) {
|
||
//var curDate = date.replace("-","")+appendZero(parseInt($(this).text()));
|
||
//if (curDate<=20191231){
|
||
// $(this).attr('url',"");
|
||
//}else{
|
||
$(this).addClass('old');
|
||
$(this).addClass('disabled');
|
||
//}
|
||
} else {
|
||
if (!ifMaxShowDate) {
|
||
$(this).attr('url', data["url"][index]);
|
||
} else {
|
||
var temp = date.split("-");
|
||
temp = temp[0] + "/" + temp[1] + "/" + parseInt($(this).text());
|
||
if (DateMaxDiff(2, temp)) {
|
||
$(this).attr('url', data["url"][index]);
|
||
} else {
|
||
$(this).addClass('old');
|
||
$(this).addClass('disabled');
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
|
||
function appendZero(n) {
|
||
return (("00" + n).substr(("00" + n).length - 2));
|
||
}
|
||
|
||
// 隐藏首页所有的弹层
|
||
function hideAll() {
|
||
$('.layoutList').removeClass('active');
|
||
$('.footerWrap .item .text').removeClass('active')
|
||
$('.mask').removeClass('active');
|
||
$('.articleList').removeClass('active');
|
||
$('.exareBox').removeClass('active')
|
||
hideDate();
|
||
$(".cancelBox").hide()
|
||
}
|
||
|
||
//检查链接是否有效
|
||
function checkUrl(url) {
|
||
isUseful = false;
|
||
$.ajax({
|
||
url: url,
|
||
type: 'GET',
|
||
async: false,
|
||
success: function (xml) {
|
||
isUseful = true;
|
||
}
|
||
});
|
||
return isUseful
|
||
}
|
||
|
||
//取版面的ID
|
||
function getCaption(obj) {
|
||
var date=$("#activeDate").val();
|
||
var index=$("#dataIndex").val();
|
||
var yearMonth = date.slice(0, 7);
|
||
//var index = obj.lastIndexOf("p");
|
||
//obj = obj.substring(index + 1, obj.length);
|
||
// console.log(obj);
|
||
return `date=${date}&year_month=${yearMonth}&index=${index}`;
|
||
}
|
||
|
||
//下载弹层
|
||
function synthBox() {
|
||
var imgUrl = $('.swiper-wrapper .swiper-slide-active img').attr('src') + '?=v1';
|
||
var date = window.location.href.match(/(\d{4})-(\d{2})\/(\d{2})/im)[0].replace("-", "年").replace("/", "月") + '日'; //日期
|
||
var week = getWeek(window.location.href.match(/(\d{4})-(\d{2})\/(\d{2})/im)[0].replace("/", "-")); //星期
|
||
// var html = '<div class="closeBtn"><i></i></div>' +
|
||
// '<div id="synthWrap">' +// <!-- 下载内容html -->
|
||
// '<img src = ' + imgUrl + ' class="synthPaper" alt=""/>' +
|
||
// '<div class="imgBottom"></div>' +
|
||
// '<div class="footer">' +
|
||
// '<div class="left"><img src="../../../image20/logo.png" alt=""/></div>' +
|
||
// '<div class="center">' +
|
||
// window.location.href.match(/(\d{4})-(\d{2})\/(\d{2})/im)[0].replace("-", ".").replace("/", ".") +
|
||
// ' ' +
|
||
// getWeek(window.location.href.match(/(\d{4})-(\d{2})\/(\d{2})/im)[0].replace("/", "-")) + '</div>' +
|
||
// '<div class="right" id="qrcode"></div>' +
|
||
// '</div>' +
|
||
// '</div>' +
|
||
// '<div class="tipsBtn"></div>' +//<!-- 保存提示按钮 -->
|
||
// '<div id="synthImg"><img src="" alt=""/></div>' +//<!-- 合成的图片 -->
|
||
// '<div class="synthmask"><img src="../../../image20/loading.gif" alt=""/></div>';//<!-- 加载中的蒙层 -->
|
||
var html = `
|
||
<div class="closeBtn"><i></i></div>
|
||
<div id="synthWrap">
|
||
<div class="synthHead">
|
||
<img src="../../../image20/logoSmall.png" alt=""/>
|
||
<div>${date} ${week}</div>
|
||
</div>
|
||
<img src = '${imgUrl}' class="synthPaper" alt=""/>
|
||
<div class="footer">
|
||
<div class="left">
|
||
<img src="../../../image20/logoBig.png" alt=""/>
|
||
</div>
|
||
<div class="right">
|
||
<div class="text">
|
||
<div>识别二维码</div>
|
||
<div>查看该版内容</div>
|
||
</div>
|
||
<div class="qr">
|
||
<img src="" id="qcImg"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="synthImg"><img src="" alt=""/></div>
|
||
<div class="saveTipsBtn">点击图片，长按分享给好友</div>
|
||
<div class="synthmask"><img src="/public/static/loading.gif" alt=""/></div>
|
||
<div id="qrcode" style="visibility:hidden;"></div>
|
||
`
|
||
$('.synthPage').append(html);
|
||
var url = window.location.href;
|
||
var index = url.substring(0, url.lastIndexOf('/') + 1);
|
||
console.log(index + '?' + getCaption())
|
||
$('body').find('#qrcode').qrcode({
|
||
render: 'canvas',
|
||
width: 180,
|
||
height: 180,
|
||
// margin: '0 auto',
|
||
text: index + '?' + getCaption()
|
||
});
|
||
document.getElementById('qcImg').src = document.querySelector('canvas').toDataURL("image/webp");
|
||
synthesisImgLoad();
|
||
|
||
$('.tipsBtn').unbind("touchstart");
|
||
$('.tipsBtn').unbind("touchend");
|
||
$('.tipsBtn').bind("touchstart", function () {
|
||
$(this).hide();
|
||
});
|
||
|
||
$('.tipsBtn').bind("touchend", function () {
|
||
$(this).show();
|
||
});
|
||
}
|
||
//判断图片是否加载完成
|
||
function synthesisImgLoad() {
|
||
var img = $('.synthPage .synthPaper');
|
||
if (img && img.length != 0) {
|
||
if (img[0].complete) {
|
||
var synBoxH = $('#synthWrap').height();
|
||
var imgH = $('#synthWrap').height() - 100;
|
||
$('#synthWrap>img.synthPaper').css('max-height', imgH + 'px');
|
||
$('#qrcode').hide()
|
||
synthesisImg();
|
||
} else {
|
||
setTimeout(function () { synthesisImgLoad() }, 300);
|
||
}
|
||
} else {
|
||
setTimeout(function () { synthesisImgLoad() }, 300);
|
||
}
|
||
}
|
||
//生成图片
|
||
function synthesisImg() {
|
||
//clearInterval(synthesisImgLoad)
|
||
var canvas = document.createElement('canvas') // 创建一个canvas节点
|
||
var shareContent = document.getElementById('synthWrap') // 需要截图的包裹的（原生的）DOM 对象
|
||
var width = shareContent.offsetWidth // 获取dom 宽度
|
||
var height = shareContent.offsetHeight // 获取dom 高度
|
||
var scale = 2 // 定义任意放大倍数 支持小数
|
||
canvas.getContext('2d').scale(scale, scale) // 获取context,设置scale
|
||
var rect = shareContent.getBoundingClientRect() // 获取元素相对于视口的
|
||
html2canvas(document.getElementById('synthWrap'), {
|
||
x: rect.left, // 绘制的dom元素相对于视口的位置
|
||
y: rect.top,
|
||
width: width, // dom 原始宽度
|
||
height: height,
|
||
windowWidth: document.body.scrollWidth,
|
||
windowHeight: document.body.scrollHeight,
|
||
// x: 0,
|
||
// y: 0,
|
||
useCORS: true, // 开启跨域
|
||
dpi: window.devicePixelRatio * 2,
|
||
scale: scale, // 添加的scale 参数
|
||
}).then((canvas) => {
|
||
var context = canvas.getContext('2d')
|
||
//关闭抗锯齿
|
||
context.mozImageSmoothingEnabled = false
|
||
context.msImageSmoothingEnabled = false
|
||
context.imageSmoothingEnabled = false
|
||
$('#synthImg img').attr('src', canvas.toDataURL());
|
||
$('#synthWrap').hide();
|
||
$('#synthImg').show();
|
||
$('.synthPage .synthmask').hide();
|
||
})
|
||
}
|
||
|
||
//星期日期计算
|
||
function getWeek(timedat) { //timedat参数格式： "2018-09-11"
|
||
let t = new Date(timedat);
|
||
let week;
|
||
if (t.getDay() === 0) week = "星期日";
|
||
if (t.getDay() === 1) week = "星期一";
|
||
if (t.getDay() === 2) week = "星期二";
|
||
if (t.getDay() === 3) week = "星期三";
|
||
if (t.getDay() === 4) week = "星期四";
|
||
if (t.getDay() === 5) week = "星期五";
|
||
if (t.getDay() === 6) week = "星期六";
|
||
return week;
|
||
};
|
||
|
||
//判断当前时间和报纸刊期之间的时间差。 如在MaxshowData天内，返回true,否则返回false
|
||
// type=1,忽略dtStartStr，日期根据浏览器地址获取;type=2，根据前一个参数，格式(YYYY/MM/DD)
|
||
function DateMaxDiff(type, dtStartStr) {
|
||
if (!ifMaxShowDate) { return true; }
|
||
var maxinterval = MaxshowData;//允许看的天数
|
||
var re = /(\d{4})-(\d{2})\/(\d{2})/i;
|
||
var sUrl = location.href;
|
||
var r = sUrl.match(re);
|
||
var dtEnd = new Date();
|
||
var dtStart;
|
||
if (type == 1) {
|
||
if (r) {
|
||
dtStart = new Date(r[1] + "/" + r[2] + "/" + r[3]);
|
||
} else {
|
||
dtStart = new Date();
|
||
}
|
||
} else if (type == 2) {
|
||
dtStart = new Date(dtStartStr);
|
||
if (isNaN(dtStart)) dtStart = new Date();
|
||
}
|
||
|
||
var date3 = dtEnd.getTime() - dtStart.getTime(); //时间差的毫秒数
|
||
var days = Math.floor(date3 / (24 * 3600 * 1000));//计算出相差天数
|
||
if ((days) >= maxinterval) {
|
||
return false;
|
||
} else {
|
||
return true;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
//日历牌替换====================
|
||
function initYearList() {//加载年份
|
||
var html = "";
|
||
html += " <div id='Datefour'>";
|
||
html += " <div class='year'>";
|
||
html += " <a href='#' class='prev'></a>";
|
||
html += " <p id='paperYear'></p>";
|
||
html += " <a href='#' class='next'></a>";
|
||
html += " </div>";
|
||
html += " <ul class='clearfix'>";
|
||
html += " </ul>";
|
||
html += " </div>";
|
||
$("body").append(html);
|
||
|
||
var url = location.href;
|
||
var re = /\/(\d{4})-(\d{2})\/(\d{2})\/node_(\d+).htm/im;
|
||
var r = url.match(re);
|
||
getYearList(r[1], r[1] + "-" + r[2] + "-" + r[3]);//按年份显示导航
|
||
|
||
}
|
||
|
||
//获取当前月份报纸xml数据
|
||
function getYearList(year, curDate) {//按年份显示导航
|
||
$("#Datefour p").html("<span onclick=\"showYearList(" + year + ",'" + curDate + "');\"><img src='../../../image20/calenderSmall.png' border=0 />" + year + "年</span>");//显示年份
|
||
var myXmlUrl = "../../../paperXml/yearList.js?time=" + new Date().getTime();
|
||
var curIndex = -1, css = "", len, perYear = 0, nextYear = 0;
|
||
|
||
$.getJSON(myXmlUrl, function (json) {
|
||
//解析列表
|
||
$.each(json, function (i, item) {
|
||
if (item.active == 1) {
|
||
if (year == item.yearNo) { curIndex = i; }
|
||
if (curIndex == -1) { perYear = item.yearNo; }
|
||
if (curIndex + 1 == i) { nextYear = item.yearNo; }
|
||
}
|
||
});
|
||
|
||
len = json.length - 1;
|
||
// 往左事件
|
||
if (perYear > 0) {
|
||
//$("#Datefour .prev span").css("color","#04C");//年份左导航箭头颜色
|
||
$("#Datefour .prev").css("background-image", "url('../../../image20/left-1.png')");
|
||
$("#Datefour .prev").attr("href", "javascript:getYearList(" + perYear + ",'" + curDate + "')");//年份左导航箭头颜
|
||
} else {
|
||
//$("#Datefour .prev span").css("color","#eee");//年份左导航箭头颜
|
||
$("#Datefour .prev").css("background-image", "url('../../../image20/left-2.png')");
|
||
$("#Datefour .prev").attr("href", "javascript:void();");//年份左导航箭头颜
|
||
}
|
||
// 往右事件
|
||
if (len != curIndex) {
|
||
$//("#Datefour .next span").css("color","#04C");//年份左导航箭头颜色
|
||
$("#Datefour .next").css("background-image", "url('../../../image20/right-1.png')");
|
||
$("#Datefour .next").attr("href", "javascript:getYearList(" + nextYear + ",'" + curDate + "')");//年份左导航箭头颜
|
||
} else {
|
||
//$("#Datefour .next span").css("color","#eee");//年份左导航箭头颜
|
||
$("#Datefour .next").css("background-image", "url('../../../image20/right-2.png')");
|
||
$("#Datefour .next").attr("href", "javascript:void();");//年份左导航箭头颜
|
||
}
|
||
});
|
||
getDateList(year, curDate);//按当前页面年份加载对应期次数据
|
||
}
|
||
|
||
|
||
function showYearList(perYear, curDate) {//显示年份列表
|
||
var myXmlUrl = "../../../paperXml/yearList.js?time=" + new Date().getTime();
|
||
$('#Datefour ul').empty();
|
||
$(".prev,.next").hide();
|
||
|
||
var liCss;
|
||
$.getJSON(myXmlUrl, function (json) {
|
||
$.each(json, function (i, item) {
|
||
if (item.active == 1) {
|
||
liCss = " style='color:#000;'";
|
||
$('#Datefour ul').append("<li style='width:25%'><a href=\"javascript:getYearList(" + item.yearNo + ",'" + curDate + "');\"" + liCss + " >" + item.yearNo + "年</a></li>");
|
||
} else {
|
||
liCss = " style='color:gray;'";
|
||
$('#Datefour ul').append("<li style='width:25%'><a href='javascript:void(0);'" + liCss + " >" + item.yearNo + "年</a></li>");
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
function getDateList(year, curDate) {//按当前页面年份加载对应期次数据
|
||
var myXmlUrl = "../../../paperXml/" + year + "_paperList.js";
|
||
var xmlDate, paperUrl, liCss;
|
||
$('#Datefour ul').empty();
|
||
$(".prev,.next").show();
|
||
|
||
var xmlDate, paperUrl, liCss;
|
||
$.getJSON(myXmlUrl, function (json) {
|
||
$.each(json, function (i, item) {
|
||
xmlDate = item.date;
|
||
paperUrl = "../../" + xmlDate.split("-")[0] + "-" + xmlDate.split("-")[1] + "/" + xmlDate.split("-")[2] + "/node_1.htm";
|
||
liCss = " style='" + (item.active == 1 ? "background-color:#eee;" : "") + (curDate == item.date ? "color:#F00;" : "") + "'";
|
||
//console.log(liCss);
|
||
$('#Datefour ul').append("<li><a href='" + paperUrl + "' " + liCss + " >" + item.name + "</a></li>");
|
||
});
|
||
});
|
||
}
|
||
|
||
//获取url中"?"符后的字串
|
||
function getURLParams() {
|
||
var index = sessionStorage.getItem("index");
|
||
return index?index:0;
|
||
// let url = decodeURI(window.location.href); //获取url中"?"符后的字串
|
||
// let theRequest = {};
|
||
// if (url.lastIndexOf("?") !== -1) {
|
||
// let str = url.substr(url.lastIndexOf("?") + 1);
|
||
// //let str = substr(url,instr(url,"?",-1)+1);
|
||
// let strs = str.split("&");
|
||
// for (var i = 0; i < strs.length; i++) {
|
||
// theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
|
||
// }
|
||
// }
|
||
// return theRequest;
|
||
};
|