Commit 0c3f1ae8 authored by 范雪寒's avatar 范雪寒

feat:

parent af9dfdb5
......@@ -47,15 +47,10 @@ cc.Class({
if (err) {
return this.asyncDelayLog(err);
}
bundle.loadScene(configData.sceneName, null, null, (err, scene) => {
if (err) {
this.asyncDelayLog('err: ', err);
}
const canvas = cc.find('Canvas');
canvas.emit('MIDDLE_LAYER_LOADED', { scene });
globalThis.SCENE_INFO = scene
// cc.director.runScene(scene);
});
const canvas = cc.find('Canvas');
canvas.emit('MIDDLE_LAYER_LOADED', { scene: null });
globalThis.configData = configData;
});
});
},
......
import { MyCocosSceneComponent } from "../script/MyCocosSceneComponent";
// @ts-ignore
import { assign, createMachine, interpret, actions, forwardTo, matchesState } from "../script/xstate";
const { pure , send, raise, sendParent } = actions;
import { assign, createMachine, interpret, actions, forwardTo, matchesState } from "../script/xstate";
const { pure, send, raise, sendParent } = actions;
const { ccclass, property } = cc._decorator;
......@@ -51,34 +51,34 @@ export default class SceneComponent extends MyCocosSceneComponent {
@property([cc.Node])
FullPageNode: cc.Node[] = [];
tw: cc.Tween = null;
gameMachineService: any = null;
LoadingCount: number = 0;
start(){
start() {
this.LoadingCount = 0;
this.showWaitingLetters();
this.initBg();
this.initSubmarineView();
this.createFiniteStateMachines();
this.BackViewButtons.forEach(b => {
b.on(cc.Node.EventType.TOUCH_START, function(){
b.on(cc.Node.EventType.TOUCH_START, function () {
this.gameMachineService.send('BACK');
// this.node.emit('BACK');
}, this, true);
});
for (let bs of [this.SpaceViewButtons, this.SubmarineViewButtons, this.LetterViewButtons, this.StoryViewButtons, this.ReviewViewButtons]) {
bs.forEach(b => {
// const env = this;
b.on(cc.Node.EventType.TOUCH_START, function(){
b.on(cc.Node.EventType.TOUCH_START, function () {
// this.gameMachineService.send('BACK')
// env.node.emit('BACK');
const [buttonName, state, index] = b.name.split('@');
console.log(buttonName, state, index);
let stateName = b.parent.name;
if (stateName.includes('@')) {
......@@ -86,33 +86,33 @@ export default class SceneComponent extends MyCocosSceneComponent {
stateName = sn;
}
console.log(stateName);
const currentDataset = this.gameMachineService.machine.config.context[stateName + 'Data'];
if (!currentDataset || !currentDataset[index]) {
return;
}
const linkFlag = stateName === 'LetterView';
globalThis.PREV_STATE = globalThis.CURRENT_STATE ? JSON.parse(JSON.stringify(globalThis.CURRENT_STATE)) : null;
globalThis.PREV_STATE = globalThis.CURRENT_STATE ? JSON.parse(JSON.stringify(globalThis.CURRENT_STATE)) : null;
const param = JSON.parse(JSON.stringify(currentDataset[index]));
globalThis.CURRENT_STATE = {
state,
data: {...param, buttonName, linkFlag }
data: { ...param, buttonName, linkFlag }
}
console.log(globalThis.PREV_STATE ,globalThis.CURRENT_STATE );
console.log(globalThis.PREV_STATE, globalThis.CURRENT_STATE);
globalThis.CURRENT_PID = param.pid;
globalThis.CURRENT_ID = param.id;
this.gameMachineService.send(state, {...param, buttonName, linkFlag });
this.gameMachineService.send(state, { ...param, buttonName, linkFlag });
}, this, true);
});
}
globalThis.aaa =this;
globalThis.aaa = this;
}
initBg() {
// const bgNode = cc.find('Canvas/MainScene/SpaceView/bg');
this.FullPageNode.forEach(n => {
n.scale = this._mapScaleMax;
});
}
......@@ -131,22 +131,22 @@ export default class SceneComponent extends MyCocosSceneComponent {
}
initSubmarineView(){
initSubmarineView() {
this.submarineView.node.on('scrolling', this.moveSubmarineBackground, this);
}
moveSubmarineBackground(){
moveSubmarineBackground() {
//获取滚动视图相对于左上角原点的当前滚动偏移
let scrollOffset: cc.Vec2 = this.submarineView.getScrollOffset();
// console.log(scrollOffset.x);
this.submarineViewBackground.x = scrollOffset.x * 0.65;
}
createFiniteStateMachines() {
const canvas = cc.find('Canvas');
canvas.on('MIDDLE_LAYER_LOADED', ({scene}) => {
canvas.on('MIDDLE_LAYER_LOADED', ({ scene }) => {
this.hideWaitingLetters();
});
const operationState = {
......@@ -161,7 +161,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
currentDataset: null,
},
states: {
SpaceView: {
entry: (ctx, event) => {
this.LetterView.active = false;
......@@ -172,69 +172,69 @@ export default class SceneComponent extends MyCocosSceneComponent {
cc.audioEngine.playMusic(this.bgMusic1, true);
// event.type !== 'BACK'
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507', (resp: any)=> {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp
rows = rows.filter(r => !r.has_courseware);
console.log('SpaceView', rows )
ctx.SpaceViewData = rows;
ctx.currentDataset = rows;
}
});
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507', (resp: any) => {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp
rows = rows.filter(r => !r.has_courseware);
console.log('SpaceView', rows)
ctx.SpaceViewData = rows;
ctx.currentDataset = rows;
}
});
},
exit: () => {
console.log('exit SpaceView stage');
exit: () => {
console.log('exit SpaceView stage');
cc.audioEngine.stopMusic();
cc.audioEngine.playMusic(this.bgMusic2, true);
},
},
on: {
SUBMARINE: 'SubmarineView',
LETTER: 'LetterView',
STORY: 'StoryView',
REVIEW: 'ReviewView',
},
},
SubmarineView: {
entry: (ctx, event) => {
console.log('entry SubmarineView stage');
console.log('entry SubmarineView stage');
this.LetterView.active = false;
this.StoryView.active = false;
this.ReviewView.active = false;
this.SubmarineView.active = true;
},
exit: () => {
// console.log('exit SubmarineView stage');
},
invoke:{
src: (ctx, event) =>{
console.log(111,event)
// this.submarineView.scrollToPage(0, 0)
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid='+globalThis.CURRENT_ID, (resp: any)=> {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
rows = rows.filter(r => !r.has_courseware)
console.log('SubmarineView', rows);
ctx.SubmarineViewData = rows;
ctx.currentDataset = rows;
}
});
},
exit: () => {
// console.log('exit SubmarineView stage');
},
invoke: {
src: (ctx, event) => {
console.log(111, event)
// this.submarineView.scrollToPage(0, 0)
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid=' + globalThis.CURRENT_ID, (resp: any) => {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
rows = rows.filter(r => !r.has_courseware)
console.log('SubmarineView', rows);
ctx.SubmarineViewData = rows;
ctx.currentDataset = rows;
}
});
}
},
on: {
LOAD: {
target:'SubmarineView',
target: 'SubmarineView',
actions: (ctx, event) => {
console.log('SubmarineView LOAD', ctx, event);
}
......@@ -243,7 +243,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
STORY: 'StoryView',
REVIEW: 'ReviewView',
BACK: {
target:'SpaceView',
target: 'SpaceView',
actions: (ctx, event) => {
console.log('back', ctx, event);
}
......@@ -251,75 +251,75 @@ export default class SceneComponent extends MyCocosSceneComponent {
},
},
LetterView: {
on: {
BACK: {
target:'SubmarineView',
target: 'SubmarineView',
actions: () => {
globalThis.CURRENT_ID = globalThis.CURRENT_PID;
}
},
PLAY: {
target:'PlayView',
target: 'PlayView',
actions: (ctx, event) => {
console.log('PLAY', ctx, event);
}
}
},
invoke:{
src: (ctx, event) =>{
invoke: {
src: (ctx, event) => {
// console.log(222,event)
// if (event.id) {
// globalThis.CURRENT_PID = globalThis.CURRENT_ID;
// globalThis.CURRENT_ID = event.id;
// }
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid='+globalThis.CURRENT_ID, (resp: any)=> {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
rows = rows.filter(r => r.has_courseware);
console.log('LetterView', rows);
ctx.LetterViewData = rows;
ctx.currentDataset = rows;
}
});
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid=' + globalThis.CURRENT_ID, (resp: any) => {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
rows = rows.filter(r => r.has_courseware);
console.log('LetterView', rows);
ctx.LetterViewData = rows;
ctx.currentDataset = rows;
}
});
}
},
entry: (ctx, event) => {
console.log('entry LetterView stage', );
console.log('entry LetterView stage',);
this.LetterView.active = true;
this.StoryView.active = false;
this.ReviewView.active = false;
this.SubmarineView.active = true;
this.LetterViewLabel.string = event.buttonName;
},
exit: () => {
console.log('exit LetterView stage');
}
},
exit: () => {
console.log('exit LetterView stage');
}
},
StoryView: {
on: {
BACK: {
target:'SubmarineView',
target: 'SubmarineView',
actions: (ctx) => {
globalThis.CURRENT_ID = globalThis.CURRENT_PID;
}
},
PLAY: {
target:'PlayView',
target: 'PlayView',
actions: (ctx, event) => {
console.log('back', ctx, event);
}
},
},
invoke:{
src: (ctx, event) =>{
invoke: {
src: (ctx, event) => {
return new Promise<void>((resolve, reject) => {
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid='+globalThis.CURRENT_ID, (resp: any)=> {
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid=' + globalThis.CURRENT_ID, (resp: any) => {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
......@@ -327,7 +327,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
console.log('StoryView', rows);
ctx.StoryViewData = rows;
ctx.currentDataset = rows;
rows.forEach((r, idx )=> {
rows.forEach((r, idx) => {
const btn = this.StoryViewButtons[idx];
btn.active = true;
const cover = btn.getComponent('Cover')
......@@ -338,118 +338,119 @@ export default class SceneComponent extends MyCocosSceneComponent {
}
});
});
}
},
entry: (ctx, event) => {
// console.log('entry StoryView stage');
// console.log('entry StoryView stage');
this.LetterView.active = false;
this.StoryView.active = true;
this.ReviewView.active = false;
this.SubmarineView.active = true;
this.ReviewViewButtons
},
exit: () => {
// console.log('exit StoryView stage');
},
},
exit: () => {
// console.log('exit StoryView stage');
},
},
ReviewView: {
on: {
BACK: {
target:'SubmarineView',
target: 'SubmarineView',
actions: (ctx) => {
globalThis.CURRENT_ID = globalThis.CURRENT_PID;
}
},
PLAY: {
target:'PlayView',
target: 'PlayView',
actions: (ctx, event) => {
// console.log('back', ctx, event);
}
},
},
invoke:{
src: (ctx, event) =>{
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid='+globalThis.CURRENT_ID, (resp: any)=> {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
rows = rows.filter(r => r.has_courseware);
console.log('ReviewView', rows);
ctx.ReviewViewData = rows;
ctx.currentDataset = rows;
rows.forEach((r, idx )=> {
const btn = this.ReviewViewButtons[idx];
btn.active = true;
const cover = btn.getComponent('Cover')
cover.setUrl(r.cover);
});
}
});
invoke: {
src: (ctx, event) => {
this.callNetworkApiGet('http://staging-teach.ireadabc.com/api/syllabus/v1/list?orgid=507&pid=' + globalThis.CURRENT_ID, (resp: any) => {
resp = JSON.parse(resp);
if (resp.msg == 'success') {
let { rows } = resp;
rows = rows.filter(r => r.has_courseware);
console.log('ReviewView', rows);
ctx.ReviewViewData = rows;
ctx.currentDataset = rows;
rows.forEach((r, idx) => {
const btn = this.ReviewViewButtons[idx];
btn.active = true;
const cover = btn.getComponent('Cover')
cover.setUrl(r.cover);
});
}
});
}
},
entry: (ctx, event) => {
// console.log('entry ReviewView stage');
// console.log('entry ReviewView stage');
this.LetterView.active = false;
this.StoryView.active = false;
this.ReviewView.active = true;
this.SubmarineView.active = true;
},
exit: () => {
// console.log('exit ReviewView stage');
},
},
exit: () => {
// console.log('exit ReviewView stage');
},
},
PlayView: {
on: {
},
invoke:{
src: (ctx, event) =>{
invoke: {
src: (ctx, event) => {
this.showWaitingLetters();
}
},
entry: (ctx, event) => {
console.log('entry PlayView stage');
console.log('entry PlayView stage');
this.showWaitingLetters();
cc.audioEngine.stopMusic();
const scene = globalThis.SCENE_INFO;
if (!scene) {
this.showWaitingLetters();
return;
}
// cc.director._scene = scene;
// cc.director._scene._activate();
// cc.game.resume();
cc.director.runScene(scene, null, ()=>{
try{
const middleLayer = cc.find('middleLayer').getComponent('middleLayer');
console.log(event.id, event.linkFlag);
middleLayer.loadOnlineCourseWare(event.id, event.linkFlag);
} catch(e) {
console.error(e);
const configData = globalThis.configData;
cc.assetManager.loadBundle(configData.bondleUrl, { version: configData.version }, async (err, bundle) => {
if (err) {
return console.log(err);
}
bundle.loadScene(configData.sceneName, null, null, (err, scene) => {
cc.director.runScene(scene, null, () => {
try {
console.log('汪汪汪')
const middleLayer = cc.find('middleLayer').getComponent('middleLayer');
console.log(event.id, event.linkFlag);
middleLayer.loadOnlineCourseWare(event.id, event.linkFlag);
} catch (e) {
console.error(e);
}
});
});
});
// this.LetterView.active = false;
// this.StoryView.active = false;
// this.ReviewView.active = true;
// this.SubmarineView.active = false;
},
exit: () => {
},
exit: () => {
this.hideWaitingLetters();
console.log('exit PlayView stage');
},
console.log('exit PlayView stage');
},
},
}
};
const operationMachine = createMachine(operationState);
this.gameMachineService = interpret(operationMachine).onTransition((state) => {
......@@ -458,17 +459,17 @@ export default class SceneComponent extends MyCocosSceneComponent {
this.gameMachineService.start();
this.restore();
}
restore(){
restore() {
if (globalThis.PREV_STATE) {
globalThis.CURRENT_ID = globalThis.PREV_STATE.data.id
globalThis.CURRENT_PID = globalThis.PREV_STATE.data.pid
this.gameMachineService.send('SpaceView', {...globalThis.PREV_STATE.data, type:globalThis.PREV_STATE.state});
this.gameMachineService.send('SpaceView', { ...globalThis.PREV_STATE.data, type: globalThis.PREV_STATE.state });
globalThis.CURRENT_STATE = JSON.parse(JSON.stringify(globalThis.PREV_STATE));
globalThis.PREV_STATE = null;
globalThis.PREV_STATE = null;
}
}
setStateContextData({rows, buttonsKey}) {
const buttons = buttonsKey;
setStateContextData({ rows, buttonsKey }) {
const buttons = buttonsKey;
buttons.forEach((b: any) => {
b.getComponent(cc.Button).interactable = false;
});
......@@ -476,30 +477,30 @@ export default class SceneComponent extends MyCocosSceneComponent {
if (!buttons[idx]) {
return;
}
(buttons[idx] as any ).getComponent(cc.Button).interactable = true;
(buttons[idx] as any ).getComponent(cc.Button).dataIndex = idx;
(buttons[idx] as any ).getComponent(cc.Button).dataMeta = item;
const [_, action, index] = (buttons[idx] as any ).name.split('@');
(buttons[idx] as any ).off(cc.Node.EventType.TOUCH_START);
(buttons[idx] as any ).on(cc.Node.EventType.TOUCH_START, function(){
(buttons[idx] as any).getComponent(cc.Button).interactable = true;
(buttons[idx] as any).getComponent(cc.Button).dataIndex = idx;
(buttons[idx] as any).getComponent(cc.Button).dataMeta = item;
const [_, action, index] = (buttons[idx] as any).name.split('@');
(buttons[idx] as any).off(cc.Node.EventType.TOUCH_START);
(buttons[idx] as any).on(cc.Node.EventType.TOUCH_START, function () {
this.gameMachineService.send(action, item)
}, this, true)
});
}
callNetworkApiGet( uri, successCallBack: (resp: string) => void, errorCallback?: (any) => void) {
callNetworkApiGet(uri, successCallBack: (resp: string) => void, errorCallback?: (any) => void) {
this.showWaitingLetters()
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
if (xhr.readyState == 4 ) {
if (xhr.readyState == 4) {
this.hideWaitingLetters()
if ( (xhr.status >= 200 && xhr.status < 400)) {
if ((xhr.status >= 200 && xhr.status < 400)) {
successCallBack && successCallBack(xhr.responseText);
} else {
} else {
errorCallback && errorCallback(xhr)
}
}
}
};
console.log('url = ' + uri);
xhr.open('GET', uri, true);
......@@ -523,37 +524,37 @@ export default class SceneComponent extends MyCocosSceneComponent {
const colorList = this.getRainbowColorList();
const text = this.loading.getChildByName('text')
text.children.forEach((node, idx) => {
node.color = colorList[idx];
this.tw = cc.tween(node)
.delay(idx / 4)
.by(0.3, { y: 50 }, { easing: 'sineOut' })
.by(0.3, { y: -50 }, { easing: 'sineIn' })
.delay((text.children.length - idx) / 4)
.union()
.repeatForever()
.start();
node.color = colorList[idx];
this.tw = cc.tween(node)
.delay(idx / 4)
.by(0.3, { y: 50 }, { easing: 'sineOut' })
.by(0.3, { y: -50 }, { easing: 'sineIn' })
.delay((text.children.length - idx) / 4)
.union()
.repeatForever()
.start();
});
this.loading.active = true;
}
getRainbowColorList() {
return [
cc.color(255, 255, 0),
cc.color(128, 255, 0),
cc.color(0, 255, 0),
cc.color(0, 255, 128),
cc.color(0, 255, 255),
cc.color(0, 128, 255),
cc.color(0, 0, 255),
cc.color(128, 0, 255),
cc.color(255, 0, 255),
cc.color(255, 0, 128),
cc.color(255, 0, 0),
cc.color(255, 128, 0),
cc.color(255, 255, 0),
cc.color(255, 255, 0),
cc.color(128, 255, 0),
cc.color(0, 255, 0),
cc.color(0, 255, 128),
cc.color(0, 255, 255),
cc.color(0, 128, 255),
cc.color(0, 0, 255),
cc.color(128, 0, 255),
cc.color(255, 0, 255),
cc.color(255, 0, 128),
cc.color(255, 0, 0),
cc.color(255, 128, 0),
cc.color(255, 255, 0),
];
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment