Commit 5a19e615 authored by 熊东起's avatar 熊东起

add:game

parents
# Created by .ignore support plugin (hsz.mobi)
.temp
node_modules
dist
yarn.lock
package-template.iml
/test/src/bundle.js
/test/src/meta.json
types
# Created by .ignore support plugin (hsz.mobi)
/src/
/test/
*.iml
.temp
/assets
tsconfig.json
{
"name": "@spark/walkCom",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"@types/prop-types": {
"version": "15.7.3",
"resolved": "http://npm.dui88.com:80/@types%2fprop-types/-/prop-types-15.7.3.tgz",
"integrity": "sha1-KrDV2i5YFflLC51LldHl8kOrLKc="
},
"@types/react": {
"version": "16.14.2",
"resolved": "http://npm.dui88.com:80/@types%2freact/-/react-16.14.2.tgz",
"integrity": "sha1-hdzAlH0GRTSZI8BMzvYBihq3U4w=",
"requires": {
"@types/prop-types": "*",
"csstype": "^3.0.2"
}
},
"csstype": {
"version": "3.0.5",
"resolved": "http://npm.dui88.com:80/csstype/-/csstype-3.0.5.tgz",
"integrity": "sha1-f97GoopnrhhkfFFmip/5W7L6e7g="
},
"duiba-utils": {
"version": "1.0.6",
"resolved": "http://npm.dui88.com:80/duiba-utils/-/duiba-utils-1.0.6.tgz",
"integrity": "sha512-FtLrxecz1KJ5mTdabj3l4yyu/xvhDga0rvXHNSeN9dQQhAF//Coi7UE8Ns0UCZFbXs8HRxToECUo8hqYqI9abQ=="
},
"fyge": {
"version": "2.0.14",
"resolved": "http://npm.dui88.com:80/fyge/-/fyge-2.0.14.tgz",
"integrity": "sha512-MI7a8iXesHhxFzOv3QQrNyXdGeCrq7J3N3MeH6QZ1g0+5LCuAfq8DLT8gjXHPxg7/V9Th8ahX2HOuzGClohI8w==",
"requires": {
"duiba-utils": "^1.0.0"
}
},
"spark-wrapper-fyge": {
"version": "1.0.24",
"resolved": "http://npm.dui88.com:80/spark-wrapper-fyge/-/spark-wrapper-fyge-1.0.24.tgz",
"integrity": "sha512-1nI6oh4+G1vdKR+pwRqJ2vYAzc5SZAI8RIVzmec3n70Vu9XdBvVi6HoKOff6KIaeg5ETlHZn5afzTOcRE7O1Cw==",
"requires": {
"fyge": "^2.0.13"
}
},
"tslib": {
"version": "2.1.0",
"resolved": "http://npm.dui88.com:80/tslib/-/tslib-2.1.0.tgz",
"integrity": "sha1-2mCGDxwuyqVwOrfTm8Bba/mIuXo=",
"dev": true
}
}
}
{
"name": "@spark/walkCom",
"version": "1.0.0",
"main": "dist/bundle.js",
"types": "types/index.d.ts",
"license": "MIT",
"scripts": {
"dev": "spark package pack -s src -o test/src/bundle.js -w",
"pack": "spark package pack -s src -o dist/bundle.js -p",
"pub": "npm run declare && read -p 'Input version: ' version && read -p 'Input remark: ' remark && spark package publish -s src -v $version -r $remark",
"declare": "tsc --outDir '.temp/out' -d --declarationDir 'types' --emitDeclarationOnly"
},
"dependencies": {
"@types/react": "^16.9.56",
"spark-wrapper-fyge": "1.0.23",
"svga-parser": "^1.1.2"
},
"devDependencies": {
"tslib": "^2.0.1"
}
}
# walkCom
## Install
`yarn add @spark/walkCom`
## Usage
```js
import {...} from '@spark/walkCom'
```
## Contribute
1. `yarn dev` to develop package
2. `cd test && yarn && yarn dev` to develop test
## Publish
`npm run pub`
import * as GAME from "spark-wrapper-fyge";
export default class GameBg extends GAME.Container{
constructor(){
super();
for(let i = 0;i <= 7;i++){
let bgItem = this.addChild(new GAME.Sprite(GAME.TextureCache[`bg${i}`]));
bgItem.y = i * 626;
}
}
}
\ No newline at end of file
import { GameIndex } from './GameIndex';
export namespace GameMgr {
export let game: GameIndex = null;
export let options: any = {
curSteps: 0,
endSteps: 0,
};
export let GAME_STEP = [0, 10000, 30000, 100000, 200000, 350000];
export let SITE_NAME = [
"宝石山",
"金猪存钱罐",
"断桥残雪",
"平湖秋月",
"拆红包",
"苏堤春晓",
"曲苑风荷",
"打病毒",
"双峰插云"
];
export let TXT_DIALOG = [
"点我进入游戏哦~",
"敬请期待哦~",
"点我进入游戏哦~"
];
}
export const CHANGE_POINT = [
{ x: 400, y: 4568, dir: 'R' },
{ x: 726, y: 4424, dir: 'L' },
{ x: 21, y: 4092, dir: 'R' },
{ x: 373, y: 3973, dir: 'R' },//1 3
{ x: 740, y: 3848, dir: 'L' },
{ x: 724, y: 3779, dir: 'L' },
{ x: 592, y: 3723, dir: 'R' },
{ x: 705, y: 3672, dir: 'L' },
{ x: 27, y: 3282, dir: 'R' },
{ x: 311, y: 3211, dir: 'L' },
{ x: 202, y: 3144, dir: 'L' },//2 10
{ x: 14, y: 3026, dir: 'R' },
{ x: 21, y: 2955, dir: 'R' },
{ x: 735, y: 2790, dir: 'L' },
{ x: 735, y: 2626, dir: 'L' },
{ x: 172, y: 2290, dir: 'R' },
{ x: 233, y: 2248, dir: 'L' },
{ x: 23, y: 2145, dir: 'R' },
{ x: 17, y: 2082, dir: 'R' },
{ x: 400, y: 1963, dir: 'R' },//3 19
{ x: 734, y: 1862, dir: 'L' },
{ x: 730, y: 1675, dir: 'L' },
{ x: 175, y: 1286, dir: 'L' },//4 22
{ x: 26, y: 1193, dir: 'R' },
{ x: 254, y: 1114, dir: 'L' },
{ x: 175, y: 1040, dir: 'R' },
{ x: 485, y: 943, dir: 'L' },
{ x: 405, y: 834, dir: 'R' },
{ x: 675, y: 750, dir: 'R' }//5 28
];
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import GameBg from "./GameBg";
import { CHANGE_POINT, GameMgr } from "./GameConfig";
import GamePart from "./GamePart";
import GameRoadMask from "./GameRoadMask";
import GameSVGA from "./GameSVGA";
import GameMask from "./GamneMask";
import player from "./player";
import SiteNamePart from "./SiteNamePart";
import SiteStep from "./SiteStep";
import { getCurPoint, getEndPath, getRoadLength, getSiteRoad } from "./utils";
const _stageH = document.body.clientHeight * 750 / document.body.clientWidth;
export class GameIndex extends GAME.WidgetBase {
private gameCon: GAME.Container;
private gamePage: GAME.ScrollPage;
private roadMask: GameRoadMask;
private player: player;
private sitePart0: GAME.Container;
private stepWord: SiteStep;
private namePart: SiteNamePart;
private gameMask: GameMask;
private gameSvga: GameSVGA;
private yanhuaSVGA: GAME.MovieClip;
onLaunched() {
GameMgr.game = this;
GameMgr.options.curSteps = this.props.curSteps;
GameMgr.GAME_STEP = this.props.gameSteps;
GameMgr.SITE_NAME = this.props.siteName;
GameMgr.TXT_DIALOG = this.props.txtDialogs;
this.initUI();
}
/** 初始化界面 */
private initUI() {
this.gameCon = this.addChild(new GAME.Container());
this.gamePage = this.gameCon.addChild(new GAME.ScrollPage(750, _stageH, 0, true, true));
let gameBg = this.gamePage.view.addChild(new GameBg());
this.gamePage.maxDistance = 5012;
this.gamePage.isSpringBack = false;
// this.gamePage.view.mouseChildren = false;
// this.gamePage.view.mouseEnable = false;
//遮罩层
this.roadMask = this.gamePage.view.addChild(new GameRoadMask());
this.roadMask.y = 0;
/** 底层 */
this.sitePart0 = this.gamePage.view.addChild(new GAME.Container());
//景物层
let panel1 = this.sitePart0.addChild(new GamePart());
//svga
this.gameSvga = this.sitePart0.addChild(new GameSVGA());
this.gameSvga.mouseChildren = false;
this.gameSvga.mouseEnable = false;
//站点名字
this.namePart = this.sitePart0.addChild(new SiteNamePart());
this.namePart.mouseChildren = false;
this.namePart.mouseEnable = false;
//站点牌
this.stepWord = this.sitePart0.addChild(new SiteStep());
this.stepWord.mouseChildren = false;
this.stepWord.mouseEnable = false;
//人物
this.player = this.gamePage.view.addChild(new player());
/** 遮住 */
this.gameMask = this.gamePage.view.addChild(new GameMask());
this.gameMask.mouseChildren = false;
this.gameMask.mouseEnable = false;
//烟花
this.yanhuaSVGA = this.gamePage.view.addChild(new GAME.MovieClip(GAME.getAssetByUUID("yanhua_svga")));
this.yanhuaSVGA.visible = false;
this.yanhuaSVGA.mouseChildren = false;
this.yanhuaSVGA.mouseEnable = false;
this.addEventListener(GAME.Event.ENTER_FRAME, this.onFarm, this);
this.updateIndexInfo();
}
/** 帧事件 */
onFarm() {
this.roadMask.y = this.player.y - 5012 - 10;
if (this.player._isMove) {
this.gamePage.view.y = -this.player.y + _stageH - 500;
}
this.onMaskPlayer();
}
/**
* 事件回调
* @param type
* @param data
*/
onEvent(type: string, data: any) {
console.log("接收到事件++", type, data)
switch (type) {
case "game-start":
this._index = 0;
GameMgr.options.curSteps = data.curSteps;
GameMgr.options.endSteps = data.endSteps;
if (data.curSteps == data.endSteps) return;
this.onMove();
break;
case "refresh-data":
GameMgr.options.curSteps = data.curSteps;
GameMgr.GAME_STEP = data.gameSteps;
GameMgr.SITE_NAME = data.siteName;
let endPoint = getCurPoint(GameMgr.options.curSteps);
this.player.stepCount = GameMgr.options.curSteps;
this.player.reset(endPoint);
let _speed = (GameMgr.GAME_STEP[5] - GameMgr.options.curSteps) / GameMgr.GAME_STEP[5] * 2000;
this.gamePage.scrollTo(this.player.y - _stageH + 500, _speed);
this.updateIndexInfo();
break;
}
}
/** 更新数据 */
updateIndexInfo() {
//刷新配置
this.namePart.resetLights(GameMgr.options.curSteps);
this.namePart.refreshNames();
this.stepWord.refreshSteps();
this.gameMask.refreshData();
// this.onMaskPlayer();
}
/** 移动 */
onMove() {
this.player.endCount = GameMgr.options.endSteps;
let path = getEndPath(GameMgr.options.curSteps, GameMgr.options.endSteps);
// console.log("需要走的路径+++", path);
this.player.onMove(path);
}
/** 到达指定站点 */
arriveEndPoint(curCount: number) {
let _index = 0, self = this;
for (let i = 0; i < GameMgr.GAME_STEP.length; i++) {
if (GameMgr.GAME_STEP[i] == curCount) {
_index = i;
break;
}
}
this.onPlayYanhuaSvga(_index, () => {
self.namePart.changeLights(_index);
});
}
/** 烟花svga播放 */
onPlayYanhuaSvga(index: number, cb?: Function) {
let self = this;
switch (index) {
case 1:
this.yanhuaSVGA.x = 50;
this.yanhuaSVGA.y = 3400;
break;
case 2:
this.yanhuaSVGA.x = 400;
this.yanhuaSVGA.y = 2800;
break;
case 3:
this.yanhuaSVGA.x = 400;
this.yanhuaSVGA.y = 1900;
break;
case 4:
this.yanhuaSVGA.x = 80;
this.yanhuaSVGA.y = 1400;
break;
case 5:
this.yanhuaSVGA.x = 40;
this.yanhuaSVGA.y = 450;
break;
}
this.yanhuaSVGA.visible = true;
if (index > 0) {
this.yanhuaSVGA.startAniRange(0, this.yanhuaSVGA.totalFrames, 1, () => {
self.yanhuaSVGA.visible = false;
self.dispatchOutEvent("arrive-site", { step: GameMgr.options.endSteps });
cb && cb();
});
} else {
self.yanhuaSVGA.visible = false;
setTimeout(() => {
cb && cb();
self.dispatchOutEvent("arrive-site", { step: GameMgr.options.endSteps });
}, 1000);
}
}
/** 盖住移动的人物 */
private _index = 0;
onMaskPlayer() {
if (this.player.y <= 4489 && this._index == 0) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 4400 && this._index == 1) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 4230 && this._index == 2) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 3900 && this._index == 3) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 3572 && this._index == 4) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 3283 && this._index == 5) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 3163 && this._index == 6) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 2243 && this._index == 7) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 1617 && this._index == 8) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 1282 && this._index == 9) {
this._index++;
this.gameMask.resetLayers(this._index);
} else if (this.player.y <= 796 && this._index == 10) {
this._index++;
this.gameMask.resetLayers(this._index);
}
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import { GameMgr } from "./GameConfig";
import GameMask from "./GamneMask";
export default class GamePart extends GAME.Container {
private partLayers: any = {};
constructor() {
super();
//宝石山右边
let bssRPart = this.addChild(new GAME.Sprite(GAME.TextureCache["bssRPart"]));
bssRPart.y = 4424;
bssRPart.x = 750 - 487;
this.partLayers["part1"] = bssRPart;
//宝石山
let bssPart = this.addChild(new GAME.Sprite(GAME.TextureCache["bssPart"]));
bssPart.y = 5012 - 1158;
this.partLayers["part2"] = bssPart;
//断桥残雪
let dqcxPart = this.addChild(new GAME.Sprite(GAME.TextureCache["dqcxPart"]));
dqcxPart.y = 3054;
dqcxPart.x = 750 - 750;
this.partLayers["part3"] = dqcxPart;
//存钱罐
let cqgPart = this.addChild(new GAME.Sprite(GAME.TextureCache["cqgPart"]));
cqgPart.y = 3735;
cqgPart.x = 750 - 628;
this.partLayers["part4"] = cqgPart;
cqgPart.addEventListener(GAME.MouseEvent.CLICK, this.onGotoActivities.bind(this, 1), this);
let dbdshape2 = this.addChild(new GAME.Graphics());
dbdshape2.beginFill("#ffffff",0);
dbdshape2.drawCircle(600,4110,200);
dbdshape2.endFill();
dbdshape2.addEventListener(GAME.MouseEvent.CLICK, this.onGotoActivities.bind(this, 1), this);
//平湖秋月
let phqyPart = this.addChild(new GAME.Sprite(GAME.TextureCache["phqyPart"]));
phqyPart.y = 2825;
phqyPart.x = 750 - 723;
this.partLayers["part5"] = phqyPart;
//曲苑风荷
let qyfhPart = this.addChild(new GAME.Sprite(GAME.TextureCache["qyfhPart"]));
qyfhPart.y = 1150;
qyfhPart.x = 0;
this.partLayers["part6"] = qyfhPart;
//苏堤春晓
let sdcxPart = this.addChild(new GAME.Sprite(GAME.TextureCache["sdcxPart"]));
sdcxPart.y = 1640;
sdcxPart.x = 750 - 708;
this.partLayers["part7"] = sdcxPart;
//拆红包
let chbPart = this.addChild(new GAME.Sprite(GAME.TextureCache["chbPart"]));
chbPart.y = 1972;
chbPart.x = 0;
this.partLayers["part8"] = chbPart;
let dbdshape1 = this.addChild(new GAME.Graphics());
dbdshape1.beginFill("#ffffff",0);
dbdshape1.drawCircle(200,2600,250);
dbdshape1.endFill();
dbdshape1.addEventListener(GAME.MouseEvent.CLICK, this.onGotoActivities.bind(this, 2), this);
//打病毒
let dbdPart = this.addChild(new GAME.Sprite(GAME.TextureCache["dbdPart"]));
dbdPart.y = 740;
dbdPart.x = 750 - 653;
this.partLayers["part9"] = dbdPart;
let dbdshape = this.addChild(new GAME.Graphics());
dbdshape.beginFill("#ffffff",0);
dbdshape.drawCircle(600,1180,250);
dbdshape.endFill();
dbdshape.addEventListener(GAME.MouseEvent.CLICK, this.onGotoActivities.bind(this, 3), this);
//双峰插云
let sfcyPart = this.addChild(new GAME.Sprite(GAME.TextureCache["sfcyPart"]));
sfcyPart.y = 0;
sfcyPart.x = 0;
this.partLayers["part10"] = sfcyPart;
sfcyPart.mouseEnable = false;
sfcyPart.mouseChildren = false;
}
//点击事件
onGotoActivities(e: any) {
GameMgr.game.dispatchOutEvent("goto-activity", { type: e });
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
export default class GameRoadMask extends GAME.Container {
constructor() {
super();
var shape1 = this.addChild(new GAME.Shape());
shape1.beginLinearGradientFill([0, 0, 0, 5012], [[0, "#000000", 0.6], [0.98, "#000000", 0.6], [1, "#000000", 0]])
shape1.drawRect(0, 0, 750, 5012)
shape1.endFill();
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
export default class GameSVGA extends GAME.Container {
constructor() {
super();
//宝石山
let bssSVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("bss_svga")));
bssSVGA.x = 125;
bssSVGA.y = 4485;
//金猪
let jzSVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("jz_svga")));
jzSVGA.x = 430;
jzSVGA.y = 4050;
//断桥残雪
let dqcxSVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("dqcx_svga")));
dqcxSVGA.x = 35;
dqcxSVGA.y = 3500;
//平湖秋月
let phqySVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("phqy_svga")));
phqySVGA.x = 422;
phqySVGA.y = 2892;
//拆红包
let chbSVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("qhb_svga")));
chbSVGA.x = 0;
chbSVGA.y = 2160;
let qhbMask = this.addChild(new GAME.Sprite(GAME.TextureCache["qhbmask"]));
qhbMask.x = 0;
qhbMask.y = 2145;
//苏堤春晓
let sdcxSVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("sdcx_svga")));
sdcxSVGA.x = 250;
sdcxSVGA.y = 1930;
//曲苑风荷1
let qyfh1SVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("qyfh1_svga")));
qyfh1SVGA.x = 28;
qyfh1SVGA.y = 1746;
//曲苑风荷2
let qyfh2SVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("qyfh2_svga")));
qyfh2SVGA.x = 10;
qyfh2SVGA.y = 1240;
//双峰插云1
let sfcy1SVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("sfcy1_svga")));
sfcy1SVGA.x = 0;
sfcy1SVGA.y = 640;
//双峰插云1
let sfcy2SVGA = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("sfcy2_svga")));
sfcy2SVGA.x = 450;
sfcy2SVGA.y = 638;
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import { GameMgr } from "./GameConfig";
import SiteName from "./SiteName";
import { getText } from "./utils";
export default class GameMask extends GAME.Container {
private partMasks: any = {};
private sitename: SiteName;
private mask2txt: GAME.TextField;
constructor() {
super();
//mask1
let mask1 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask1"]));
mask1.y = 4424;
mask1.x = 593;
this.partMasks["mask1"] = mask1;
let mask2 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask3"]));
mask2.y = 4309;
mask2.x = 438;
this.partMasks["mask2"] = mask2;
let mask3 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask2"]));
mask3.y = 4118;
mask3.x = 53;
this.partMasks["mask3"] = mask3;
let mask4 = this.addChild(new GAME.Container());
let mask4Img = mask4.addChild(new GAME.Sprite(GAME.TextureCache["mask4"]));
mask4.x = 617;
mask4.y = 3822;
let sitename = mask4.addChild(new SiteName());
sitename.x = 55;
sitename.y = 30;
sitename.txt = GameMgr.SITE_NAME[1];
sitename.resetUI();
this.sitename = sitename;
this.partMasks["mask4"] = mask4;
let mask5 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask5"]));
mask5.y = 3312;
mask5.x = 0;
this.partMasks["mask5"] = mask5;
let mask6 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask6"]));
mask6.y = 3189;
mask6.x = 126;
this.partMasks["mask6"] = mask6;
let mask7 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask7"]));
mask7.y = 3054;
mask7.x = 0;
this.partMasks["mask7"] = mask7;
let mask8 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask8"]));
mask8.y = 1972;
mask8.x = 0;
this.partMasks["mask8"] = mask8;
let mask9 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask9"]));
mask9.y = 1449;
mask9.x = 332;
this.partMasks["mask9"] = mask9;
let mask10 = this.addChild(new GAME.Sprite(GAME.TextureCache["mask10"]));
mask10.y = 1150;
mask10.x = 0;
this.partMasks["mask10"] = mask10;
let mask11 = this.addChild(new GAME.Container());
mask11.x = 608;
mask11.y = 700;
mask11.addChild(new GAME.Sprite(GAME.TextureCache["step5"]));
let mask11txt = getText(`${GameMgr.GAME_STEP[5]}步`, 24, "#2c3452", GAME.TEXT_ALIGN.CENTER, 115, 6, 61);
mask11txt.skew.set(0,-0.32);
mask11.addChild(mask11txt);
this.mask2txt = mask11txt;
this.partMasks["mask11"] = mask11;
for (let item in this.partMasks) {
this.partMasks[item] && (this.partMasks[item].alpha = 0);
}
}
/** 层级变化 */
resetLayers(index: number) {
for(let i = 1;i <= 11;i++){
if(i <= index){
this.partMasks[`mask${i}`].alpha = 1;
}else{
this.partMasks[`mask${i}`].alpha = 0;
}
}
}
//刷新数据
refreshData(){
this.mask2txt.text = `${GameMgr.GAME_STEP[5]}步`;
this.sitename.txt = GameMgr.SITE_NAME[1];
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import { getText } from "./utils";
export default class SiteName extends GAME.Container {
private darkNameCon: GAME.Container;
private lightNameCon: GAME.Container;
private darkTxt: GAME.TextField;
private lightTxt: GAME.TextField;
private _txt: string = "";
constructor() {
super();
this.darkNameCon = this.addChild(new GAME.Container());
this.lightNameCon = this.addChild(new GAME.Container());
//未点亮
let darkImg = this.darkNameCon.addChild(new GAME.Sprite(GAME.TextureCache["siteNameW"]));
//点亮
let lightImg = this.lightNameCon.addChild(new GAME.Sprite(GAME.TextureCache["siteNameB"]));
let darkTxt = getText("宝石山", 30, "#8c5635", GAME.TEXT_ALIGN.CENTER, 40, 5, 0);
darkTxt.lineType = GAME.TEXT_lINETYPE.MULTI;
darkTxt.lineSpacing = 5;
darkTxt.textHeight = lightImg.height + 5;
darkTxt.verticalAlign = GAME.VERTICAL_ALIGN.MIDDLE;
this.darkTxt = this.darkNameCon.addChild(darkTxt);
let lightTxt = getText("宝石山", 30, "#cacdd9", GAME.TEXT_ALIGN.CENTER, 40, 5, 0);
lightTxt.lineType = GAME.TEXT_lINETYPE.MULTI;
lightTxt.lineSpacing = 5;
lightTxt.textHeight = lightImg.height + 5;
lightTxt.verticalAlign = GAME.VERTICAL_ALIGN.MIDDLE;
this.lightTxt = this.lightNameCon.addChild(lightTxt);
this.lightNameCon.width = 48;
this.lightNameCon.height = 208;
this.lightNameCon.anchorX = 24;
this.lightNameCon.anchorY = 104;
this.lightNameCon.scaleX = 0;
this.lightNameCon.scaleY = 0;
this.lightNameCon.alpha = 0;
}
set txt(v: string) {
this._txt = v;
this.darkTxt.text = this.lightTxt.text = v;
}
resetUI(){
this.lightNameCon.scaleX = 1;
this.lightNameCon.scaleY = 1;
this.lightNameCon.alpha = 1;
}
/** 点亮动画 */
onLightAni() {
GAME.Tween.get(this.lightNameCon)
.to({scaleX: 1,scaleY: 1,alpha: 1},200);
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import { GameMgr } from "./GameConfig";
import SiteName from "./SiteName";
import TxtDialog from "./TxtDialog";
export default class SiteNamePart extends GAME.Container {
private partNames: any = {};
private txtDialogs: any = {};
constructor() {
super();
for (let i = 0; i < 9; i++) {
let name = this.addChild(new SiteName());
this.partNames[`name${i}`] = name;
name.txt = GameMgr.SITE_NAME[i];
}
for (let i = 0; i < 3; i++) {
let txtDialog = this.addChild(new TxtDialog());
this.txtDialogs[`txt${i}`] = txtDialog;
txtDialog.txt = GameMgr.TXT_DIALOG[i];
}
this.resetpoint();
}
/** 初始化位置 */
resetpoint() {
this.partNames["name0"].x = 65;
this.partNames["name0"].y = 4279;
this.partNames["name1"].x = 672;
this.partNames["name1"].y = 3852;
this.partNames["name2"].x = 78;
this.partNames["name2"].y = 3569;
this.partNames["name3"].x = 598;
this.partNames["name3"].y = 3081;
this.partNames["name4"].x = 362;
this.partNames["name4"].y = 2513;
this.partNames["name5"].x = 603;
this.partNames["name5"].y = 2200;
this.partNames["name6"].x = 182;
this.partNames["name6"].y = 1418;
this.partNames["name7"].x = 485;
this.partNames["name7"].y = 1010;
this.partNames["name8"].x = 176;
this.partNames["name8"].y = 588;
for (let i = 0; i <= 8; i++) {
if (i == 0 || i == 1 || i == 4 || i == 7) {
this.partNames[`name${i}`].resetUI();
}
}
this.txtDialogs["txt0"].x = 439;
this.txtDialogs["txt0"].y = 4070;
this.txtDialogs["txt0"].resetAni();
this.txtDialogs["txt1"].x = 73;
this.txtDialogs["txt1"].y = 2418;
this.txtDialogs["txt1"].resetAni();
this.txtDialogs["txt2"].x = 375;
this.txtDialogs["txt2"].y = 1251;
this.txtDialogs["txt2"].resetAni();
}
/** 初始化亮度 */
resetLights(curCount: number) {
let _index = 0;
for (let i = 0; i < GameMgr.GAME_STEP.length; i++) {
if (GameMgr.GAME_STEP[i] <= curCount) {
_index = i;
}
}
switch (_index) {
case 1:
this.partNames["name2"].resetUI();
break;
case 2:
this.partNames["name2"].resetUI();
this.partNames["name3"].resetUI();
break;
case 3:
this.partNames["name2"].resetUI();
this.partNames["name3"].resetUI();
this.partNames["name5"].resetUI();
break;
case 4:
this.partNames["name2"].resetUI();
this.partNames["name3"].resetUI();
this.partNames["name5"].resetUI();
this.partNames["name6"].resetUI();
break;
case 5:
this.partNames["name2"].resetUI();
this.partNames["name3"].resetUI();
this.partNames["name5"].resetUI();
this.partNames["name6"].resetUI();
this.partNames["name8"].resetUI();
break;
}
}
/** 改变亮度 */
changeLights(index: number) {
switch (index) {
case 1:
this.partNames["name2"].onLightAni();
break;
case 2:
this.partNames["name3"].onLightAni();
break;
case 3:
this.partNames["name5"].onLightAni();
break;
case 4:
this.partNames["name6"].onLightAni();
break;
case 5:
this.partNames["name8"].onLightAni();
break;
}
}
/** 刷新数据 */
refreshNames() {
for (let i = 0; i < 9; i++) {
this.partNames[`name${i}`].txt = GameMgr.SITE_NAME[i];
}
for (let i = 0; i < 3; i++) {
this.txtDialogs[`txt${i}`].txt = GameMgr.TXT_DIALOG[i];
}
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import { GameMgr } from "./GameConfig";
import { getText } from "./utils";
export default class SiteStep extends GAME.Container {
private stepTxts: any = {};
private _txt: string = "";
constructor() {
super();
let step1 = this.addChild(new GAME.Sprite(GAME.TextureCache["step1"]));
step1.x = 346;
step1.y = 3961;
let step1txt = getText(`${GameMgr.GAME_STEP[1]}步`, 28, "#2c3452", GAME.TEXT_ALIGN.CENTER, 115, 352, 4012);
step1txt.skew.set(0, -0.2);
this.addChild(step1txt);
this.stepTxts["step1"] = step1txt;
let step2 = this.addChild(new GAME.Sprite(GAME.TextureCache["step2"]));
step2.x = 171;
step2.y = 3005;
let step2txt = getText(`${GameMgr.GAME_STEP[2]}步`, 28, "#2c3452", GAME.TEXT_ALIGN.CENTER, 115, 177, 3035);
step2txt.skew.set(0, 0.45);
this.addChild(step2txt);
this.stepTxts["step2"] = step2txt;
let step3 = this.addChild(new GAME.Sprite(GAME.TextureCache["step3"]));
step3.x = 375;
step3.y = 1937;
let step3txt = getText(`${GameMgr.GAME_STEP[3]}步`, 24, "#2c3452", GAME.TEXT_ALIGN.CENTER, 115, 381, 1997);
step3txt.skew.set(0, -0.3);
this.addChild(step3txt);
this.stepTxts["step3"] = step3txt;
let step4 = this.addChild(new GAME.Sprite(GAME.TextureCache["step4"]));
step4.x = 142;
step4.y = 1146;
let step4txt = getText(`${GameMgr.GAME_STEP[4]}步`, 24, "#2c3452", GAME.TEXT_ALIGN.CENTER, 115, 148, 1175);
step4txt.skew.set(0, 0.5);
this.addChild(step4txt);
this.stepTxts["step4"] = step4txt;
let step5 = this.addChild(new GAME.Sprite(GAME.TextureCache["step5"]));
step5.x = 608;
step5.y = 700;
let step5txt = getText(`${GameMgr.GAME_STEP[5]}步`, 24, "#2c3452", GAME.TEXT_ALIGN.CENTER, 115, 614, 761);
step5txt.skew.set(0, -0.32);
this.addChild(step5txt);
this.stepTxts["step5"] = step5txt;
}
set txt(v: string) {
this._txt = v;
}
/** 刷新步数 */
refreshSteps() {
for (let i = 1; i <= 5; i++) {
this.stepTxts[`step${i}`].text = `${GameMgr.GAME_STEP[i]}步`;
}
}
}
\ No newline at end of file
import * as GAME from "spark-wrapper-fyge";
import { getText } from "./utils";
export default class TxtDialog extends GAME.Container {
private roomTxt: GAME.TextField;
private _txt: string = "";
constructor() {
super();
let txtBg = this.addChild(new GAME.Sprite(GAME.TextureCache["wordTxt"]));
let roomTxt = getText("点我进入游戏哦~", 22, "#7e3a1e", GAME.TEXT_ALIGN.CENTER, 218, 0, 14);
this.roomTxt = this.addChild(roomTxt);
}
set txt(v: string) {
this._txt = v;
this.roomTxt.text = v+"";
}
resetAni() {
let _y = this.y;
GAME.Tween.get(this, { loop: true })
.to({ y: _y - 5 }, 300)
.to({ y: _y }, 300)
.to({ y: _y + 5 }, 300)
.to({ y: _y }, 300)
}
}
\ No newline at end of file
declare function getMetaConfig(id: string);
declare const PROCESS = 1;
declare const DOM_COMPONENT = 2;
declare const CANVAS_WIDGET = 3;
/**
* Created by rockyl on 2020/9/19.
*/
import {GameIndex} from "./GameIndex";
import {registerCustomLoader} from 'spark-wrapper-fyge'
import {svgaLoader} from 'svga-parser'
registerCustomLoader('.svga', svgaLoader);
/**
* @type CANVAS_WIDGET
* @name 测试模块
* @desc 测试模块的工厂方法
*/
export function WalkCom() {
return new GameIndex(getMetaConfig('WalkCom'));
}
{
"id": "WalkCom",
"name": "测试模块",
"desc": "实现了测试模块",
"config": {
"WalkCom": {
"props": [
{
"name": "curSteps",
"alias": "当前位置",
"type": "number",
"default": 0
},
{
"name": "gameSteps",
"alias": "所有站点位置",
"type": "number",
"default": [0, 10000, 30000, 100000, 200000, 350000]
},
{
"name": "siteName",
"alias": "站点名字",
"type": "string",
"default": [
"宝石山",
"金猪存钱罐",
"断桥残雪",
"平湖秋月",
"拆红包",
"苏堤春晓",
"曲苑风荷",
"打病毒",
"双峰插云"
]
},
{
"name": "txtDialogs",
"alias": "文字气泡",
"type": "string",
"default": [
"点我进入游戏哦~",
"敬请期待哦~",
"点我进入游戏哦~"
]
}
],
"assets": [
{
"name": "bg0",
"url": "//yun.duiba.com.cn/spark/assets/52494f5f52fb7c1c26e3394622bfcc921ea81488.png",
"uuid": "bg0",
"ext": ".png"
},
{
"name": "bg1",
"url": "//yun.duiba.com.cn/spark/assets/017affd13f79922a30b166a01f659901aa82600f.png",
"uuid": "bg1",
"ext": ".png"
},
{
"name": "bg2",
"url": "//yun.duiba.com.cn/spark/assets/1a798d6fbc9cf4d44f871e8867393e2fec4c98af.png",
"uuid": "bg2",
"ext": ".png"
},
{
"name": "bg3",
"url": "//yun.duiba.com.cn/spark/assets/303c9509aade47d1c02943f85a7c3feee3c309d9.png",
"uuid": "bg3",
"ext": ".png"
},
{
"name": "bg4",
"url": "//yun.duiba.com.cn/spark/assets/60ac97777f7ef02845891a3ceb10b00828afe4d0.png",
"uuid": "bg4",
"ext": ".png"
},
{
"name": "bg5",
"url": "//yun.duiba.com.cn/spark/assets/f67f8630fe02d895a84b86433bf57327673612ab.png",
"uuid": "bg5",
"ext": ".png"
},
{
"name": "bg6",
"url": "//yun.duiba.com.cn/spark/assets/431329ba0f3d6b51a64e7c08f078b78696b3ed73.png",
"uuid": "bg6",
"ext": ".png"
},
{
"name": "bg7",
"url": "//yun.duiba.com.cn/spark/assets/1c95bc1c7df1765508b21dd447c6a486b3866583.png",
"uuid": "bg7",
"ext": ".png"
},
{
"name": "宝石山",
"url": "//yun.duiba.com.cn/spark/assets/f1ac1c31ca5ef732a33248829be5be0f14a8a759.png",
"uuid": "bssPart",
"ext": ".png"
}
,
{
"name": "宝石山右边",
"url": "//yun.duiba.com.cn/spark/assets/63b881db4c1f8da230e40372a04aa981a9bb5c8c.png",
"uuid": "bssRPart",
"ext": ".png"
},
{
"name": "金猪存钱罐",
"url": "//yun.duiba.com.cn/spark/assets/57f5b228279b10c19e5da73b669e1cb42f6f96bb.png",
"uuid": "cqgPart",
"ext": ".png"
},
{
"name": "断桥残雪",
"url": "//yun.duiba.com.cn/spark/assets/30c4365901a5919684fc89ea93aec4022b0afd0f.png",
"uuid": "dqcxPart",
"ext": ".png"
},
{
"name": "平湖秋月",
"url": "//yun.duiba.com.cn/spark/assets/e1a8a21e7ee04eb4d3b0db06e2d099821ec4cc6a.png",
"uuid": "phqyPart",
"ext": ".png"
},
{
"name": "拆红包",
"url": "//yun.duiba.com.cn/spark/assets/85147443866a533c1080f5e3edcae64a0fa33ba2.png",
"uuid": "chbPart",
"ext": ".png"
},
{
"name": "苏堤春晓",
"url": "//yun.duiba.com.cn/spark/assets/d221fb8c04cf51644c6924f073e2e59200c3312f.png",
"uuid": "sdcxPart",
"ext": ".png"
},
{
"name": "曲苑风荷",
"url": "//yun.duiba.com.cn/spark/assets/bdd62d8c5df3564aecd40b6c376d73b606214f05.png",
"uuid": "qyfhPart",
"ext": ".png"
},
{
"name": "打病毒",
"url": "//yun.duiba.com.cn/spark/assets/a105e500da437b7a6a86aa4f6df50adecbac9e61.png",
"uuid": "dbdPart",
"ext": ".png"
},
{
"name": "双峰插云",
"url": "//yun.duiba.com.cn/spark/assets/5763ad4e31b3250dddd11e7802dcc45a1ee9a9a6.png",
"uuid": "sfcyPart",
"ext": ".png"
},
{
"name": "景点名字白色",
"url": "//yun.duiba.com.cn/spark/assets/98031869aeed8cc96fa745f6f345b5620dc3edfe.png",
"uuid": "siteNameW",
"ext": ".png"
},
{
"name": "景点名字亮色",
"url": "//yun.duiba.com.cn/spark/assets/6cf73b5472148edf38848acbda2b7c1906552919.png",
"uuid": "siteNameB",
"ext": ".png"
},
{
"name": "文字气泡",
"url": "//yun.duiba.com.cn/spark/assets/b42f3508c4bdc549d443a9eb73d32c22ea9b6dca.png",
"uuid": "wordTxt",
"ext": ".png"
},
{
"name": "人物文字气泡",
"url": "//yun.duiba.com.cn/spark/assets/a26da8b7f7c6213d756e3c2e9b253160e7deac07.png",
"uuid": "playerTxt",
"ext": ".png"
},
{
"name": "站牌1",
"url": "//yun.duiba.com.cn/spark/assets/9e5b97024fc5db17954b2aa5decfc8ba636c825d.png",
"uuid": "step1",
"ext": ".png"
},
{
"name": "站牌2",
"url": "//yun.duiba.com.cn/spark/assets/21c612efe4205751582dbcb493684f26076b061b.png",
"uuid": "step2",
"ext": ".png"
},
{
"name": "站牌3",
"url": "//yun.duiba.com.cn/spark/assets/cb5f7a2ae34bb1fbc0b2da1a4b69c637ec1bb97e.png",
"uuid": "step3",
"ext": ".png"
},
{
"name": "站牌4",
"url": "//yun.duiba.com.cn/spark/assets/c9101f79c92c49e2938bf8b7d0a4db979a4993f7.png",
"uuid": "step4",
"ext": ".png"
},
{
"name": "站牌5",
"url": "//yun.duiba.com.cn/spark/assets/4d730c25e510af0f4eda00c0038d52cfcc90f7f5.png",
"uuid": "step5",
"ext": ".png"
},
{
"name": "抢红包遮罩",
"url": "//yun.duiba.com.cn/spark/assets/dab93c867a799b37aa853ceff9d558543266b47a.png",
"uuid": "qhbmask",
"ext": ".png"
},
{
"name": "杭小宝",
"url": "//yun.duiba.com.cn/spark/assets/280e010e9c0e884d6909a544bec1d9931896bb6b.svga",
"uuid": "hangxiaobao",
"ext": ".svga"
},
{
"name": "宝石山svga",
"url": "//yun.duiba.com.cn/spark/assets/dff0e2bba59f9c144f98cc534f7a465d29ed4880.svga",
"uuid": "bss_svga",
"ext": ".svga"
},
{
"name": "断桥残雪svga",
"url": "//yun.duiba.com.cn/spark/assets/78e388b83123d4ec4bce77ed1d74dbacd1ff813f.svga",
"uuid": "dqcx_svga",
"ext": ".svga"
},
{
"name": "金猪svga",
"url": "//yun.duiba.com.cn/spark/assets/685367c238fca18659057e93c21d1afbce296c1d.svga",
"uuid": "jz_svga",
"ext": ".svga"
},
{
"name": "平湖秋月svga",
"url": "//yun.duiba.com.cn/spark/assets/73ad243143e1e47bcebd2fb0355767ea3696405e.svga",
"uuid": "phqy_svga",
"ext": ".svga"
},
{
"name": "抢红包svga",
"url": "//yun.duiba.com.cn/spark/assets/a7e9fbf9198f942a26a9534bc5468b11ef2d8d4b.svga",
"uuid": "qhb_svga",
"ext": ".svga"
},
{
"name": "曲苑风荷1svga",
"url": "//yun.duiba.com.cn/spark/assets/413fe4e5fcfaec61bbcdbc00ac499c11d4bc3c05.svga",
"uuid": "qyfh1_svga",
"ext": ".svga"
},
{
"name": "曲苑风荷2svga",
"url": "//yun.duiba.com.cn/spark/assets/ad26878a26e0cb380f112771786e221dc1c365bc.svga",
"uuid": "qyfh2_svga",
"ext": ".svga"
},
{
"name": "双峰插云1svga",
"url": "//yun.duiba.com.cn/spark/assets/8ed6fe82fbd0488c8b11fb7218202f2f6df145cb.svga",
"uuid": "sfcy1_svga",
"ext": ".svga"
},
{
"name": "双峰插云2svga",
"url": "//yun.duiba.com.cn/spark/assets/a97ec0601885e27919c015b693af83cd19b90ace.svga",
"uuid": "sfcy2_svga",
"ext": ".svga"
},
{
"name": "苏堤春晓svga",
"url": "//yun.duiba.com.cn/spark/assets/50950445aaa51b4d075b16390170c9a5c50b68e4.svga",
"uuid": "sdcx_svga",
"ext": ".svga"
},
{
"name": "烟花svga",
"url": "//yun.duiba.com.cn/spark/assets/ae8cc8b2a3e140d6c43e90147aba643ccf719887.svga",
"uuid": "yanhua_svga",
"ext": ".svga"
},
{
"name": "盖住1",
"url": "//yun.duiba.com.cn/spark/assets/6e1bb52797a470af034f0f33df631818d6954951.png",
"uuid": "mask1",
"ext": ".png"
},
{
"name": "盖住2",
"url": "//yun.duiba.com.cn/spark/assets/9b30654acc0ab5e458cd960eded41f5bbee38d95.png",
"uuid": "mask2",
"ext": ".png"
},
{
"name": "盖住3",
"url": "//yun.duiba.com.cn/spark/assets/6f5d45b0571526e674c33eb1576db8030ee6b117.png",
"uuid": "mask3",
"ext": ".png"
},
{
"name": "盖住4",
"url": "//yun.duiba.com.cn/spark/assets/54ce9abca439bcc5445beb61432a65dca3dab2f1.png",
"uuid": "mask4",
"ext": ".png"
},
{
"name": "盖住5",
"url": "//yun.duiba.com.cn/spark/assets/0179b18907ce6f4cbe77455a5b0407d7cbf82466.png",
"uuid": "mask5",
"ext": ".png"
},
{
"name": "盖住6",
"url": "//yun.duiba.com.cn/spark/assets/709d3b2efab3903ccc1f57dd7e0842b3cdcee78b.png",
"uuid": "mask6",
"ext": ".png"
},
{
"name": "盖住7",
"url": "//yun.duiba.com.cn/spark/assets/84bc2dc697f022afeb5ae42d986d54100071536e.png",
"uuid": "mask7",
"ext": ".png"
},
{
"name": "盖住8",
"url": "//yun.duiba.com.cn/spark/assets/c760b72c9fa1d20c289da49316ccbacf6c263c4d.png",
"uuid": "mask8",
"ext": ".png"
},
{
"name": "盖住9",
"url": "//yun.duiba.com.cn/spark/assets/5930654f5ff6d42a7797d0d75a6c998f873eb783.png",
"uuid": "mask9",
"ext": ".png"
},
{
"name": "盖住10",
"url": "//yun.duiba.com.cn/spark/assets/97eb63fd9df45c1faa1ace2638386205314af0fc.png",
"uuid": "mask10",
"ext": ".png"
}
],
"events": {
"in": {
"start": {
"alias": "开始"
},
"stop": {
"alias": "停止"
}
},
"out": {
"show_one": {
"alias": "展示一个文本",
"data": {
"text": "文本"
}
}
}
}
}
},
"externals": {
"svga-parser": "svga-parser"
}
}
import * as GAME from "spark-wrapper-fyge";
import { CHANGE_POINT, GameMgr } from "./GameConfig";
import { getSiteRoad, getText } from "./utils";
export default class player extends GAME.Container {
private _player: GAME.MovieClip;
private stepCountTxt: GAME.TextField;
private _stepCount: number;
private _step: number = 0;
public _isMove: boolean = false;
private _speed: number = 0;
private _dt: number = 1 / 60;
private _path: Array<Object> = [];
private _curTargetPosition: any = {};//当前目标点
public endCount: number = 0;
constructor() {
super();
this._player = this.addChild(new GAME.MovieClip(GAME.getAssetByUUID("hangxiaobao")));
// console.log("00", GAME.getAssetByUUID("hangxiaobao"));
this._player.x = -this._player.videoWidth / 2;
this._player.y = -this._player.videoHeight + 10;
let topBg = this.addChild(new GAME.Sprite(GAME.getAssetByUUID("playerTxt")));
topBg.x = -topBg.width / 2;
topBg.y = -this._player.videoHeight + 30;
topBg.anchorX = topBg.width / 2;
topBg.anchorY = topBg.height / 2;
topBg.scaleX = 1.2;
topBg.scaleY = 1.2;
let stepCount = getText("0步", 24, "#575757", GAME.TEXT_ALIGN.CENTER, topBg.width - 10, topBg.x, topBg.y + 10);
this.stepCountTxt = this.addChild(stepCount);
this.addEventListener(GAME.Event.ENTER_FRAME, this.onFarm, this);
}
/** 重置位置 */
reset(point: any) {
this.x = point.x;
this.y = point.y;
this.onChangeDir(point.dir);
this._player.gotoAndStop(1);
}
/** 帧事件 */
onFarm() {
if (!this._isMove) return;
if (!this.speed) return;
this.loopMove();
}
/** 步数 */
set stepCount(v: number) {
if (this._stepCount == v) return;
this._stepCount = v;
this.stepCountTxt.text = Math.floor(this._stepCount) + "步";
}
get stepCount(): number {
return this._stepCount;
}
/** 速度 */
get speed(): number {
return this._speed;
}
set speed(v: number) {
if (v === this._speed) return;
this._speed = v;
}
/**
* 每帧更新移动
*/
loopMove() {
let frameDistance = this._dt * this.speed;
let dx = this._curTargetPosition.x - this.x;
let dy = this._curTargetPosition.y - this.y;
let distance = Math.sqrt(dx * dx + dy * dy);
let f = frameDistance / distance;
this.x += f * dx;
this.y += f * dy;
this.stepCount += this._step;
if (this.y >> 0 <= this._curTargetPosition.y) {
// console.log("转向");
this.speed = 0;
this.onChangeDir(this._curTargetPosition.dir);
this.doMoveNextPosition();
}
}
/** 移动到下一个点 */
doMoveNextPosition() {
// console.log("98898", this._path)
if (this._path && this._path.length) {
this._curTargetPosition = this._path.shift();
this.speed = 100;
} else {
this.speed = 0;
this._isMove = false;
this.stepCount = this.endCount;
GameMgr.game.arriveEndPoint(this.endCount);
this._player.gotoAndStop(1);
}
}
/** move */
onMove(path: object[]) {
this._path = path;
this.speed = 100;
this._step = this.getStepForfarm();
// console.log("每一帧步数", this._step);
this._isMove = true;
this._curTargetPosition = this._path.shift();
this._player.play();
this.doMoveNextPosition();
}
/** 转向 */
onChangeDir(dir: string) {
if (dir === 'R') {
this._player.scaleX = -1;
this._player.x = this._player.videoWidth / 2;
} else if (dir === 'L') {
this._player.scaleX = 1;
this._player.x = -this._player.videoWidth / 2;
}
}
/** 获取每一帧相加的步数 */
getStepForfarm() {
let allStep = 0, _index = 0;
for (let i = 0; i < GameMgr.GAME_STEP.length; i++) {
if (this.endCount <= GameMgr.GAME_STEP[i]) {
allStep = GameMgr.GAME_STEP[i] - GameMgr.GAME_STEP[i - 1] || 0;
_index = i;
break;
}
}
let _dis = this._dt * this.speed;
let allRoads = getSiteRoad();
let allRoadLength = 0;
// console.log("****", _index)
if (_index != 0) {
allRoadLength = allRoads[_index - 1];
}
// console.log("00000", _dis, allRoadLength, allStep)
return _dis / allRoadLength * allStep;
}
}
\ No newline at end of file
import { CHANGE_POINT, GameMgr } from "./GameConfig"
import * as GAME from "spark-wrapper-fyge";
export const ROAD_KEY = [-1, 2, 9, 18, 21, 27];
/** 获取全路径 */
export const getRoadLength = function () {
let roadLengthArr: Array<number> = [];
let roadPoint = CHANGE_POINT;
for (let i = 0; i < roadPoint.length; i++) {
if (i + 1 < roadPoint.length) {
let _dx = roadPoint[i + 1].x - roadPoint[i].x;
let _dy = roadPoint[i + 1].y - roadPoint[i].y;
let distance = Math.sqrt(_dx * _dx + _dy * _dy);
roadLengthArr.push(Math.floor(distance));
}
}
return roadLengthArr;
}
/**获取站点位置 */
export const getSiteRoad = function () {
let roads = getRoadLength();
let count = 0, siteRoadsLength: Array<number> = [], temp = 0;
for (let i = 0; i < roads.length; i++) {
count += roads[i];
if (i == 2 || i == 9 || i == 18 || i == 21 || i == 27) {
siteRoadsLength.push(count - temp);
temp = count;
}
}
return siteRoadsLength;
}
/** 获取 点位 */
export const getCurPoint = function (curCount: number) {
let path: Array<Object> = [];
let endPoint: any;
let needStep: Array<number> = [], index = -1, remainCount = 0, curAllcount = 0;
let allRoads = getRoadLength();
let roads = getSiteRoad();
for (let i = 0; i < GameMgr.GAME_STEP.length; i++) {
if (i + 1 < GameMgr.GAME_STEP.length) {
needStep.push(GameMgr.GAME_STEP[i + 1] - GameMgr.GAME_STEP[i]);
}
// console.log("8787", curCount, GameMgr.GAME_STEP[i])
if (curCount <= GameMgr.GAME_STEP[i] && index == -1) {
index = i;
remainCount = curCount - GameMgr.GAME_STEP[i - 1] || 0;
curAllcount = GameMgr.GAME_STEP[i] - GameMgr.GAME_STEP[i - 1] || 0;
break;
}
}
if (index == 0) {
endPoint = { x: CHANGE_POINT[0].x, y: CHANGE_POINT[0].y, dir: CHANGE_POINT[0].dir };
return endPoint;
}
// console.log("111", index - 1);
//获得停留路段
let curRoad = roads[index - 1];
//多出当前路段
let remainRoad = curRoad * remainCount / curAllcount
let allRoadLength = 0;
let curIndex = 0;
// console.log("121", remainRoad)
for (let i = index == 0 ? 0 : ROAD_KEY[index - 1] + 1; i <= ROAD_KEY[index]; i++) {
allRoadLength += allRoads[i];
// console.log("55555", allRoadLength);
if (remainRoad <= allRoadLength) {
curIndex = i;
allRoadLength -= allRoads[i];
break;
}
}
//当前小路段的超出部分
let _distance = 0;
// console.log("98888", curIndex, remainRoad);
_distance = remainRoad - allRoadLength;
let _x = (CHANGE_POINT[curIndex + 1].x - CHANGE_POINT[curIndex].x) * _distance / allRoads[curIndex] + CHANGE_POINT[curIndex].x;
let _y = (CHANGE_POINT[curIndex + 1].y - CHANGE_POINT[curIndex].y) * _distance / allRoads[curIndex] + CHANGE_POINT[curIndex].y;
endPoint = { x: Math.floor(_x), y: Math.floor(_y), dir: CHANGE_POINT[curIndex].dir };
return endPoint;
}
//获取路径
export const getEndPath = function (curStep: number, preStep: number) {
let endPath: Array<Object> = [];
let curPoint = getCurPoint(curStep);
let prePoint = getCurPoint(preStep);
endPath.push(curPoint);
//简单点 -- 用Y值
for (let i = 0; i < CHANGE_POINT.length; i++) {
if (curPoint.y > CHANGE_POINT[i].y && prePoint.y < CHANGE_POINT[i].y) {
endPath.push(CHANGE_POINT[i]);
}
}
endPath.push(prePoint);
return endPath;
}
//获取字
export const getText = function (
txt: string,
size: number,
color: string = "#000000",
align: GAME.TEXT_ALIGN = GAME.TEXT_ALIGN.LEFT,
textWidth: number = 0,
x: number = 0,
y: number = 0
): GAME.TextField {
var text = new GAME.TextField();
text.fillColor = color;
text.size = size;
text.textWidth = textWidth;
text.textAlign = align;
text.x = x;
text.y = y;
text.text = txt;
return text
}
\ No newline at end of file
File added
EXTEND_ESLINT = true
/**
* Created by rockyl on 2020/11/20.
*/
const path = require('path');
module.exports = {
devServer: function(configFunction){
return function(proxy, allowedHost) {
const config = configFunction(proxy, allowedHost);
config.contentBase = [path.resolve('public'), path.resolve('../')];
return config;
};
}
}
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3",
"spark-utils": "^0.0.13"
},
"scripts": {
"dev": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-scripts ",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"react-app-rewired": "^2.1.6",
"sass": "^1.29.0"
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<title>test: walkCom</title>
<script src="//yun.duiba.com.cn/js-libs/rem/1.1.0/rem.min.js"></script>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
import React from 'react';
import './App.scss';
import { CanvasWidget } from 'spark-utils';
import { WalkCom } from "./bundle";
let _widget;
/**
* 配置覆盖
*/
const widgetConfig = {
props: {
},
assets: [
{
"name": "红包",
"url": "//yun.duiba.com.cn/aurora/df6e289d635a6a2b4f3df055e00301f63b07d863.png",
"uuid": "image",
"ext": ".png"
},
],
}
function App() {
// const [widgetVisible, setWidgetVisible] = useState(false);
function onReady(widget) {
_widget = widget;
}
/**
* 事件回调
*/
function onEvent(type, payload) {
console.log(type, payload);
}
function onAssetsProcess(loaded, total) {
console.log(`assets load process:${loaded}/${total}`)
}
function onAssetsComplete() {
console.log(`assets load complete`)
}
function onClickButton(type) {
_widget.dispatchInEvent(type,{curSteps: 220000,endSteps: 350000})
}
return (
<div className="App">
<div className="control-bar">
<button onClick={e => onClickButton('game-start')}>GO</button>
</div>
<CanvasWidget className="canvas-widget" widgetFactory={WalkCom} widgetConfig={widgetConfig}
onEvent={onEvent}
onReady={onReady} onAssetsProcess={onAssetsProcess}
onAssetsComplete={onAssetsComplete} />
</div>
);
}
export default App;
.App {
width: 100%;
height: 100%;
label{
display: flex;
justify-content: space-between;
margin-bottom: 5px;
}
.canvas-widget {
width: 100%;
height: 100%;
}
.control-bar {
position: absolute;
right: 10px;
bottom: 10px;
}
}
import React from 'react';
import { render } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
const { getByText } = render(<App />);
const linkElement = getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});
import React from 'react';
import ReactDOM from 'react-dom';
import './index.scss';
import App from './App';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
html, body, #root{
width: 100%;
height: 100%;
}
body {
margin: 0;
font-size: 14px;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom/extend-expect';
{
"compilerOptions": {
"module": "ES6",
"target": "ES5",
"jsx": "react",
"allowJs": true,
"moduleResolution": "Node",
"allowSyntheticDefaultImports": true,
"resolveJsonModule": true,
"lib": [
"ES2015",
"DOM"
]
},
"include": ["src"]
}
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