Commit f0684238 authored by 任建锋's avatar 任建锋

美食从天而降自定义模块

parent 72c4b76a
This diff is collapsed.
/**
* Created by renjianfeng on 2020-03-13.
*/
const customId = 'food-fell';
(async function () {
let customModule = await fetch(`../meta.json`);
customModule = await customModule.json();
console.log(customModule);
await loadAssets(customModule.assets);
launchWithCustomModule(customModule);
})();
function launchWithCustomModule(customModule) {
//engine.registerCustomCodeModule(customModule);
engine.registerCustomModule(customId, window[customId]);
const {props: propsOption, assets} = customModule;
let props = engine.computeProps(customModuleProps, propsOption);
const customModuleIns = {
id: customId,
props,
assets,
};
engine.registerCustomModules([customModuleIns]);
engine.launchWithConfig({
options: {
entrySceneView: 'entry',
},
assets: [],
views: [{
name: 'entry',
type: 'node',
properties: {
x: 0,
y: 0,
}
}],
}, null, function () {
setTimeout(() => {
engine.addCustomModule(customId, engine.gameStage.sceneContainer.getChildAt(0));
}, 100);
setTimeout(() => {
engine.globalEvent.dispatchEvent('food-fell-reset', {
"goodsProbability": [0.8,0.1,0.1],
"countDown": 30,
"acceleratedSpeed":0.1
});
engine.globalEvent.dispatchEvent('food-fell-start');
}, 500);
});
engine.globalEvent.addEventListener('food-fell-time-update', (e) => {
console.log(e.type, e.data);
});
engine.globalEvent.addEventListener('food-fell-score-update', (e) => {
console.log(e.type, e.data);
});
engine.globalEvent.addEventListener('food-fell-game-over', (e) => {
console.log(e.type, e.data);
});
}
function getAssetByUUID(uuid) {
return engine.resolveCustomAsset(customId, uuid);
}
function getProps() {
return engine.getProps(customId);
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>美食从天而降</title>
<meta name="viewport"
content="width=device-width,initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="full-screen" content="true"/>
<meta name="screen-orientation" content="portrait"/>
<meta name="x5-fullscreen" content="true"/>
<meta name="360-fullscreen" content="true"/>
<style>
html,
body {
padding: 0;
margin: 0;
border: 0;
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
background-color: red;
}
</style>
</head>
<body>
<div id="game-container" style="line-height:0;font-size:0"></div>
<script crossorigin="anonymous" src="//yun.duiba.com.cn/editor/zeroing/libs/engine.50cdcef6ebe4e8c0fbc624f9d4fbf225102c5750.js"></script>
<script crossorigin="anonymous" src="//yun.duiba.com.cn/editor/zeroing/libs/svga.fd3923ae6e664251ca7981801a65809cc5f36bc3.js"></script>
<!-- <script src="//yun.duiba.com.cn/editor/zeroing/libs/engine.ebc906f6b50b8da0a669f77027981d5f3cb560ce.js"></script> -->
<!-- <script src="http://localhost:4002/debug/engine.js"></script>
<script src="http://localhost:4003/debug/engine-svga.js"></script> -->
<!--<script src="//yun.duiba.com.cn/editor/zeroing/libs/engine.9a9dbfda4cb2dd5508ecddfe3d95dfd88063f7b5.js"></script>-->
<script src="app.js"></script>
<script src="props.js"></script>
<script src="load-assets.js"></script>
<script src="main.js"></script>
<script>
</script>
</body>
\ No newline at end of file
/**
* Created by rockyl on 2020-01-21.
*/
const assets = [
{
"name": "玩家icon",
"url": "//yun.duiba.com.cn/aurora/assets/50a7212a113175fa18c866b005d98f07c558dc77.png",
"uuid": "66f23d13-82a5-4cec-9496-301ec240d087",
"ext": ".png"
},
{
"name": "雨滴",
"url": "//yun.duiba.com.cn/aurora/assets/8564c8c9be3aead71b05a0bab8d7d07ac3f778a1.png",
"uuid": "264a6192-d7bf-45e8-8f15-6ba2c439a532",
"ext": ".png"
},
{
"name": "炸弹",
"url": "//yun.duiba.com.cn/aurora/assets/171e92283cd13c013ee1b76d28d252ff08815d47.png",
"uuid": "eb88b42d-e151-4c1b-94b9-7c16f7bfac29",
"ext": ".png"
},
{
"name": "石块",
"url": "//yun.duiba.com.cn/aurora/assets/99b0af0c59fe79a415a3f032149cfacc27e3ac2c.png",
"uuid": "ab1bdabc-21ba-46bf-9299-6c638f766c88",
"ext": ".png"
},
{
"name": "水花",
"url": "//yun.duiba.com.cn/aurora/assets/93d37b4a0e367e80e375308a6b4414d72d7666fc.svga",
"uuid": "b521bf94-20e1-44dd-8eca-d24996cbaeae",
"ext": ".svga"
},
{
"name": "炸弹",
"url": "//yun.duiba.com.cn/aurora/assets/4dd18f0689c663bbcf710a7afc4d929084d97d36.svga",
"uuid": "322edf39-805b-4e84-9d07-5573dfeebc0e",
"ext": ".svga"
},
{
"name": "玩家",
"url": "//yun.duiba.com.cn/aurora/assets/b66300c5d4f27134b0aac3dc90a3220e8ae572eb.svga",
"uuid": "71d8dcbc-3931-471a-b585-b3ae01b25aa6",
"ext": ".svga"
}
];
function loadAssets(customModuleAssets, onProgress, onComplete){
return engine.loadAssets(assets.concat(...customModuleAssets), onProgress, onComplete);
}
This diff is collapsed.
This diff is collapsed.
/**
* Created by rockyl on 2020-01-21.
*/
let customModuleProps = {
};
{
"name": "口红机",
"desc": "口红机模块",
"props": {
"playerPositionY": {
"alias": "玩家Y轴位置",
"type": "number",
"default": 900
},
"rainScore": {
"alias": "接中雨滴获得分数",
"type": "number",
"default": 1
},
"stoneScore": {
"alias": "接中石块获得分数",
"type": "number",
"default": -1
},
"speed": {
"alias": "道具掉落初始速度",
"type": "number",
"default": 10
},
"maxSpeed": {
"alias": "道具掉落速度上限",
"type": "number",
"default": 3
},
"gameOverCondition": {
"alias": "游戏结束条件(1:接到炸弹死亡,2:分数负数或接到炸弹死亡)",
"type": "number",
"default": 1
}
},
"assets": [
{
"name": "玩家icon",
"url": "//yun.duiba.com.cn/aurora/assets/50a7212a113175fa18c866b005d98f07c558dc77.png",
"uuid": "66f23d13-82a5-4cec-9496-301ec240d087",
"ext": ".png"
},
{
"name": "雨滴",
"url": "//yun.duiba.com.cn/aurora/assets/8564c8c9be3aead71b05a0bab8d7d07ac3f778a1.png",
"uuid": "264a6192-d7bf-45e8-8f15-6ba2c439a532",
"ext": ".png"
},
{
"name": "炸弹",
"url": "//yun.duiba.com.cn/aurora/assets/171e92283cd13c013ee1b76d28d252ff08815d47.png",
"uuid": "eb88b42d-e151-4c1b-94b9-7c16f7bfac29",
"ext": ".png"
},
{
"name": "石块",
"url": "//yun.duiba.com.cn/aurora/assets/99b0af0c59fe79a415a3f032149cfacc27e3ac2c.png",
"uuid": "ab1bdabc-21ba-46bf-9299-6c638f766c88",
"ext": ".png"
},
{
"name": "水花",
"url": "//yun.duiba.com.cn/aurora/assets/93d37b4a0e367e80e375308a6b4414d72d7666fc.svga",
"uuid": "b521bf94-20e1-44dd-8eca-d24996cbaeae",
"ext": ".svga"
},
{
"name": "炸弹svga",
"url": "//yun.duiba.com.cn/aurora/assets/4dd18f0689c663bbcf710a7afc4d929084d97d36.svga",
"uuid": "322edf39-805b-4e84-9d07-5573dfeebc0e",
"ext": ".svga"
},
{
"name": "玩家",
"url": "//yun.duiba.com.cn/aurora/assets/b66300c5d4f27134b0aac3dc90a3220e8ae572eb.svga",
"uuid": "71d8dcbc-3931-471a-b585-b3ae01b25aa6",
"ext": ".svga"
}
],
"events": {
"in": {
"food-fell-reset": {
"alias": "重置",
"data": {
"goodsProbability": "[0.2,0.5,0.3]道具概率(雨滴、石头、炸弹),所有概率相加为1",
"countDown": "倒计时(s)",
"acceleratedSpeed":"道具掉落加速度(单位:每秒)"
}
},
"food-fell-start": {
"alias": "开始"
},
"food-fell-revive": {
"alias": "复活"
},
"food-fell-pause": {
"alias": "暂停"
},
"food-fell-resume": {
"alias": "恢复"
},
"food-fell-clear": {
"alias": "清空,通过reset事件恢复"
}
},
"out": {
"food-fell-score-update": {
"alias": "分数更新",
"data": {
"score":"分数"
}
},
"food-fell-time-update": {
"alias": "倒计时更新",
"data": {
"time":"剩余时间"
}
},
"food-fell-game-over": {
"alias": "游戏结束",
"data": {
"score":"分数",
"reason": "结束原因(1:时间到了,2:玩家死亡)"
}
}
}
}
}
\ No newline at end of file
/**
* Created by rockyl on 2018/8/16.
*/
import { props } from "../props";
import { playSound, createSvga } from "./utils";
import ObjectPool = engine.ObjectPool;
import { getTextureByName } from "./utils";
import { Goods } from "./Goods";
import { PoolName } from "./object-pool-init";
export default class GameView extends engine.Container {
private _hasSetup;
//玩家
private player: engine.Container;
//触摸层
private rectBg: engine.Rect;
//npc层
private NpcBg: engine.Container;
//当前分数
private score
//游戏状态
private gameIng;
//npc出身计时器
private timer
//倒计时计时器
private countdownTimer: any
//倒计时
private countdown: number
//当前速度
private speed: number
// 当前场景上面的物品
private goodsItems = []
private _goods: Goods;
constructor() {
super();
this.once(engine.Event.ADDED_TO_STAGE, this.setup, this);
}
private waterSvga
private boomSvga
private playerSvga
setup() {
if (this._hasSetup) {
return;
}
this._hasSetup = true;
this.NpcBg = new engine.Container();
this.NpcBg.alpha = 1;
this.NpcBg.width = 0;
this.NpcBg.height = 0;
this.addChild(this.NpcBg)
this.player = new engine.Container();
this.player.mouseEnabled = false;
// this.player.fillColor="rgba(0, 0, 0,1)"
//console.log(this.player.fillColor)
this.addChild(this.player);
this.waterSvga=createSvga("水花")
this.playerSvga=createSvga("玩家")
this.boomSvga=createSvga("炸弹svga")
this.player.addChild(this.playerSvga);
this.player.addChild(this.waterSvga);
this.player.addChild(this.boomSvga);
this.playerSvga.gotoAndPlay(1);
this.visible=false;
setTimeout(()=>{
this.visible=true;
// this.player.width=this.playerSvga.width;
// this.player.height=this.playerSvga.height;
this.player.anchorY = this.player.height / 2;
this.player.anchorX = this.player.width / 2;
console.log(this.player.width)
console.log(this.playerSvga.width)
this.player.x = 375 - this.player.width / 2;
this.player.y = props.playerPositionY;
},300)
this.rectBg = new engine.Rect();
this.rectBg.alpha = 0;
this.rectBg.width = 750;
this.rectBg.height = 1624;
this.addChild(this.rectBg)
this.rectBg.addEventListener(engine.MouseEvent.MOUSE_DOWN, this.onDownStage, this);
this.rectBg.addEventListener(engine.MouseEvent.MOUSE_MOVE, this.onMoveStage, this);
this.rectBg.addEventListener(engine.MouseEvent.MOUSE_OUT, this.onOutStage, this);
}
/**
* 重置场景
*/
reset() {
this.recycleGoods()
}
/**
* 开始
*/
start() {
this.score = 0;
this.speed = 1
this.gameIng = true;
this.creatNpc()
this.beginNpc()
this.countdown = props.countDown;
this.countdownTimer = setInterval(() => {
if (this.gameIng) {
if (this.countdown > 0) {
engine.globalEvent.dispatchEvent('food-fell-time-update', {
time: this.countdown,
});
this.countdown -= 1
} else {
engine.globalEvent.dispatchEvent('food-fell-game-over', {
score: this.score,
reason: 1
});
this.died()
}
}
}, 1000)
}
/**
* npc开始掉落
*/
beginNpc() {
this.timer = setTimeout(() => {
if (this.gameIng) {
this.speed += props.acceleratedSpeed;
this.creatNpc()
}
//递归执行
this.beginNpc()
}, 2000 / this.speed)
}
/**
* 暂停
*/
pause() {
this.gameIng = false;
}
/**
* 恢复
*/
revive() {
this.gameIng = true;
}
/**
* 重新开始
*/
resume() {
this.reset()
this.start()
}
/**
* 创建NPC
*/
private creatNpc() {
let goods = this._goods = <Goods>ObjectPool.getObject(PoolName);
this.goodsItems.push(goods)
this.NpcBg.addChild(goods);
goods.addEventListener(engine.Event.ENTER_FRAME, goods["onGoodsEnter"] = () => {
if (goods.y > 1624) {
this.removeNpc(goods)
} else {
if (this.gameIng) {
//速度叠加
goods.y += (4 * this.speed)
//如果玩家和物品发生碰撞
if (this.hasHit(this.player, goods)) {
if (goods["npcType"] == "rain") {
console.log("碰到雨滴")
this.score += props.rainScore
this.waterSvga.visible=true;
this.waterSvga.play(false, false)
this.waterSvga.once(engine.Event.END_FRAME, ()=>{
this.waterSvga.visible=false;
}, this);
} else if (goods["npcType"] == "stone") {
console.log("碰到石头")
this.score += props.stoneScore
} else if (goods["npcType"] == "boom") {
console.log("碰到炸弹")
this.boomSvga.visible=true;
this.boomSvga.play(false, false)
this.boomSvga.once(engine.Event.END_FRAME, ()=>{
this.boomSvga.visible=false;
}, this);
engine.globalEvent.dispatchEvent('food-fell-game-over', {
score: this.score,
reason: 2
});
this.died()
}
engine.globalEvent.dispatchEvent('food-fell-score-update', {
score: this.score,
});
this.removeNpc(goods)
}
}
}
}, this);
}
/**
* 玩家死亡
*/
private died() {
this.score = 0
this.pause()
}
/**
* 回收指定物品
* @param goods 物品
*/
private removeNpc(goods) {
this.NpcBg.removeChild(goods);
ObjectPool.recycleObject(PoolName, goods);
goods.removeEventListener(engine.Event.ENTER_FRAME, goods["onGoodsEnter"], this);
let index = this.goodsItems.indexOf(goods);
if (index > -1) {
this.goodsItems.splice(index, 1);
}
}
/**
* 回收对象
*/
private recycleGoods() {
clearTimeout(this.timer)
clearInterval(this.countdownTimer)
for (let goods of this.goodsItems) {
if (goods) {
this.removeChild(goods);
ObjectPool.recycleObject(PoolName, goods);
goods.removeEventListener(engine.Event.ENTER_FRAME, goods["onGoodsEnter"], this);
}
}
this.goodsItems = []
}
private moveCatchX = 0
private playerCatchX = 0
/**
* 碰撞检测
* @param a a盒子
* @param b b盒子
*/
private hasHit(a, b) {
if (
Math.abs((a.x + a.width / 2) - (b.x + b.width / 2)) < a.width / 2 + b.width / 2
&&
Math.abs((a.y + a.height / 2) - (b.y + b.height / 2)) < a.height / 2 + b.height / 2
) {
return true;
} else {
return false;
}
}
private onDownStage = (e) => {
this.moveCatchX = e.localX;
this.playerCatchX = this.player.x
}
private onMoveStage = (e) => {
if (this.gameIng) {
this.player.x = this.playerCatchX + (e.localX - this.moveCatchX)
}
}
private onOutStage = (e) => {
this.moveCatchX = 0
}
}
/**
* Created by rockyl on 2020-01-09.
*/
import GameView from "./GameView";
import {injectProps} from "../props";
export class GameWrapper extends engine.Container {
private _status;
private _gameView: GameView;
constructor() {
super();
engine.globalEvent.addEventListener('food-fell-reset', this.reset, this);
engine.globalEvent.addEventListener('food-fell-start', this.start, this);
engine.globalEvent.addEventListener('food-fell-pause', this.pause, this);
engine.globalEvent.addEventListener('food-fell-resume', this.resume, this);
engine.globalEvent.addEventListener('food-fell-revive', this.revive, this);
engine.globalEvent.addEventListener('food-fell-clear', this.clear, this);
this.addEventListener(engine.MouseEvent.CLICK, this.onTap, this);
let gameView = this._gameView = new GameView();
this.addChild(gameView);
// gameView.reset()
// gameView.start()
}
reset(event: engine.Event) {
injectProps(event.data);
this._gameView.visible = true;
this._gameView.reset();
}
start(event: engine.Event) {
injectProps(event.data);
this._status = 1;
this._gameView.start();
}
pause() {
this._gameView.pause();
}
resume() {
this._gameView.resume();
}
revive() {
this._gameView.revive();
}
clear() {
this._gameView.visible = false;
}
private onTap(event) {
// this._gameView.tap(event);
}
}
/**
* Created by rockyl on 2020-02-02.
*
* 掉落物品
*/
import {getTextureByName} from "./utils";
import {props} from "../props";
export class Goods extends engine.Container {
private _body:engine.Rect
private _toY;
constructor() {
super();
let body
body = this._body =new engine.Rect()
let rain = new engine.Sprite(getTextureByName('雨滴'));
rain["npcType"]="rain"
let stone = new engine.Sprite(getTextureByName('石块'));
stone["npcType"]="stone"
let boom = new engine.Sprite(getTextureByName('炸弹'));
boom["npcType"]="boom"
rain.visible=false;
stone.visible=false;
boom.visible=false;
body.addChild(rain)
body.addChild(stone)
body.addChild(boom)
this.addChild(body);
body.width=.0001;
body.height=.0001;
body.mouseEnabled=false;
}
getRandomNumberByRange(start, end) {
return Math.floor(Math.random() * (end - start) + start)
}
reset() {
this.visible = true;
this.rotation = 0;
this.anchorOffsetY = 0;
this.y = 0;
this.x = (750-120)*Math.random()+30;
this.rotation = 0;
let random=Math.random()
if(random<props.goodsProbability[0]){
this.showNpc("rain")
}else if(random>=props.goodsProbability[0]&&random<=(props.goodsProbability[0]+props.goodsProbability[1])){
this.showNpc("stone")
}else if(random>(props.goodsProbability[0]+props.goodsProbability[1])){
this.showNpc("boom")
}
}
showNpc(type){
for(let i=0;i<this._body.children.length;i++){
this._body.children[i].visible=false;
this._body.children[i].mouseEnabled=false;
}
for(let i=0;i<this._body.children.length;i++){
if(this._body.children[i]["npcType"]==type){
this["npcType"]=type
this._body.children[i].visible=true;
this._body.children[i].mouseEnabled=false;
}
}
}
set anchorOffsetY(v) {
this._body.y = v;
}
}
/**
* Created by rockyl on 2020-02-03.
*/
import {Goods} from "./Goods";
import ObjectPool = engine.ObjectPool;
export const PoolName: string = 'goods';
ObjectPool.registerPool(PoolName, function () {
return new Goods();
}, function (item: Goods, data) {
item.reset();
});
/**
* Created by rockyl on 2020-01-21.
*/
export function getTexture(uuid) {
return engine.Texture.from(getAssetByUUID(uuid).uuid);
}
export function getTextureByName(name) {
return getTexture(engine.getAssetByName(name).uuid);
}
export function playSound(name) {
engine.playSound(engine.getAssetByName(name).uuid, {keep: true});
}
export function createSvga(name, anchorName?) {
let inst = new svga.Svga();
inst.source = 'asset://' + engine.getAssetByName(name).uuid;
return inst;
}
\ No newline at end of file
/**
* Created by rockyl on 2019-11-20.
*/
import {GameWrapper} from "./game/GameWrapper";
import {injectProps, prepareProps} from "./props";
export default function (props) {
prepareProps();
injectProps(props);
let instance = new GameWrapper();
return instance;
}
/**
* Created by rockyl on 2020-01-21.
*/
export let props: any = {};
export function prepareProps() {
let metaProps = getProps();
engine.injectProp(props, metaProps);
}
export function injectProps(p) {
engine.injectProp(props, p);
}
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