change something

README.md

@@ -221,9 +221,9 @@
     <!-- 第十一行 -->
     <tr>
         <td valign="top">
-        <a href="https://sun0225sun.github.io/Awesome-Love-Code/Web/034">
-            <p align="center">034</p>
-            <img src="https://cdn.jsdelivr.net/gh/sun0225SUN/Awesome-Love-Code/assets/img/web/034.png"/>
+        <a href="https://sun0225sun.github.io/Awesome-Love-Code/Web/031">
+            <p align="center">031</p>
+            <img src="https://cdn.jsdelivr.net/gh/sun0225SUN/Awesome-Love-Code/assets/img/web/031.png"/>
         </a>
     </td>
     <td valign="top">
@@ -242,21 +242,19 @@
     <!-- 第十一行 -->
     <tr>
         <td valign="top">
-        <a href="https://sun0225sun.github.io/Awesome-Love-Code/Web/031">
-            <p align="center">031</p>
-            <img src="https://cdn.jsdelivr.net/gh/sun0225SUN/Awesome-Love-Code/assets/img/web/031.png"/>
+        <a href="https://sun0225sun.github.io/Awesome-Love-Code/Web/034">
+            <p align="center">034</p>
+            <img src="https://cdn.jsdelivr.net/gh/sun0225SUN/Awesome-Love-Code/assets/img/web/034.png"/>
         </a>
     </td>
     </tr>
 </table>
 
 >  注:
-> 
->  031 源自此仓库：https://github.com/Kaiser-DMr/-3D  作者：Kaiser-DMr
-> 
+>
 >  032 源自此仓库：https://github.com/fromann/heart  作者：fromann
-
-
+> 
+>  034 源自此仓库：https://github.com/Kaiser-DMr/-3D  作者：Kaiser-DMr
 
 # Python
 

Web/031/css/style.css

 body {
-  /* 爱心跳动,抖音ID:不吃蟹黄 作品参考bootstrapmb,引入three基于canvas制作 */
-  background: rgb(0, 0, 0);
+  background: #000;
   overflow: hidden;
   margin: 0;
-  /* background-color: #000 !important; */
-}
+}
\ No newline at end of file

Web/031/js/MeshSurfaceSampler.js

 ( function () {
+
+	/**
+ * Utility class for sampling weighted random points on the surface of a mesh.
+ *
+ * Building the sampler is a one-time O(n) operation. Once built, any number of
+ * random samples may be selected in O(logn) time. Memory usage is O(n).
+ *
+ * References:
+ * - http://www.joesfer.com/?p=84
+ * - https://stackoverflow.com/a/4322940/1314762
+ */
+
 	const _face = new THREE.Triangle();
 
 	const _color = new THREE.Vector3();
@@ -167,7 +179,9 @@
 				targetColor.r = _color.x;
 				targetColor.g = _color.y;
 				targetColor.b = _color.z;
+
 			}
+
 			return this;
 
 		}

Web/031/js/OBJLoader.js

 ( function () {
-	// 爱心跳动,抖音ID:不吃蟹黄 作品参考bootstrapmb,引入three基于canvas制作
+
 	const _object_pattern = /^[og]\s*(.+)?/; // mtllib file_reference
 
 	const _material_library_pattern = /^mtllib /; // usemtl material_name

Web/031/js/script.js

 console.clear();
 
+// 创建场景对象 Scene
 const scene = new THREE.Scene();
+
+// 创建透视相机
 const camera = new THREE.PerspectiveCamera(
   75,
   window.innerWidth / window.innerHeight,
@@ -8,116 +11,183 @@ const camera = new THREE.PerspectiveCamera(
   1000
 );
 
+//  创建渲染器对象
 const renderer = new THREE.WebGLRenderer({
-  antialias: true
+  antialias: true, //  是否执行抗锯齿。默认值为false。
 });
-renderer.setClearColor(0xff5555);
+
+// 设置颜色及其透明度
+renderer.setClearColor(new THREE.Color("rgb(0,0,0)"));
+
+// 将输 canvas 的大小调整为 (width, height) 并考虑设备像素比，且将视口从 (0, 0) 开始调整到适合大小
 renderer.setSize(window.innerWidth, window.innerHeight);
 document.body.appendChild(renderer.domElement);
 
-camera.position.z = 1;
+// 表示对象局部位置的 Vector3。默认值为(0, 0, 0)。
+camera.position.z = 1.8;
 
+// 轨迹球控制器
 const controls = new THREE.TrackballControls(camera, renderer.domElement);
 controls.noPan = true;
 controls.maxDistance = 3;
 controls.minDistance = 0.7;
 
+// 物体
 const group = new THREE.Group();
 scene.add(group);
 
 let heart = null;
 let sampler = null;
 let originHeart = null;
-new THREE.OBJLoader().load('https://assets.codepen.io/127738/heart_2.obj',obj => {
-  heart = obj.children[0];
-  heart.geometry.rotateX(-Math.PI * 0.5);
-  heart.geometry.scale(0.04, 0.04, 0.04);
-  heart.geometry.translate(0, -0.4, 0);
-  group.add(heart);
-  
-  heart.material = new THREE.MeshBasicMaterial({
-    color: 0xff5555    
-  });
-  originHeart = Array.from(heart.geometry.attributes.position.array);
-  sampler = new THREE.MeshSurfaceSampler(heart).build();
-  init();
-  renderer.setAnimationLoop(render);
-});
+
+// OBJ加载器
+new THREE.OBJLoader().load(
+  "https://assets.codepen.io/127738/heart_2.obj",
+  (obj) => {
+    heart = obj.children[0];
+    heart.geometry.rotateX(-Math.PI * 0.5);
+    heart.geometry.scale(0.04, 0.04, 0.04);
+    heart.geometry.translate(0, -0.4, 0);
+    group.add(heart);
+
+    // 基础网格材质
+    heart.material = new THREE.MeshBasicMaterial({
+      color: new THREE.Color("rgb(0,0,0)"),
+    });
+    originHeart = Array.from(heart.geometry.attributes.position.array);
+    // 用于在网格表面上采样加权随机点的实用程序类。
+    sampler = new THREE.MeshSurfaceSampler(heart).build();
+    // 生成表皮
+    init();
+    // 每一帧都会调用
+    renderer.setAnimationLoop(render);
+  }
+);
 
 let positions = [];
+let colors = [];
 const geometry = new THREE.BufferGeometry();
-const material = new THREE.LineBasicMaterial({
-  color: 0xffffff
+
+const material = new THREE.PointsMaterial({
+  vertexColors: true, // Let Three.js knows that each point has a different color
+  size: 0.009,
 });
-const lines = new THREE.LineSegments(geometry, material);
-group.add(lines);
+
+const particles = new THREE.Points(geometry, material);
+group.add(particles);
 
 const simplex = new SimplexNoise();
 const pos = new THREE.Vector3();
-class Grass {
-  constructor () {
+const palette = [
+  new THREE.Color("#ffd4ee"),
+  new THREE.Color("#ff77fc"),
+  new THREE.Color("#ff77ae"),
+  new THREE.Color("#ff1775"),
+];
+class SparkPoint {
+  constructor() {
     sampler.sample(pos);
+    this.color = palette[Math.floor(Math.random() * palette.length)];
+    this.rand = Math.random() * 0.03;
     this.pos = pos.clone();
-    this.scale = Math.random() * 0.01 + 0.001;
     this.one = null;
     this.two = null;
   }
-  update (a) {
-    const noise = simplex.noise4D(this.pos.x*1.5, this.pos.y*1.5, this.pos.z*1.5, a * 0.0005) + 1;
-    this.one = this.pos.clone().multiplyScalar(1.01 + (noise * 0.15 * beat.a));
-    this.two = this.one.clone().add(this.one.clone().setLength(this.scale));
+  update(a) {
+    const noise =
+      simplex.noise4D(this.pos.x * 1, this.pos.y * 1, this.pos.z * 1, 0.1) +
+      1.5;
+    const noise2 =
+      simplex.noise4D(this.pos.x * 500, this.pos.y * 500, this.pos.z * 500, 1) +
+      1;
+    this.one = this.pos.clone().multiplyScalar(1.01 + noise * 0.15 * beat.a);
+    this.two = this.pos
+      .clone()
+      .multiplyScalar(1 + noise2 * 1 * (beat.a + 0.3) - beat.a * 1.2);
   }
 }
 
 let spikes = [];
-function init (a) {
+function init(a) {
   positions = [];
-  for (let i = 0; i < 20000; i++) {
-    const g = new Grass();
+  colors = [];
+  for (let i = 0; i < 10000; i++) {
+    const g = new SparkPoint();
     spikes.push(g);
   }
 }
 
 const beat = { a: 0 };
-gsap.timeline({
-  repeat: -1,
-  repeatDelay: 0.3
-}).to(beat, {
-  a: 1.2,
-  duration: 0.6,
-  ease: 'power2.in'
-}).to(beat, {
-  a: 0.0,
-  duration: 0.6,
-  ease: 'power3.out'
-});
-gsap.to(group.rotation, {
-  y: Math.PI * 2,
-  duration: 12,
-  ease: 'none',
-  repeat: -1
-});
+gsap
+  .timeline({
+    repeat: -1,
+    repeatDelay: 0.3,
+  })
+  .to(beat, {
+    a: 0.5,
+    duration: 0.6,
+    ease: "power2.in",
+  })
+  .to(beat, {
+    a: 0.0,
+    duration: 0.6,
+    ease: "power3.out",
+  });
+
+// 0.22954521554974774 -0.22854083083283794
+const maxZ = 0.23;
+const rateZ = 0.5;
 
 function render(a) {
   positions = [];
-  spikes.forEach(g => {
+  colors = [];
+  spikes.forEach((g, i) => {
     g.update(a);
-    positions.push(g.one.x, g.one.y, g.one.z);
-    positions.push(g.two.x, g.two.y, g.two.z);
+    const rand = g.rand;
+    const color = g.color;
+    if (maxZ * rateZ + rand > g.one.z && g.one.z > -maxZ * rateZ - rand) {
+      positions.push(g.one.x, g.one.y, g.one.z);
+      colors.push(color.r, color.g, color.b);
+    }
+    if (
+      maxZ * rateZ + rand * 2 > g.one.z &&
+      g.one.z > -maxZ * rateZ - rand * 2
+    ) {
+      positions.push(g.two.x, g.two.y, g.two.z);
+      colors.push(color.r, color.g, color.b);
+    }
   });
-  geometry.setAttribute('position', new THREE.BufferAttribute(new Float32Array(positions), 3));
-  
+  geometry.setAttribute(
+    "position",
+    new THREE.BufferAttribute(new Float32Array(positions), 3)
+  );
+
+  geometry.setAttribute(
+    "color",
+    new THREE.BufferAttribute(new Float32Array(colors), 3)
+  );
+
   const vs = heart.geometry.attributes.position.array;
-  for (let i = 0; i < vs.length; i+=3) {
-    const v = new THREE.Vector3(originHeart[i], originHeart[i+1], originHeart[i+2]);
-    const noise = simplex.noise4D(originHeart[i]*1.5, originHeart[i+1]*1.5, originHeart[i+2]*1.5, a * 0.0005) + 1;
-    v.multiplyScalar(1 + (noise * 0.15 * beat.a));
+  for (let i = 0; i < vs.length; i += 3) {
+    const v = new THREE.Vector3(
+      originHeart[i],
+      originHeart[i + 1],
+      originHeart[i + 2]
+    );
+    const noise =
+      simplex.noise4D(
+        originHeart[i] * 1.5,
+        originHeart[i + 1] * 1.5,
+        originHeart[i + 2] * 1.5,
+        a * 0.0005
+      ) + 1;
+    v.multiplyScalar(0 + noise * 0.15 * beat.a);
     vs[i] = v.x;
-    vs[i+1] = v.y;
-    vs[i+2] = v.z;
+    vs[i + 1] = v.y;
+    vs[i + 2] = v.z;
   }
   heart.geometry.attributes.position.needsUpdate = true;
-  
+
   controls.update();
   renderer.render(scene, camera);
 }
@@ -127,4 +197,4 @@ function onWindowResize() {
   camera.aspect = window.innerWidth / window.innerHeight;
   camera.updateProjectionMatrix();
   renderer.setSize(window.innerWidth, window.innerHeight);
-}
\ No newline at end of file
+}

Web/031/js/simplex-noise.js

-(function () {
+/*
+ * A fast javascript implementation of simplex noise by Jonas Wagner
+
+Based on a speed-improved simplex noise algorithm for 2D, 3D and 4D in Java.
+Which is based on example code by Stefan Gustavson (stegu@itn.liu.se).
+With Optimisations by Peter Eastman (peastman@drizzle.stanford.edu).
+Better rank ordering method by Stefan Gustavson in 2012.
+
+ Copyright (c) 2018 Jonas Wagner
+
+ Permission is hereby granted, free of charge, to any person obtaining a copy
+ of this software and associated documentation files (the "Software"), to deal
+ in the Software without restriction, including without limitation the rights
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ copies of the Software, and to permit persons to whom the Software is
+ furnished to do so, subject to the following conditions:
+
+ The above copyright notice and this permission notice shall be included in all
+ copies or substantial portions of the Software.
+
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ SOFTWARE.
+ */
+(function() {
   'use strict';
 
   var F2 = 0.5 * (Math.sqrt(3.0) - 1.0);
@@ -12,7 +40,8 @@
     var random;
     if (typeof randomOrSeed == 'function') {
       random = randomOrSeed;
-    } else if (randomOrSeed) {
+    }
+    else if (randomOrSeed) {
       random = alea(randomOrSeed);
     } else {
       random = Math.random;
@@ -41,8 +70,7 @@
 
       0, -1, 1,
       0, 1, -1,
-      0, -1, -1
-    ]),
+      0, -1, -1]),
     grad4: new Float32Array([0, 1, 1, 1, 0, 1, 1, -1, 0, 1, -1, 1, 0, 1, -1, -1,
       0, -1, 1, 1, 0, -1, 1, -1, 0, -1, -1, 1, 0, -1, -1, -1,
       1, 0, 1, 1, 1, 0, 1, -1, 1, 0, -1, 1, 1, 0, -1, -1,
@@ -50,9 +78,8 @@
       1, 1, 0, 1, 1, 1, 0, -1, 1, -1, 0, 1, 1, -1, 0, -1,
       -1, 1, 0, 1, -1, 1, 0, -1, -1, -1, 0, 1, -1, -1, 0, -1,
       1, 1, 1, 0, 1, 1, -1, 0, 1, -1, 1, 0, 1, -1, -1, 0,
-      -1, 1, 1, 0, -1, 1, -1, 0, -1, -1, 1, 0, -1, -1, -1, 0
-    ]),
-    noise2D: function (xin, yin) {
+      -1, 1, 1, 0, -1, 1, -1, 0, -1, -1, 1, 0, -1, -1, -1, 0]),
+    noise2D: function(xin, yin) {
       var permMod12 = this.permMod12;
       var perm = this.perm;
       var grad3 = this.grad3;
@@ -113,7 +140,7 @@
       return 70.0 * (n0 + n1 + n2);
     },
     // 3D simplex noise
-    noise3D: function (xin, yin, zin) {
+    noise3D: function(xin, yin, zin) {
       var permMod12 = this.permMod12;
       var perm = this.perm;
       var grad3 = this.grad3;
@@ -159,7 +186,8 @@
           j2 = 0;
           k2 = 1;
         } // Z X Y order
-      } else { // x0<y0
+      }
+      else { // x0<y0
         if (y0 < z0) {
           i1 = 0;
           j1 = 0;
@@ -236,7 +264,7 @@
       return 32.0 * (n0 + n1 + n2 + n3);
     },
     // 4D simplex noise, better simplex rank ordering method 2012-03-09
-    noise4D: function (x, y, z, w) {
+    noise4D: function(x, y, z, w) {
       var perm = this.perm;
       var grad4 = this.grad4;
 
@@ -409,17 +437,16 @@
       }
     }
     mash = null;
-    return function () {
+    return function() {
       var t = 2091639 * s0 + c * 2.3283064365386963e-10; // 2^-32
       s0 = s1;
       s1 = s2;
       return s2 = t - (c = t | 0);
     };
   }
-
   function masher() {
     var n = 0xefc8249d;
-    return function (data) {
+    return function(data) {
       data = data.toString();
       for (var i = 0; i < data.length; i++) {
         n += data.charCodeAt(i);
@@ -436,9 +463,7 @@
   }
 
   // amd
-  if (typeof define !== 'undefined' && define.amd) define(function () {
-    return SimplexNoise;
-  });
+  if (typeof define !== 'undefined' && define.amd) define(function() {return SimplexNoise;});
   // common js
   if (typeof exports !== 'undefined') exports.SimplexNoise = SimplexNoise;
   // browser
@@ -448,4 +473,4 @@
     module.exports = SimplexNoise;
   }
 
-})();
\ No newline at end of file
+})();

Web/034/css/style.css

 body {
-  background: #000;
+  /* 爱心跳动,抖音ID:不吃蟹黄 作品参考bootstrapmb,引入three基于canvas制作 */
+  background: rgb(0, 0, 0);
   overflow: hidden;
   margin: 0;
-}
\ No newline at end of file
+  /* background-color: #000 !important; */
+}

Web/034/js/MeshSurfaceSampler.js

 ( function () {
-
-	/**
- * Utility class for sampling weighted random points on the surface of a mesh.
- *
- * Building the sampler is a one-time O(n) operation. Once built, any number of
- * random samples may be selected in O(logn) time. Memory usage is O(n).
- *
- * References:
- * - http://www.joesfer.com/?p=84
- * - https://stackoverflow.com/a/4322940/1314762
- */
-
 	const _face = new THREE.Triangle();
 
 	const _color = new THREE.Vector3();
@@ -179,9 +167,7 @@
 				targetColor.r = _color.x;
 				targetColor.g = _color.y;
 				targetColor.b = _color.z;
-
 			}
-
 			return this;
 
 		}

Web/034/js/OBJLoader.js

 ( function () {
-
+	// 爱心跳动,抖音ID:不吃蟹黄 作品参考bootstrapmb,引入three基于canvas制作
 	const _object_pattern = /^[og]\s*(.+)?/; // mtllib file_reference
 
 	const _material_library_pattern = /^mtllib /; // usemtl material_name

Web/034/js/script.js

 console.clear();
 
-// 创建场景对象 Scene
 const scene = new THREE.Scene();
-
-// 创建透视相机
 const camera = new THREE.PerspectiveCamera(
   75,
   window.innerWidth / window.innerHeight,
@@ -11,183 +8,116 @@ const camera = new THREE.PerspectiveCamera(
   1000
 );
 
-//  创建渲染器对象
 const renderer = new THREE.WebGLRenderer({
-  antialias: true, //  是否执行抗锯齿。默认值为false。
+  antialias: true
 });
-
-// 设置颜色及其透明度
-renderer.setClearColor(new THREE.Color("rgb(0,0,0)"));
-
-// 将输 canvas 的大小调整为 (width, height) 并考虑设备像素比，且将视口从 (0, 0) 开始调整到适合大小
+renderer.setClearColor(0xff5555);
 renderer.setSize(window.innerWidth, window.innerHeight);
 document.body.appendChild(renderer.domElement);
 
-// 表示对象局部位置的 Vector3。默认值为(0, 0, 0)。
-camera.position.z = 1.8;
+camera.position.z = 1;
 
-// 轨迹球控制器
 const controls = new THREE.TrackballControls(camera, renderer.domElement);
 controls.noPan = true;
 controls.maxDistance = 3;
 controls.minDistance = 0.7;
 
-// 物体
 const group = new THREE.Group();
 scene.add(group);
 
 let heart = null;
 let sampler = null;
 let originHeart = null;
-
-// OBJ加载器
-new THREE.OBJLoader().load(
-  "https://assets.codepen.io/127738/heart_2.obj",
-  (obj) => {
-    heart = obj.children[0];
-    heart.geometry.rotateX(-Math.PI * 0.5);
-    heart.geometry.scale(0.04, 0.04, 0.04);
-    heart.geometry.translate(0, -0.4, 0);
-    group.add(heart);
-
-    // 基础网格材质
-    heart.material = new THREE.MeshBasicMaterial({
-      color: new THREE.Color("rgb(0,0,0)"),
-    });
-    originHeart = Array.from(heart.geometry.attributes.position.array);
-    // 用于在网格表面上采样加权随机点的实用程序类。
-    sampler = new THREE.MeshSurfaceSampler(heart).build();
-    // 生成表皮
-    init();
-    // 每一帧都会调用
-    renderer.setAnimationLoop(render);
-  }
-);
+new THREE.OBJLoader().load('https://assets.codepen.io/127738/heart_2.obj',obj => {
+  heart = obj.children[0];
+  heart.geometry.rotateX(-Math.PI * 0.5);
+  heart.geometry.scale(0.04, 0.04, 0.04);
+  heart.geometry.translate(0, -0.4, 0);
+  group.add(heart);
+  
+  heart.material = new THREE.MeshBasicMaterial({
+    color: 0xff5555    
+  });
+  originHeart = Array.from(heart.geometry.attributes.position.array);
+  sampler = new THREE.MeshSurfaceSampler(heart).build();
+  init();
+  renderer.setAnimationLoop(render);
+});
 
 let positions = [];
-let colors = [];
 const geometry = new THREE.BufferGeometry();
-
-const material = new THREE.PointsMaterial({
-  vertexColors: true, // Let Three.js knows that each point has a different color
-  size: 0.009,
+const material = new THREE.LineBasicMaterial({
+  color: 0xffffff
 });
-
-const particles = new THREE.Points(geometry, material);
-group.add(particles);
+const lines = new THREE.LineSegments(geometry, material);
+group.add(lines);
 
 const simplex = new SimplexNoise();
 const pos = new THREE.Vector3();
-const palette = [
-  new THREE.Color("#ffd4ee"),
-  new THREE.Color("#ff77fc"),
-  new THREE.Color("#ff77ae"),
-  new THREE.Color("#ff1775"),
-];
-class SparkPoint {
-  constructor() {
+class Grass {
+  constructor () {
     sampler.sample(pos);
-    this.color = palette[Math.floor(Math.random() * palette.length)];
-    this.rand = Math.random() * 0.03;
     this.pos = pos.clone();
+    this.scale = Math.random() * 0.01 + 0.001;
     this.one = null;
     this.two = null;
   }
-  update(a) {
-    const noise =
-      simplex.noise4D(this.pos.x * 1, this.pos.y * 1, this.pos.z * 1, 0.1) +
-      1.5;
-    const noise2 =
-      simplex.noise4D(this.pos.x * 500, this.pos.y * 500, this.pos.z * 500, 1) +
-      1;
-    this.one = this.pos.clone().multiplyScalar(1.01 + noise * 0.15 * beat.a);
-    this.two = this.pos
-      .clone()
-      .multiplyScalar(1 + noise2 * 1 * (beat.a + 0.3) - beat.a * 1.2);
+  update (a) {
+    const noise = simplex.noise4D(this.pos.x*1.5, this.pos.y*1.5, this.pos.z*1.5, a * 0.0005) + 1;
+    this.one = this.pos.clone().multiplyScalar(1.01 + (noise * 0.15 * beat.a));
+    this.two = this.one.clone().add(this.one.clone().setLength(this.scale));
   }
 }
 
 let spikes = [];
-function init(a) {
+function init (a) {
   positions = [];
-  colors = [];
-  for (let i = 0; i < 10000; i++) {
-    const g = new SparkPoint();
+  for (let i = 0; i < 20000; i++) {
+    const g = new Grass();
     spikes.push(g);
   }
 }
 
 const beat = { a: 0 };
-gsap
-  .timeline({
-    repeat: -1,
-    repeatDelay: 0.3,
-  })
-  .to(beat, {
-    a: 0.5,
-    duration: 0.6,
-    ease: "power2.in",
-  })
-  .to(beat, {
-    a: 0.0,
-    duration: 0.6,
-    ease: "power3.out",
-  });
-
-// 0.22954521554974774 -0.22854083083283794
-const maxZ = 0.23;
-const rateZ = 0.5;
+gsap.timeline({
+  repeat: -1,
+  repeatDelay: 0.3
+}).to(beat, {
+  a: 1.2,
+  duration: 0.6,
+  ease: 'power2.in'
+}).to(beat, {
+  a: 0.0,
+  duration: 0.6,
+  ease: 'power3.out'
+});
+gsap.to(group.rotation, {
+  y: Math.PI * 2,
+  duration: 12,
+  ease: 'none',
+  repeat: -1
+});
 
 function render(a) {
   positions = [];
-  colors = [];
-  spikes.forEach((g, i) => {
+  spikes.forEach(g => {
     g.update(a);
-    const rand = g.rand;
-    const color = g.color;
-    if (maxZ * rateZ + rand > g.one.z && g.one.z > -maxZ * rateZ - rand) {
-      positions.push(g.one.x, g.one.y, g.one.z);
-      colors.push(color.r, color.g, color.b);
-    }
-    if (
-      maxZ * rateZ + rand * 2 > g.one.z &&
-      g.one.z > -maxZ * rateZ - rand * 2
-    ) {
-      positions.push(g.two.x, g.two.y, g.two.z);
-      colors.push(color.r, color.g, color.b);
-    }
+    positions.push(g.one.x, g.one.y, g.one.z);
+    positions.push(g.two.x, g.two.y, g.two.z);
   });
-  geometry.setAttribute(
-    "position",
-    new THREE.BufferAttribute(new Float32Array(positions), 3)
-  );
-
-  geometry.setAttribute(
-    "color",
-    new THREE.BufferAttribute(new Float32Array(colors), 3)
-  );
-
+  geometry.setAttribute('position', new THREE.BufferAttribute(new Float32Array(positions), 3));
+  
   const vs = heart.geometry.attributes.position.array;
-  for (let i = 0; i < vs.length; i += 3) {
-    const v = new THREE.Vector3(
-      originHeart[i],
-      originHeart[i + 1],
-      originHeart[i + 2]
-    );
-    const noise =
-      simplex.noise4D(
-        originHeart[i] * 1.5,
-        originHeart[i + 1] * 1.5,
-        originHeart[i + 2] * 1.5,
-        a * 0.0005
-      ) + 1;
-    v.multiplyScalar(0 + noise * 0.15 * beat.a);
+  for (let i = 0; i < vs.length; i+=3) {
+    const v = new THREE.Vector3(originHeart[i], originHeart[i+1], originHeart[i+2]);
+    const noise = simplex.noise4D(originHeart[i]*1.5, originHeart[i+1]*1.5, originHeart[i+2]*1.5, a * 0.0005) + 1;
+    v.multiplyScalar(1 + (noise * 0.15 * beat.a));
     vs[i] = v.x;
-    vs[i + 1] = v.y;
-    vs[i + 2] = v.z;
+    vs[i+1] = v.y;
+    vs[i+2] = v.z;
   }
   heart.geometry.attributes.position.needsUpdate = true;
-
+  
   controls.update();
   renderer.render(scene, camera);
 }
@@ -197,4 +127,4 @@ function onWindowResize() {
   camera.aspect = window.innerWidth / window.innerHeight;
   camera.updateProjectionMatrix();
   renderer.setSize(window.innerWidth, window.innerHeight);
-}
+}
\ No newline at end of file

Web/034/js/simplex-noise.js

-/*
- * A fast javascript implementation of simplex noise by Jonas Wagner
-
-Based on a speed-improved simplex noise algorithm for 2D, 3D and 4D in Java.
-Which is based on example code by Stefan Gustavson (stegu@itn.liu.se).
-With Optimisations by Peter Eastman (peastman@drizzle.stanford.edu).
-Better rank ordering method by Stefan Gustavson in 2012.
-
- Copyright (c) 2018 Jonas Wagner
-
- Permission is hereby granted, free of charge, to any person obtaining a copy
- of this software and associated documentation files (the "Software"), to deal
- in the Software without restriction, including without limitation the rights
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- copies of the Software, and to permit persons to whom the Software is
- furnished to do so, subject to the following conditions:
-
- The above copyright notice and this permission notice shall be included in all
- copies or substantial portions of the Software.
-
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- SOFTWARE.
- */
-(function() {
+(function () {
   'use strict';
 
   var F2 = 0.5 * (Math.sqrt(3.0) - 1.0);
@@ -40,8 +12,7 @@ Better rank ordering method by Stefan Gustavson in 2012.
     var random;
     if (typeof randomOrSeed == 'function') {
       random = randomOrSeed;
-    }
-    else if (randomOrSeed) {
+    } else if (randomOrSeed) {
       random = alea(randomOrSeed);
     } else {
       random = Math.random;
@@ -70,7 +41,8 @@ Better rank ordering method by Stefan Gustavson in 2012.
 
       0, -1, 1,
       0, 1, -1,
-      0, -1, -1]),
+      0, -1, -1
+    ]),
     grad4: new Float32Array([0, 1, 1, 1, 0, 1, 1, -1, 0, 1, -1, 1, 0, 1, -1, -1,
       0, -1, 1, 1, 0, -1, 1, -1, 0, -1, -1, 1, 0, -1, -1, -1,
       1, 0, 1, 1, 1, 0, 1, -1, 1, 0, -1, 1, 1, 0, -1, -1,
@@ -78,8 +50,9 @@ Better rank ordering method by Stefan Gustavson in 2012.
       1, 1, 0, 1, 1, 1, 0, -1, 1, -1, 0, 1, 1, -1, 0, -1,
       -1, 1, 0, 1, -1, 1, 0, -1, -1, -1, 0, 1, -1, -1, 0, -1,
       1, 1, 1, 0, 1, 1, -1, 0, 1, -1, 1, 0, 1, -1, -1, 0,
-      -1, 1, 1, 0, -1, 1, -1, 0, -1, -1, 1, 0, -1, -1, -1, 0]),
-    noise2D: function(xin, yin) {
+      -1, 1, 1, 0, -1, 1, -1, 0, -1, -1, 1, 0, -1, -1, -1, 0
+    ]),
+    noise2D: function (xin, yin) {
       var permMod12 = this.permMod12;
       var perm = this.perm;
       var grad3 = this.grad3;
@@ -140,7 +113,7 @@ Better rank ordering method by Stefan Gustavson in 2012.
       return 70.0 * (n0 + n1 + n2);
     },
     // 3D simplex noise
-    noise3D: function(xin, yin, zin) {
+    noise3D: function (xin, yin, zin) {
       var permMod12 = this.permMod12;
       var perm = this.perm;
       var grad3 = this.grad3;
@@ -186,8 +159,7 @@ Better rank ordering method by Stefan Gustavson in 2012.
           j2 = 0;
           k2 = 1;
         } // Z X Y order
-      }
-      else { // x0<y0
+      } else { // x0<y0
         if (y0 < z0) {
           i1 = 0;
           j1 = 0;
@@ -264,7 +236,7 @@ Better rank ordering method by Stefan Gustavson in 2012.
       return 32.0 * (n0 + n1 + n2 + n3);
     },
     // 4D simplex noise, better simplex rank ordering method 2012-03-09
-    noise4D: function(x, y, z, w) {
+    noise4D: function (x, y, z, w) {
       var perm = this.perm;
       var grad4 = this.grad4;
 
@@ -437,16 +409,17 @@ Better rank ordering method by Stefan Gustavson in 2012.
       }
     }
     mash = null;
-    return function() {
+    return function () {
       var t = 2091639 * s0 + c * 2.3283064365386963e-10; // 2^-32
       s0 = s1;
       s1 = s2;
       return s2 = t - (c = t | 0);
     };
   }
+
   function masher() {
     var n = 0xefc8249d;
-    return function(data) {
+    return function (data) {
       data = data.toString();
       for (var i = 0; i < data.length; i++) {
         n += data.charCodeAt(i);
@@ -463,7 +436,9 @@ Better rank ordering method by Stefan Gustavson in 2012.
   }
 
   // amd
-  if (typeof define !== 'undefined' && define.amd) define(function() {return SimplexNoise;});
+  if (typeof define !== 'undefined' && define.amd) define(function () {
+    return SimplexNoise;
+  });
   // common js
   if (typeof exports !== 'undefined') exports.SimplexNoise = SimplexNoise;
   // browser
@@ -473,4 +448,4 @@ Better rank ordering method by Stefan Gustavson in 2012.
     module.exports = SimplexNoise;
   }
 
-})();
+})();
\ No newline at end of file