◆少前百科是非盈利性、非官方的少女前线维基百科。 ◆如果您发现某些内容错误/空缺,请勇于修正/添加!参与进来其实很容易!点这里 加入少前百科。 ◆有任何意见、建议、纠错,欢迎在 GFwiki:反馈与建议 提出和讨论。编辑事务讨论QQ群:597764980,微博@GFwiki少前百科 ◆To foreigners,You can use twitter to contact us. |
“Widget:SkinQuery/js”的版本间的差异
(更新) |
|||
(未显示3个用户的57个中间版本) | |||
第1行: | 第1行: | ||
<includeonly><script type="text/javascript">(window.RLQ=window.RLQ||[]).push(function(){ | <includeonly><script type="text/javascript">(window.RLQ=window.RLQ||[]).push(function(){ | ||
+ | |||
+ | var htmlPageSave = []; // for page 1, 2, 3…… | ||
var suitElement = document.querySelectorAll('.suitdata'); | var suitElement = document.querySelectorAll('.suitdata'); | ||
− | creat_suit(); | + | var suitChoice = {} |
− | + | ||
− | + | creat_select(); | |
+ | update_suitChoice(); | ||
+ | creat_suit("skinFocus") | ||
+ | creat_interact(); | ||
+ | creat_album(); | ||
+ | |||
+ | function dragFn (dragObj,parent) { | ||
+ | $(dragObj).mousedown(function (e) { | ||
+ | var _this = $(this); | ||
+ | var parent_h = $(parent)[0].offsetHeight | ||
+ | parent_w = $(parent)[0].offsetWidth | ||
+ | drag_h = $(this)[0].offsetHeight | ||
+ | drag_w = $(this)[0].offsetWidth | ||
+ | var dragX = e.clientX - $(this)[0].offsetLeft; | ||
+ | var dragY = e.clientY - $(this)[0].offsetTop; | ||
+ | |||
+ | $(dragObj).addClass("mousedown"); | ||
+ | |||
+ | $(document).mousemove(function (e) { | ||
+ | var l = e.clientX - dragX; | ||
+ | var t = e.clientY - dragY; | ||
+ | if (l < 0) { | ||
+ | l = 0; | ||
+ | } else if (l > parent_w - drag_w) { | ||
+ | l = parent_w - drag_w; | ||
+ | } | ||
+ | if (t < 0) { | ||
+ | t = 0; | ||
+ | } else if (t > parent_h - drag_h) { | ||
+ | t = parent_h - drag_h; | ||
+ | } | ||
+ | _this.css({ | ||
+ | left: l + 'px', | ||
+ | top: t + 'px', | ||
+ | }); | ||
+ | }) | ||
+ | }); | ||
+ | |||
+ | $(document).mouseup(function () { | ||
+ | $(this).off('mousemove');$(dragObj).removeClass("mousedown") | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | function creat_select(){ | ||
+ | var html_text = ` | ||
+ | <div class="skinselectbox"> | ||
+ | <div class="suitbtnbtnbox" style="display: none;"> | ||
+ | <div class="gfcheckbtn suitbtn buttonStateOn" id="suitModeFocus">纯享模式<\/div> | ||
+ | <div class="gfcheckbtn suitbtn" id="suitModeGallery">画廊模式<\/div> | ||
+ | <div class="gfcheckbtn suitbtn" id="suitModeCard">卡片模式<\/div> | ||
+ | <div class="gfcheckbtn suitbtn" id="suitModeTheme">主题模式<\/div> | ||
+ | <div class="gfcheckbtn suitbtn" id="suitModeText">文字模式<\/div> | ||
+ | <\/div> | ||
+ | <div class="skinbtnbox"> | ||
+ | <div class="gfactivebtn skinsecall">全选<\/div> | ||
+ | <div class="gfactivebtn skinclear">清空<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2016">2016年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2017">2017年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2018">2018年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2019">2019年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2020">2020年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2021">2021年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2022">2022年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2023">2023年<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="suit2024">2024年<\/div> | ||
+ | <\/div><br/> | ||
+ | <div class="skinbtnbox"> | ||
+ | <div class="gfactivebtn skinsecall">全选<\/div> | ||
+ | <div class="gfactivebtn skinclear">清空<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeJp">正月<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeSpring">春节<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeWedding">婚纱<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeAnniversary">周年庆<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeChild">儿童节<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeSwim">泳装<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeHallo">万圣节<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeXmas">圣诞节<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeCollaborate">联动<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeSpecial">特典<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="typeOther">其他<\/div> | ||
+ | <\/div><br/> | ||
+ | <div class="skinbtnbox"> | ||
+ | <div class="gfactivebtn skinsecall">全选<\/div> | ||
+ | <div class="gfactivebtn skinclear">清空<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="live2d">Live2D<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="animated">Anime<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="normal">Normal<\/div> | ||
+ | <\/div><br/> | ||
+ | <div class="skinbtnbox"> | ||
+ | <div class="gfactivebtn skinsecall">全选<\/div> | ||
+ | <div class="gfactivebtn skinclear">清空<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="3card">3<span class="btntext">黑卡<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="5card">5<span class="btntext">黑卡<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="8card">8<span class="btntext">黑卡<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="xcard"><span class="btntext">黑卡无效<\/span><\/div> | ||
+ | <\/div><br/> | ||
+ | <div class="skinbtnbox" style="display: none;"> | ||
+ | <div class="gfactivebtn skinsecall">全选<\/div> | ||
+ | <div class="gfactivebtn skinclear">清空<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="600change">600<span class="btntext">EX.<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="200change">200<span class="btntext">EX.<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="100change">100<span class="btntext">EX.<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="NRMB">N<span class="btntext">RMB<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="othertype">特殊<\/div> | ||
+ | <\/div> | ||
+ | <div class="skinbtnbox" style="display: none;"> | ||
+ | <div class="gfactivebtn skinsecall">全选<\/div> | ||
+ | <div class="gfactivebtn skinclear">清空<\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="diamond1" style="width: 120px;">388 ~ 999<span class="btntext">钻石<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="diamond2" style="width: 120px;">1188 ~ 1699<span class="btntext">钻石<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="diamond3" style="width: 120px;">1888 ~ 1999<span class="btntext">钻石<\/span><\/div> | ||
+ | <div class="gfcheckbtn skinbtn buttonStateOn" id="diamond4" style="width: 120px;">2180 ~ 2588<span class="btntext">钻石<\/span><\/div> | ||
+ | <\/div> | ||
+ | <\/div> | ||
+ | |||
+ | <table class="pageControl"><tr><td class="pagePrev">◀ PREV<\/td><td class="pageNumberDiv"><\/td><td class="pageNext">NEXT ▶<\/td><\/tr><\/table> | ||
+ | <div id="displaydiv"><\/div> | ||
+ | <table class="pageControl"><tr><td class="pagePrev">◀ PREV<\/td><td class="pageNumberDiv"><\/td><td class="pageNext">NEXT ▶<\/td><\/tr><\/table>`; | ||
+ | |||
+ | $("#mw-content-text").append(html_text); | ||
+ | |||
+ | $(".suitbtn").click(function(){ | ||
+ | $(".suitbtn").removeClass("buttonStateOn"); | ||
+ | $(this).addClass("buttonStateOn"); | ||
+ | update_skin_display(); | ||
+ | }); | ||
+ | |||
+ | $(".skinbtn").click(function(){ | ||
+ | if($(this).hasClass("buttonStateOn")) $(this).removeClass("buttonStateOn"); | ||
+ | else $(this).addClass("buttonStateOn"); | ||
+ | update_skin_display(); | ||
+ | }); | ||
+ | |||
+ | $("div.skinsecall").click(function(){ | ||
+ | let this_element = $(this).parent("div.skinbtnbox").children("div.skinbtn"); | ||
+ | if(this_element) for(let i = 0; i < this_element.length; i ++ ) | ||
+ | if(!$(this_element[i]).hasClass("buttonStateOn")) $(this_element[i]).addClass("buttonStateOn"); | ||
+ | update_skin_display(); | ||
+ | }); | ||
+ | $("div.skinclear").click(function(){ | ||
+ | let this_element = $(this).parent("div.skinbtnbox").children("div.skinbtn"); | ||
+ | if(this_element) for(let i = 0; i < this_element.length; i ++ ) | ||
+ | if($(this_element[i]).hasClass("buttonStateOn")) $(this_element[i]).removeClass("buttonStateOn"); | ||
+ | update_skin_display(); | ||
+ | }); | ||
+ | |||
+ | $(".pagePrev").click(function(){ | ||
+ | let pageLength = $(".pageNumber").length / 2; | ||
+ | let num = Number($($(".pageChosen")[0]).attr("pageIndex")); | ||
+ | if(num > 0) $("[pageIndex='" + String(num - 1) + "']").click(); | ||
+ | else $("[pageIndex='" + String(pageLength - 1) + "']").click(); | ||
+ | }); | ||
+ | $(".pageNext").click(function(){ | ||
+ | let pageLength = $(".pageNumber").length / 2; | ||
+ | let num = Number($($(".pageChosen")[0]).attr("pageIndex")); | ||
+ | if(num < pageLength - 1) $("[pageIndex='" + String(num + 1) + "']").click(); | ||
+ | else $("[pageIndex='0']").click(); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | function update_skin_display(){ | ||
+ | update_suitChoice(); | ||
+ | if(suitChoice._suitModeFocus_status) creat_suit("skinFocus"); | ||
+ | else if(suitChoice._suitModeGallery_status) creat_suit(); | ||
+ | else if(suitChoice._suitModeCard_status) creat_skin(); | ||
+ | else if(suitChoice._suitModeTheme_status) creat_suit("suitOnly"); | ||
+ | else if(suitChoice._suitModeText_status) creat_suit("textMode"); | ||
+ | |||
+ | |||
+ | creat_interact(); | ||
+ | } | ||
+ | |||
+ | function suit_judge(i){ | ||
+ | let year_pass = false; | ||
+ | let routine_pass = false; | ||
+ | let routine = $(suitElement[i]).attr("data-routine"); | ||
+ | let year = $(suitElement[i]).attr("data-time").slice(0, 4); | ||
+ | |||
+ | if(routine == "2" && suitChoice._typeJp_status) routine_pass = true; | ||
+ | else if(routine == "1" && suitChoice._typeSpring_status) routine_pass = true; | ||
+ | else if(routine == "3" && suitChoice._typeWedding_status) routine_pass = true; | ||
+ | else if(routine == "4" && suitChoice._typeAnniversary_status) routine_pass = true; | ||
+ | else if(routine == "5" && suitChoice._typeChild_status) routine_pass = true; | ||
+ | else if(routine == "6" && suitChoice._typeSwim_status) routine_pass = true; | ||
+ | else if(routine == "7" && suitChoice._typeHallo_status) routine_pass = true; | ||
+ | else if(routine == "8" && suitChoice._typeXmas_status) routine_pass = true; | ||
+ | else if(routine == "9" && suitChoice._typeOther_status) routine_pass = true; | ||
+ | else if(routine == "11" && suitChoice._typeCollaborate_status) routine_pass = true; | ||
+ | else if(routine == "0" && suitChoice._typeSpecial_status) routine_pass = true; | ||
+ | |||
+ | if(year == 2016 && suitChoice._year2016_status) year_pass = true; | ||
+ | else if(year == 2017 && suitChoice._year2017_status) year_pass = true; | ||
+ | else if(year == 2018 && suitChoice._year2018_status) year_pass = true; | ||
+ | else if(year == 2019 && suitChoice._year2019_status) year_pass = true; | ||
+ | else if(year == 2020 && suitChoice._year2020_status) year_pass = true; | ||
+ | else if(year == 2021 && suitChoice._year2021_status) year_pass = true; | ||
+ | else if(year == 2022 && suitChoice._year2022_status) year_pass = true; | ||
+ | else if(year == 2023 && suitChoice._year2023_status) year_pass = true; | ||
+ | else if(year == 2024 && suitChoice._year2024_status) year_pass = true; | ||
+ | |||
+ | if(year_pass && routine_pass) return true | ||
+ | else return false | ||
+ | } | ||
+ | |||
+ | function skin_judge(i, j){ | ||
+ | let anime_pass = false; | ||
+ | let this_anime = $(suitElement[i]).attr("data-anime" + String(j)); | ||
+ | if(!this_anime) this_anime = "Normal"; | ||
+ | if(this_anime == "Live2D" && suitChoice._live2d_status) anime_pass = true; | ||
+ | else if(this_anime == "Animated" && suitChoice._animated_status) anime_pass = true; | ||
+ | else if(this_anime == "Normal" && suitChoice._normal_status) anime_pass = true; | ||
+ | if(!anime_pass) return false | ||
+ | |||
+ | let card_pass = false; | ||
+ | let this_card = $(suitElement[i]).attr("data-bcard" + String(j)); | ||
+ | if(this_card == "3" && suitChoice._3card_status) card_pass = true; | ||
+ | else if(this_card == "5" && suitChoice._5card_status) card_pass = true; | ||
+ | else if(this_card == "8" && suitChoice._8card_status) card_pass = true; | ||
+ | else if(this_card == "0" && suitChoice._xcard_status) card_pass = true; | ||
+ | if(!card_pass) return false | ||
+ | |||
+ | let gain_pass = false; | ||
+ | let this_type = $(suitElement[i]).attr("data-gain" + String(j)); | ||
+ | let this_item = $(suitElement[i]).attr("data-item" + String(j)); | ||
+ | if(this_type == "采购" && this_item == "600" && suitChoice._600change_status) gain_pass = true; | ||
+ | else if(this_type == "采购" && this_item == "200" && suitChoice._200change_status) gain_pass = true; | ||
+ | else if(this_type == "采购" && this_item == "100" && suitChoice._100change_status) gain_pass = true; | ||
+ | else if(this_type == "RMB" && suitChoice._NRMB_status) gain_pass = true; | ||
+ | else if(this_type == "其他" && suitChoice._othertype_status) gain_pass = true; | ||
+ | |||
+ | this_item = Number(this_item); | ||
+ | if(this_type == "钻石" && Number(this_item) >= 388 && Number(this_item) <= 999 && suitChoice._diamond1_status) gain_pass = true; | ||
+ | else if(this_type == "钻石" && Number(this_item) >= 1188 && Number(this_item) <= 1699 && suitChoice._diamond2_status) gain_pass = true; | ||
+ | else if(this_type == "钻石" && Number(this_item) >= 1888 && Number(this_item) <= 1999 && suitChoice._diamond3_status) gain_pass = true; | ||
+ | else if(this_type == "钻石" && Number(this_item) >= 2180 && Number(this_item) <= 2588 && suitChoice._diamond4_status) gain_pass = true; | ||
+ | |||
+ | if(gain_pass) return true | ||
+ | else return false | ||
+ | } | ||
+ | |||
+ | function creat_skin(){ | ||
+ | let skinArray = []; | ||
+ | for(let i = 0; i < suitElement.length; i++){ | ||
+ | if(!suit_judge(i)) continue; | ||
+ | for(let j = 0 ; j < 12; j++) if(skin_judge(i, j)) skinArray.push({'suit':i, 'skin':j}); | ||
+ | } | ||
+ | |||
+ | let skinMax = 50; | ||
+ | creat_page_change(skinArray.length, skinMax); | ||
+ | |||
+ | htmlPageSave = []; | ||
+ | let html_text = ``; | ||
+ | for(let num = 0; num < skinArray.length; num ++){ | ||
+ | html_text += creat_card(skinArray[num].suit, skinArray[num].skin); | ||
+ | |||
+ | if(num % skinMax == skinMax - 1){ | ||
+ | htmlPageSave.push(html_text); | ||
+ | html_text = ``; | ||
+ | } else if(num == skinArray.length - 1){ | ||
+ | htmlPageSave.push(html_text); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | if(htmlPageSave.length) $($(".pageNumber")[0]).click(); | ||
+ | else $("#displaydiv").html(""); | ||
+ | } | ||
+ | |||
+ | function creat_suit(mode){ | ||
+ | let suitArray = []; | ||
+ | for(let i = 0; i < suitElement.length; i++) if(suit_judge(i)) suitArray.push(i); | ||
+ | |||
+ | let suitMax = 8; | ||
+ | creat_page_change(suitArray.length, suitMax); | ||
− | + | htmlPageSave = []; | |
var html_text = ``; | var html_text = ``; | ||
− | for(let | + | for(let num = 0; num < suitArray.length; num++){ |
− | html_text += `<div class="onesuit"><a class="suitname" href=" | + | let i = suitArray[num]; |
− | html_text += `[` + $(suitElement[i]).attr("data-suitname") + `]</a>`; | + | html_text += `<div class="onesuit"><a class="suitname" href="/w/` + $(suitElement[i]).attr("data-suitlink") + `">`; |
+ | html_text += `[` + $(suitElement[i]).attr("data-suitname") + `]<span class="suittime">`; | ||
+ | html_text += $(suitElement[i]).attr("data-time").slice(0, 4) + `年`; | ||
+ | html_text += $(suitElement[i]).attr("data-time").slice(4, 6) + `月`; | ||
+ | html_text += $(suitElement[i]).attr("data-time").slice(6, 8) + `日<\/span><\/a>`; | ||
+ | |||
for(let j = 0 ; j < 12; j++){ | for(let j = 0 ; j < 12; j++){ | ||
− | if(!$(suitElement[i]).attr("data-num" + String(j))) continue; | + | if(!$(suitElement[i]).attr("data-num" + String(j)) || (mode == "suitOnly") || !skin_judge(i, j)) continue; |
+ | if(mode == "textMode") html_text += creat_card_text(i, j); | ||
+ | else html_text += creat_card(i, j, mode); | ||
+ | } | ||
+ | html_text += `<\/div>`; | ||
− | + | if(num % suitMax == suitMax - 1){ | |
− | + | htmlPageSave.push(html_text); | |
− | + | html_text = ``; | |
− | + | } else if(num == suitArray.length - 1){ | |
− | + | htmlPageSave.push(html_text); | |
− | + | } | |
− | + | } | |
+ | |||
+ | if(htmlPageSave.length) $($(".pageNumber")[0]).click(); | ||
+ | else $("#displaydiv").html(""); | ||
+ | } | ||
− | + | function creat_card(i, j, mode){ | |
− | + | let bcard_class = "cardgrey"; | |
− | + | switch($(suitElement[i]).attr("data-bcard" + String(j))){ | |
− | + | case "3" : bcard_class = "cardblue"; break; | |
− | + | case "5" : bcard_class = "cardgreen"; break; | |
− | + | case "8" : bcard_class = "cardorange"; break; | |
− | + | default : bcard_class = "cardgrey"; | |
− | + | } | |
− | + | let bcard_text = $(suitElement[i]).attr("data-bcard" + String(j)); | |
+ | if(Number(bcard_text) == 0) bcard_text = "×"; | ||
− | + | let item_class = "itemgrey"; | |
− | + | let gain_text = `<div class="skingain `; | |
− | + | let item_text = $(suitElement[i]).attr("data-item" + String(j)); | |
− | + | switch($(suitElement[i]).attr("data-gain" + String(j))){ | |
− | + | case "采购" : gain_text += `itemwhite">兑换券<\/div>`; item_class = "itemwhite"; break; | |
− | + | case "钻石" : gain_text += `itemblue">钻石<\/div>`; item_class = "itemblue"; break; | |
+ | case "RMB" : gain_text += `itemred">RMB<\/div>`; item_class = "itemred"; break; | ||
+ | case "其他" : gain_text += `itemgrey">其他<\/div>`; item_class = "itemgrey"; break; | ||
+ | default : gain_text += `itemgrey">error<\/div>`; | ||
+ | } | ||
− | + | let anime_text = ""; | |
− | + | switch($(suitElement[i]).attr("data-anime" + String(j))){ | |
− | + | case "Live2D" : anime_text = `Live2D`; break; | |
− | + | case "Animated" : anime_text = `Animated`; break; | |
− | + | default : anime_text = ""; break; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | $(" | + | let card_text = `<div class="oneskin ` + ((mode == "skinFocus") ? "skinfocus" : bcard_class) + `">`; |
+ | if(!(mode == "textMode")) card_text += `<div class="skinpicndiv" data-pica="${$(suitElement[i]).attr("data-pica" + String(j))}" data-picb="${$(suitElement[i]).attr("data-picb" + String(j))}">`; | ||
+ | if(!(mode == "textMode")) card_text += `<img class="skinpicn" src="` + $(suitElement[i]).attr("data-picn" + String(j)).replace(/ /g,"_") + `" /><\/div>`; | ||
+ | |||
+ | card_text += `<div class="skintext"> | ||
+ | <div class="skindolllink" data-dollname="${$(suitElement[i]).attr("data-doll" + String(j))}"> | ||
+ | <div class="skindoll">` + $(suitElement[i]).attr("data-doll" + String(j)) + `<\/div> | ||
+ | <div class="skinname">` + $(suitElement[i]).attr("data-name" + String(j)) + `<\/div> | ||
+ | <\/div>`; | ||
+ | |||
+ | if(!(mode == "skinFocus")) card_text += `<div class="skinbcard">` + bcard_text + `<\/div>` + gain_text + `<div class="skinitem ` + item_class + `">` + item_text + `<\/div>`; | ||
+ | if(!(mode == "textMode")) card_text += ((anime_text) ? `<div class="skinanime">` + anime_text + `<\/div>` : ``); | ||
+ | card_text += `<\/div><\/div>`; | ||
+ | |||
+ | return card_text; | ||
+ | } | ||
+ | |||
+ | function creat_card_text(i, j){ | ||
+ | let bcard_text = $(suitElement[i]).attr("data-bcard" + String(j)); | ||
+ | let card_text = `<div class="skindolllink skinTextOnly" data-dollname="${$(suitElement[i]).attr("data-doll" + String(j))}">`; | ||
+ | card_text += `<div class="skindoll">` + $(suitElement[i]).attr("data-doll" + String(j)) + `<\/div>`; | ||
+ | card_text += `<div class="skinname">` + $(suitElement[i]).attr("data-name" + String(j)) + `<\/div>`; | ||
+ | card_text += `${(bcard_text == "0") ? "X" : bcard_text}黑卡 ${$(suitElement[i]).attr("data-gain" + String(j))}${$(suitElement[i]).attr("data-item" + String(j))}`; | ||
+ | card_text += `<\/div>`; | ||
+ | return card_text | ||
} | } | ||
− | function | + | function creat_interact(){ |
− | $('. | + | $('.skinpicndiv').click(function(){ |
− | $( | + | $("#skinalbumpic").hide(); |
+ | var img = new Image(); | ||
+ | $(img).load(function(){ $("#skinalbumpic").fadeIn(200);}); | ||
+ | $(img).attr({"src": $(this).attr("data-pica").replace(/ /g,"_")}); | ||
+ | |||
+ | $("#skinalbum").fadeIn(300); | ||
+ | $("#skinalbumpic").attr("data-pica", $(this).attr("data-pica").replace(/ /g,"_")); | ||
+ | $("#skinalbumpic").attr("data-picb", $(this).attr("data-picb").replace(/ /g,"_")); | ||
+ | $("#skinalbumpic").attr("src", $(this).attr("data-pica").replace(/ /g,"_")); | ||
+ | $("#skinalbumpic").attr("state", "a"); | ||
}); | }); | ||
− | $( | + | |
− | $(this). | + | $(".skindolllink").click(function(){ |
+ | let doll_link = "/w/" + $(this).attr("data-dollname"); | ||
+ | window.open(doll_link); | ||
}); | }); | ||
} | } | ||
− | function | + | function creat_album(){ |
− | + | let html_text = `<div id="skinalbum"> | |
− | + | <img id="skinalbumpic" src="" state="a" \/> | |
− | window. | + | <div class="skinalbumbtn" id="skinalbumswitch">⇵<\/div> |
+ | <div class="skinalbumbtn" id="skinalbumclose">×<\/div> | ||
+ | <\/div>`; | ||
+ | |||
+ | let the_width = 1024; | ||
+ | if(window.innerHeight > window.innerWidth) the_width = window.innerWidth; | ||
+ | else the_width = window.innerHeight; | ||
+ | if(the_width > 1024) the_width = 1024; | ||
+ | |||
+ | let album_width = String(the_width - 60) + "px"; | ||
+ | let pic_width = String(the_width - 80) + "px"; | ||
+ | console.log(album_width, pic_width); | ||
+ | |||
+ | $("body").append(html_text); | ||
+ | |||
+ | $("#skinalbum").attr("the_width", the_width); | ||
+ | $("#skinalbum").css({ | ||
+ | "width":album_width, "height":album_width, | ||
+ | "left":(String((window.innerWidth - the_width + 58)/2) + "px"), | ||
+ | "top":(String((window.innerHeight - the_width + 58)/2) + "px") | ||
}); | }); | ||
+ | $("#skinalbumpic").css({"width":pic_width, "height":pic_width}); | ||
+ | |||
+ | $("#skinalbumswitch").click(function(){ | ||
+ | $("#skinalbumpic").fadeOut(200); | ||
+ | |||
+ | setTimeout(function(){ | ||
+ | var img = new Image(); | ||
+ | $(img).load(function(){ $("#skinalbumpic").fadeIn(200);}); | ||
+ | if($("#skinalbumpic").attr("state") == "a"){ | ||
+ | $(img).attr({"src": $("#skinalbumpic").attr("data-picb")}); | ||
+ | $("#skinalbumpic").attr("src", $("#skinalbumpic").attr("data-picb")); | ||
+ | $("#skinalbumpic").attr("state", "b"); | ||
+ | } else { | ||
+ | $(img).attr({"src": $("#skinalbumpic").attr("data-pica")}); | ||
+ | $("#skinalbumpic").attr("src", $("#skinalbumpic").attr("data-pica")); | ||
+ | $("#skinalbumpic").attr("state", "a"); | ||
+ | } | ||
+ | }, 200); | ||
+ | }); | ||
+ | |||
+ | $("#skinalbumclose").click(function(){ | ||
+ | $("#skinalbum").fadeOut(300); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | function creat_page_change(len, max){ | ||
+ | $(".pageNumberDiv").children().remove(); | ||
+ | for(let i = 0; i < Math.ceil(len / max); i++){ | ||
+ | let div_html = `<div class="pageNumber" pageIndex="${i}">${i + 1}<\/div>`; | ||
+ | $(".pageNumberDiv").append(div_html); | ||
+ | } | ||
+ | |||
+ | $(".pageNumber").click(function(){ | ||
+ | let num = Number($(this).attr("pageIndex")) + 1; | ||
+ | |||
+ | $(".pageNumber").removeClass("pageChosen"); | ||
+ | $("[pageIndex='" + String(num - 1) + "']").addClass("pageChosen"); | ||
+ | |||
+ | $("#displaydiv").stop().fadeOut(200); | ||
+ | setTimeout(function(){ | ||
+ | $("#displaydiv").html(htmlPageSave[num - 1]); | ||
+ | creat_interact(); | ||
+ | $("#displaydiv").stop().fadeIn(200); | ||
+ | }, 190); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | function update_suitChoice(){ | ||
+ | suitChoice._suitModeFocus_status = $("#suitModeFocus").hasClass("buttonStateOn"); | ||
+ | suitChoice._suitModeGallery_status = $("#suitModeGallery").hasClass("buttonStateOn"); | ||
+ | suitChoice._suitModeCard_status = $("#suitModeCard").hasClass("buttonStateOn"); | ||
+ | suitChoice._suitModeTheme_status = $("#suitModeTheme").hasClass("buttonStateOn"); | ||
+ | suitChoice._suitModeText_status = $("#suitModeText").hasClass("buttonStateOn"); | ||
+ | |||
+ | suitChoice._year2016_status = $("#suit2016").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2017_status = $("#suit2017").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2018_status = $("#suit2018").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2019_status = $("#suit2019").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2020_status = $("#suit2020").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2021_status = $("#suit2021").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2022_status = $("#suit2022").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2023_status = $("#suit2023").hasClass("buttonStateOn"); | ||
+ | suitChoice._year2024_status = $("#suit2024").hasClass("buttonStateOn"); | ||
+ | |||
+ | suitChoice._typeJp_status = $("#typeJp").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeSpring_status = $("#typeSpring").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeWedding_status = $("#typeWedding").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeAnniversary_status = $("#typeAnniversary").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeChild_status = $("#typeChild").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeSwim_status = $("#typeSwim").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeHallo_status = $("#typeHallo").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeXmas_status = $("#typeXmas").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeCollaborate_status = $("#typeCollaborate").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeSpecial_status = $("#typeSpecial").hasClass("buttonStateOn"); | ||
+ | suitChoice._typeOther_status = $("#typeOther").hasClass("buttonStateOn"); | ||
+ | |||
+ | suitChoice._live2d_status = $("#live2d").hasClass("buttonStateOn"); | ||
+ | suitChoice._animated_status = $("#animated").hasClass("buttonStateOn"); | ||
+ | suitChoice._normal_status = $("#normal").hasClass("buttonStateOn"); | ||
+ | |||
+ | suitChoice._3card_status = $("#3card").hasClass("buttonStateOn"); | ||
+ | suitChoice._5card_status = $("#5card").hasClass("buttonStateOn"); | ||
+ | suitChoice._8card_status = $("#8card").hasClass("buttonStateOn"); | ||
+ | suitChoice._xcard_status = $("#xcard").hasClass("buttonStateOn"); | ||
+ | |||
+ | suitChoice._100change_status = $("#100change").hasClass("buttonStateOn"); | ||
+ | suitChoice._200change_status = $("#200change").hasClass("buttonStateOn"); | ||
+ | suitChoice._600change_status = $("#600change").hasClass("buttonStateOn"); | ||
+ | suitChoice._NRMB_status = $("#NRMB").hasClass("buttonStateOn"); | ||
+ | suitChoice._othertype_status = $("#othertype").hasClass("buttonStateOn"); | ||
+ | suitChoice._diamond1_status = $("#diamond1").hasClass("buttonStateOn"); | ||
+ | suitChoice._diamond2_status = $("#diamond2").hasClass("buttonStateOn"); | ||
+ | suitChoice._diamond3_status = $("#diamond3").hasClass("buttonStateOn"); | ||
+ | suitChoice._diamond4_status = $("#diamond4").hasClass("buttonStateOn"); | ||
} | } | ||
+ | dragFn ("#skinalbum","body"); | ||
}) | }) | ||
</script></includeonly> | </script></includeonly> |