react3dtagcloud - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

lib/index.js

@@ -53,3 +53,4 @@ "use strict";
       tags: [],
-      millisec: props.millisec || 64
+      millisec: props.millisec || 64,
+      timer: ''
     };
@@ -62,3 +63,16 @@ return _this;
     value: function componentWillReceiveProps(nextProps) {
+      var _this2 = this;
+
       if (nextProps.tagName != this.props.tagName) {
+        if (!this.state.timer) {
+          var timer = setInterval(function () {
+            _this2.rotateX();
+
+            _this2.rotateY();
+          }, this.state.millisec);
+          this.setState({
+            timer: timer
+          });
+        }
+
         this.move(nextProps.tagName);
@@ -70,9 +84,9 @@ }
     value: function componentDidMount() {
-      var _this2 = this;
+      var _this3 = this;
 
       document.addEventListener('mousemove', function (e) {
-        var angleX = 2 * (e.clientX / document.body.getBoundingClientRect().width - 0.5) * _this2.state.speed * BASEANGLE;
-        var angleY = 2 * (e.clientY / document.body.getBoundingClientRect().height - 0.5) * _this2.state.speed * BASEANGLE;
+        var angleX = 2 * (e.clientX / document.body.getBoundingClientRect().width - 0.5) * _this3.state.speed * BASEANGLE;
+        var angleY = 2 * (e.clientY / document.body.getBoundingClientRect().height - 0.5) * _this3.state.speed * BASEANGLE;
 
-        _this2.setState({
+        _this3.setState({
           angleX: angleX,
@@ -87,8 +101,11 @@ angleY: angleY
 
-      setInterval(function () {
-        _this2.rotateX();
+      var timer = setInterval(function () {
+        _this3.rotateX();
 
-        _this2.rotateY();
+        _this3.rotateY();
       }, this.state.millisec);
       this.move(this.props.tagName);
+      this.setState({
+        timer: timer
+      });
     } // handleMouseover(e) {
@@ -108,3 +125,3 @@ // 	const angleY = 2 * (e.clientX / document.body.getBoundingClientRect().width - 0.5) * speed * BASEANGLE;
     value: function move(tagName) {
-      var _this3 = this;
+      var _this4 = this;
 
@@ -115,5 +132,5 @@ var len = tagName.length;
         var angleB = angleA * Math.sqrt(len * Math.PI);
-        var z = _this3.state.R * Math.cos(angleA);
-        var y = _this3.state.R * Math.sin(angleA) * Math.sin(angleB);
-        var x = _this3.state.R * Math.sin(angleA) * Math.cos(angleB);
+        var z = _this4.state.R * Math.cos(angleA);
+        var y = _this4.state.R * Math.sin(angleA) * Math.sin(angleB);
+        var x = _this4.state.R * Math.sin(angleA) * Math.cos(angleB);
         var color = '#' + Math.floor(Math.random() * 0xffffff).toString(16);
@@ -168,2 +185,6 @@ var tagProps = {
     value: function render() {
+      var containerStyle = {
+        width: '100%',
+        heght: '100%'
+      };
       var wrapperStyle = {
@@ -175,2 +196,5 @@ position: 'relative',
       return _react.default.createElement("div", {
+        className: "tag-cloud-container",
+        style: containerStyle
+      }, _react.default.createElement("div", {
         className: "wrapper",
@@ -182,3 +206,3 @@ style: wrapperStyle
         }, tag), " ");
-      }));
+      })));
     }
@@ -185,0 +209,0 @@ }]);

package.json

 {
   "name": "react3dtagcloud",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "基于 react 的 3d 标签云",
@@ -8,5 +8,6 @@ "repository": "crazylxr/3dtagcloudforeact",
   "scripts": {
-    "start": "webpack-dev-server --open",
+    "start": "webpack-dev-server --open development",
     "build": "webpack",
-    "transplie": "npx babel src --out-dir lib"
+    "transplie": "npx babel src --out-dir lib",
+    "prepublishOnly": "npm run transplie"
   },
@@ -33,3 +34,4 @@ "keywords": [
     "webpack-cli": "^3.2.1",
-    "webpack-dev-server": "^3.1.14"
+    "webpack-dev-server": "^3.1.14",
+    "html-webpack-plugin": "^3.2.0"
   },
@@ -36,0 +38,0 @@ "dependencies": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

18002

decreased by-20.41%

Dev dependency count

13

increased by8.33%

Number of package files

7

decreased by-50%

Lines of code

291

decreased by-36.04%

No dependency changes