index.js 9.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346
  1. Component({
  2. behaviors: [require('../common/share-behavior').default],
  3. properties: {
  4. captureState: {
  5. type: Number,
  6. value: 0,
  7. observer: function (newVal, oldVal) {
  8. if (newVal !== oldVal) {
  9. if (newVal === 1) {
  10. this.capture();
  11. this.ShowModel();
  12. }
  13. }
  14. },
  15. },
  16. recordState: {
  17. type: Number,
  18. value: 0,
  19. observer: function (newVal, oldVal) {
  20. if (newVal !== oldVal) {
  21. if (newVal === 0) {
  22. this.recordEnd();
  23. } else {
  24. this.recordStart();
  25. }
  26. }
  27. }
  28. },
  29. captureQuality: {
  30. type: Number,
  31. value: 0.8,
  32. },
  33. captureType: {
  34. type: String,
  35. value: 'jpg',
  36. },
  37. recordFPS: {
  38. type: Number,
  39. value: 30,
  40. },
  41. recordWidth: {
  42. type: Number,
  43. value: undefined,
  44. },
  45. recordHeight: {
  46. type: Number,
  47. value: undefined,
  48. },
  49. recordBPS: {
  50. type: Number,
  51. value: 1000,
  52. },
  53. uiShowModelView:{
  54. type: Boolean,
  55. value: false,
  56. observer: function (newVal, oldVal) {
  57. if (newVal !== oldVal) {
  58. if(newVal){
  59. //this.ShowModel(1);
  60. }else{
  61. this.CloseModel();
  62. }
  63. }
  64. },
  65. },
  66. uiShowIndex:{
  67. type: Number,
  68. value: 0,
  69. observer: function (newVal, oldVal) {
  70. if (newVal !== oldVal) {
  71. this.ShowModel(newVal);
  72. }
  73. },
  74. }
  75. },
  76. data: {
  77. loaded: false,
  78. loadedSaoMiao:false,
  79. loaded: false,
  80. arReady: false,
  81. loaded2:false,
  82. position2:[0,0,0],
  83. rot:0,
  84. str:"1",
  85. luanniaoShow:false,
  86. fuzhuShow:false,
  87. yinglongShow:false,
  88. nianshouShow:false,
  89. },
  90. lifetimes: {
  91. async attached() {
  92. console.log('data', this.data);
  93. }
  94. },
  95. methods: {
  96. handleReady: function ({detail}) {
  97. const xrScene = this.scene = detail.value;
  98. console.log('xr-scene', xrScene);
  99. this.binglong = {el:this.scene.getElementById('binglong')};
  100. const scene = this.scene = detail.value;
  101. const appHide = () => this.scene.share.recordPause();
  102. const appShow = () => this.scene.share.recordResume();
  103. wx.onAppHide(appHide);
  104. wx.onAppShow(appShow);
  105. wx.offAppHide(appHide);
  106. wx.offAppShow(appShow);
  107. this.triggerEvent('sceneReady', {width: scene.width, height: scene.height});
  108. const fireworkField = xrScene.getElementById("firework");
  109. const tempSystem = fireworkField.getComponent('custom-particle')
  110. tempSystem.addSizeGradient(0,0.2);
  111. tempSystem.addSizeGradient(3,1);
  112. var myData ={}
  113. myData = {
  114. "capacity": 100,
  115. "emitRate": 0, //子发射器不进行每秒发射
  116. "burstCount": 100, // 一次爆发200粒子
  117. "burstTime": 0, // 爆发延时为0
  118. "burstCycle": 1, // 发射一次
  119. "size":[0.05],
  120. "startColor":[1,0.3,0.1,1],
  121. "endColor":[1,1,1,0],
  122. "emitterType":"SphereShape",
  123. "emitterProps": [["radius","0.5"]],
  124. "lifeTime":[1], // 粒子生命周期为3秒
  125. "stopDuration":[2], // 子发射器生命周期为3秒
  126. "speed":"2",
  127. "texture":"flarePicture"
  128. }
  129. var subEmitter = tempSystem.createSubEmitter(myData)
  130. subEmitter.state = 1 // 设置为1为当粒子消失后出现作用子发射器
  131. //可以规定多个子发射器的阵列
  132. tempSystem.subEmitters = [subEmitter]
  133. const fireworkField2 = xrScene.getElementById("firework2");
  134. const tempSystem2 = fireworkField2.getComponent('custom-particle')
  135. tempSystem2.addSizeGradient(0,0.2);
  136. tempSystem2.addSizeGradient(3,1);
  137. var myData2 ={}
  138. myData2 = {
  139. "capacity": 100,
  140. "emitRate": 0, //子发射器不进行每秒发射
  141. "burstCount": 100, // 一次爆发200粒子
  142. "burstTime": 0.1, // 爆发延时为0
  143. "burstCycle": 1, // 发射一次
  144. "size":[0.05],
  145. "startColor":[1,0.5,0.8,1],
  146. "endColor":[1,1,1,0],
  147. "emitterType":"SphereShape",
  148. "emitterProps": [["radius","0.5"]],
  149. "lifeTime":[1], // 粒子生命周期为3秒
  150. "stopDuration":[2], // 子发射器生命周期为3秒
  151. "speed":"2",
  152. "texture":"flarePicture"
  153. }
  154. var subEmitter2 = tempSystem2.createSubEmitter(myData2)
  155. subEmitter2.state = 1 // 设置为1为当粒子消失后出现作用子发射器
  156. //可以规定多个子发射器的阵列
  157. tempSystem2.subEmitters = [subEmitter2]
  158. const fireworkField3 = xrScene.getElementById("firework3");
  159. const tempSystem3 = fireworkField3.getComponent('custom-particle')
  160. tempSystem3.addSizeGradient(0,0.2);
  161. tempSystem3.addSizeGradient(3,1);
  162. var myData3 ={}
  163. myData3 = {
  164. "capacity": 100,
  165. "emitRate": 0, //子发射器不进行每秒发射
  166. "burstCount": 100, // 一次爆发200粒子
  167. "burstTime": 0.1, // 爆发延时为0
  168. "burstCycle": 1, // 发射一次
  169. "size":[0.05],
  170. "startColor":[1,1,0.5,1],
  171. "endColor":[1,1,1,0],
  172. "emitterType":"SphereShape",
  173. "emitterProps": [["radius","0.5"]],
  174. "lifeTime":[1], // 粒子生命周期为3秒
  175. "stopDuration":[2], // 子发射器生命周期为3秒
  176. "speed":"2",
  177. "texture":"flarePicture"
  178. }
  179. var subEmitter3 = tempSystem3.createSubEmitter(myData3)
  180. subEmitter3.state = 1 // 设置为1为当粒子消失后出现作用子发射器
  181. //可以规定多个子发射器的阵列
  182. tempSystem3.subEmitters = [subEmitter3]
  183. },
  184. handleAssetsProgress: function({detail}) {
  185. this.triggerEvent('assetsProgress', detail.value);
  186. },
  187. handleAssetsLoaded: function ({detail}) {
  188. console.log('assets loaded', detail.value);
  189. this.triggerEvent('assetsLoaded', detail.value);
  190. this.setData({
  191. loaded: true
  192. });
  193. },handleGltfLoaded2: function() {
  194. },handleGltfLoaded: function() {
  195. },
  196. handleTrackerSwitch: function ({detail}) {
  197. const active = detail.value;
  198. if(active)
  199. {
  200. this.setData({
  201. loaded2: true
  202. });
  203. }
  204. },handleARTrackerState({detail}) {
  205. // 事件的值即为`ARTracker`实例
  206. const tracker = detail.value;
  207. // 获取当前状态和错误信息
  208. const {state, errorMessage} = tracker;
  209. const element = detail.el;
  210. if( state==2)
  211. {
  212. this.triggerEvent('assetsstr',"state" + state);
  213. /*
  214. this.triggerEvent('assetsstr',"x:" + (180/Math.PI* element.scene.getNodeById("Marker").rotation.x) +"\ny:" + (180/Math.PI*element.scene.getNodeById("Marker").rotation.y)+"\nz:" + (180/Math.PI*element.scene.getNodeById("Marker").rotation.z));*/
  215. }
  216. },
  217. handleAnimationStop: function() {
  218. console.log('animation Stop');
  219. },
  220. /* handleGLTFLoadedbingLong:function({detail}){
  221. const el2 = detail.value;
  222. var state = true;
  223. const xrScene = this.scene;
  224. const xrFrameSystem = wx.getXrFrameSystem();
  225. const myModel = xrScene.getElementById('binglong');
  226. this.myModelAnimator = myModel.getComponent(xrFrameSystem.Animator);
  227. const clips = this.myModelAnimator._clips;
  228. this.clipName = []
  229. clips.forEach((v, key) => {
  230. if (key.indexOf('pose') == -1) {
  231. this.clipName.push(key)
  232. }
  233. })
  234. wx.showToast({
  235. title: this.clipName[0],
  236. });
  237. this.myModelAnimator.play.play(this.clipName[0],{ loop:5,});
  238. var interval = setInterval(function() {
  239. if(false)
  240. {
  241. clearInterval(interval);
  242. }
  243. console.log(5000 +" 毫秒更新");
  244. if(state)
  245. {
  246. state = false;
  247. this.myModelAnimator.play.play(this.clipName[1],{ loop:5,});
  248. }else{
  249. state = true;
  250. this.myModelAnimator.play.play(this.clipName[2],{ loop:5,});
  251. el2.position =(0 -2.5 -40);
  252. }
  253. }, 5000)
  254. },*/
  255. capture() {
  256. this.scene.share.captureToFriends({
  257. fileType: this.data.captureType,
  258. quality: this.data.captureQuality
  259. });
  260. },
  261. recordStart() {
  262. console.log('recordStart')
  263. wx.updateShareMenu({
  264. withShareTicket: true,
  265. success () { }
  266. })
  267. this.scene.share.recordStart({
  268. fps: this.data.recordFPS,
  269. videoBitsPerSecond: this.data.recordBPS,
  270. width: this.data.recordWidth,
  271. height: this.data.recordHeight
  272. });
  273. },
  274. recordEnd() {
  275. console.log('recordEnd')
  276. //
  277. const tempFilePath = this.scene.share.recordFinishToAlbum({
  278. fps: this.data.recordFPS,
  279. videoBitsPerSecond: this.data.recordBPS,
  280. width: this.data.recordWidth,
  281. height: this.data.recordHeight
  282. });
  283. wx.shareVideoMessage({
  284. videoPath: tempFilePath,
  285. });
  286. },
  287. ShowModel(modelIndex){
  288. console.log(' ShowMoelIndex ',modelIndex);
  289. switch(modelIndex){
  290. case 0:
  291. this.setData({luanniaoShow:true});
  292. break;
  293. case 1:
  294. this.setData({yinglongShow:true});
  295. break;
  296. case 2:
  297. this.setData({fuzhuShow:true});
  298. break;
  299. case 3:
  300. this.setData({nianshouShow:true});
  301. break;
  302. }
  303. },
  304. CloseModel(){
  305. this.setData({longshow:false});
  306. this.setData({binglongshow:false});
  307. this.setData({lanjiachongshow:false});
  308. }
  309. }
  310. })