1.9.5

README.md

@@ -240,9 +240,6 @@ katex:
 # since year
 since: 2019
 
-# pageFooter (Set true can let more people know this theme, Thanks!)
-pageFooter: true
-
 # only for chinese website
 # ICP
 icp:
@@ -324,6 +321,11 @@ ads:
     img: https://cdn.jsdelivr.net/gh/Shen-Yu/cdn/img/ten_2.jpg
     url: https://curl.qcloud.com/kvO7hb43
     width: 300
+
+# encrypt settings
+lock:
+  enable: false
+  password: 123456
 ```
 
 ## Plugins

_config.yml

@@ -166,9 +166,6 @@ mermaid:
 # 网站成立年份(默认为 2019，若填入年份小于当前年份，则显示为 2018-2019 类似的格式)
 since: 2015
 
-# 是否显示页脚信息(建议保留)
-pageFooter: true
-
 # ICP备案信息尾部显示
 icp:
   enable: false
@@ -251,3 +248,8 @@ ads:
     img: https://cdn.jsdelivr.net/gh/Shen-Yu/cdn/img/vultr.png
     url: https://www.vultr.com/?ref=8630075
     width: 300
+
+# 网站开启加密访问，密码可设置任何字符
+lock:
+  enable: false
+  password: 123456

languages/de.yml

@@ -30,3 +30,9 @@ post:
   sticky: Oben
   copyright_title: Copyright-Hinweis
   copyright_content: Sofern nicht anders angegeben, liegt das Urheberrecht aller Artikel in diesem Blog beim Autor. Nachdruck bitte Quelle angeben!
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/default.yml

@@ -30,3 +30,9 @@ post:
   sticky: Sticky
   copyright_title: Copyright
   copyright_content: Copyright is owned by the author. For commercial reprints, please contact the author for authorization. For non-commercial reprints, please indicate the source.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/en.yml

@@ -30,3 +30,9 @@ post:
   sticky: Sticky
   copyright_title: Copyright
   copyright_content: Copyright is owned by the author. For commercial reprints, please contact the author for authorization. For non-commercial reprints, please indicate the source.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/es.yml

@@ -30,3 +30,9 @@ post:
   sticky: Arriba
   copyright_title: Derechos de autor
   copyright_content: Los derechos de autor son propiedad del autor. Para reimpresiones comerciales, comuníquese con el autor para obtener autorización. Para reimpresiones no comerciales, indique la fuente.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/fr.yml

@@ -30,3 +30,9 @@ post:
   sticky: Haut
   copyright_title: Avis de copyright
   copyright_content: Le droit d'auteur appartient à l'auteur. Pour les réimpressions commerciales, veuillez contacter l'auteur pour autorisation. Pour les réimpressions non commerciales, veuillez indiquer la source.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/ja.yml

@@ -30,3 +30,9 @@ post:
   sticky: 上へ
   copyright_title: 著作権表示
   copyright_content: 著作権は著者が所有しています。商業版の複製については、承認について著者に連絡してください。非商業版の複製については、出典を明記してください。
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/ko.yml

@@ -30,3 +30,9 @@ post:
   sticky: 톱
   copyright_title: 저작권 고지
   copyright_content: 저작권은 저자가 소유합니다. 상업용 재 인쇄의 경우 승인을 위해 저자에게 문의하십시오. 비상업적 재 인쇄의 경우 출처를 명시하십시오.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/nl.yml

@@ -30,3 +30,9 @@ post:
   sticky: Sticky
   copyright_title: Copyright melding
   copyright_content: Copyright is eigendom van de auteur. Neem voor commerciële herdrukken contact op met de auteur voor autorisatie. Geef de bron aan voor niet-commerciële herdrukken.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/no.yml

@@ -30,3 +30,9 @@ post:
   sticky: Sticky
   copyright_title: Opphavsrett
   copyright_content: Opphavsrett eies av forfatteren. For kommersielle opptrykk, vennligst kontakt forfatteren for godkjenning. For ikke-kommersiell uttrykk, vennligst oppgi kilden.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/pt.yml

@@ -30,3 +30,9 @@ post:
   sticky: Sticky
   copyright_title: direito autoral
   copyright_content: Os direitos autorais são de propriedade do autor. Para reimpressões comerciais, entre em contato com o autor para obter autorização. Para reimpressões não comerciais, indique a fonte.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/ru.yml

@@ -30,3 +30,9 @@ post:
   sticky: липкий
   copyright_title: Авторские права
   copyright_content: Авторские права принадлежат автору. Для коммерческих перепечаток, пожалуйста, свяжитесь с автором для авторизации. Для некоммерческих перепечаток, пожалуйста, укажите источник.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/vi.yml

@@ -30,3 +30,9 @@ post:
   sticky: dính
   copyright_title: Bản quyền
   copyright_content: Bản quyền thuộc sở hữu của tác giả. Đối với tái bản thương mại, xin vui lòng liên hệ với tác giả cho phép. Đối với tái bản phi thương mại, xin vui lòng cho biết nguồn.
+
+lock:
+  lock_info: Please enter password
+  lock_error: Incorrect password, please try again
+  confirm_text: Ok
+  cancel_text: Cancel

languages/zh-CN.yml

@@ -30,3 +30,9 @@ post:
   sticky: 置顶
   copyright_title: 版权声明
   copyright_content: 本博客所有文章除特别声明外，著作权归作者所有。转载请注明出处！
+
+lock:
+  lock_info: 请输入访问密码
+  lock_error: 密码错误，请重试
+  confirm_text: 确定
+  cancel_text: 取消

languages/zh-TW.yml

@@ -30,3 +30,9 @@ post:
   sticky: 置頂
   copyright_title: 版權聲明
   copyright_content: 本博客所有文章除特別聲明外，著作權歸作者所有。轉載請註明出處！
+
+lock:
+  lock_info: 請輸入訪問密碼
+  lock_error: 密碼錯誤，請重試
+  confirm_text: 確定
+  cancel_text: 取消

layout/_partial/after-footer.ejs

@@ -1,4 +1,4 @@
-<%- js('/js/jquery-2.0.3.min') %> <%- js('/js/lazyload.min') %>
+<%- js('/js/jquery-3.6.0.min') %> <%- js('/js/lazyload.min') %>
 <!-- Tocbot -->
 <% if (theme.toc && is_post() && !page.no_toc){ %> <%- js('/js/tocbot.min') %>
 <script>

layout/_partial/head.ejs

@@ -40,10 +40,21 @@
       <script src="https://cdn.jsdelivr.net/npm/pace-js@1.0.2/pace.min.js"></script>
       <% } %> <%- partial('google-analytics') %> <%- partial('baidu-analytics')
       %>
+      <link
+        rel="stylesheet"
+        href="https://cdn.jsdelivr.net/npm/@sweetalert2/theme-bulma@5.0.1/bulma.min.css"
+      />
+      <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.19/dist/sweetalert2.min.js"></script>
+
       <!-- mermaid -->
       <% if (theme.mermaid.enable) { %>
       <script src="<%= theme.mermaid.cdn %>"></script>
       <% } %>
+      <style>
+        .swal2-styled.swal2-confirm {
+          font-size: 1.6rem;
+        }
+      </style>
     </head>
   </html>
 </html>

layout/_partial/lock.ejs

@@ -0,0 +1,37 @@
+<% if (theme.lock.enable){ %>
+<script>
+  const password = "<%= theme.lock.password %>";
+  const lock_password = window.sessionStorage.getItem("lock_password");
+  console.log(password, lock_password);
+  if (lock_password !== password) {
+    Swal.fire({
+      title: "<%= __('lock.lock_info') %>",
+      input: "text",
+      inputAttributes: {
+        autocapitalize: "off",
+      },
+      showCancelButton: false,
+      showLoaderOnConfirm: true,
+      allowOutsideClick: false,
+      confirmButtonText: "<%= __('lock.confirm_text') %>",
+    }).then((result) => {
+      console.log(result);
+      if (result.isConfirmed) {
+        console.log(password);
+        if (result.value === password) {
+          window.sessionStorage.setItem("lock_password", result.value);
+        } else {
+          Swal.fire({
+            icon: "error",
+            title: "<%= __('lock.lock_error') %>",
+            confirmButtonText: "<%= __('lock.confirm_text') %>",
+            allowOutsideClick: false,
+          }).then(() => {
+            window.location.reload();
+          });
+        }
+      }
+    });
+  }
+</script>
+<% } %>

layout/layout.ejs

@@ -21,10 +21,10 @@
     <main class="content on">
       <%- body %>
       <%- partial('_partial/footer', null, {cache: !config.relative_link}) %>    
-      <div class="float_btns">
-        <%- partial('_partial/totop') %>
-      </div>
     </main>
+    <div class="float_btns">
+      <%- partial('_partial/float-btns') %>
+    </div>
     <aside class="sidebar on">
       <%- partial('_partial/sidebar') %>
     </aside>
@@ -34,6 +34,7 @@
     <% if (theme.music&&theme.music.enable){ %>
     <%- partial('_partial/music') %>
     <% } %>
+    <%- partial('_partial/lock') %>
   </div>
 </body>
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-ayer",
-  "version": "1.9.2-0",
+  "version": "1.9.5",
   "description": "a clean and elegant theme for hexo.",
   "scripts": {
     "dev": "rollup -c -w",

source-src/js/ayer.js

@@ -15,7 +15,7 @@
     }, searchAnimDuration);
   };
 
-  $(".nav-item-search").click(() => {
+  $(".nav-item-search").on("click", () => {
     if (isSearchAnim) return;
     startSearchAnim();
     $searchWrap.addClass("on");
@@ -24,7 +24,7 @@
     });
   });
 
-  $(document).mouseup((e) => {
+  $(document).on("mouseup", (e) => {
     const _con = $(".local-search");
     if (!_con.is(e.target) && _con.has(e.target).length === 0) {
       $searchWrap.removeClass("on");
@@ -32,7 +32,7 @@
   });
 
   // Not recommended in mobile, /search.xml is actually large.
-  if ($(".local-search").size()) {
+  if ($(".local-search").length) {
     $.getScript("/js/search.js", function () {
       searchFunc("/search.xml", "local-search-input", "local-search-result");
     });
@@ -67,7 +67,7 @@
   };
 
   // Share
-  $(".share-outer").click(() => $(".share-wrap").fadeToggle());
+  $(".share-outer").on("click", () => $(".share-wrap").fadeToggle());
 
   // Lazyload
   $("img.lazy").lazyload({
@@ -82,7 +82,7 @@
 
   // ScrollDown
   $(document).ready(function ($) {
-    $(".anchor").click(function (e) {
+    $(".anchor").on("click", function (e) {
       e.preventDefault();
       $("main").animate({ scrollTop: $(".cover").height() }, "smooth");
     });
@@ -102,7 +102,7 @@
 
     // Show and hide the scroll to top link based on scroll position
     scrollElem.hide();
-    $(".content").scroll(function () {
+    $(".content").on("scroll", () => {
       const scrollTop = $(".content").scrollTop();
       if (scrollTop > upperLimit) {
         $(scrollElem).stop().fadeTo(200, 0.6); // fade back in
@@ -112,7 +112,7 @@
     });
 
     // Scroll to top animation on click
-    $(scrollElem).click(function () {
+    $(scrollElem).on("click", () => {
       $(".content").animate({ scrollTop: 0 }, scrollSpeed);
       return false;
     });
@@ -135,18 +135,18 @@
   const $content = $(".content"),
     $sidebar = $(".sidebar");
 
-  $(".navbar-toggle").on("click", function () {
+  $(".navbar-toggle").on("click", () => {
     $(".content,.sidebar").addClass("anim");
     $content.toggleClass("on");
     $sidebar.toggleClass("on");
   });
 
   // Reward
-  $("#reward-btn").click(() => {
+  $("#reward-btn").on("click", () => {
     $("#reward").fadeIn(150);
     $("#mask").fadeIn(150);
   });
-  $("#reward .close, #mask").click(() => {
+  $("#reward .close, #mask").on("click", () => {
     $("#mask").fadeOut(100);
     $("#reward").fadeOut(100);
   });
@@ -159,7 +159,7 @@
     $("body").removeClass("darkmode");
     $("#todark i").removeClass("ri-sun-line").addClass("ri-moon-line");
   }
-  $("#todark").click(() => {
+  $("#todark").on("click", () => {
     if (sessionStorage.getItem("darkmode") == 1) {
       $("body").removeClass("darkmode");
       $("#todark i").removeClass("ri-sun-line").addClass("ri-moon-line");

source/dist/main.js

@@ -1 +1 @@
-!function(){"use strict";var e;function t(e,t){e=e.replace(/<%-sUrl%>/g,encodeURIComponent(t.sUrl)).replace(/<%-sTitle%>/g,encodeURIComponent(t.sTitle)).replace(/<%-sDesc%>/g,encodeURIComponent(t.sDesc)).replace(/<%-sPic%>/g,encodeURIComponent(t.sPic));window.open(e)}function o(){$(".wx-share-modal").removeClass("in ready"),$("#share-mask").hide()}function s(e,o){"weibo"===e?t("http://service.weibo.com/share/share.php?url=<%-sUrl%>&title=<%-sTitle%>&pic=<%-sPic%>",o):"qq"===e?t("http://connect.qq.com/widget/shareqq/index.html?url=<%-sUrl%>&title=<%-sTitle%>&source=<%-sDesc%>",o):"douban"===e?t("https://www.douban.com/share/service?image=<%-sPic%>&href=<%-sUrl%>&name=<%-sTitle%>&text=<%-sDesc%>",o):"qzone"===e?t("http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=<%-sUrl%>&title=<%-sTitle%>&pics=<%-sPic%>&summary=<%-sDesc%>",o):"facebook"===e?t("https://www.facebook.com/sharer/sharer.php?u=<%-sUrl%>",o):"twitter"===e?t("https://twitter.com/intent/tweet?text=<%-sTitle%>&url=<%-sUrl%>",o):"google"===e?t("https://plus.google.com/share?url=<%-sUrl%>",o):"weixin"===e&&($(".wx-share-modal").addClass("in ready"),$("#share-mask").show())}!function(e){let t=e(".search-form-wrap"),o=!1;e(".nav-item-search").click((()=>{var s;o||(o=!0,t.addClass("on"),s=function(){e(".local-search-input").focus()},setTimeout((function(){o=!1,s&&s()}),200))})),e(document).mouseup((o=>{const s=e(".local-search");s.is(o.target)||0!==s.has(o.target).length||t.removeClass("on")})),e(".local-search").size()&&e.getScript("/js/search.js",(function(){searchFunc("/search.xml","local-search-input","local-search-result")})),e(".share-outer").click((()=>e(".share-wrap").fadeToggle())),e("img.lazy").lazyload({effect:"fadeIn"}),e("#gallery").justifiedGallery({rowHeight:200,margins:5}),e(document).ready((function(e){e(".anchor").click((function(t){t.preventDefault(),e("main").animate({scrollTop:e(".cover").height()},"smooth")}))})),(()=>{const t=e("#totop");t.hide(),e(".content").scroll((function(){e(".content").scrollTop()>1e3?e(t).stop().fadeTo(200,.6):e(t).stop().fadeTo(200,0)})),e(t).click((function(){return e(".content").animate({scrollTop:0},1e3),!1}))})(),e(".article-entry").each((function(t){e(this).find("img").each((function(){if(e(this).parent().is("a"))return;const{alt:t}=this;t&&e(this).after('<span class="caption">'+t+"</span>")}))}));const s=e(".content"),r=e(".sidebar");e(".navbar-toggle").on("click",(function(){e(".content,.sidebar").addClass("anim"),s.toggleClass("on"),r.toggleClass("on")})),e("#reward-btn").click((()=>{e("#reward").fadeIn(150),e("#mask").fadeIn(150)})),e("#reward .close, #mask").click((()=>{e("#mask").fadeOut(100),e("#reward").fadeOut(100)})),1==sessionStorage.getItem("darkmode")?(e("body").addClass("darkmode"),e("#todark i").removeClass("ri-moon-line").addClass("ri-sun-line")):(e("body").removeClass("darkmode"),e("#todark i").removeClass("ri-sun-line").addClass("ri-moon-line")),e("#todark").click((()=>{1==sessionStorage.getItem("darkmode")?(e("body").removeClass("darkmode"),e("#todark i").removeClass("ri-sun-line").addClass("ri-moon-line"),sessionStorage.removeItem("darkmode")):(e("body").addClass("darkmode"),e("#todark i").removeClass("ri-moon-line").addClass("ri-sun-line"),sessionStorage.setItem("darkmode",1))}));console.log("%c%s%c%s%c%s","background-color: #49b1f5; color: #fff; padding: 8px; font-size: 14px;","主题不错？⭐star 支持一下 ->","background-color: #ffbca2; padding: 8px; font-size: 14px;","https://github.com/Shen-Yu/hexo-theme-ayer","background-color: #eaf8ff;","\n\n     _ __   _______ _____    \n    / \\ \\ \\ / / ____|  _  \\  \n   / _ \\ \\ V /|  _| | |_) |  \n  / ___ \\ | | | |___|  _ <   \n /_/   \\_\\ _| |_____|_| \\__\\ \n")}(jQuery),e={id:"JGjrOr2rebvP6q2a",ck:"JGjrOr2rebvP6q2a"},function(t){var o=window,s=document,r=e,a="".concat("https:"===s.location.protocol?"https://":"http://","sdk.51.la/js-sdk-pro.min.js"),n=s.createElement("script"),c=s.getElementsByTagName("script")[0];n.type="text/javascript",n.setAttribute("charset","UTF-8"),n.async=!0,n.src=a,n.id="LA_COLLECT",r.d=n;var i=function(){o.LA.ids.push(r)};o.LA?o.LA.ids&&i():(o.LA=e,o.LA.ids=[],i()),c.parentNode.insertBefore(n,c)}();(()=>{let e=document.querySelectorAll(".share-sns");if(!e||0===e.length)return;let t=window.location.href,r=document.querySelector("title").innerHTML,a=document.querySelectorAll(".article-entry img").length?document.querySelector(".article-entry img").getAttribute("src"):"";""===a||/^(http:|https:)?\/\//.test(a)||(a=window.location.origin+a),e.forEach((e=>{e.onclick=o=>{s(e.getAttribute("data-type"),{sUrl:t,sPic:a,sTitle:r,sDesc:r})}})),document.querySelector("#mask").onclick=o,document.querySelector(".modal-close").onclick=o})()}();
+!function(){"use strict";var e;function t(e,t){e=e.replace(/<%-sUrl%>/g,encodeURIComponent(t.sUrl)).replace(/<%-sTitle%>/g,encodeURIComponent(t.sTitle)).replace(/<%-sDesc%>/g,encodeURIComponent(t.sDesc)).replace(/<%-sPic%>/g,encodeURIComponent(t.sPic));window.open(e)}function o(){$(".wx-share-modal").removeClass("in ready"),$("#share-mask").hide()}function s(e,o){"weibo"===e?t("http://service.weibo.com/share/share.php?url=<%-sUrl%>&title=<%-sTitle%>&pic=<%-sPic%>",o):"qq"===e?t("http://connect.qq.com/widget/shareqq/index.html?url=<%-sUrl%>&title=<%-sTitle%>&source=<%-sDesc%>",o):"douban"===e?t("https://www.douban.com/share/service?image=<%-sPic%>&href=<%-sUrl%>&name=<%-sTitle%>&text=<%-sDesc%>",o):"qzone"===e?t("http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=<%-sUrl%>&title=<%-sTitle%>&pics=<%-sPic%>&summary=<%-sDesc%>",o):"facebook"===e?t("https://www.facebook.com/sharer/sharer.php?u=<%-sUrl%>",o):"twitter"===e?t("https://twitter.com/intent/tweet?text=<%-sTitle%>&url=<%-sUrl%>",o):"google"===e?t("https://plus.google.com/share?url=<%-sUrl%>",o):"weixin"===e&&($(".wx-share-modal").addClass("in ready"),$("#share-mask").show())}!function(e){let t=e(".search-form-wrap"),o=!1;e(".nav-item-search").on("click",(()=>{var s;o||(o=!0,t.addClass("on"),s=function(){e(".local-search-input").focus()},setTimeout((function(){o=!1,s&&s()}),200))})),e(document).on("mouseup",(o=>{const s=e(".local-search");s.is(o.target)||0!==s.has(o.target).length||t.removeClass("on")})),e(".local-search").length&&e.getScript("/js/search.js",(function(){searchFunc("/search.xml","local-search-input","local-search-result")})),e(".share-outer").on("click",(()=>e(".share-wrap").fadeToggle())),e("img.lazy").lazyload({effect:"fadeIn"}),e("#gallery").justifiedGallery({rowHeight:200,margins:5}),e(document).ready((function(e){e(".anchor").on("click",(function(t){t.preventDefault(),e("main").animate({scrollTop:e(".cover").height()},"smooth")}))})),(()=>{const t=e("#totop");t.hide(),e(".content").on("scroll",(()=>{e(".content").scrollTop()>1e3?e(t).stop().fadeTo(200,.6):e(t).stop().fadeTo(200,0)})),e(t).on("click",(()=>(e(".content").animate({scrollTop:0},1e3),!1)))})(),e(".article-entry").each((function(t){e(this).find("img").each((function(){if(e(this).parent().is("a"))return;const{alt:t}=this;t&&e(this).after('<span class="caption">'+t+"</span>")}))}));const s=e(".content"),r=e(".sidebar");e(".navbar-toggle").on("click",(()=>{e(".content,.sidebar").addClass("anim"),s.toggleClass("on"),r.toggleClass("on")})),e("#reward-btn").on("click",(()=>{e("#reward").fadeIn(150),e("#mask").fadeIn(150)})),e("#reward .close, #mask").on("click",(()=>{e("#mask").fadeOut(100),e("#reward").fadeOut(100)})),1==sessionStorage.getItem("darkmode")?(e("body").addClass("darkmode"),e("#todark i").removeClass("ri-moon-line").addClass("ri-sun-line")):(e("body").removeClass("darkmode"),e("#todark i").removeClass("ri-sun-line").addClass("ri-moon-line")),e("#todark").on("click",(()=>{1==sessionStorage.getItem("darkmode")?(e("body").removeClass("darkmode"),e("#todark i").removeClass("ri-sun-line").addClass("ri-moon-line"),sessionStorage.removeItem("darkmode")):(e("body").addClass("darkmode"),e("#todark i").removeClass("ri-moon-line").addClass("ri-sun-line"),sessionStorage.setItem("darkmode",1))}));console.log("%c%s%c%s%c%s","background-color: #49b1f5; color: #fff; padding: 8px; font-size: 14px;","主题不错？⭐star 支持一下 ->","background-color: #ffbca2; padding: 8px; font-size: 14px;","https://github.com/Shen-Yu/hexo-theme-ayer","background-color: #eaf8ff;","\n\n     _ __   _______ _____    \n    / \\ \\ \\ / / ____|  _  \\  \n   / _ \\ \\ V /|  _| | |_) |  \n  / ___ \\ | | | |___|  _ <   \n /_/   \\_\\ _| |_____|_| \\__\\ \n")}(jQuery),e={id:"JGjrOr2rebvP6q2a",ck:"JGjrOr2rebvP6q2a"},function(t){var o=window,s=document,r=e,n="".concat("https:"===s.location.protocol?"https://":"http://","sdk.51.la/js-sdk-pro.min.js"),a=s.createElement("script"),c=s.getElementsByTagName("script")[0];a.type="text/javascript",a.setAttribute("charset","UTF-8"),a.async=!0,a.src=n,a.id="LA_COLLECT",r.d=a;var i=function(){o.LA.ids.push(r)};o.LA?o.LA.ids&&i():(o.LA=e,o.LA.ids=[],i()),c.parentNode.insertBefore(a,c)}();(()=>{let e=document.querySelectorAll(".share-sns");if(!e||0===e.length)return;let t=window.location.href,r=document.querySelector("title").innerHTML,n=document.querySelectorAll(".article-entry img").length?document.querySelector(".article-entry img").getAttribute("src"):"";""===n||/^(http:|https:)?\/\//.test(n)||(n=window.location.origin+n),e.forEach((e=>{e.onclick=o=>{s(e.getAttribute("data-type"),{sUrl:t,sPic:n,sTitle:r,sDesc:r})}})),document.querySelector("#mask").onclick=o,document.querySelector(".modal-close").onclick=o})()}();

source/js/clickBoom1.js

@@ -18,134 +18,134 @@ let pointerX = 0;
 let pointerY = 0;
 
 let tap =
-    "ontouchstart" in window || navigator.msMaxTouchPoints
-        ? "touchstart"
-        : "mousedown";
+  "ontouchstart" in window || navigator.msMaxTouchPoints
+    ? "touchstart"
+    : "mousedown";
 
 // sea blue
 let colors = ["127, 180, 226", "157, 209, 243", "204, 229, 255"];
 
 function setCanvasSize() {
-    canvasEl.width = window.innerWidth;
-    canvasEl.height = window.innerHeight;
-    canvasEl.style.width = window.innerWidth + "px";
-    canvasEl.style.height = window.innerHeight + "px";
+  canvasEl.width = window.innerWidth;
+  canvasEl.height = window.innerHeight;
+  canvasEl.style.width = window.innerWidth + "px";
+  canvasEl.style.height = window.innerHeight + "px";
 }
 
 function updateCoords(e) {
-    pointerX = e.clientX || e.touches[0].clientX;
-    pointerY = e.clientY || e.touches[0].clientY;
+  pointerX = e.clientX || e.touches[0].clientX;
+  pointerY = e.clientY || e.touches[0].clientY;
 }
 
 function setParticuleDirection(p) {
-    let angle = (anime.random(0, 360) * Math.PI) / 180;
-    let value = anime.random(minDiffuseRadius, maxDiffuseRadius);
-    let radius = [-1, 1][anime.random(0, 1)] * value;
-    return {
-        x: p.x + radius * Math.cos(angle),
-        y: p.y + radius * Math.sin(angle)
-    };
+  let angle = (anime.random(0, 360) * Math.PI) / 180;
+  let value = anime.random(minDiffuseRadius, maxDiffuseRadius);
+  let radius = [-1, 1][anime.random(0, 1)] * value;
+  return {
+    x: p.x + radius * Math.cos(angle),
+    y: p.y + radius * Math.sin(angle),
+  };
 }
 
 function createParticule(x, y) {
-    let p = {};
-    p.x = x;
-    p.y = y;
-    p.color =
-        "rgba(" +
-        colors[anime.random(0, colors.length - 1)] +
-        "," +
-        anime.random(0.2, 0.8) +
-        ")";
-    p.radius = anime.random(minCircleRadius, maxCircleRadius);
-    p.endPos = setParticuleDirection(p);
-    p.draw = function () {
-        ctx.beginPath();
-        ctx.arc(p.x, p.y, p.radius, 0, 2 * Math.PI, true);
-        ctx.fillStyle = p.color;
-        ctx.fill();
-    };
-    return p;
+  let p = {};
+  p.x = x;
+  p.y = y;
+  p.color =
+    "rgba(" +
+    colors[anime.random(0, colors.length - 1)] +
+    "," +
+    anime.random(0.2, 0.8) +
+    ")";
+  p.radius = anime.random(minCircleRadius, maxCircleRadius);
+  p.endPos = setParticuleDirection(p);
+  p.draw = function () {
+    ctx.beginPath();
+    ctx.arc(p.x, p.y, p.radius, 0, 2 * Math.PI, true);
+    ctx.fillStyle = p.color;
+    ctx.fill();
+  };
+  return p;
 }
 
 function createCircle(x, y) {
-    let p = {};
-    p.x = x;
-    p.y = y;
-    p.color = "#000";
-    p.radius = 0.1;
-    p.alpha = 0.5;
-    p.lineWidth = 6;
-    p.draw = function () {
-        ctx.globalAlpha = p.alpha;
-        ctx.beginPath();
-        ctx.arc(p.x, p.y, p.radius, 0, 2 * Math.PI, true);
-        ctx.lineWidth = p.lineWidth;
-        ctx.strokeStyle = p.color;
-        ctx.stroke();
-        ctx.globalAlpha = 1;
-    };
-    return p;
+  let p = {};
+  p.x = x;
+  p.y = y;
+  p.color = "#000";
+  p.radius = 0.1;
+  p.alpha = 0.5;
+  p.lineWidth = 6;
+  p.draw = function () {
+    ctx.globalAlpha = p.alpha;
+    ctx.beginPath();
+    ctx.arc(p.x, p.y, p.radius, 0, 2 * Math.PI, true);
+    ctx.lineWidth = p.lineWidth;
+    ctx.strokeStyle = p.color;
+    ctx.stroke();
+    ctx.globalAlpha = 1;
+  };
+  return p;
 }
 
 function renderParticule(anim) {
-    for (let i = 0; i < anim.animatables.length; i++) {
-        anim.animatables[i].target.draw();
-    }
+  for (let i = 0; i < anim.animatables.length; i++) {
+    anim.animatables[i].target.draw();
+  }
 }
 
 function animateParticules(x, y) {
-    let circle = createCircle(x, y);
-    let particules = [];
-    for (let i = 0; i < numberOfParticules; i++) {
-        particules.push(createParticule(x, y));
-    }
-    anime
-        .timeline()
-        .add({
-            targets: particules,
-            x: function (p) {
-                return p.endPos.x;
-            },
-            y: function (p) {
-                return p.endPos.y;
-            },
-            radius: 0.1,
-            duration: anime.random(minAnimeDuration, maxAnimeDuration),
-            easing: "easeOutExpo",
-            update: renderParticule
-        })
-        .add({
-            targets: circle,
-            radius: anime.random(minOrbitRadius, maxOrbitRadius),
-            lineWidth: 0,
-            alpha: {
-                value: 0,
-                easing: "linear",
-                duration: anime.random(600, 800)
-            },
-            duration: anime.random(1200, 1800),
-            easing: "easeOutExpo",
-            update: renderParticule,
-            offset: 0
-        });
+  let circle = createCircle(x, y);
+  let particules = [];
+  for (let i = 0; i < numberOfParticules; i++) {
+    particules.push(createParticule(x, y));
+  }
+  anime
+    .timeline()
+    .add({
+      targets: particules,
+      x: function (p) {
+        return p.endPos.x;
+      },
+      y: function (p) {
+        return p.endPos.y;
+      },
+      radius: 0.1,
+      duration: anime.random(minAnimeDuration, maxAnimeDuration),
+      easing: "easeOutExpo",
+      update: renderParticule,
+    })
+    .add({
+      targets: circle,
+      radius: anime.random(minOrbitRadius, maxOrbitRadius),
+      lineWidth: 0,
+      alpha: {
+        value: 0,
+        easing: "linear",
+        duration: anime.random(600, 800),
+      },
+      duration: anime.random(1200, 1800),
+      easing: "easeOutExpo",
+      update: renderParticule,
+      offset: 0,
+    });
 }
 
 let render = anime({
-    duration: Infinity,
-    update: function () {
-        ctx.clearRect(0, 0, canvasEl.width, canvasEl.height);
-    }
+  duration: Infinity,
+  update: function () {
+    ctx.clearRect(0, 0, canvasEl.width, canvasEl.height);
+  },
 });
 
 document.addEventListener(
-    tap,
-    function (e) {
-        render.play();
-        updateCoords(e);
-        animateParticules(pointerX, pointerY);
-    },
-    false
+  tap,
+  function (e) {
+    render.play();
+    updateCoords(e);
+    animateParticules(pointerX, pointerY);
+  },
+  false
 );
 
 setCanvasSize();

source/js/clickBoom2.js

@@ -1,154 +1,180 @@
 class Circle {
-    constructor({ origin, speed, color, angle, context }) {
-      this.origin = origin
-      this.position = { ...this.origin }
-      this.color = color
-      this.speed = speed
-      this.angle = angle
-      this.context = context
-      this.renderCount = 0
-    }
+  constructor({ origin, speed, color, angle, context }) {
+    this.origin = origin;
+    this.position = { ...this.origin };
+    this.color = color;
+    this.speed = speed;
+    this.angle = angle;
+    this.context = context;
+    this.renderCount = 0;
+  }
 
-    draw() {
-      this.context.fillStyle = this.color
-      this.context.beginPath()
-      this.context.arc(this.position.x, this.position.y, 2, 0, Math.PI * 2)
-      this.context.fill()
-    }
+  draw() {
+    this.context.fillStyle = this.color;
+    this.context.beginPath();
+    this.context.arc(this.position.x, this.position.y, 2, 0, Math.PI * 2);
+    this.context.fill();
+  }
 
-    move() {
-      this.position.x = (Math.sin(this.angle) * this.speed) + this.position.x
-      this.position.y = (Math.cos(this.angle) * this.speed) + this.position.y + (this.renderCount * 0.3)
-      this.renderCount++
+  move() {
+    this.position.x = Math.sin(this.angle) * this.speed + this.position.x;
+    this.position.y =
+      Math.cos(this.angle) * this.speed +
+      this.position.y +
+      this.renderCount * 0.3;
+    this.renderCount++;
+  }
+}
+
+class Boom {
+  constructor({ origin, context, circleCount = 10, area }) {
+    this.origin = origin;
+    this.context = context;
+    this.circleCount = circleCount;
+    this.area = area;
+    this.stop = false;
+    this.circles = [];
+  }
+
+  randomArray(range) {
+    const length = range.length;
+    const randomIndex = Math.floor(length * Math.random());
+    return range[randomIndex];
+  }
+
+  randomColor() {
+    const range = ["8", "9", "A", "B", "C", "D", "E", "F"];
+    return (
+      "#" +
+      this.randomArray(range) +
+      this.randomArray(range) +
+      this.randomArray(range) +
+      this.randomArray(range) +
+      this.randomArray(range) +
+      this.randomArray(range)
+    );
+  }
+
+  randomRange(start, end) {
+    return (end - start) * Math.random() + start;
+  }
+
+  init() {
+    for (let i = 0; i < this.circleCount; i++) {
+      const circle = new Circle({
+        context: this.context,
+        origin: this.origin,
+        color: this.randomColor(),
+        angle: this.randomRange(Math.PI - 1, Math.PI + 1),
+        speed: this.randomRange(1, 6),
+      });
+      this.circles.push(circle);
     }
   }
 
-  class Boom {
-    constructor ({ origin, context, circleCount = 10, area }) {
-      this.origin = origin
-      this.context = context
-      this.circleCount = circleCount
-      this.area = area
-      this.stop = false
-      this.circles = []
-    }
-  
-    randomArray(range) {
-      const length = range.length
-      const randomIndex = Math.floor(length * Math.random())
-      return range[randomIndex]
-    }
-  
-    randomColor() {
-      const range = ['8', '9', 'A', 'B', 'C', 'D', 'E', 'F']
-      return '#' + this.randomArray(range) + this.randomArray(range) + this.randomArray(range) + this.randomArray(range) + this.randomArray(range) + this.randomArray(range)
-    }
-  
-    randomRange(start, end) {
-      return (end - start) * Math.random() + start
-    }
-  
-    init() {
-      for(let i = 0; i < this.circleCount; i++) {
-        const circle = new Circle({
-          context: this.context,
-          origin: this.origin,
-          color: this.randomColor(),
-          angle: this.randomRange(Math.PI - 1, Math.PI + 1),
-          speed: this.randomRange(1, 6)
-        })
-        this.circles.push(circle)
+  move() {
+    this.circles.forEach((circle, index) => {
+      if (
+        circle.position.x > this.area.width ||
+        circle.position.y > this.area.height
+      ) {
+        return this.circles.splice(index, 1);
       }
-    }
-  
-    move() {
-      this.circles.forEach((circle, index) => {
-        if (circle.position.x > this.area.width || circle.position.y > this.area.height) {
-          return this.circles.splice(index, 1)
-        }
-        circle.move()
-      })
-      if (this.circles.length == 0) {
-        this.stop = true
-      }
-    }
-  
-    draw() {
-      this.circles.forEach(circle => circle.draw())
+      circle.move();
+    });
+    if (this.circles.length == 0) {
+      this.stop = true;
     }
   }
 
-  class CursorSpecialEffects {
-    constructor() {
-      this.computerCanvas = document.createElement('canvas')
-      this.renderCanvas = document.createElement('canvas')
+  draw() {
+    this.circles.forEach((circle) => circle.draw());
+  }
+}
 
-      this.computerContext = this.computerCanvas.getContext('2d')
-      this.renderContext = this.renderCanvas.getContext('2d')
+class CursorSpecialEffects {
+  constructor() {
+    this.computerCanvas = document.createElement("canvas");
+    this.renderCanvas = document.createElement("canvas");
 
-      this.globalWidth = window.innerWidth
-      this.globalHeight = window.innerHeight
+    this.computerContext = this.computerCanvas.getContext("2d");
+    this.renderContext = this.renderCanvas.getContext("2d");
 
-      this.booms = []
-      this.running = false
-    }
+    this.globalWidth = window.innerWidth;
+    this.globalHeight = window.innerHeight;
 
-    handleMouseDown(e) {
-      const boom = new Boom({
-        origin: { x: e.clientX, y: e.clientY },
-        context: this.computerContext,
-        area: {
-          width: this.globalWidth,
-          height: this.globalHeight
-        }
-      })
-      boom.init()
-      this.booms.push(boom)
-      this.running || this.run()
-    }
-  
-    handlePageHide() {
-      this.booms = []
-      this.running = false
-    }
-  
-    init() {
-      const style = this.renderCanvas.style
-      style.position = 'fixed'
-      style.top = style.left = 0
-      style.zIndex = '99999'
-      style.pointerEvents = 'none'
-  
-      style.width = this.renderCanvas.width = this.computerCanvas.width = this.globalWidth
-      style.height = this.renderCanvas.height = this.computerCanvas.height = this.globalHeight
-  
-      document.body.append(this.renderCanvas)
-  
-      window.addEventListener('mousedown', this.handleMouseDown.bind(this))
-      window.addEventListener('pagehide', this.handlePageHide.bind(this))
-    }
-  
-    run() {
-      this.running = true
-      if (this.booms.length == 0) {
-        return this.running = false
-      }
-  
-      requestAnimationFrame(this.run.bind(this))
-  
-      this.computerContext.clearRect(0, 0, this.globalWidth, this.globalHeight)
-      this.renderContext.clearRect(0, 0, this.globalWidth, this.globalHeight)
-  
-      this.booms.forEach((boom, index) => {
-        if (boom.stop) {
-          return this.booms.splice(index, 1)
-        }
-        boom.move()
-        boom.draw()
-      })
-      this.renderContext.drawImage(this.computerCanvas, 0, 0, this.globalWidth, this.globalHeight)
-    }
+    this.booms = [];
+    this.running = false;
   }
 
-  const cursorSpecialEffects = new CursorSpecialEffects()
-  cursorSpecialEffects.init()
+  handleMouseDown(e) {
+    const boom = new Boom({
+      origin: { x: e.clientX, y: e.clientY },
+      context: this.computerContext,
+      area: {
+        width: this.globalWidth,
+        height: this.globalHeight,
+      },
+    });
+    boom.init();
+    this.booms.push(boom);
+    this.running || this.run();
+  }
+
+  handlePageHide() {
+    this.booms = [];
+    this.running = false;
+  }
+
+  init() {
+    const style = this.renderCanvas.style;
+    style.position = "fixed";
+    style.top = style.left = 0;
+    style.zIndex = "99999";
+    style.pointerEvents = "none";
+
+    style.width =
+      this.renderCanvas.width =
+      this.computerCanvas.width =
+        this.globalWidth;
+    style.height =
+      this.renderCanvas.height =
+      this.computerCanvas.height =
+        this.globalHeight;
+
+    document.body.append(this.renderCanvas);
+
+    window.addEventListener("mousedown", this.handleMouseDown.bind(this));
+    window.addEventListener("pagehide", this.handlePageHide.bind(this));
+  }
+
+  run() {
+    this.running = true;
+    if (this.booms.length == 0) {
+      return (this.running = false);
+    }
+
+    requestAnimationFrame(this.run.bind(this));
+
+    this.computerContext.clearRect(0, 0, this.globalWidth, this.globalHeight);
+    this.renderContext.clearRect(0, 0, this.globalWidth, this.globalHeight);
+
+    this.booms.forEach((boom, index) => {
+      if (boom.stop) {
+        return this.booms.splice(index, 1);
+      }
+      boom.move();
+      boom.draw();
+    });
+    this.renderContext.drawImage(
+      this.computerCanvas,
+      0,
+      0,
+      this.globalWidth,
+      this.globalHeight
+    );
+  }
+}
+
+const cursorSpecialEffects = new CursorSpecialEffects();
+cursorSpecialEffects.init();