{"version":3,"sources":["webpack:///./src/WebGL/AppContent/HeartGrid/HeartGridSea.vue?950c","webpack:///src/WebGL/AppContent/HeartGrid/HeartGridSea.vue","webpack:///./src/WebGL/AppContent/HeartGrid/HeartGridSea.vue?73ce","webpack:///./src/WebGL/AppContent/HeartGrid/HeartGridSea.vue","webpack:///./src/WebGL/AppContent/HeartGrid/matcap/pink.jpg","webpack:///./src/WebGL/AppContent/HeartGrid/matcap/pink-2.jpg","webpack:///./src/WebGL/AppContent/HeartGrid/matcap/yellow.jpg","webpack:///./src/WebGL/AppContent/HeartGrid/fbx/star.fbx","webpack:///./src/WebGL/AppContent/HeartGrid/matcap/silver.png","webpack:///./src/WebGL/AppContent/HeartGrid/matcap/red-2.jpg","webpack:///./src/WebGL/AppContent/HeartGrid/fbx/heart.fbx"],"names":["render","_vm","this","_h","$createElement","_c","_self","_t","staticRenderFns","name","mixins","props","components","data","hit","open","beforeDestroy","component","module","exports"],"mappings":"uHAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACJ,EAAIM,GAAG,YAAY,IACzHC,EAAkB,G,gHCiBtB,GACEC,KAAM,oBACNC,OAAQ,CAAC,EAAX,MACEC,MAAO,GAEPC,WAAY,OAAd,OAAc,CAAd,GACA,WAEEC,KARF,WASI,MAAO,CACLC,KAAK,EACLC,MAAM,IAGV,QAdF,WAcA,yNACA,qBACA,wBAFA,SAIA,yBACA,iBAEA,sCACA,6BACA,sBACA,WAVA,cAIA,EAJA,gBAaA,yBACA,iBAEA,sCACA,6BAEA,WAnBA,cAaA,EAbA,iBAuBA,yBACA,6BAEA,8BACA,sFACA,WA5BA,QAyGA,IAlFA,EAvBA,OAgCA,GACA,8BACA,iCACA,gCACA,gCAGA,gBACA,yCACA,GAEA,aAEA,YACA,YACA,YAEA,aAEA,6CACA,6DACA,gDAEA,8DACA,4CAGA,qBACA,oKACA,mDACA,4BACA,6BACA,6BACA,kBACA,kBACA,kBAPA,4CAUA,KACA,uJACA,yBACA,8BACA,yFAEA,8BACA,2FAEA,8BACA,2FAEA,8BACA,4FAZA,4CAeA,KACA,oCAEA,iCACA,mCACA,QAGA,MAEA,IAEA,IACA,UACA,UACA,UACA,KACA,oBACA,aACA,YACA,gBACA,gBACA,OACA,GAGA,SACA,4BACA,UACA,SACA,UACA,UACA,IACA,IACA,KACA,KACA,MACA,QACA,OACA,UAEA,iBACA,IAKA,0BACA,wBACA,kBACA,kBAEA,KACA,KACA,KAEA,cACA,kDAEA,iCACA,mCAGA,8DACA,mBACA,KACA,eACA,cAEA,8DACA,mBACA,cACA,kBAEA,cAEA,6DACA,OACA,cACA,4DACA,OACA,cAEA,+DACA,KACA,mBACA,cACA,kBAEA,cACA,8DACA,KACA,mBACA,OACA,cAEA,8BACA,OACA,qCAIA,oCACA,oCAEA,sCACA,4BAEA,wBACA,MACA,yBAEA,mBACA,IACA,qBAGA,KAQA,IALA,cAIA,IACA,YACA,2BACA,WADA,EACA,OADA,EACA,MAEA,iBACA,iBAEA,UAKA,qBAYA,iBACA,iBAEA,kBACA,iBAEA,gEAOA,aACA,YACA,aACA,aACA,aACA,UACA,oBAEA,aACA,SACA,WACA,UACA,qBAGA,aACA,aACA,aACA,WACA,oBAEA,qBAGA,gBACA,sDACA,eACA,mBAEA,eACA,eACA,oBAGA,QA1RA,+CA+REC,cA7SF,cClBoX,I,YCOhXC,EAAY,eACd,EACAjB,EACAQ,GACA,EACA,KACA,KACA,MAIa,aAAAS,E,gCClBfC,EAAOC,QAAU,IAA0B,yB,uBCA3CD,EAAOC,QAAU,IAA0B,2B,qBCA3CD,EAAOC,QAAU,IAA0B,2B,kCCA3C,OAAe,iBAA0B,wC,qBCAzCD,EAAOC,QAAU,IAA0B,2B,qBCA3CD,EAAOC,QAAU,IAA0B,0B,kCCA3C,OAAe,iBAA0B","file":"js/chunk-25a3e870.da23385e.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_vm._t(\"default\")],2)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <slot></slot>\n  </div>\n</template>\n\n<script>\nimport { Tree, getScreen } from '../../Reusable'\nimport { Mesh, Object3D, MeshMatcapMaterial, TextureLoader, Vector2, Raycaster, Color, IcosahedronBufferGeometry } from 'three'\n\nimport { FBXLoader } from 'three/examples/jsm/loaders/FBXLoader'\n\n// import { Refractor } from 'three/examples/jsm/objects/Refractor'\n// import { FastBlurShader } from './FastBlurShader'\n\n// eslint-disable-next-line\nlet Cache = {}\n\nexport default {\n  name: 'StarKindnessWords',\n  mixins: [Tree],\n  props: {\n  },\n  components: {\n    ...require('../../webgl')\n  },\n  data () {\n    return {\n      hit: false,\n      open: false\n    }\n  },\n  async mounted () {\n    var raycaster = new Raycaster()\n    var mouse = new Vector2(1, 1)\n\n    let starGeo = await new Promise((resolve) => {\n      let loader = new FBXLoader()\n      // eslint-disable-next-line\n      loader.load(require('file-loader!./fbx/star.fbx').default, (obj) => {\n        let geo = obj.children[2].geometry\n        geo.rotateX(Math.PI * 0.5)\n        resolve(geo)\n      })\n    })\n    let heartGeo = await new Promise((resolve) => {\n      let loader = new FBXLoader()\n      // eslint-disable-next-line\n      loader.load(require('file-loader!./fbx/heart.fbx').default, (obj) => {\n        let geo = obj.children[0].geometry\n        // geo.rotateX(-Math.PI)\n        resolve(geo)\n      })\n    })\n\n    let cursorMatcap = await new Promise((resolve) => {\n      let loader = new TextureLoader()\n      // eslint-disable-next-line\n      loader.load(require('./matcap/silver.png'), (obj) => {\n        let matcap = new MeshMatcapMaterial({ transparent: true, opacity: 1.0, color: 0xffffff, matcap: obj })\n        resolve(matcap)\n      })\n    })\n\n    let colors = {\n      red: new Color('#ff0000'),\n      yellow: new Color('#ffff00'),\n      white: new Color('#ffffff'),\n      gray: new Color('#bababa')\n    }\n\n    let cursorMesh = new Mesh(\n      new IcosahedronBufferGeometry(0.6, 0),\n      cursorMatcap\n    )\n    cursorMesh.visible = false\n\n    cursorMesh.scale.x = 2\n    cursorMesh.scale.y = 2\n    cursorMesh.scale.z = 2\n\n    this.o3d.add(cursorMesh)\n\n    document.documentElement.style.cursor = 'none'\n    this.lookup('element').addEventListener('mouseover', () => {\n      document.documentElement.style.cursor = 'none'\n    })\n    this.lookup('element').addEventListener('mouseleave', () => {\n      document.documentElement.style.cursor = ''\n    })\n\n    let camera = this.lookup('camera')\n    this.lookup('base').onLoop(async () => {\n      let screen = getScreen({ camera, depth: camera.position.z * 0.9 })\n      cursorMesh.position.x = mouse.x * screen.width * 0.5\n      cursorMesh.position.y = mouse.y * screen.height * 0.5\n      cursorMesh.position.z = camera.position.z * 0.9\n      cursorMesh.rotation.x += 0.01\n      cursorMesh.rotation.y += 0.01\n      cursorMesh.rotation.z += 0.01\n    })\n\n    let matcaps = {}\n    setTimeout(async () => {\n      let loader = new TextureLoader()\n      loader.load(require('./matcap/red-2.jpg'), (obj) => {\n        matcaps.red = new MeshMatcapMaterial({ transparent: true, opacity: 1.0, color: 0xffffff, matcap: obj })\n      })\n      loader.load(require('./matcap/pink.jpg'), (obj) => {\n        matcaps.pink1 = new MeshMatcapMaterial({ transparent: true, opacity: 1.0, color: 0xffffff, matcap: obj })\n      })\n      loader.load(require('./matcap/pink-2.jpg'), (obj) => {\n        matcaps.pink2 = new MeshMatcapMaterial({ transparent: true, opacity: 1.0, color: 0xffffff, matcap: obj })\n      })\n      loader.load(require('./matcap/yellow.jpg'), (obj) => {\n        matcaps.yellow = new MeshMatcapMaterial({ transparent: true, opacity: 1.0, color: 0xffffff, matcap: obj })\n      })\n    })\n    let cx = 15\n    let cy = 15 * this.screen.width / this.screen.height\n\n    if (this.screen.width < this.screen.height) {\n      cx = cx * this.screen.height / this.screen.width\n      cy *= 1.5\n    }\n\n    let total = cx * cy\n\n    let geo = starGeo\n\n    let idx = 0\n    let mapper = new Map()\n    let offsetX = (cx - 1) / 2\n    let offsetY = (cy - 1) / 2\n    let raycasterList = []\n    let group = new Object3D()\n    this.o3d.add(group)\n    for (let y = 0; y < cy; y++) {\n      for (let x = 0; x < cx; x++) {\n        let mesh = new Mesh(\n          geo,\n          undefined\n        )\n        // mesh.instanceMatrix.setUsage(DynamicDrawUsage)\n        group.add(mesh)\n        let color = new Color('#ffffff')\n        raycasterList.push(mesh)\n        mapper.set(idx, {\n          offsetX,\n          offsetY,\n          x,\n          y,\n          cx,\n          cy,\n          idx,\n          total,\n          mesh,\n          color\n        })\n        console.log(x, y)\n        idx++\n      }\n    }\n\n    // group.rotation.y = Math.PI\n    group.rotation.x = Math.PI * -0.35\n    group.rotation.z = Math.PI * 0.5\n    group.position.y = -150\n    group.position.z = -350\n\n    let mouseDown = false\n    let rayhitID = false\n    let hoverID = false\n\n    let onUpdateMouse = (pt) => {\n      let rect = this.lookup('element').getBoundingClientRect()\n\n      mouse.x = ((pt.pageX - rect.left) / rect.width) * 2 - 1\n      mouse.y = -((pt.pageY - rect.top) / rect.height) * 2 + 1\n    }\n\n    this.lookup('element').addEventListener('mousemove', (evt) => {\n      evt.preventDefault()\n      onUpdateMouse(evt)\n      cursorMesh.visible = true\n    }, { passive: false })\n\n    this.lookup('element').addEventListener('touchmove', (evt) => {\n      evt.preventDefault()\n      if (evt.touches[0]) {\n        onUpdateMouse(evt.touches[0])\n      }\n    }, { passive: false })\n\n    this.lookup('element').addEventListener('touchend', (evt) => {\n      mouseDown = false\n    }, { passive: false })\n    this.lookup('element').addEventListener('mouseup', (evt) => {\n      mouseDown = false\n    }, { passive: false })\n\n    this.lookup('element').addEventListener('touchstart', (evt) => {\n      mouseDown = true\n      evt.preventDefault()\n      if (evt.touches[0]) {\n        onUpdateMouse(evt.touches[0])\n      }\n    }, { passive: false })\n    this.lookup('element').addEventListener('mousedown', (evt) => {\n      mouseDown = true\n      evt.preventDefault()\n      onUpdateMouse(evt)\n    }, { passive: false })\n\n    this.$watch('hit', (nv, ov) => {\n      if (nv !== ov) {\n        this.$emit('hit', { index: nv, length: total })\n      }\n    })\n\n    this.lookup('base').onLoop(() => {\n      let time = window.performance.now() * 0.001\n\n      raycaster.setFromCamera(mouse, this.lookup('camera'))\n      let intersection = raycaster.intersectObjects(raycasterList)\n      // document.documentElement.style.cursor = 'none'\n      cursorMesh.material.color = colors.gray\n      if (intersection[0]) {\n        cursorMesh.material.color = colors.white\n        // document.documentElement.style.cursor = 'pointer'\n        hoverID = intersection[0].object.uuid\n        if (mouseDown) {\n          rayhitID = intersection[0].object.uuid\n        }\n      } else {\n        hoverID = false\n      }\n\n      let PI = Math.PI\n      // let sin = Math.sin\n      // let cos = Math.cos\n      // let tan = Math.tan\n      let idx = 0\n      for (let y = 0; y < cy; y++) {\n        for (let x = 0; x < cx; x++) {\n          let { mesh, color } = mapper.get(idx)\n\n          mesh.position.x = offsetX - x\n          mesh.position.y = offsetY - y\n\n          let ee = idx / total\n\n          // let radius = 350 * (ee) * 3.0\n          // let deep = -600\n          // let twist = 2.0 + Math.sin(time * 0.01)\n          let wavy = Math.sin(time + ee * PI * 0.5)\n\n          // let e = ee * PI * 2.0 * twist + Math.sin(time * PI * 0.01)\n\n          // var xx = (0.5 - Math.sin(e) * Math.sin(e)) * radius\n          // var yy = (Math.sin(e) * Math.cos(e)) * radius\n          // var zz = (0.5 - ee) * deep\n\n          // mesh.position.x = xx\n          // mesh.position.y = yy\n          // mesh.position.z = zz\n\n          mesh.position.x = offsetX - x\n          mesh.position.y = offsetY - y\n\n          mesh.position.x *= -80\n          mesh.position.y *= 80\n          // mesh.position.z = 40// * wavy\n          mesh.position.z = Math.sin(mesh.position.y * 0.003 + mesh.position.x * 0.003 + time) * 40\n\n          // mesh.position.x *= -50\n          // mesh.position.y *= 50\n          // mesh.position.z = 40// * wavy\n\n          // lowers platform\n          mesh.geometry = starGeo\n          if (rayhitID === mesh.uuid) {\n            mesh.scale.x = 35\n            mesh.scale.y = 35\n            mesh.scale.z = 35\n            if (matcaps.pink1) {\n              mesh.material = matcaps.pink1\n            }\n            mesh.geometry = heartGeo\n            this.hit = idx\n          } else if (hoverID === mesh.uuid) {\n            if (matcaps.pink2) {\n              mesh.material = matcaps.pink2\n            }\n          } else {\n            mesh.scale.x = 20\n            mesh.scale.y = 20\n            mesh.scale.z = 20\n            if (matcaps.yellow) {\n              mesh.material = matcaps.yellow\n              // color.setHSL(offsetX - x + Math.sin(x * 3.14 * 2.0 + time * 0.5), 0.65, 0.65)\n              mesh.material.color = color\n            }\n          }\n          if (mesh.geometry === starGeo) {\n            mesh.rotation.x = 0 + Math.sin(mesh.position.z * 0.01) * Math.PI * 0.75\n            mesh.rotation.y = 0\n            mesh.rotation.z = time + wavy\n          } else {\n            mesh.rotation.x = 0\n            mesh.rotation.y = 0\n            mesh.rotation.z = time * 2.0 + wavy\n          }\n          // mesh.rotation.x = Math.PI * 0.5\n          idx++\n        }\n      }\n    })\n  },\n  beforeDestroy () {\n  }\n}\n</script>\n\n<style>\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./HeartGridSea.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./HeartGridSea.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./HeartGridSea.vue?vue&type=template&id=329173ec&\"\nimport script from \"./HeartGridSea.vue?vue&type=script&lang=js&\"\nexport * from \"./HeartGridSea.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","module.exports = __webpack_public_path__ + \"img/pink.fc697929.jpg\";","module.exports = __webpack_public_path__ + \"img/pink-2.f3df29ec.jpg\";","module.exports = __webpack_public_path__ + \"img/yellow.ce283a21.jpg\";","export default __webpack_public_path__ + \"4dc84a905e1850c3ae3d5f4bd56694e4.fbx\";","module.exports = __webpack_public_path__ + \"img/silver.9f53adb6.png\";","module.exports = __webpack_public_path__ + \"img/red-2.601c7df2.jpg\";","export default __webpack_public_path__ + \"c6091dba5a824a2e655f5c698301bc4c.fbx\";"],"sourceRoot":""}