更新

2026-02-17 13:10:05 +08:00 · 2021-01-28 19:30:39 +08:00
parent 7a7ade6355
commit 7a1d3bc69f
38 changed files with 371 additions and 286 deletions
--- a/assets/js/joe.global.js
+++ b/assets/js/joe.global.js
@@ -331,19 +331,6 @@ document.addEventListener('DOMContentLoaded', () => {
        }
    }

-    /* 激活OωO表情 */
-    {
-        new OwO({
-            logo: 'OωO表情',
-            container: document.querySelector('.joe_owo__container'),
-            target: document.querySelector('.joe_owo__target'),
-            api: 'https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/json/owo.json',
-            position: 'down',
-            width: '100%',
-            maxHeight: '250px'
-        });
-    }
-
    /* 懒加载 */
    new LazyLoad('.lazyload');

--- a/assets/js/joe.owo.js
+++ b/assets/js/joe.owo.js
@@ -1 +0,0 @@
-"use strict";function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function e(e,t){for(var a=0;a<t.length;a++){var s=t[a];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}return function(t,a,s){return a&&e(t.prototype,a),s&&e(t,s),t}}();!function(){var e=function(){function e(t){var a=this;_classCallCheck(this,e);var s={logo:"OwO表情",container:document.getElementsByClassName("OwO")[0],target:document.getElementsByTagName("textarea")[0],position:"down",width:"100%",maxHeight:"250px",api:"https://api.anotherhome.net/OwO/OwO.json"};for(var n in s)s.hasOwnProperty(n)&&!t.hasOwnProperty(n)&&(t[n]=s[n]);this.container=t.container,this.target=t.target,"up"===t.position&&this.container.classList.add("OwO-up");var i=new XMLHttpRequest;i.onreadystatechange=function(){4===i.readyState&&(i.status>=200&&i.status<300||304===i.status?(a.odata=JSON.parse(i.responseText),a.init(t)):console.log("OwO data request was unsuccessful: "+i.status))},i.open("get",t.api,!0),i.send(null)}return _createClass(e,[{key:"init",value:function(e){var t=this;this.area=e.target,this.packages=Object.keys(this.odata);for(var a='\n            <div class="OwO-logo"><span>'+e.logo+'</span></div>\n            <div class="OwO-body" style="width: '+e.width+'">',s=0;s<this.packages.length;s++){a+='\n                <ul class="OwO-items OwO-items-'+this.odata[this.packages[s]].type+'" style="max-height: '+(parseInt(e.maxHeight)-53+"px")+';">';for(var n=this.odata[this.packages[s]].container,i=0;i<n.length;i++)a+='\n                    <li class="OwO-item" title="'+n[i].text+'">'+n[i].icon+"</li>";a+="\n                </ul>"}a+='\n                <div class="OwO-bar">\n                    <ul class="OwO-packages">';for(var o=0;o<this.packages.length;o++)a+="\n                        <li><span>"+this.packages[o]+"</span></li>";a+="\n                    </ul>\n                </div>\n            </div>\n            ",this.container.innerHTML=a,this.logo=this.container.getElementsByClassName("OwO-logo")[0],this.logo.addEventListener("click",function(){t.toggle()}),this.container.getElementsByClassName("OwO-body")[0].addEventListener("click",function(e){var a=null;if(e.target.classList.contains("OwO-item")?a=e.target:e.target.parentNode.classList.contains("OwO-item")&&(a=e.target.parentNode),a){var s=t.area.selectionEnd,n=t.area.value;t.area.value=n.slice(0,s)+a.innerHTML+n.slice(s),t.area.focus(),t.toggle()}}),this.packagesEle=this.container.getElementsByClassName("OwO-packages")[0];for(var c=function(e){!function(a){t.packagesEle.children[e].addEventListener("click",function(){t.tab(a)})}(e)},l=0;l<this.packagesEle.children.length;l++)c(l);this.tab(0)}},{key:"toggle",value:function(){this.container.classList.contains("OwO-open")?this.container.classList.remove("OwO-open"):this.container.classList.add("OwO-open")}},{key:"tab",value:function(e){var t=this.container.getElementsByClassName("OwO-items-show")[0];t&&t.classList.remove("OwO-items-show"),this.container.getElementsByClassName("OwO-items")[e].classList.add("OwO-items-show");var a=this.container.getElementsByClassName("OwO-package-active")[0];a&&a.classList.remove("OwO-package-active"),this.packagesEle.getElementsByTagName("li")[e].classList.add("OwO-package-active")}}]),e}();"undefined"!=typeof module&&"undefined"!=typeof module.exports?module.exports=e:window.OwO=e}();
--- a/assets/js/joe.wallpaper.js
+++ b/assets/js/joe.wallpaper.js
@@ -0,0 +1,95 @@
+/* 详情页和独立页面需要用到的JS */
+console.time('Wallpaper.js执行时长');
+
+document.addEventListener('DOMContentLoaded', () => {
+    /* 是否正在请求 */
+    let isLoading = false;
+    /* 查询字段 */
+    let queryData = {
+        cid: '',
+        start: 0,
+        count: 30
+    };
+    /* 总页数 */
+    let total = 0;
+
+    /* 获取壁纸分类 */
+    $.ajax({
+        url: Joe.BASE_API,
+        type: 'POST',
+        data: {
+            routeType: 'wallpaper_type'
+        },
+        success(res) {
+            let htmlStr = '';
+            if (res.code !== 1) return (htmlStr = '<li class="error">壁纸抓取失败！请联系作者！</li>');
+            res.data.forEach(_ => (htmlStr += `<li class="item" data-cid="${_.id}">${_.name}</li>`));
+            $('.joe_wallpaper__type-list').html(htmlStr);
+            $('.joe_wallpaper__type-list .item').first().click();
+            queryData.cid = $('.joe_wallpaper__type-list .item').first().attr('data-cid');
+        }
+    });
+
+    /* 切换类目 */
+    $('.joe_wallpaper__type-list').on('click', '.item', function () {
+        const cid = $(this).attr('data-cid');
+        if (queryData.cid === cid || isLoading) return;
+        $(this).addClass('active').siblings().removeClass('active');
+        queryData.cid = cid;
+        queryData.start = 0;
+        getList();
+    });
+
+    /* 渲染DOM */
+    function getList() {
+        isLoading = true;
+        $('.joe_wallpaper__loading').css('display', 'flex');
+        $('.joe_wallpaper__list').html('');
+        $.ajax({
+            url: Joe.BASE_API,
+            type: 'POST',
+            data: {
+                routeType: 'wallpaper_list',
+                cid: queryData.cid,
+                start: queryData.start,
+                count: queryData.count
+            },
+            success(res) {
+                let htmlStr = '';
+                if (res.code !== 1) return;
+                res.data.forEach(_ => {
+                    htmlStr += `
+                        <a class="item animated bounceIn" data-fancybox="gallery" href="${_.url}">
+                            <img class="wallpaper_lazyload" src="${Joe.LAZY_LOAD}" data-original="${_.img_1024_768}">
+                        </a>`;
+                });
+                $('.joe_wallpaper__list').html(htmlStr);
+                new LazyLoad('.wallpaper_lazyload');
+                total = res.total;
+                isLoading = false;
+                $('.joe_wallpaper__loading').css('display', 'none');
+                initPagination();
+            }
+        });
+    }
+
+    /* 初始化分页 */
+    function initPagination() {
+        let htmlStr = '';
+        if (queryData.start / queryData.count !== 0) htmlStr += `<li class="joe_wallpaper__pagination-item" data-start="${queryData.start - queryData.count}"><svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path d="M822.272 146.944l-396.8 396.8c-19.456 19.456-51.2 19.456-70.656 0-18.944-19.456-18.944-51.2 0-70.656l396.8-396.8c19.456-19.456 51.2-19.456 70.656 0 18.944 19.456 18.944 45.056 0 70.656z" fill="" p-id="9417"></path><path d="M745.472 940.544l-396.8-396.8c-19.456-19.456-19.456-51.2 0-70.656 19.456-19.456 51.2-19.456 70.656 0l403.456 390.144c19.456 25.6 19.456 51.2 0 76.8-26.112 19.968-51.712 19.968-77.312 0.512zM181.248 877.056c0-3.584 0-7.68 0.512-11.264h-0.512V151.552h0.512c-0.512-3.584-0.512-7.168-0.512-11.264 0-43.008 21.504-78.336 48.128-78.336s48.128 34.816 48.128 78.336c0 3.584 0 7.68-0.512 11.264h0.512V865.792h-0.512c0.512 3.584 0.512 7.168 0.512 11.264 0 43.008-21.504 78.336-48.128 78.336s-48.128-35.328-48.128-78.336z"></path></svg></li><li class="joe_wallpaper__pagination-item" data-start="${queryData.start - queryData.count}">${queryData.start / queryData.count}</li>`;
+        htmlStr += `<li class="active joe_wallpaper__pagination-item">${queryData.start / queryData.count + 1}</li>`;
+        if (queryData.start != total) htmlStr += `<li class="joe_wallpaper__pagination-item" data-start="${queryData.start + queryData.count}">${queryData.start / queryData.count + 2}</li>`;
+        if (queryData.start < total) htmlStr += `<li class="joe_wallpaper__pagination-item" data-start="${queryData.start + queryData.count}"><svg class="next" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path d="M822.272 146.944l-396.8 396.8c-19.456 19.456-51.2 19.456-70.656 0-18.944-19.456-18.944-51.2 0-70.656l396.8-396.8c19.456-19.456 51.2-19.456 70.656 0 18.944 19.456 18.944 45.056 0 70.656z" fill="" p-id="9417"></path><path d="M745.472 940.544l-396.8-396.8c-19.456-19.456-19.456-51.2 0-70.656 19.456-19.456 51.2-19.456 70.656 0l403.456 390.144c19.456 25.6 19.456 51.2 0 76.8-26.112 19.968-51.712 19.968-77.312 0.512zM181.248 877.056c0-3.584 0-7.68 0.512-11.264h-0.512V151.552h0.512c-0.512-3.584-0.512-7.168-0.512-11.264 0-43.008 21.504-78.336 48.128-78.336s48.128 34.816 48.128 78.336c0 3.584 0 7.68-0.512 11.264h0.512V865.792h-0.512c0.512 3.584 0.512 7.168 0.512 11.264 0 43.008-21.504 78.336-48.128 78.336s-48.128-35.328-48.128-78.336z"></path></svg></li>`;
+        $('.joe_wallpaper__pagination').html(htmlStr);
+    }
+
+    /* 切换分页 */
+    $('.joe_wallpaper__pagination').on('click', '.joe_wallpaper__pagination-item', function () {
+        const start = $(this).attr('data-start');
+        if (!start || isLoading) return;
+        queryData.start = Number(start);
+        getList();
+    });
+
+    console.timeEnd('Wallpaper.js执行时长');
+});
				`@@ -1 +0,0 @@`
				"use strict";function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function e(e,t){for(var a=0;a<t.length;a++){var s=t[a];s.enumerable=s.enumerable\|\|!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}return function(t,a,s){return a&&e(t.prototype,a),s&&e(t,s),t}}();!function(){var e=function(){function e(t){var a=this;_classCallCheck(this,e);var s={logo:"OwO表情",container:document.getElementsByClassName("OwO")[0],target:document.getElementsByTagName("textarea")[0],position:"down",width:"100%",maxHeight:"250px",api:"https://api.anotherhome.net/OwO/OwO.json"};for(var n in s)s.hasOwnProperty(n)&&!t.hasOwnProperty(n)&&(t[n]=s[n]);this.container=t.container,this.target=t.target,"up"===t.position&&this.container.classList.add("OwO-up");var i=new XMLHttpRequest;i.onreadystatechange=function(){4===i.readyState&&(i.status>=200&&i.status<300\|\|304===i.status?(a.odata=JSON.parse(i.responseText),a.init(t)):console.log("OwO data request was unsuccessful: "+i.status))},i.open("get",t.api,!0),i.send(null)}return _createClass(e,[{key:"init",value:function(e){var t=this;this.area=e.target,this.packages=Object.keys(this.odata);for(var a='\n <div class="OwO-logo"><span>'+e.logo+'</span></div>\n <div class="OwO-body" style="width: '+e.width+'">',s=0;s<this.packages.length;s++){a+='\n <ul class="OwO-items OwO-items-'+this.odata[this.packages[s]].type+'" style="max-height: '+(parseInt(e.maxHeight)-53+"px")+';">';for(var n=this.odata[this.packages[s]].container,i=0;i<n.length;i++)a+='\n <li class="OwO-item" title="'+n[i].text+'">'+n[i].icon+"</li>";a+="\n </ul>"}a+='\n <div class="OwO-bar">\n <ul class="OwO-packages">';for(var o=0;o<this.packages.length;o++)a+="\n <li><span>"+this.packages[o]+"</span></li>";a+="\n </ul>\n </div>\n </div>\n ",this.container.innerHTML=a,this.logo=this.container.getElementsByClassName("OwO-logo")[0],this.logo.addEventListener("click",function(){t.toggle()}),this.container.getElementsByClassName("OwO-body")[0].addEventListener("click",function(e){var a=null;if(e.target.classList.contains("OwO-item")?a=e.target:e.target.parentNode.classList.contains("OwO-item")&&(a=e.target.parentNode),a){var s=t.area.selectionEnd,n=t.area.value;t.area.value=n.slice(0,s)+a.innerHTML+n.slice(s),t.area.focus(),t.toggle()}}),this.packagesEle=this.container.getElementsByClassName("OwO-packages")[0];for(var c=function(e){!function(a){t.packagesEle.children[e].addEventListener("click",function(){t.tab(a)})}(e)},l=0;l<this.packagesEle.children.length;l++)c(l);this.tab(0)}},{key:"toggle",value:function(){this.container.classList.contains("OwO-open")?this.container.classList.remove("OwO-open"):this.container.classList.add("OwO-open")}},{key:"tab",value:function(e){var t=this.container.getElementsByClassName("OwO-items-show")[0];t&&t.classList.remove("OwO-items-show"),this.container.getElementsByClassName("OwO-items")[e].classList.add("OwO-items-show");var a=this.container.getElementsByClassName("OwO-package-active")[0];a&&a.classList.remove("OwO-package-active"),this.packagesEle.getElementsByTagName("li")[e].classList.add("OwO-package-active")}}]),e}();"undefined"!=typeof module&&"undefined"!=typeof module.exports?module.exports=e:window.OwO=e}();