优化：标签云3d样式由js控制

package.json

@@ -1,6 +1,6 @@
 {
   "name": "halo-theme-dream2.0",
-  "version": "1.3.1.3",
+  "version": "1.3.1.4",
   "description": "梦之城，童话梦境，动漫类型博客主题。",
   "main": "index.js",
   "author": "nineya",

src/css/style.less

@@ -3118,13 +3118,6 @@ button.swiper-pagination-bullet {
     color: var(--dark-c) !important;
   }
 
-  &.tagcloud .tagcloud3d {
-    min-width: auto !important;
-    overflow: hidden !important;
-    margin: 0 auto;
-    min-height: 220px !important;
-  }
-
   &.love {
     position: relative;
     color: #fff;

src/js/tagcloud.js

@@ -73,8 +73,11 @@ window.tagcloud = (function (win, doc) { // ns
     self.update(self)    //初始更新
     self.box.style.visibility = 'visible'
     self.box.style.position = 'relative'
-    self.box.style.minHeight = 1.2 * self.size + 'px'
-    self.box.style.minWidth = 2.5 * self.size + 'px'
+    self.box.style.overflow = 'hidden'
+    self.box.style.margin = '0'
+    self.box.style.padding = '0'
+    self.box.style.minHeight = (1.2 * self.size < 220 ? 220 : 1.2 * self.size) + 'px'
+    self.box.style.minWidth = 'auto'
     for (var j2 = 0, len2 = self.items.length; j2 < len2; j2++) {
       self.items[j2].element.style.position = 'absolute'
       self.items[j2].element.style.zIndex = j2 + 1

templates/assets/js/tagcloud.min.js

@@ -1 +1 @@
-window.tagcloud=function(a,l){function u(e){var s=this;s.config=u._getConfig(e),s.box=s.config.element,s.fontsize=s.config.fontsize,s.radius=s.config.radius,s.depth=2*s.radius,s.size=2*s.radius,s.mspeed=u._getMsSpeed(s.config.mspeed),s.ispeed=u._getIsSpeed(s.config.ispeed),s.items=s._getItems(),s.direction=s.config.direction,s.keep=s.config.keep,s.active=!1,s.lasta=1,s.lastb=1,s.mouseX0=s.ispeed*Math.sin(s.direction*Math.PI/180),s.mouseY0=-s.ispeed*Math.cos(s.direction*Math.PI/180),s.mouseX=s.mouseX0,s.mouseY=s.mouseY0,s.index=-1,u._on(s.box,"mouseover",function(){s.active=!0}),u._on(s.box,"mouseout",function(){s.active=!1}),u._on(s.keep?a:s.box,"mousemove",function(e){var e=a.event||e,t=s.box.getBoundingClientRect();s.mouseX=(e.clientX-(t.left+s.box.offsetWidth/2))/5,s.mouseY=(e.clientY-(t.top+s.box.offsetHeight/2))/5});for(var t=0,i=s.items.length;t<i;t++)s.items[t].element.index=t,s.items[t].element.onmouseover=function(){s.index=this.index},s.items[t].element.onmouseout=function(){s.index=-1};u.boxs.push(s.box),s.update(s),s.box.style.visibility="visible",s.box.style.position="relative",s.box.style.minHeight=1.2*s.size+"px",s.box.style.minWidth=2.5*s.size+"px";for(var o=0,n=s.items.length;o<n;o++)s.items[o].element.style.position="absolute",s.items[o].element.style.zIndex=o+1;s.up=setInterval(function(){s.update(s)},30)}return u.boxs=[],u._set=function(e){if(-1===u.boxs.indexOf(e))return!0},Array.prototype.indexOf||(Array.prototype.indexOf=function(e){var t=this.length>>>0,s=Number(arguments[1])||0;for((s=s<0?Math.ceil(s):Math.floor(s))<0&&(s+=t);s<t;s++)if(s in this&&this[s]===e)return s;return-1}),u._getConfig=function(e){var t={fontsize:16,radius:60,mspeed:"normal",ispeed:"normal",direction:135,keep:!0};if("[object Object]"===Object.prototype.toString.call(e))for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&(t[s]=e[s]);return t},u._getMsSpeed=function(e){return{slow:1.5,normal:3,fast:5}[e]||3},u._getIsSpeed=function(e){return{slow:10,normal:25,fast:50}[e]||25},u._getSc=function(e,t){var s=Math.PI/180;return[Math.sin(e*s),Math.cos(e*s),Math.sin(t*s),Math.cos(t*s)]},u._on=function(e,t,s,i){e.addEventListener?e.addEventListener(t,s,i):e.attachEvent?e.attachEvent("on"+t,s):e["on"+t]=s},u.prototype={constructor:u,update:function(){var e,t,s=this;if(s.active||s.keep||(s.mouseX=Math.abs(s.mouseX-s.mouseX0)<1?s.mouseX0:(s.mouseX+s.mouseX0)/2,s.mouseY=Math.abs(s.mouseY-s.mouseY0)<1?s.mouseY0:(s.mouseY+s.mouseY0)/2),e=-Math.min(Math.max(-s.mouseY,-s.size),s.size)/s.radius*s.mspeed,t=Math.min(Math.max(-s.mouseX,-s.size),s.size)/s.radius*s.mspeed,!(Math.abs(e)<=.01&&Math.abs(t)<=.01)){s.lasta=e,s.lastb=t;for(var i=u._getSc(e,t),o=0,n=s.items.length;o<n;o++){var a=s.items[o].x,l=s.items[o].y*i[1]+s.items[o].z*-i[0],m=s.items[o].y*i[0]+s.items[o].z*i[1],r=a*i[3]+m*i[2],m=m*i[3]-a*i[2];s.index===o?(s.items[o].scale=1,s.items[o].fontsize=16,s.items[o].alpha=1,s.items[o].element.style.zIndex=99):(a=s.depth/(s.depth+m),s.items[o].x=r,s.items[o].y=l,s.items[o].z=m,s.items[o].scale=a,s.items[o].fontsize=Math.ceil(2*a)+s.fontsize-6,s.items[o].alpha=1.5*a-.5,s.items[o].element.style.zIndex=Math.ceil(10*a-5)),s.items[o].element.style.fontSize=s.items[o].fontsize+"px",s.items[o].element.style.left=s.items[o].x+(s.box.offsetWidth-s.items[o].offsetWidth)/2+"px",s.items[o].element.style.top=s.items[o].y+(s.box.offsetHeight-s.items[o].offsetHeight)/2+"px",s.items[o].element.style.filter="alpha(opacity="+100*s.items[o].alpha+")",s.items[o].element.style.opacity=s.items[o].alpha}}},_getItems:function(){for(var e,t=this,s=[],i=t.box.children,o=i.length,n=0;n<o;n++)(e={}).angle={},e.angle.phi=Math.acos((2*n+1)/o-1),e.angle.theta=Math.sqrt((o+1)*Math.PI)*e.angle.phi,e.element=i[n],e.offsetWidth=e.element.offsetWidth,e.offsetHeight=e.element.offsetHeight,e.x=1.5*t.radius*Math.cos(e.angle.theta)*Math.sin(e.angle.phi),e.y=1.5*t.radius*Math.sin(e.angle.theta)*Math.sin(e.angle.phi),e.z=1.5*t.radius*Math.cos(e.angle.phi),e.element.style.left=e.x+(t.box.offsetWidth-e.offsetWidth)/2+"px",e.element.style.top=e.y+(t.box.offsetHeight-e.offsetHeight)/2+"px",s.push(e);return s}},l.querySelectorAll||(l.querySelectorAll=function(e){var t,s=l.createElement("style"),i=[];for(l.documentElement.firstChild.appendChild(s),l._qsa=[],s.styleSheet.cssText=e+"{x-qsa:expression(document._qsa && document._qsa.push(this))}",window.scrollBy(0,0),s.parentNode.removeChild(s);l._qsa.length;)(t=l._qsa.shift()).style.removeAttribute("x-qsa"),i.push(t);return l._qsa=null,i}),function(e){for(var t=(e=e||{}).selector||".tagcloud",s=l.querySelectorAll(t),i=[],o=0,n=s.length;o<n;o++)e.element=s[o],u._set(e.element)&&i.push(new u(e));return i}}(window,document);
+window.tagcloud=function(a,l){function u(e){var s=this;s.config=u._getConfig(e),s.box=s.config.element,s.fontsize=s.config.fontsize,s.radius=s.config.radius,s.depth=2*s.radius,s.size=2*s.radius,s.mspeed=u._getMsSpeed(s.config.mspeed),s.ispeed=u._getIsSpeed(s.config.ispeed),s.items=s._getItems(),s.direction=s.config.direction,s.keep=s.config.keep,s.active=!1,s.lasta=1,s.lastb=1,s.mouseX0=s.ispeed*Math.sin(s.direction*Math.PI/180),s.mouseY0=-s.ispeed*Math.cos(s.direction*Math.PI/180),s.mouseX=s.mouseX0,s.mouseY=s.mouseY0,s.index=-1,u._on(s.box,"mouseover",function(){s.active=!0}),u._on(s.box,"mouseout",function(){s.active=!1}),u._on(s.keep?a:s.box,"mousemove",function(e){var e=a.event||e,t=s.box.getBoundingClientRect();s.mouseX=(e.clientX-(t.left+s.box.offsetWidth/2))/5,s.mouseY=(e.clientY-(t.top+s.box.offsetHeight/2))/5});for(var t=0,i=s.items.length;t<i;t++)s.items[t].element.index=t,s.items[t].element.onmouseover=function(){s.index=this.index},s.items[t].element.onmouseout=function(){s.index=-1};u.boxs.push(s.box),s.update(s),s.box.style.visibility="visible",s.box.style.position="relative",s.box.style.overflow="hidden",s.box.style.margin="0",s.box.style.padding="0",s.box.style.minHeight=(1.2*s.size<220?220:1.2*s.size)+"px",s.box.style.minWidth="auto";for(var o=0,n=s.items.length;o<n;o++)s.items[o].element.style.position="absolute",s.items[o].element.style.zIndex=o+1;s.up=setInterval(function(){s.update(s)},30)}return u.boxs=[],u._set=function(e){if(-1===u.boxs.indexOf(e))return!0},Array.prototype.indexOf||(Array.prototype.indexOf=function(e){var t=this.length>>>0,s=Number(arguments[1])||0;for((s=s<0?Math.ceil(s):Math.floor(s))<0&&(s+=t);s<t;s++)if(s in this&&this[s]===e)return s;return-1}),u._getConfig=function(e){var t={fontsize:16,radius:60,mspeed:"normal",ispeed:"normal",direction:135,keep:!0};if("[object Object]"===Object.prototype.toString.call(e))for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&(t[s]=e[s]);return t},u._getMsSpeed=function(e){return{slow:1.5,normal:3,fast:5}[e]||3},u._getIsSpeed=function(e){return{slow:10,normal:25,fast:50}[e]||25},u._getSc=function(e,t){var s=Math.PI/180;return[Math.sin(e*s),Math.cos(e*s),Math.sin(t*s),Math.cos(t*s)]},u._on=function(e,t,s,i){e.addEventListener?e.addEventListener(t,s,i):e.attachEvent?e.attachEvent("on"+t,s):e["on"+t]=s},u.prototype={constructor:u,update:function(){var e,t,s=this;if(s.active||s.keep||(s.mouseX=Math.abs(s.mouseX-s.mouseX0)<1?s.mouseX0:(s.mouseX+s.mouseX0)/2,s.mouseY=Math.abs(s.mouseY-s.mouseY0)<1?s.mouseY0:(s.mouseY+s.mouseY0)/2),e=-Math.min(Math.max(-s.mouseY,-s.size),s.size)/s.radius*s.mspeed,t=Math.min(Math.max(-s.mouseX,-s.size),s.size)/s.radius*s.mspeed,!(Math.abs(e)<=.01&&Math.abs(t)<=.01)){s.lasta=e,s.lastb=t;for(var i=u._getSc(e,t),o=0,n=s.items.length;o<n;o++){var a=s.items[o].x,l=s.items[o].y*i[1]+s.items[o].z*-i[0],m=s.items[o].y*i[0]+s.items[o].z*i[1],r=a*i[3]+m*i[2],m=m*i[3]-a*i[2];s.index===o?(s.items[o].scale=1,s.items[o].fontsize=16,s.items[o].alpha=1,s.items[o].element.style.zIndex=99):(a=s.depth/(s.depth+m),s.items[o].x=r,s.items[o].y=l,s.items[o].z=m,s.items[o].scale=a,s.items[o].fontsize=Math.ceil(2*a)+s.fontsize-6,s.items[o].alpha=1.5*a-.5,s.items[o].element.style.zIndex=Math.ceil(10*a-5)),s.items[o].element.style.fontSize=s.items[o].fontsize+"px",s.items[o].element.style.left=s.items[o].x+(s.box.offsetWidth-s.items[o].offsetWidth)/2+"px",s.items[o].element.style.top=s.items[o].y+(s.box.offsetHeight-s.items[o].offsetHeight)/2+"px",s.items[o].element.style.filter="alpha(opacity="+100*s.items[o].alpha+")",s.items[o].element.style.opacity=s.items[o].alpha}}},_getItems:function(){for(var e,t=this,s=[],i=t.box.children,o=i.length,n=0;n<o;n++)(e={}).angle={},e.angle.phi=Math.acos((2*n+1)/o-1),e.angle.theta=Math.sqrt((o+1)*Math.PI)*e.angle.phi,e.element=i[n],e.offsetWidth=e.element.offsetWidth,e.offsetHeight=e.element.offsetHeight,e.x=1.5*t.radius*Math.cos(e.angle.theta)*Math.sin(e.angle.phi),e.y=1.5*t.radius*Math.sin(e.angle.theta)*Math.sin(e.angle.phi),e.z=1.5*t.radius*Math.cos(e.angle.phi),e.element.style.left=e.x+(t.box.offsetWidth-e.offsetWidth)/2+"px",e.element.style.top=e.y+(t.box.offsetHeight-e.offsetHeight)/2+"px",s.push(e);return s}},l.querySelectorAll||(l.querySelectorAll=function(e){var t,s=l.createElement("style"),i=[];for(l.documentElement.firstChild.appendChild(s),l._qsa=[],s.styleSheet.cssText=e+"{x-qsa:expression(document._qsa && document._qsa.push(this))}",window.scrollBy(0,0),s.parentNode.removeChild(s);l._qsa.length;)(t=l._qsa.shift()).style.removeAttribute("x-qsa"),i.push(t);return l._qsa=null,i}),function(e){for(var t=(e=e||{}).selector||".tagcloud",s=l.querySelectorAll(t),i=[],o=0,n=s.length;o<n;o++)e.element=s[o],u._set(e.element)&&i.push(new u(e));return i}}(window,document);

templates/widget/tagcloud.html

@@ -12,7 +12,7 @@
         <a th:if="${theme.config.sidebar.tagcloud_more}" class="card-more" th:href="@{/tags}">更多<i class="ri-arrow-right-double-line"></i></a>
     </div>
     <div th:if="${isEmpty}" class="card-empty">暂无标签</div>
-    <div th:unless="${isEmpty}" th:class="'card-content' + ${showTagCloudStyle ? ' tagcloud3d' : ''}">
+    <div th:unless="${isEmpty}" class="card-content">
         <a
           th:each="tag : ${tags}"
           th:href="@{${tag.status.permalink}}"

theme.yaml

@@ -22,6 +22,6 @@ spec:
   settingName: theme-dream-setting
   configMapName: theme-dream-configMap
   # 版本号
-  version: 1.3.1.3
+  version: 1.3.1.4
   # 最低支持的 Halo 版本
   require: ">=2.0.0"