index.js 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. Component({
  2. // behaviors: [require('../common/share-behavior').default],
  3. properties: {
  4. a: Number,
  5. },
  6. data: {
  7. loaded: false,
  8. arReady: false,
  9. },
  10. lifetimes: {
  11. async attached() {
  12. console.log('data', this.data)
  13. }
  14. },
  15. methods: {
  16. handleReady({
  17. detail
  18. }) {
  19. const xrScene = this.scene = detail.value;
  20. this.mat = new(wx.getXrFrameSystem().Matrix4)();
  21. console.log('xr-scene', xrScene)
  22. this.triggerEvent('ready')
  23. },
  24. handleAssetsProgress: function ({
  25. detail
  26. }) {
  27. // console.log('assets progress', detail.value.progress);
  28. const progress =
  29. Math.floor(detail.value.progress * 100)
  30. this.triggerEvent('progress', progress)
  31. },
  32. handleAssetsLoaded: function ({
  33. detail
  34. }) {
  35. console.log('assets loaded', detail.value);
  36. const el = detail.value.target;
  37. // this.setData({loaded: true});
  38. this.scene.event.addOnce('touchstart', this.placeNode.bind(this));
  39. this.triggerEvent('loaded')
  40. },
  41. handleARReady: function ({
  42. detail
  43. }) {
  44. console.log('arReady', this.scene.ar.arVersion);
  45. },
  46. placeNode(event) {
  47. const {
  48. clientX,
  49. clientY
  50. } = event.touches[0];
  51. const {
  52. frameWidth: width,
  53. frameHeight: height
  54. } = this.scene;
  55. if (clientY / height > 0.8 && clientX / width < 0.2) {
  56. this.scene.getNodeById('setitem').visible = false;
  57. this.scene.ar.resetPlane();
  58. } else {
  59. this.scene.ar.placeHere('setitem', true);
  60. console.error('show-gltf')
  61. if (this.video) {
  62. this.video.play()
  63. }
  64. }
  65. this.scene.event.addOnce('touchstart', this.placeNode.bind(this));
  66. },
  67. handleGLTFLoaded({
  68. detail
  69. }) {
  70. const el = detail.value.target;
  71. console.error('handleGLTFLoaded')
  72. const gltf = el.getComponent("gltf");
  73. const video = this.scene.assets.getAsset("video-texture", "cat");
  74. const newMat = this.scene.assets.getAsset("material", "catMat");
  75. this.video = video
  76. for (const mesh of gltf.getPrimitivesByNodeName("video")) {
  77. mesh.material = newMat
  78. }
  79. }
  80. }
  81. })