$(document).ready(function () {
$('.logo').on('click', function() {
window.location.href = "https://www.bibidd.com";
})
$('.quanpinghei').hide();
// 页面传参
var url = window.location.search;
// 判断图片是否被收藏参数
var collectionStatus;
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(
decodeURIComponent(strs[i].split("=")[1])
);
}
}
var username = localStorage.getItem('username');
var uid = localStorage.getItem("uid");
if (uid) {
$("#register").text("My Collection");
$("#login").text("Log out");
$("#login").css("backgroundColor", "#D6565A");
} else {
$("#register").text("Sign up");
$("#login").text("Login");
$("#login").css("backgroundColor", "#CE5C2A");
}
// 获取视频id
var imgid = theRequest.imgid;
// 获取点赞数量
var fabulous = theRequest.fabulous;
$('.fabulous').find("p").eq(0).text(fabulous);
function getData() {
$.ajax({
type:'post',
url:'https://www.bibidd.com/bibidd/Media/img_detail',
dataType: "json",
data: {
imgs_id: imgid
},
success: function (res) {
},
complete:function(res) {
let dataArray = res.responseJSON.data;
let imgListHtml = '';
$.each(dataArray, function(index, data) {
// imgListHtml += '
';
// imgListHtml += '
';
imgListHtml += ' ![]()
';
})
$('.imgList').html(imgListHtml);
var loadingUrl = "/Public/bibidd/images/photoloading.png";
$(".img img").lazyload({
effect: "fadeIn",
placeholder: loadingUrl,
failurelimit: 10,
});
$('.loading').hide();
$('.img').on('click',function() {
$('.bigImgWrap').show();
$('.bigImg').attr('src', dataArray[$(this).index()]);
})
}
})
}
getData();
$('h2').text(theRequest.name);
// 热门tag分类
$(".nav li").on("click", function () {
const pname = $(this).find("p").eq(0).text();
$(location).attr("href", "photo.html?navtag=" + pname + '?status='+1);
});
// 视频搜索
$(".searchBtn").on("click", function () {
if (!$(".searchInput").val().trim()) {
// 请输入搜索关键字
tip('Please enter the search content');
} else {
const pname = $(".searchInput").val().trim();
$(location).attr("href", "photo.html?navtag=" + pname + '?status='+1);
}
});
$(document).on('keyup', function(event) {
if(event.keyCode ==13){
$(".searchBtn").trigger("click");
}
})
// 查看图片详情
$('.videoContent').on('click', function() {
const videoName = $(this).find('div').eq(1).text();
$(location).attr("href", "bphotodetails.html?name="+videoName + '?status='+1);
})
// 底部标签栏
// 底部标签栏
$(".tabbar li").on("click", function () {
if ($(this).index() === 0) {
$(location).attr("href", 'https://www.bibidd.com?status='+1);
}else if ($(this).index() === 1) {
$(location).attr("href", 'photo.html?status='+1);
}
});
// 标签检索图片
$('.label').on('click', function(){
$('.videopage').show();
$('.labelpage').hide();
$('h2').text($(this).text());
})
// 注册/登录
$('.accountRight').on('click', function() {
$('.loginBox').show();
})
$('.guanbi').on('click', function() {
$('.loginBox').hide();
})
// 查看我的收藏
$('#register').on('click', function() {
if($(this).text()==='My Collection') {
$(location).attr('href', 'collection.html?status='+1);
}else {
// 注册
$(location).attr('href', 'register.html?status='+1);
}
$('.loginBox').hide();
})
// 登录/退出登录
$('#login').on('click', function() {
if($(this).text()==='Log out') {
// 退出登录
localStorage.removeItem('uid');
location.reload();
}else {
// 登录
$(location).attr('href', 'login.html?status='+1);
}
$('.loginBox').hide();
})
// 判断屏幕滚动高度是否超过1屏
$(window).scroll(function() {
var scrollT = $(document).scrollTop();
var offsetT = $('.main').offset().top;
if(scrollT >= offsetT) {
$('.backToTop').show();
}else {
$('.backToTop').hide();
}
})
// 返回顶部
$('.backToTop').on('click', function() {
$('html, body').animate({
scrollTop:0
}, 500);
})
// 判断当前是否可以进行收藏相关交互
var collectionChange = false;
// 判断该图片是否被收藏接口
function collectionData() {
$.ajax({
type:'post',
url:'https://www.bibidd.com/bibidd/Media/yn_shoucang',
dataType: "json",
data: {
type:'img',
cid:imgid,
uid:uid
},
success: function (res) {
},
complete:function(res) {
let collectionData = res.responseJSON.message;
collectionChange = true;
if(collectionData === 'ok') {
// 已经被收藏
$('.collection img').attr('src','/Public/bibidd/images/xingsel.png');
$('.collection').find("p").eq(0).text('Favorite');
collectionStatus = true;
}else {
// 没被收藏
$('.collection img').attr('src','/Public/bibidd/images/xing.png');
$('.collection').find("p").eq(0).text('Not collected');
collectionStatus = false;
}
}
})
}
if(uid){
collectionData();
$('#register').text('My Collection');
$('#login').text('Log out');
$("#login").css("backgroundColor", "#D6565A");
}else{
$('.collection').find("p").eq(0).text('Not collected');
$('#register').text('Sign up');
$('#login').text('Login');
$("#login").css("backgroundColor", "#CE5C2A");
}
// 点赞
var fabulousStatus = true;
$('.fabulous').on('click', function() {
$('.collection img').attr('src','/Public/bibidd/images/load.png');
setTimeout(() => {
$('.collection img').attr('src','/Public/bibidd/images/zan.png');
$.ajax({
type:'post',
url:'https://www.bibidd.com/bibidd/Media/dianzan_img_video',
dataType: "json",
data: {
type:'img',
cid:imgid,
uid:uid
},
success: function (res) {
let fabulous = $('.fabulous').find("p").eq(0).text();
$('.fabulous').find("p").eq(0).text(Number(fabulous) + 1);
}
})
}, 2000);
})
// 收藏
$('.collection').on('click', function() {
if(uid){
if(collectionStatus) {
$('.collection img').attr('src','/Public/bibidd/images/xing.png');
$('.collection').find("p").eq(0).text('Not collected');
collectionclose();
}else {
$('.collection img').attr('src','/Public/bibidd/images/xingsel.png');
$('.collection').find("p").eq(0).text('Favorite');
collectionAdd();
}
}else{
// 弹窗提示去登录
$('.loginBox').show();
}
})
// 添加收藏
function collectionAdd() {
$.ajax({
type:'post',
url:'https://www.bibidd.com/bibidd/Media/add_to_shoucang',
dataType: "json",
data: {
type:'img',
cid:imgid,
uid:uid
},
success: function (res) {
},
complete:function(res) {
collectionChange = true;
let collectionData = res.responseJSON.message;
if(collectionData === 'ok') {
// 已经被收藏
$('.collection img').attr('src','/Public/bibidd/images/xingsel.png');
$('.collection').find("p").eq(0).text('Favorite');
collectionStatus = true;
}else {
$('.collection img').attr('src','/Public/bibidd/images/xing.png');
$('.collection').find("p").eq(0).text('Not collected');
collectionStatus = false;
tip('Please try again later');
}
}
})
}
// 取消收藏
function collectionclose() {
$.ajax({
type:'post',
url:'https://www.bibidd.com/bibidd/Media/quxiao_shoucang',
dataType: "json",
data: {
type:'img',
cid:imgid,
uid:uid
},
success: function (res) {
},
complete:function(res) {
let collectionData = res.responseJSON.message;
if(collectionData === 'ok') {
// 已经取消收藏
$('.collection img').attr('src','/Public/bibidd/images/xing.png');
$('.collection').find("p").eq(0).text('Not collected');
collectionStatus = false;
}else {
$('.collection img').attr('src','/Public/bibidd/images/xingsel.png');
$('.collection').find("p").eq(0).text('Favorite');
collectionStatus = true;
tip('Please try again later');
}
}
})
}
function tip(text) {
$('#tip').show();
$('.tiptext').text(text);
setTimeout(() => {
$('#tip').hide();
}, 1000);
}
$('.guanbiBigImg img').on('click',function() {
$('.bigImgWrap').hide();
})
$('.clearTextImg').on('click', function() {
$('.searchInput').val('');
})
})