【更新】：

1.添加数据上报功能；
2.视频第一页显示优化；
3.测试状态不验证token；
4.开屏loading页面，强制横屏；
5.添加jquery；

assets/main/SceneMain.fire

@@ -73,21 +73,18 @@
       },
       {
         "__id__": 5
-      },
-      {
-        "__id__": 7
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 14
+        "__id__": 12
       },
       {
-        "__id__": 15
+        "__id__": 13
       },
       {
-        "__id__": 16
+        "__id__": 14
       }
     ],
     "_prefab": null,
@@ -236,100 +233,6 @@
     "_alignWithScreen": true,
     "_id": "ea1MDxU7BPMb9AjP2dy+Az"
   },
-  {
-    "__type__": "cc.Node",
-    "_name": "bg",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 2
-    },
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 6
-      }
-    ],
-    "_prefab": null,
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 2480,
-      "height": 1440
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": "57dpEEmjdEWpMBbWM5m+k8"
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 5
-    },
-    "_enabled": true,
-    "_materials": [
-      {
-        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
-      }
-    ],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": {
-      "__uuid__": "7d07c1e2-73b5-410d-998f-dbe6f1cc8026"
-    },
-    "_type": 0,
-    "_sizeMode": 1,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_atlas": null,
-    "_id": "ebD4sGX51Ek7m3NGwtQQY4"
-  },
   {
     "__type__": "cc.Node",
     "_name": "btnNext",
@@ -339,19 +242,19 @@
     },
     "_children": [
       {
-        "__id__": 8
+        "__id__": 6
       }
     ],
     "_active": false,
     "_components": [
       {
-        "__id__": 10
+        "__id__": 8
       },
       {
-        "__id__": 11
+        "__id__": 9
       },
       {
-        "__id__": 12
+        "__id__": 10
       }
     ],
     "_prefab": null,
@@ -407,13 +310,13 @@
     "_name": "label",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 7
+      "__id__": 5
     },
     "_children": [],
     "_active": true,
     "_components": [
       {
-        "__id__": 9
+        "__id__": 7
       }
     ],
     "_prefab": null,
@@ -469,7 +372,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 8
+      "__id__": 6
     },
     "_enabled": true,
     "_materials": [
@@ -502,7 +405,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 7
+      "__id__": 5
     },
     "_enabled": true,
     "_materials": [
@@ -534,7 +437,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 7
+      "__id__": 5
     },
     "_enabled": true,
     "alignMode": 1,
@@ -561,7 +464,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 7
+      "__id__": 5
     },
     "_enabled": true,
     "_normalMaterial": null,
@@ -570,7 +473,7 @@
     "zoomScale": 1.2,
     "clickEvents": [
       {
-        "__id__": 13
+        "__id__": 11
       }
     ],
     "_N$interactable": true,
@@ -679,7 +582,7 @@
       "__uuid__": "cd07e761-75fb-4f91-be77-c08f86d00457"
     },
     "btnNext": {
-      "__id__": 7
+      "__id__": 5
     },
     "_id": "80oQpM9U1KTIx7FH0iSB/b"
   },

assets/main/SceneMain.ts

@@ -1,6 +1,6 @@
 cc.macro.ENABLE_TRANSPARENT_CANVAS = true;
 
-import common, { AttributeGame, AttributeUnit } from "../src/common/common";
+import common, { AttributeGame, AttributeUnit, UitlData } from "../src/common/common";
 import CConst from "../src/common/CConst";
 import NotifierCenter from "../src/webtcp/NotifierCenter";
 import Loader from "../src/config/Loader";
@@ -60,13 +60,13 @@ export default class Scene extends cc.Component {
     /** 游戏开始 */
     async start() {
         common.hideLoading();
-        let result = await this.checkUser();
+        let result = common.isDebug ? true : await this.checkUser();
         if (result) {
             this.enterGame();
         }
         else {
             const options = {
-                title: '弹窗',
+                title: '',
                 content: '请下载应用！'
             };
             const params = {
@@ -81,12 +81,10 @@ export default class Scene extends cc.Component {
     /** 用户检测 */
     async checkUser(): Promise<boolean> {
         // 验证token
-        let url = 'https://open.api.luojigou.vip/mall/mobile/common/verify/token';
         let token = Tools.getLocalStorage('token', null);
-        common.log('token验证 url: ', url, '; token: ', token);
         return new Promise((resolve) => {
             let xhr = new XMLHttpRequest();
-            xhr.open("GET", url, true);
+            xhr.open("GET", common.urlToken, true);
             xhr.setRequestHeader('token', token);
             xhr.onreadystatechange = function () {
                 if (xhr.readyState === 4 && (xhr.status >= 200 && xhr.status < 300)) {
@@ -105,10 +103,10 @@ export default class Scene extends cc.Component {
     /** 进入游戏 */
     async enterGame() {
         // 获取网络地址信息
-        let json = Tools.getNetLocationInfo();
-        common.log("网络数据：", JSON.stringify(json, null, 4));
+        let json: UitlData = Tools.getNetLocationInfo();
         let unitNum = json.modelId ? json.modelId : common.unitCur;
         common.setUnitNum(unitNum);
+        common.setItemId(json.itemId);
         let isHas = await this.initData(unitNum);
         if (isHas) {
             await AudioCB.instance.init();
@@ -124,8 +122,8 @@ export default class Scene extends cc.Component {
         }
         else {
             const options = {
-                title: '弹窗',
-                content: '当前集数不存在！',
+                title: '',
+                content: '当前动画游戏不存在！',
             };
             const params = {
                 mode: PopupCacheMode.Once,
@@ -229,10 +227,15 @@ export default class Scene extends cc.Component {
     }
 
     resetBtnNext(show) {
-        this.btnNext.active = false;// 显示下一步按钮
-        if (!show) return;
-        let gameOne = common.getGameFormLocal();
-        this.btnNext.active = Number(gameOne) >= 0;
+        if (common.isDebug) {
+            this.btnNext.active = true;
+        }
+        else{
+            this.btnNext.active = false;// 显示下一步按钮
+            if (!show) return;
+            let gameOne = common.getGameFormLocal();
+            this.btnNext.active = Number(gameOne) >= 0;
+        }
     }
 
     /**
@@ -275,10 +278,18 @@ export default class Scene extends cc.Component {
         let curPage = common.getPageNum();
         let attribute: AttributeUnit = common.attributeMap[curUint];
         let length = attribute.config.length;
-        if (curPage > length - 1) {
-            return;
+        console.log('curPage: ', curPage, '; length: ', length);
+        if (curPage < length) {
+            this.addPrefab(curUint, curPage + 1);
+        }
+        else{
+            let token = Tools.getLocalStorage('token', null);
+            let xhr = new XMLHttpRequest();
+            xhr.open("GET", common.urlOver, true);
+            xhr.setRequestHeader('itemId', common.getItemId());
+            xhr.setRequestHeader('token', token);
+            xhr.send();
         }
-        this.addPrefab(curUint, curPage + 1);
     }
 
     /**

assets/res/videoPlayer/res/prefab/videoPlayer.prefab

@@ -209,9 +209,6 @@
     ],
     "_active": true,
     "_components": [
-      {
-        "__id__": 14
-      },
       {
         "__id__": 16
       }
@@ -388,10 +385,13 @@
       },
       {
         "__id__": 12
+      },
+      {
+        "__id__": 13
       }
     ],
     "_prefab": {
-      "__id__": 13
+      "__id__": 15
     },
     "_opacity": 255,
     "_color": {
@@ -499,23 +499,12 @@
     "_originalHeight": 0,
     "_id": ""
   },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "6937c4f4-77ad-4091-aac0-c5e69333a25d"
-    },
-    "fileId": "38NAYRKc9OBa39f6W1HN/x",
-    "sync": false
-  },
   {
     "__type__": "cc.Button",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 6
+      "__id__": 10
     },
     "_enabled": true,
     "_normalMaterial": null,
@@ -524,7 +513,7 @@
     "zoomScale": 1.2,
     "clickEvents": [
       {
-        "__id__": 15
+        "__id__": 14
       }
     ],
     "_N$interactable": true,
@@ -592,6 +581,17 @@
     "handler": "eventTouch",
     "customEventData": ""
   },
+  {
+    "__type__": "cc.PrefabInfo",
+    "root": {
+      "__id__": 1
+    },
+    "asset": {
+      "__uuid__": "6937c4f4-77ad-4091-aac0-c5e69333a25d"
+    },
+    "fileId": "38NAYRKc9OBa39f6W1HN/x",
+    "sync": false
+  },
   {
     "__type__": "cc.Widget",
     "_name": "",

assets/res/videoPlayer/src/VideoPlayer.ts

@@ -46,8 +46,9 @@ export default class VideoPlayer extends GameBase {
     /** 事件-视频相关 */
     eventVideo(videoplayer: cc.VideoPlayer, event: cc.VideoPlayer.EventType, customEventData): void {
         common.log('视频：', this.getStatus(event), '; url: ', videoplayer.remoteURL);
-        if(event === cc.VideoPlayer.EventType.PLAYING){
+        if (this.video.isPlaying()) {
             this.nodeStart.active = false;
+            common.log('视频播放');
         }
         else if(event === cc.VideoPlayer.EventType.READY_TO_PLAY){
             this.playVideo();

assets/resources/prefab/popUp.prefab

@@ -746,7 +746,7 @@
   },
   {
     "__type__": "cc.Node",
-    "_name": "content",
+    "_name": "title",
     "_objFlags": 0,
     "_parent": {
       "__id__": 18
@@ -764,14 +764,14 @@
     "_opacity": 255,
     "_color": {
       "__type__": "cc.Color",
-      "r": 90,
-      "g": 189,
-      "b": 203,
+      "r": 142,
+      "g": 138,
+      "b": 117,
       "a": 255
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 58,
+      "width": 300,
       "height": 36.54
     },
     "_anchorPoint": {
@@ -784,7 +784,7 @@
       "ctor": "Float64Array",
       "array": [
         0,
-        50,
+        40,
         0,
         0,
         0,
@@ -837,7 +837,7 @@
     "_N$horizontalAlign": 1,
     "_N$verticalAlign": 1,
     "_N$fontFamily": "Arial",
-    "_N$overflow": 0,
+    "_N$overflow": 3,
     "_N$cacheMode": 0,
     "_id": ""
   },
@@ -849,12 +849,12 @@
     "asset": {
       "__uuid__": "508a53bb-f5d5-4fce-9847-3365dcf24782"
     },
-    "fileId": "c4G6Poa71GsaxQ2HIwj59P",
+    "fileId": "28VD8YNKtC5pnLnwXAWSio",
     "sync": false
   },
   {
     "__type__": "cc.Node",
-    "_name": "title",
+    "_name": "content",
     "_objFlags": 0,
     "_parent": {
       "__id__": 18
@@ -872,14 +872,14 @@
     "_opacity": 255,
     "_color": {
       "__type__": "cc.Color",
-      "r": 142,
-      "g": 138,
-      "b": 117,
+      "r": 90,
+      "g": 189,
+      "b": 203,
       "a": 255
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 300,
+      "width": 159.5,
       "height": 36.54
     },
     "_anchorPoint": {
@@ -892,7 +892,7 @@
       "ctor": "Float64Array",
       "array": [
         0,
-        -20,
+        -10,
         0,
         0,
         0,
@@ -931,8 +931,8 @@
     ],
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
-    "_string": "xxxxxxxxxxxxxxxxxx",
-    "_N$string": "xxxxxxxxxxxxxxxxxx",
+    "_string": "xxxxxxxxxxx",
+    "_N$string": "xxxxxxxxxxx",
     "_fontSize": 29,
     "_lineHeight": 29,
     "_enableWrapText": true,
@@ -945,7 +945,7 @@
     "_N$horizontalAlign": 1,
     "_N$verticalAlign": 1,
     "_N$fontFamily": "Arial",
-    "_N$overflow": 3,
+    "_N$overflow": 0,
     "_N$cacheMode": 0,
     "_id": ""
   },
@@ -957,7 +957,7 @@
     "asset": {
       "__uuid__": "508a53bb-f5d5-4fce-9847-3365dcf24782"
     },
-    "fileId": "28VD8YNKtC5pnLnwXAWSio",
+    "fileId": "c4G6Poa71GsaxQ2HIwj59P",
     "sync": false
   },
   {
@@ -1104,10 +1104,10 @@
       "__id__": 5
     },
     "titleLabel": {
-      "__id__": 23
+      "__id__": 20
     },
     "contentLabel": {
-      "__id__": 20
+      "__id__": 23
     },
     "confirmBtn": {
       "__id__": 27

assets/src/common/Tools.ts

@@ -1,4 +1,5 @@
 import AudioCB, { AudioOrder } from "../audioUitls/AudioCB";
+import common, { UitlData } from "./common";
 
 class Tools {
     private static _instance: Tools;
@@ -411,10 +412,10 @@ class Tools {
     };
 
     /** 从网络地址信息 */
-    getNetLocationInfo() {
+    getNetLocationInfo(): UitlData {
         let http = window.location.href;
         let arrHttp = http.split("?");
-        let json: any = { url: arrHttp[0] };
+        let json = new UitlData();
         if (arrHttp && arrHttp.length > 1) {
             let arrObj = arrHttp[1].split("&");
             for (let index = 0; index < arrObj.length; index++) {
@@ -422,6 +423,7 @@ class Tools {
                 json[arrInfo[0]] = arrInfo[1];
             }
         }
+        console.log('网络地址信息：', JSON.stringify(json, null, 4));
         return json;
     };
 

assets/src/common/common.ts

@@ -20,6 +20,12 @@ export class AttributeGame {
     scriptName: string;
 }
 
+export class UitlData {
+    url: string;
+    modelId?: number;
+    itemId?: string;
+}
+
 class common {
     private static _instance: common;
     public static getInstance(): common {
@@ -33,10 +39,21 @@ class common {
 
     isDebug: boolean = false;
     project: string = "luojigou_yinliu";
-    unitCur: number = 3;// 第几集，从1开始
-    pageCur: number = 6;// 第几个游戏，从1开始
+    itemId: string = '';
+    unitCur: number = 2;// 第几集，从1开始
+    pageCur: number = 1;// 第几个游戏，从1开始
     isCanPlayVideo = false;
     attributeMap: any = {};// 内部形式为 { "0" : AttributeUtil } 
+    urlToken: string = 'https://open.api.luojigou.vip/mall/mobile/common/verify/token';// 验证token的地址；
+    urlOver: string = 'https://open.api.luojigou.vip/app/app/gameCourse/record/12321312';// 当前集游戏完结，上报地址；
+
+    getItemId(){
+        return this.itemId;
+    };
+
+    setItemId(id){
+        this.itemId = id;
+    };
 
     getUnitNum() {
         return this.unitCur > 0 ? this.unitCur : 1;
@@ -65,7 +82,6 @@ class common {
     getGameFormLocal(): number {
         let objLocal: any = Tools.getLocalStorage(this.project, null);
         objLocal = JSON.parse(objLocal);
-        this.log("获取本地数据：", JSON.stringify(objLocal, null, 4));
         if (!objLocal) return -1;
         if (!objLocal.objUnit) return -1;
         let unitOne = objLocal.objUnit[this.getUnitNum()];
@@ -101,7 +117,6 @@ class common {
             objLocal.objUnit[unit] = {};
             objLocal.objUnit[unit][page] = page;
         }
-        this.log("设置本地数据：", JSON.stringify(objLocal, null, 4));
         Tools.setLocalStorage(this.project, JSON.stringify(objLocal));
     };
 

build-templates/web-mobile/index.html

@@ -4,6 +4,42 @@
 <head>
     <meta charset="utf-8">
 
+    <style>
+        @media screen and (orientation: portrait) {
+            html {
+                width: 100%;
+                height: 100%;
+                overflow: hidden;
+            }
+            body {
+                width: 100%;
+                height: 100%;
+                overflow: hidden;
+            }
+            #splash {
+                position: absolute;
+            }
+        }
+        
+        @media screen and (orientation: landscape) {
+            html {
+                width: 100%;
+                height: 100%;
+            }
+            body {
+                width: 100%;
+                height: 100%;
+            }
+            #splash {
+                position: absolute;
+                top: 0;
+                left: 0;
+                width: 100%;
+                height: 100%;
+            }
+        }
+    </style>
+
     <title>与逻辑狗一起玩转思维</title>
 
     <!--http://www.html5rocks.com/en/mobile/mobifying/-->
@@ -50,7 +86,37 @@
     </div>
 
     <script src="src/settings.js" charset="utf-8"></script>
-
+    <script src="js/jquery.min.js" charset="utf-8"></script>
+    <script>
+        // 试试横屏
+        let funcScreen = () => {
+            let width = document.documentElement.clientWidth;
+            let height = document.documentElement.clientHeight;
+            splash = $('#splash');
+            if (width < height) {
+                splash.width(height);
+                splash.height(width);
+                splash.css('top', (height - width) / 2);
+                splash.css('left', 0 - (height - width) / 2);
+                splash.css('transform', 'rotate(90deg)');
+                splash.css('transform-origin', '50% 50%');
+            } else {
+                splash.width(width);
+                splash.height(height);
+                splash.css('top', 0);
+                splash.css('left', 0);
+                splash.css('transform', 'none');
+                splash.css('transform-origin', '50% 50%');
+            }
+        };
+        funcScreen();
+        var evt = "onorientationchange" in window ? "orientationchange" : "resize";
+        window.addEventListener(evt, () => {
+            setTimeout(() => {
+                funcScreen();
+            }, 100);
+        })
+    </script>
     <script src="main.js" charset="utf-8"></script>
 
     <script type="text/javascript">

build-templates/web-mobile/style-mobile.css

@@ -106,7 +106,7 @@ p.footer {
 .progress-bar span {
     display: block;
     height: 100%;
-    border-radius: 10px;
+    border-radius: 16px;
     transition: width .4s ease-in-out;
     background-color: #3dc5de;
 }