KANGFU_GAME
/
bird-go-home
7
0
Fork 0
Code Issues Releases Activity
Browse Source

Merge branch 'master' of dd.tall.wiki:ccsens_fe/bird-go-home

master
wally 4 years ago
parent
66c2a926f2 40e58da7b6
commit
d9067eee1e
19 changed files with 2169 additions and 3961 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 34
      README.md
  2. BIN
      dist.zip
  3. 5358
      package-lock.json
  4. BIN
      public/RECOVER_鸟妈妈回家_HTML5 Canvas.fla
  5. 4
      public/bird.html
  6. 548
      public/bird.js
  7. BIN
      public/images/stopDemo.png
  8. BIN
      public/images/再来一次_.png
  9. BIN
      public/恢复_鸟妈妈回家_HTML5 Canvas.fla
  10. BIN
      public/鸟妈妈回家_HTML5 Canvas.fla
  11. 38
      src/classes/again.js
  12. 17
      src/classes/count.js
  13. 41
      src/classes/demo.js
  14. 1
      src/classes/end.js
  15. 1
      src/classes/sound.js
  16. 4
      src/classes/time.js
  17. 3
      src/custom.js
  18. 28
      src/index.js
  19. 53
      src/test.js

34
README.md
View File

@ -1,5 +1,15 @@
# 鸟妈妈回家
# 运行步骤
1. git clone https://dd.tall.wiki/gitea/ccsens_fe/bird-go-home.git
2. 全局安装gulp npm i gulp -g
3. npm i 或者 yarn
4. 运行gulp
5. 运行vscode的live server
6. 部署服务器 dist目录
## 游戏介绍
“鸟妈妈回家”游戏用于 康复训练，上肢训练
@ -133,31 +143,16 @@ tree -I "node_modules|package-lock.json|yarn.lock"
```js
<script src="libs/1.0.0/createjs.min.js"></script>
<script src="bird.js"></script>
<script src="js/index.js"></script>
<script src="js/custom.js"></script>
<script src="js/classes/bird.js"></script>
<script src="js/classes/count.js"></script>
<script src="js/classes/back.js"></script>
<script src="js/classes/time.js"></script>
<script src="js/classes/level.js"></script>
<script src="js/classes/sound.js"></script>
<script src="js/classes/end.js"></script>
<script src="js/test.js"></script>
<script src="main.js"></script>
<!-- write your code here -->
</head>
<body onload="init();" style="margin:0px;">
<body onload="init();" style="margin: 0px;">
<div id="animation_container" style="background-color:rgba(255, 255, 255, 1.00); width:1280px; height:720px">
<canvas id="canvas" width="1280" height="720" style="position: absolute; display: none; background-color:rgba(255, 255, 255, 1.00);"></canvas>
<div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:1280px; height:720px; position: absolute; left: 0px; top: 0px; display: none;">
</div>
</div>
<div id='_preload_div_' style='position:absolute; top:0; left:0; display: inline-block; height:720px; width: 1280px; text-align: center;'> <span style='display: inline-block; height: 100%; vertical-align: middle;'></span> <img src=images/_preloader.gif style='vertical-align: middle; max-height: 100%'/></div>
<div style="position: fixed; top: 0; left: 0; z-index: 999;padding: 20px">
<h3>测试功能区</h3>
<button onclick="Count.of()">开始倒计时</button>
<button onclick="timeInstance.start()">开始游戏</button>
<button>结束游戏</button>
</div>
</body>
```
@ -172,6 +167,7 @@ function handleComplete(evt, comp) {
var ss = comp.getSpriteSheet();
var queue = evt.target;
var ssMetadata = lib.ssMetadata;
// for循环 i=0; 前面需要加 let， 否则编译会报错
for (i = 0; i < ssMetadata.length; i++) {
ss[ssMetadata[i].name] = new createjs.SpriteSheet({ images: [queue.getResult(ssMetadata[i].name)], frames: ssMetadata[i].frames });
}
@ -216,7 +212,7 @@ let state = 0; // 游戏状态 0->未开始 1->进行中 2->结束
function initStage(lib) {
library = lib;
window.bird = Bird.of(gameOver); // 初始化鸟等
window.main = Main.of(gameOver); // 初始化鸟等
window.timeInstance = Time.of(gameOver); // 初始化游戏时间
// window.soundInstance = Sound.of(); // 初始化音频
Level.of(2); // 游戏难度级别
@ -226,7 +222,7 @@ function initStage(lib) {
// 游戏结束 显示结束得分面板
function gameOver() {
state = 2;
const times = bird.times;
const times = main.times;
const score = parseInt((config.total / config.times) * times);
End.of(score);
}

BIN
dist.zip
View File

Binary file not shown.

5358
package-lock.json
View File

File diff suppressed because it is too large

BIN
public/RECOVER_鸟妈妈回家_HTML5 Canvas.fla
View File

Binary file not shown.

4
public/bird.html
View File

@ -22,7 +22,7 @@
}
</style>
<script src="libs/1.0.0/createjs.min.js"></script>
<script src="bird.js?1632731010092"></script>
<script src="bird.js"></script>
<script>
var canvas, stage, exportRoot, anim_container, dom_overlay_container, fnStartAnimation;
function init() {
@ -75,6 +75,6 @@ function handleComplete(evt,comp) {
<div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:1280px; height:720px; position: absolute; left: 0px; top: 0px; display: none;">
</div>
</div>
<div id='_preload_div_' style='position:absolute; top:0; left:0; display: inline-block; height:720px; width: 1280px; text-align: center;'> <span style='display: inline-block; height: 100%; vertical-align: middle;'></span> <img src=images/_preloader.gif?1632731010092 style='vertical-align: middle; max-height: 100%'/></div>
<div id='_preload_div_' style='position:absolute; top:0; left:0; display: inline-block; height:720px; width: 1280px; text-align: center;'> <span style='display: inline-block; height: 100%; vertical-align: middle;'></span> <img src=images/_preloader.gif style='vertical-align: middle; max-height: 100%'/></div>
</body>
</html>

548
public/bird.js
View File

File diff suppressed because one or more lines are too long

BIN
public/images/stopDemo.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
public/images/再来一次_.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
public/恢复_鸟妈妈回家_HTML5 Canvas.fla
View File

Binary file not shown.

BIN
public/鸟妈妈回家_HTML5 Canvas.fla
View File

Binary file not shown.

38
src/classes/again.js
View File

@ -0,0 +1,38 @@
/**
* 再玩一次类
* @property {object} lib 库对象
* @property {object} btnAgain 面板元素对象
*/
function Again() {
this.lib = library;
this.btnAgain = null;
}
Again.of = function () {
const instance = new Again();
instance.init();
return instance;
};
// 初始化
Again.prototype.init = function () {
this.showAgainBtn();
};
// 渲染背景面板
Again.prototype.showAgainBtn = function () {
const lib = this.lib;
const btnAgain = new lib.btnAgain();
btnAgain.x = lib.properties.width / 2;
btnAgain.y = lib.properties.height / 2 + 150;
this.btnAgain = btnAgain;
this.btnAgain.addEventListener(
'click',
function () {
location.reload();
},
false,
);
stage.addChild(btnAgain);
};

17
src/classes/count.js
View File

@ -9,8 +9,9 @@
* @property {number} default 倒计时值
* @property {number} timer 计时器id
* @property {object} lib 库对象
* @property {function} countEndCallback 结束回调函数
*/
function Count(startTime = Date.now(), defaultCount = config.count || 5) {
function Count(countEndCallback, startTime, defaultCount = config.count || 5) {
this.default = defaultCount;
this.startTime = startTime;
@ -18,16 +19,18 @@ function Count(startTime = Date.now(), defaultCount = config.count || 5) {
this.text = null;
this.timer = null;
this.lib = library;
this.countEndCallback = countEndCallback;
}
/**
* 静态方法 封装new 及 init方法
* 使用时直接调用此方法
* @param {function} countEndCallback 倒计时结束的回调函数
* @param {number} defaultCount 倒计时时长
* @returns
*/
Count.of = function (defaultCount) {
const instance = new Count(defaultCount);
Count.of = function (countEndCallback, startTime = Date.now(), defaultCount) {
const instance = new Count(countEndCallback, startTime, defaultCount);
instance.init();
return instance;
};
@ -64,12 +67,12 @@ Count.prototype.renderContent = function () {
// 更新倒计时文本
Count.prototype.update = function (time) {
if (time <= 0) {
console.log(time);
// 发送倒计时结束的消息
clearInterval(this.timer);
stage.removeChild(this.text);
stage.removeChild(this.modal);
// sendEndCountRequest(); // 发送倒计时结束的消息
this.countEnd();
return;
}
@ -86,3 +89,9 @@ Count.prototype.renderText = function (time) {
this.text = text;
stage.addChild(text);
};
// 结束倒计时 开始游戏
Count.prototype.countEnd = function () {
// 执行结束后的回调
this.countEndCallback();
};

41
src/classes/demo.js
View File

@ -0,0 +1,41 @@
/**
* 演示模式类
* @property {object} lib 库对象
* @property {object} stopDemo 面板元素对象
*/
function Demo() {
this.lib = library;
this.stopDemo = null;
}
Demo.of = function () {
const instance = new Demo();
instance.init();
return instance;
};
// 初始化
Demo.prototype.init = function () {
this.showStopDemo();
};
// 显示演示模式按钮
Demo.prototype.showStopDemo = function () {
const lib = this.lib;
const stopDemo = new lib.stopDemo();
stopDemo.x = 50;
stopDemo.y = lib.properties.height - 100;
this.stopDemo = stopDemo;
// 关闭演示模式
this.stopDemo.addEventListener(
'click',
function () {
stage.removeChild(stopDemo);
location.hash = '';
location.reload();
},
false,
);
stage.addChild(stopDemo);
};

1
src/classes/end.js
View File

@ -31,6 +31,7 @@ End.of = function (score) {
End.prototype.init = function () {
this.renderModal();
this.renderText(this.score);
Again.of();
};
// 渲染背景面板

1
src/classes/sound.js
View File

@ -20,7 +20,6 @@ Sound.prototype.init = function () {
{ src: 'sounds/unbelievable.mp3', id: 'unbelievable' },
];
createjs.Sound.addEventListener('fileload', function (event) {
console.log('event: ', event);
this.music[event.id] = createjs.Sound.createInstance(event.id);
});
createjs.Sound.registerSounds(sounds, '../../');

4
src/classes/time.js
View File

@ -43,13 +43,13 @@ Time.of = function (endCallback, duration = config.duration || 60, count = confi
// 初始化
Time.prototype.init = function () {
console.log('初始化');
this.renderBg();
this.renderText(this.duration);
};
// 开始游戏 开始倒计时
Time.prototype.start = function (startTime = Date.now()) {
console.log('开始游戏: ');
this.started = true;
state = 1;
this.startTime = startTime;
@ -92,10 +92,8 @@ Time.prototype.update = function () {
if (this.timerId || !this.started) return;
// const endTime = this.startTime + this.count * 1000 + this.duration * 1000;
const endTime = this.startTime + this.duration * 1000;
// console.log('endTime: ', endTime);
this.timerId = setInterval(() => {
let leftTime = Math.round((endTime - Date.now()) / 1000);
console.log('leftTime: ', leftTime);
this.text && stage.removeChild(this.text);
if (leftTime <= 0) {
leftTime = 0;

3
src/custom.js
View File

@ -3,7 +3,7 @@ const config = {
duration: 60, // 总时长 s
level: 1, // 游戏难度级别
total: 100, // 总分
times: 20, // 动作次数
times: 21, // 动作次数
};
let library = null;
@ -17,6 +17,7 @@ function initStage(lib) {
// window.soundInstance = Sound.of(); // 初始化音频
Level.of(2); // 游戏难度级别
Back.of(); // 返回按钮
isHash();
}
// 游戏结束 显示结束得分面板

28
src/index.js
View File

@ -1,8 +1,5 @@
var canvas, stage, exportRoot, anim_container, dom_overlay_container, fnStartAnimation;
function init() {
// 连点7次开始游戏
startGame();
canvas = document.getElementById('canvas');
anim_container = document.getElementById('animation_container');
dom_overlay_container = document.getElementById('dom_overlay_container');
@ -52,28 +49,3 @@ function handleComplete(evt, comp) {
AdobeAn.compositionLoaded(lib.properties.id);
fnStartAnimation();
}
function startGame() {
var count = 0,
timer;
document.onclick = function () {
if (count < 6) {
if (timer) {
clearTimeout(timer);
}
count++;
timer = setTimeout(function () {
count = 0;
}, 300);
} else if (count === 6) {
count = 0;
clearTimeout(timer);
sevenClick();
}
};
function sevenClick() {
console.log('连点7次开始游戏');
timeInstance.start();
main.play();
}
}

53
src/test.js
View File

@ -0,0 +1,53 @@
// 判断是否在演示模式 能否直接开始游戏
function isHash() {
if (location.hash && location.hash === 'p') {
Demo.of();
Count.of(countOver);
} else {
// 连点7次触发倒计时
startGame();
}
}
function startGame() {
var count = 0,
timer;
document.onclick = function () {
if (count < 6) {
if (timer) {
clearTimeout(timer);
}
count++;
timer = setTimeout(function () {
count = 0;
}, 300);
} else if (count === 6) {
count = 0;
clearTimeout(timer);
sevenClick();
}
};
}
function sevenClick() {
Count.of(countOver);
addHash();
}
// 倒计时结束 开始游戏
function countOver() {
timeInstance.start();
}
// 添加hash值
function addHash() {
location.hash = 'p';
Demo.of();
}
function test() {
document.addEventListener('click', () => {
main.play();
});
}
test();
Write Preview
Loading…
Cancel
Save