44 changed files with 8018 additions and 0 deletions
@ -0,0 +1,113 @@ |
|||
# Logs |
|||
logs |
|||
*.log |
|||
npm-debug.log* |
|||
yarn-debug.log* |
|||
yarn-error.log* |
|||
lerna-debug.log* |
|||
|
|||
# Diagnostic reports (https://nodejs.org/api/report.html) |
|||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json |
|||
|
|||
# Runtime data |
|||
pids |
|||
*.pid |
|||
*.seed |
|||
*.pid.lock |
|||
|
|||
# Directory for instrumented libs generated by jscoverage/JSCover |
|||
lib-cov |
|||
|
|||
# Coverage directory used by tools like istanbul |
|||
coverage |
|||
*.lcov |
|||
|
|||
# nyc test coverage |
|||
.nyc_output |
|||
|
|||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) |
|||
.grunt |
|||
|
|||
# Bower dependency directory (https://bower.io/) |
|||
bower_components |
|||
|
|||
# node-waf configuration |
|||
.lock-wscript |
|||
|
|||
# Compiled binary addons (https://nodejs.org/api/addons.html) |
|||
build/Release |
|||
|
|||
# Dependency directories |
|||
node_modules/ |
|||
jspm_packages/ |
|||
|
|||
# TypeScript v1 declaration files |
|||
typings/ |
|||
|
|||
# TypeScript cache |
|||
*.tsbuildinfo |
|||
|
|||
# Optional npm cache directory |
|||
.npm |
|||
|
|||
# Optional eslint cache |
|||
.eslintcache |
|||
|
|||
# Microbundle cache |
|||
.rpt2_cache/ |
|||
.rts2_cache_cjs/ |
|||
.rts2_cache_es/ |
|||
.rts2_cache_umd/ |
|||
|
|||
# Optional REPL history |
|||
.node_repl_history |
|||
|
|||
# Output of 'npm pack' |
|||
*.tgz |
|||
|
|||
# Yarn Integrity file |
|||
.yarn-integrity |
|||
|
|||
# dotenv environment variables file |
|||
.env |
|||
.env.test |
|||
|
|||
# parcel-bundler cache (https://parceljs.org/) |
|||
.cache |
|||
|
|||
# Next.js build output |
|||
.next |
|||
|
|||
# Nuxt.js build / generate output |
|||
.nuxt |
|||
dist |
|||
|
|||
# Gatsby files |
|||
.cache/ |
|||
# Comment in the public line in if your project uses Gatsby and *not* Next.js |
|||
# https://nextjs.org/blog/next-9-1#public-directory-support |
|||
# public |
|||
|
|||
# vuepress build output |
|||
.vuepress/dist |
|||
|
|||
# Serverless directories |
|||
.serverless/ |
|||
|
|||
# FuseBox cache |
|||
.fusebox/ |
|||
|
|||
# DynamoDB Local files |
|||
.dynamodb/ |
|||
|
|||
# TernJS port file |
|||
.tern-port |
|||
|
|||
.vscode/ |
|||
|
|||
.idea/ |
|||
yarn.lock |
|||
|
|||
dist |
|||
dist/* |
|||
.~README.md |
|||
@ -0,0 +1,13 @@ |
|||
{ |
|||
"printWidth": 140, |
|||
"singleQuote": true, |
|||
"semi": true, |
|||
"trailingComma": "all", |
|||
"arrowParens": "avoid", |
|||
"tabWidth": 2, |
|||
"useTabs": false, |
|||
"bracketSpacing": true, |
|||
"jsxBracketSameLine": false, |
|||
"proseWrap": "always", |
|||
"endOfLine": "lf" |
|||
} |
|||
@ -0,0 +1,34 @@ |
|||
const { task, series, parallel, src, dest, watch } = require('gulp'); |
|||
const babel = require('gulp-babel'); |
|||
const uglify = require('gulp-uglify'); |
|||
const concat = require('gulp-concat'); |
|||
const clean = require('gulp-clean'); |
|||
const livereload = require('gulp-livereload'); |
|||
|
|||
const cleanTask = function () { |
|||
return src('dist/*', { read: false }).pipe(clean()); |
|||
}; |
|||
|
|||
const script = function () { |
|||
return src('src/**/*.js') |
|||
.pipe(babel({ presets: ['@babel/env'] })) |
|||
.pipe(uglify()) |
|||
.pipe(concat('main.js')) |
|||
.pipe(dest('dist/')) |
|||
.pipe(livereload({ start: true, port: 3001, reloadPage: 'dist/index.html' })); |
|||
}; |
|||
|
|||
const copy = function () { |
|||
src('./public/index.html').pipe(dest('dist/')); |
|||
src('./public/source-code.js').pipe(dest('dist/')); |
|||
src('./public/images/*').pipe(dest('dist/images')); |
|||
src('./public/libs/**/*').pipe(dest('dist/libs')); |
|||
src('./public/sounds/*').pipe(dest('dist/sounds')); |
|||
}; |
|||
|
|||
const watchTask = function () { |
|||
livereload.listen(); |
|||
watch('src/*', script); |
|||
}; |
|||
|
|||
exports.default = parallel(copy, script, watchTask); |
|||
File diff suppressed because it is too large
@ -0,0 +1,29 @@ |
|||
{ |
|||
"name": "bird-go-home", |
|||
"version": "1.0.0", |
|||
"description": "", |
|||
"main": ".svrxrc.js", |
|||
"scripts": { |
|||
"dev": "gulp" |
|||
}, |
|||
"repository": { |
|||
"type": "git", |
|||
"url": "gitea@dd.tall.wiki:ccsens_fe/bird-go-home.git" |
|||
}, |
|||
"keywords": [], |
|||
"author": "", |
|||
"license": "ISC", |
|||
"devDependencies": { |
|||
"@babel/core": "^7.15.5", |
|||
"@babel/preset-env": "^7.15.6", |
|||
"gulp": "^4.0.2", |
|||
"gulp-babel": "^8.0.0", |
|||
"gulp-clean": "^0.4.0", |
|||
"gulp-concat": "^2.6.1", |
|||
"gulp-livereload": "^4.0.2", |
|||
"gulp-uglify": "^3.0.2" |
|||
}, |
|||
"dependencies": { |
|||
"vinyl-paths": "^4.0.0" |
|||
} |
|||
} |
|||
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 5.8 KiB |
|
After Width: | Height: | Size: 6.1 KiB |
|
After Width: | Height: | Size: 81 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 8.7 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 348 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 6.7 KiB |
|
After Width: | Height: | Size: 8.1 KiB |
@ -0,0 +1,37 @@ |
|||
<!DOCTYPE html> |
|||
<!-- |
|||
NOTES: |
|||
1. All tokens are represented by '$' sign in the template. |
|||
2. You can write your code only wherever mentioned. |
|||
3. All occurrences of existing tokens will be replaced by their appropriate values. |
|||
4. Blank lines will be removed automatically. |
|||
5. Remove unnecessary comments before creating your template. |
|||
--> |
|||
<html> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta name="authoring-tool" content="Adobe_Animate_CC"> |
|||
<title>source-code</title> |
|||
<!-- write your code here --> |
|||
<style> |
|||
#animation_container, #_preload_div_ { |
|||
position:absolute; |
|||
margin:auto; |
|||
left:0;right:0; |
|||
top:0;bottom:0; |
|||
} |
|||
</style> |
|||
<script src="libs/1.0.0/createjs.min.js"></script> |
|||
<script src="source-code.js"></script> |
|||
<script src="main.js"></script> |
|||
<!-- write your code here --> |
|||
</head> |
|||
<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> |
|||
</body> |
|||
</html> |
|||
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
@ -0,0 +1,80 @@ |
|||
<!DOCTYPE html> |
|||
<!-- |
|||
NOTES: |
|||
1. All tokens are represented by '$' sign in the template. |
|||
2. You can write your code only wherever mentioned. |
|||
3. All occurrences of existing tokens will be replaced by their appropriate values. |
|||
4. Blank lines will be removed automatically. |
|||
5. Remove unnecessary comments before creating your template. |
|||
--> |
|||
<html> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta name="authoring-tool" content="Adobe_Animate_CC"> |
|||
<title>source-code</title> |
|||
<!-- write your code here --> |
|||
<style> |
|||
#animation_container, #_preload_div_ { |
|||
position:absolute; |
|||
margin:auto; |
|||
left:0;right:0; |
|||
top:0;bottom:0; |
|||
} |
|||
</style> |
|||
<script src="libs/1.0.0/createjs.min.js"></script> |
|||
<script src="source-code.js"></script> |
|||
<script> |
|||
var canvas, stage, exportRoot, anim_container, dom_overlay_container, fnStartAnimation; |
|||
function init() { |
|||
canvas = document.getElementById("canvas"); |
|||
anim_container = document.getElementById("animation_container"); |
|||
dom_overlay_container = document.getElementById("dom_overlay_container"); |
|||
var comp=AdobeAn.getComposition("397CEFA891E67B489D61174578189EF7"); |
|||
var lib=comp.getLibrary(); |
|||
var loader = new createjs.LoadQueue(false); |
|||
loader.addEventListener("fileload", function(evt){handleFileLoad(evt,comp)}); |
|||
loader.addEventListener("complete", function(evt){handleComplete(evt,comp)}); |
|||
var lib=comp.getLibrary(); |
|||
loader.loadManifest(lib.properties.manifest); |
|||
} |
|||
function handleFileLoad(evt, comp) { |
|||
var images=comp.getImages(); |
|||
if (evt && (evt.item.type == "image")) { images[evt.item.id] = evt.result; } |
|||
} |
|||
function handleComplete(evt,comp) { |
|||
//This function is always called, irrespective of the content. You can use the variable "stage" after it is created in token create_stage. |
|||
var lib=comp.getLibrary(); |
|||
var ss=comp.getSpriteSheet(); |
|||
var queue = evt.target; |
|||
var ssMetadata = lib.ssMetadata; |
|||
for(i=0; i<ssMetadata.length; i++) { |
|||
ss[ssMetadata[i].name] = new createjs.SpriteSheet( {"images": [queue.getResult(ssMetadata[i].name)], "frames": ssMetadata[i].frames} ) |
|||
} |
|||
var preloaderDiv = document.getElementById("_preload_div_"); |
|||
preloaderDiv.style.display = 'none'; |
|||
canvas.style.display = 'block'; |
|||
exportRoot = new lib.摘苹果Canvas(); |
|||
stage = new lib.Stage(canvas); |
|||
//Registers the "tick" event listener. |
|||
fnStartAnimation = function() { |
|||
stage.addChild(exportRoot); |
|||
createjs.Ticker.framerate = lib.properties.fps; |
|||
createjs.Ticker.addEventListener("tick", stage); |
|||
} |
|||
//Code to support hidpi screens and responsive scaling. |
|||
AdobeAn.makeResponsive(true,'both',true,1,[canvas,preloaderDiv,anim_container,dom_overlay_container]); |
|||
AdobeAn.compositionLoaded(lib.properties.id); |
|||
fnStartAnimation(); |
|||
} |
|||
</script> |
|||
<!-- write your code here --> |
|||
</head> |
|||
<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> |
|||
</body> |
|||
</html> |
|||
File diff suppressed because one or more lines are too long
Binary file not shown.
@ -0,0 +1,47 @@ |
|||
/** |
|||
* 再玩一次类 |
|||
* @property {object} lib 库对象 |
|||
* @property {object} btnAgain 面板元素对象 |
|||
*/ |
|||
function Again() { |
|||
this.lib = library; |
|||
|
|||
this.btnAgain = null; |
|||
} |
|||
|
|||
Again.of = (function () { |
|||
let instance = null; |
|||
return function () { |
|||
if (!instance) { |
|||
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 () { |
|||
if (config.mode === 0) { |
|||
againMessage(); |
|||
} else { |
|||
location.reload(); |
|||
} |
|||
}, |
|||
false, |
|||
); |
|||
stage.addChild(btnAgain); |
|||
}; |
|||
@ -0,0 +1,32 @@ |
|||
function Back() { |
|||
this.lib = library; |
|||
|
|||
this.back = null; |
|||
} |
|||
|
|||
Back.of = (function () { |
|||
let instance = null; |
|||
return function () { |
|||
if (!instance) { |
|||
instance = new Back(); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
Back.prototype.init = function () { |
|||
const target = new this.lib.btnBack(); |
|||
target.x = 40; |
|||
target.y = 80; |
|||
target.scaleX = 1.3; |
|||
target.scaleY = 1.3; |
|||
target.addEventListener('click', this.goHome, false); |
|||
this.back = target; |
|||
stage.addChild(target); |
|||
}; |
|||
|
|||
// 返回主菜单 TODO:
|
|||
Back.prototype.goHome = function () { |
|||
console.log('goHome'); |
|||
}; |
|||
@ -0,0 +1,102 @@ |
|||
// Count.of(startTime, defaultCount) 调用即可
|
|||
|
|||
/** |
|||
* 倒计时类 |
|||
* @param {number} startTime 开始倒计时的时间 |
|||
* @param {number} defaultCount 倒计时时长 TODO: const startTime = +gameInfo.startTime; |
|||
* @property {object} modal 面板对象 |
|||
* @property {object} text 倒计时文本对象 |
|||
* @property {number} default 倒计时值 |
|||
* @property {number} timer 计时器id |
|||
* @property {object} lib 库对象 |
|||
* @property {function} countEndCallback 结束回调函数 |
|||
*/ |
|||
function Count(countEndCallback, startTime, defaultCount = config.count || 5) { |
|||
this.default = defaultCount; |
|||
this.startTime = startTime; |
|||
|
|||
this.modal = null; |
|||
this.text = null; |
|||
this.timer = null; |
|||
this.lib = library; |
|||
this.countEndCallback = countEndCallback; |
|||
} |
|||
|
|||
/** |
|||
* 静态方法 封装new 及 init方法 |
|||
* 使用时直接调用此方法 |
|||
* @param {function} countEndCallback 倒计时结束的回调函数 |
|||
* @param {number} defaultCount 倒计时时长 |
|||
* @returns |
|||
*/ |
|||
Count.of = (function () { |
|||
let instance = null; |
|||
return function (countEndCallback, startTime = Date.now(), defaultCount) { |
|||
if (!instance) { |
|||
instance = new Count(countEndCallback, startTime, defaultCount); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
// 初始化方法
|
|||
Count.prototype.init = function () { |
|||
this.renderModal(); |
|||
this.renderContent(); |
|||
}; |
|||
|
|||
// 渲染面板
|
|||
Count.prototype.renderModal = function () { |
|||
const target = new this.lib.bgModalBegin(); |
|||
target.x = this.lib.properties.width / 2; |
|||
target.y = this.lib.properties.height / 2; |
|||
this.modal = target; |
|||
stage.addChild(target); // 显示开始游戏的倒计时面板
|
|||
}; |
|||
|
|||
// 渲染倒计时文本内容
|
|||
Count.prototype.renderContent = function () { |
|||
const endCountTime = this.startTime + this.default * 1000; |
|||
let leftCount = Math.round((endCountTime - Date.now()) / 1000); |
|||
|
|||
this.update(leftCount); // 开始开始游戏的 倒计时
|
|||
|
|||
this.timer = setInterval(() => { |
|||
leftCount = Math.round((endCountTime - Date.now()) / 1000); |
|||
stage.removeChild(this.text); |
|||
this.update(leftCount); |
|||
}, 1000); |
|||
}; |
|||
|
|||
// 更新倒计时文本
|
|||
Count.prototype.update = function (time) { |
|||
if (time <= 0) { |
|||
// 发送倒计时结束的消息
|
|||
clearInterval(this.timer); |
|||
stage.removeChild(this.text); |
|||
stage.removeChild(this.modal); |
|||
// sendEndCountRequest(); // 发送倒计时结束的消息
|
|||
this.countEnd(); |
|||
return; |
|||
} |
|||
|
|||
this.renderText(time); |
|||
}; |
|||
|
|||
// 渲染文本
|
|||
Count.prototype.renderText = function (time) { |
|||
const text = new createjs.Text(time, 'bold 100px Arial', '#87431c'); |
|||
text.x = this.lib.properties.width / 2; |
|||
text.y = this.lib.properties.height / 2 + 20; |
|||
text.textAlign = 'center'; |
|||
text.textBaseline = 'alphabetic'; |
|||
this.text = text; |
|||
stage.addChild(text); |
|||
}; |
|||
|
|||
// 结束倒计时 开始游戏
|
|||
Count.prototype.countEnd = function () { |
|||
// 执行结束后的回调
|
|||
this.countEndCallback(); |
|||
}; |
|||
@ -0,0 +1,47 @@ |
|||
/** |
|||
* 演示模式类 |
|||
* @property {object} lib 库对象 |
|||
* @property {object} stopDemo 面板元素对象 |
|||
*/ |
|||
function Demo() { |
|||
this.lib = library; |
|||
|
|||
this.stopDemo = null; |
|||
} |
|||
|
|||
Demo.of = (function () { |
|||
let instance = null; |
|||
return function () { |
|||
if (!instance) { |
|||
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(); |
|||
isDemo = false; |
|||
}, |
|||
false, |
|||
); |
|||
stage.addChild(stopDemo); |
|||
}; |
|||
@ -0,0 +1,65 @@ |
|||
/** |
|||
* 游戏结束 |
|||
* @param {number} score 最终得分 |
|||
* |
|||
* @property {object} lib 资源对象 |
|||
* @property {number} score 最终得分 |
|||
* @property {object} modal 面板元素对象 |
|||
* @property {object} text 文本元素对象 |
|||
*/ |
|||
function End(score) { |
|||
this.lib = library; |
|||
|
|||
this.score = score; |
|||
|
|||
this.modal = null; |
|||
this.text = null; |
|||
} |
|||
|
|||
/** |
|||
* 静态方法 封装new init 返回实例 |
|||
* @param {number} score 最终得分 |
|||
* @returns |
|||
*/ |
|||
End.of = (function () { |
|||
let instance = null; |
|||
return function (score) { |
|||
if (!instance) { |
|||
instance = new End(score); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
// 初始化
|
|||
End.prototype.init = function () { |
|||
this.renderModal(); |
|||
this.renderText(this.score); |
|||
Again.of(); |
|||
}; |
|||
|
|||
// 渲染背景面板
|
|||
End.prototype.renderModal = function () { |
|||
const lib = this.lib; |
|||
const target = new lib.bgModalEnd(); |
|||
target.x = lib.properties.width / 2; |
|||
target.y = lib.properties.height / 2; |
|||
this.modal = target; |
|||
stage.addChild(target); |
|||
}; |
|||
|
|||
/** |
|||
* 渲染得分文本对象 |
|||
* @param {number} score 最终得分 |
|||
*/ |
|||
End.prototype.renderText = function (score) { |
|||
const lib = this.lib; |
|||
const target = new createjs.Text(score, 'bold 100px Arial', '#793b18'); |
|||
target.x = lib.properties.width / 2; |
|||
target.y = lib.properties.height / 2 + 70; |
|||
target.textAlign = 'center'; |
|||
target.textBaseline = 'alphabetic'; |
|||
this.text = target; |
|||
stage.addChild(target); |
|||
}; |
|||
@ -0,0 +1,34 @@ |
|||
/** |
|||
* 难度等级类 |
|||
* @param {number} level 等级数字代码 |
|||
*/ |
|||
function Level(level) { |
|||
this.lib = library; |
|||
|
|||
this.level = level; |
|||
} |
|||
|
|||
/** |
|||
* 静态方法 封装new init 返回实例 |
|||
* @param {number} level 等级数值 |
|||
* @returns |
|||
*/ |
|||
Level.of = function (level) { |
|||
const instance = new Level(level); |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
|
|||
// 初始化 渲染
|
|||
// 更新config中的level属性
|
|||
Level.prototype.init = function () { |
|||
const initX = this.lib.properties.width / 2; |
|||
const initY = 80; |
|||
const target = new this.lib.Level(); |
|||
target.x = initX; |
|||
target.y = initY; |
|||
|
|||
target.gotoAndStop(`level-${this.level}`); |
|||
config.level = this.level; |
|||
stage.addChild(target); |
|||
}; |
|||
@ -0,0 +1,81 @@ |
|||
/** |
|||
* 游戏主体 |
|||
* @param {function} endCallback 游戏结束的回调函数 |
|||
* @param {number} max 最多运动次数 |
|||
* |
|||
* @property {object} lib 资源对象 |
|||
* @property {object} element 主体元素对象 |
|||
* @property {number} prevTime 上次完成的时间ms |
|||
* @property {number} max 最多运动(play)次数 |
|||
* @property {number} times 当前运动次数 play依次+1 |
|||
* @property {function} endCallback 结束后 调用的回调函数 |
|||
*/ |
|||
function Main(endCallback, max) { |
|||
this.lib = library; |
|||
|
|||
this.element = null; |
|||
this.prevTime = 0; |
|||
|
|||
this.max = max; |
|||
this.times = 0; |
|||
this.endCallback = endCallback; |
|||
} |
|||
|
|||
/** |
|||
* 静态方法 封装new init 返回实例 |
|||
* @param {function} endCallback 游戏结束的回调函数 |
|||
* @param {number} max 最多运动次数 |
|||
*/ |
|||
Main.of = (function () { |
|||
let instance = null; |
|||
return function (endCallback, max = config.times) { |
|||
if (!instance) { |
|||
instance = new Main(endCallback, max); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
// 初始方法
|
|||
Main.prototype.init = function () { |
|||
const target = new this.lib.Main(); |
|||
this.element = target; |
|||
stage.addChild(target); |
|||
}; |
|||
|
|||
// play
|
|||
// 限制了两次动作间隔时间不能少于1.55s
|
|||
// 游戏状态在进行中才能触发
|
|||
// play次数 >= 最多完成次数 调用结束的callback
|
|||
Main.prototype.play = function (direction) { |
|||
if (Date.now() - this.prevTime <= 1500 || state !== 1) return; |
|||
// if (state !== 1) return;
|
|||
this.element.play(); |
|||
this.times += 1; |
|||
|
|||
this.computeScore(this.times, direction); |
|||
setTimeout(function () { |
|||
window.soundInstance.playBomb(direction); |
|||
}, 300); |
|||
|
|||
this.prevTime = Date.now(); |
|||
if (this.times >= this.max) { |
|||
this.times = this.max; |
|||
this.endCallback(); |
|||
} |
|||
}; |
|||
|
|||
/** |
|||
* 计算当前的次数与分值 并发送给父窗口 |
|||
* @param {number} times 当前动作执行成功的次数 |
|||
* @param {number} direction play code |
|||
*/ |
|||
Main.prototype.computeScore = function (times, direction = 0) { |
|||
const directionTarget = config.config.scores.find(item => item.direction === direction); |
|||
config.currentTimes = times; |
|||
config.currentScore += directionTarget.score; |
|||
if (config.mode === 0) { |
|||
sendMessage({ event: 'play', data: { currentTimes: times, currentScore: config.currentScore } }); |
|||
} |
|||
}; |
|||
@ -0,0 +1,56 @@ |
|||
// 音频处理类;
|
|||
function Sound() { |
|||
this.lib = library; |
|||
|
|||
this.music = {}; |
|||
} |
|||
|
|||
Sound.of = (function () { |
|||
let instance = null; |
|||
return function () { |
|||
if (!instance) { |
|||
instance = new Sound(); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
Sound.prototype.init = function () { |
|||
createjs.Sound.alternateExtensions = ['mp3']; |
|||
const sounds = [ |
|||
{ src: 'sounds/bgmMusic.mp3', id: 'bgm' }, |
|||
{ src: 'sounds/audio1.mp3', id: 'audio1' }, |
|||
]; |
|||
const _this = this; |
|||
createjs.Sound.addEventListener('fileload', function (event) { |
|||
_this.music[event.id] = createjs.Sound.createInstance(event.id); |
|||
}); |
|||
createjs.Sound.registerSounds(sounds, './'); |
|||
this.playBgm(); |
|||
}; |
|||
|
|||
Sound.prototype.playBgm = function () { |
|||
this.music.bgm && this.music.bgm.play({ loop: -1, volume: 0.3 }); // 播放背景音乐
|
|||
}; |
|||
|
|||
Sound.prototype.playBomb = function (direction) { |
|||
if (direction === 0) { |
|||
this.music.audio1 && this.music.audio1.play(); // 播放挤橙汁声
|
|||
} |
|||
}; |
|||
|
|||
// let music = {};
|
|||
// function initSound() {
|
|||
// createjs.Sound.alternateExtensions = ['mp3'];
|
|||
// const sounds = [
|
|||
// { src: 'public/sounds/bgmMusic.mp3', id: 'bgm' },
|
|||
// { src: 'public/sounds/excitationMusic.mp3', id: 'excitation' },
|
|||
// { src: 'public/sounds/amazing.mp3', id: 'amazing' },
|
|||
// { src: 'public/sounds/unbelievable.mp3', id: 'unbelievable' },
|
|||
// ];
|
|||
// createjs.Sound.addEventListener('fileload', function (event) {
|
|||
// music[event.id] = createjs.Sound.createInstance(event.id);
|
|||
// });
|
|||
// createjs.Sound.registerSounds(sounds, '../../');
|
|||
// }
|
|||
@ -0,0 +1,55 @@ |
|||
/** |
|||
* 暂停游戏类（暂停继续游戏） |
|||
* @property {object} lib 库对象 |
|||
* @property {object} suspend 面板元素对象 |
|||
*/ |
|||
function Suspend() { |
|||
this.lib = library; |
|||
|
|||
this.suspend = null; |
|||
} |
|||
|
|||
Suspend.of = (function () { |
|||
let instance = null; |
|||
return function () { |
|||
if (!instance) { |
|||
instance = new Suspend(); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
// 初始化
|
|||
Suspend.prototype.init = function () { |
|||
this.suspendGame(); |
|||
}; |
|||
|
|||
// 暂停游戏按钮
|
|||
Suspend.prototype.suspendGame = function () { |
|||
const lib = this.lib; |
|||
const suspend = new lib.suspend(); |
|||
suspend.x = 50; |
|||
suspend.y = lib.properties.height - 100; |
|||
this.suspend = suspend; |
|||
const _this = this; |
|||
// 继续游戏
|
|||
this.suspend.addEventListener( |
|||
'click', |
|||
function () { |
|||
_this.hide(); |
|||
continueMessage(); |
|||
}, |
|||
false, |
|||
); |
|||
// stage.addChild(this.suspend);
|
|||
// stage.removeChild(this.suspend);
|
|||
}; |
|||
|
|||
Suspend.prototype.hide = function () { |
|||
stage.removeChild(this.suspend); |
|||
}; |
|||
|
|||
Suspend.prototype.show = function () { |
|||
stage.addChild(this.suspend); |
|||
}; |
|||
@ -0,0 +1,125 @@ |
|||
/** |
|||
* 游戏时长 计时 |
|||
* @param {function} endCallback 倒计时结束的回调函数 |
|||
* @param {number} duration 游戏时长 |
|||
* @param {number} count 游戏倒计时时长 |
|||
* |
|||
* @property {number} duration 游戏时长 |
|||
* @property {number} count 游戏倒计时时长 |
|||
* @property {number} startTime 游戏开始是ms |
|||
* @property {boolean} started 游戏是否开始 |
|||
* @property {object} lib 资源库 |
|||
* @property {object} bg 时间倒计时背景 |
|||
* @property {object} text 倒计时文本 |
|||
* @property {number} timerId 定时器id |
|||
* @property {function} endCallback 结束回调函数 |
|||
*/ |
|||
function Time(endCallback, duration, count) { |
|||
this.duration = duration; |
|||
this.count = count; |
|||
this.startTime = Date.now(); |
|||
|
|||
this.started = false; // 是否开始游戏
|
|||
|
|||
this.lib = library; |
|||
this.bg = null; |
|||
this.text = null; |
|||
this.timerId = null; |
|||
this.endCallback = endCallback; |
|||
} |
|||
|
|||
/** |
|||
* 静态方法 封装new init 返回实例 |
|||
* @param {function} endCallback 倒计时结束的回调函数 |
|||
* @param {number} duration 游戏时长 |
|||
* @param {number} count 游戏倒计时时长 |
|||
* @returns |
|||
*/ |
|||
Time.of = (function () { |
|||
let instance = null; |
|||
return function (endCallback, duration = config.duration || 60, count = config.count || 5) { |
|||
if (!instance) { |
|||
instance = new Time(endCallback, duration, count); |
|||
} |
|||
instance.init(); |
|||
return instance; |
|||
}; |
|||
})(); |
|||
|
|||
// 初始化
|
|||
Time.prototype.init = function () { |
|||
this.renderBg(); |
|||
this.renderText(this.duration); |
|||
}; |
|||
|
|||
// 设置时长
|
|||
Time.prototype.setDuration = function (duration) { |
|||
this.duration = duration; |
|||
this.renderText(this.duration); |
|||
}; |
|||
|
|||
// 开始游戏 开始倒计时
|
|||
Time.prototype.start = function (startTime = Date.now()) { |
|||
this.started = true; |
|||
state = 1; |
|||
this.startTime = startTime; |
|||
this.duration = leftDuration ? leftDuration : this.duration; |
|||
this.update(); |
|||
}; |
|||
|
|||
// 暂停游戏 暂停倒计时
|
|||
Time.prototype.pause = function () { |
|||
this.started = false; |
|||
state = 3; |
|||
clearTimeout(this.timerId); |
|||
this.timerId = null; |
|||
}; |
|||
|
|||
// 结束游戏 结束倒计时
|
|||
Time.prototype.end = function () { |
|||
this.started = false; |
|||
this.timerId && clearTimeout(this.timerId); |
|||
this.timerId = null; |
|||
// 执行结束后的回调
|
|||
this.endCallback(); |
|||
}; |
|||
|
|||
// 渲染背景
|
|||
Time.prototype.renderBg = function () { |
|||
const initX = this.lib.properties.width - 100; |
|||
const initY = 80; |
|||
const instance = new this.lib.timeBg(); |
|||
instance.x = initX; |
|||
instance.y = initY; |
|||
this.bg = instance; |
|||
stage.addChild(instance); |
|||
}; |
|||
|
|||
// 渲染文本
|
|||
Time.prototype.renderText = function (time) { |
|||
if (this.text) stage.removeChild(this.text); |
|||
const text = new createjs.Text(time, 'bold 40px Arial', '#823d16'); |
|||
text.x = this.lib.properties.width - 100; |
|||
text.y = 100; |
|||
text.textAlign = 'center'; |
|||
text.textBaseline = 'alphabetic'; |
|||
this.text = text; |
|||
stage.addChild(text); |
|||
}; |
|||
|
|||
// 更新文本
|
|||
Time.prototype.update = function () { |
|||
if (this.timerId || !this.started) return; |
|||
// const endTime = this.startTime + this.duration * 1000;
|
|||
this.timerId = setInterval(() => { |
|||
// let leftTime = Math.round((endTime - Date.now()) / 1000);
|
|||
this.duration--; |
|||
leftDuration = this.duration; |
|||
this.text && stage.removeChild(this.text); |
|||
if (this.duration <= 0) { |
|||
this.duration = 0; |
|||
this.end(); |
|||
} |
|||
this.renderText(this.duration); |
|||
}, 1000); |
|||
}; |
|||
@ -0,0 +1,54 @@ |
|||
const config = { |
|||
count: 5, // 默认倒计时时长
|
|||
duration: 60, // 总时长 s
|
|||
total: 90, // 总分
|
|||
times: 15, // 动作次数
|
|||
level: 1, // 游戏难度级别
|
|||
mode: 1, // 模式 0-> 正常模式 1-> 演示模式
|
|||
currentScore: 0, // 当前得分
|
|||
currentTimes: 0, // 当前次数
|
|||
config: { |
|||
scores: [{ direction: 0, score: 6 }], |
|||
directions: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], |
|||
}, // 得分配置
|
|||
}; |
|||
|
|||
let library = null; |
|||
let state = 0; // 游戏状态 0->未开始 1->进行中 2->结束 3->暂停
|
|||
let isDemo = false; // 是不是演示模式
|
|||
let leftDuration = null; // 暂停时的时间
|
|||
|
|||
function initStage(lib) { |
|||
library = lib; |
|||
|
|||
window.main = Main.of(gameOver); // 初始化鸟等
|
|||
window.timeInstance = Time.of(gameOver); // 初始化游戏时间
|
|||
window.soundInstance = Sound.of(); // 初始化音频
|
|||
|
|||
Level.of(config.level); // 游戏难度级别
|
|||
Back.of(); // 返回按钮
|
|||
isHash(); |
|||
window.suspend = Suspend.of(); |
|||
|
|||
window.addEventListener( |
|||
'click', |
|||
function () { |
|||
if (!window.soundInstance) return; |
|||
window.soundInstance.playBgm(); |
|||
}, |
|||
false, |
|||
); |
|||
} |
|||
|
|||
// 游戏结束 显示结束得分面板
|
|||
function gameOver() { |
|||
state = 2; |
|||
const times = main.times; |
|||
|
|||
setTimeout(() => { |
|||
End.of(config.currentScore || 0); |
|||
if (config.mode === 0) { |
|||
finishMessage(config.currentScore, times); |
|||
} |
|||
}, 2000); |
|||
} |
|||
@ -0,0 +1,51 @@ |
|||
var canvas, stage, exportRoot, anim_container, dom_overlay_container, fnStartAnimation; |
|||
function init() { |
|||
canvas = document.getElementById('canvas'); |
|||
anim_container = document.getElementById('animation_container'); |
|||
dom_overlay_container = document.getElementById('dom_overlay_container'); |
|||
var comp = AdobeAn.getComposition('397CEFA891E67B489D61174578189EF7'); |
|||
var lib = comp.getLibrary(); |
|||
var loader = new createjs.LoadQueue(false); |
|||
loader.addEventListener('fileload', function (evt) { |
|||
handleFileLoad(evt, comp); |
|||
}); |
|||
loader.addEventListener('complete', function (evt) { |
|||
handleComplete(evt, comp); |
|||
}); |
|||
var lib = comp.getLibrary(); |
|||
loader.loadManifest(lib.properties.manifest); |
|||
} |
|||
function handleFileLoad(evt, comp) { |
|||
var images = comp.getImages(); |
|||
if (evt && evt.item.type == 'image') { |
|||
images[evt.item.id] = evt.result; |
|||
} |
|||
} |
|||
function handleComplete(evt, comp) { |
|||
//This function is always called, irrespective of the content. You can use the variable "stage" after it is created in token create_stage.
|
|||
var lib = comp.getLibrary(); |
|||
var ss = comp.getSpriteSheet(); |
|||
var queue = evt.target; |
|||
var ssMetadata = lib.ssMetadata; |
|||
for (let i = 0; i < ssMetadata.length; i++) { |
|||
ss[ssMetadata[i].name] = new createjs.SpriteSheet({ images: [queue.getResult(ssMetadata[i].name)], frames: ssMetadata[i].frames }); |
|||
} |
|||
var preloaderDiv = document.getElementById('_preload_div_'); |
|||
preloaderDiv.style.display = 'none'; |
|||
canvas.style.display = 'block'; |
|||
exportRoot = new lib.摘苹果Canvas(); |
|||
stage = new lib.Stage(canvas); |
|||
//Registers the "tick" event listener.
|
|||
fnStartAnimation = function () { |
|||
stage.addChild(exportRoot); |
|||
|
|||
initStage(lib); |
|||
|
|||
createjs.Ticker.framerate = lib.properties.fps; |
|||
createjs.Ticker.addEventListener('tick', stage); |
|||
}; |
|||
//Code to support hidpi screens and responsive scaling.
|
|||
AdobeAn.makeResponsive(true, 'both', true, 1, [canvas, preloaderDiv, anim_container, dom_overlay_container]); |
|||
AdobeAn.compositionLoaded(lib.properties.id); |
|||
fnStartAnimation(); |
|||
} |
|||
@ -0,0 +1,132 @@ |
|||
window.addEventListener( |
|||
'message', |
|||
function (e) { |
|||
const res = e.data; |
|||
console.log('子->接受: ', res); |
|||
switch (res.event) { |
|||
case 'start': |
|||
startGame(res.data); |
|||
return; |
|||
case 'play': |
|||
playGame(res.data); |
|||
return; |
|||
case 'pause': |
|||
pauseGame(res.data); |
|||
return; |
|||
case 'continue': |
|||
continueGame(res.data); |
|||
return; |
|||
default: |
|||
finishGame(res.data); |
|||
return; |
|||
} |
|||
|
|||
function startGame(data) { |
|||
if (state === 2) { |
|||
location.reload(); |
|||
return; |
|||
} |
|||
const { count, game, status, param } = data; |
|||
config.count = count.duration; |
|||
config.duration = game.duration; |
|||
config.total = game.totalScore; |
|||
config.times = game.totalTimes; |
|||
config.level = game.level; |
|||
config.config = game.config; |
|||
config.mode = game.mode; |
|||
|
|||
window.timeInstance.setDuration(game.duration); |
|||
Level.of(config.level); |
|||
if (config.mode === 0) { |
|||
// 开始倒计时
|
|||
Count.of(countOver); |
|||
} else { |
|||
sevenClick(); |
|||
} |
|||
if (!window.soundInstance) return; |
|||
window.soundInstance.playBgm(); |
|||
} |
|||
|
|||
function playGame(data) { |
|||
if (state !== 1) return; |
|||
const { status, param } = data; |
|||
// config.currentScore = score;
|
|||
// config.currentTimes = times;
|
|||
state = status; |
|||
if (config.config.directions[config.currentTimes] === param.direction) { |
|||
main.play(param.direction); |
|||
} else { |
|||
alert('动作不匹配'); |
|||
} |
|||
} |
|||
|
|||
function pauseGame(data) { |
|||
if (state !== 1) return; |
|||
state = data.status; |
|||
window.suspend.show(); |
|||
window.timeInstance.pause(); |
|||
} |
|||
|
|||
function continueGame(data) { |
|||
if (state !== 3) return; |
|||
state = data.status; |
|||
window.suspend.hide(); |
|||
window.timeInstance.start(); |
|||
} |
|||
|
|||
function finishGame(data) { |
|||
const { score, times, status, param } = data; |
|||
state = status; |
|||
// config.total = score;
|
|||
// config.times = times;
|
|||
End.of(score || 0); |
|||
window.timeInstance.setDuration(0); |
|||
} |
|||
}, |
|||
false, |
|||
); |
|||
|
|||
// 发消息
|
|||
function sendMessage(data) { |
|||
if (!data) { |
|||
return alert('错误: 发送消息数据为空'); |
|||
} |
|||
console.log('子->发送: ', data); |
|||
top.postMessage(data, document.referrer); |
|||
} |
|||
|
|||
// 发送继续游戏消息
|
|||
function continueMessage() { |
|||
const data = { |
|||
event: 'continue', |
|||
data: { |
|||
status: 1, // 1 -> 进行中
|
|||
}, |
|||
}; |
|||
sendMessage(data); |
|||
} |
|||
|
|||
// 发送游戏结束消息
|
|||
function finishMessage(score, times) { |
|||
const data = { |
|||
event: 'finish', |
|||
data: { |
|||
score: score, // 得分
|
|||
times: times, // 次数
|
|||
status: 2, // 游戏状态 0 1 2
|
|||
param: {}, // 额外个性化参数
|
|||
}, |
|||
}; |
|||
sendMessage(data); |
|||
} |
|||
|
|||
// 发送再来一次消息
|
|||
function againMessage() { |
|||
const data = { |
|||
event: 'again', |
|||
data: { |
|||
param: {}, // 额外个性化参数
|
|||
}, |
|||
}; |
|||
sendMessage(data); |
|||
} |
|||
@ -0,0 +1,57 @@ |
|||
// 判断是否在演示模式 能否直接开始游戏
|
|||
function isHash() { |
|||
if (location.hash && location.hash === '#p') { |
|||
isDemo = true; |
|||
Demo.of(); |
|||
Count.of(countOver); |
|||
} else { |
|||
// 连点7次触发倒计时
|
|||
startGame(); |
|||
} |
|||
} |
|||
|
|||
function startGame() { |
|||
var count = 0, |
|||
timer; |
|||
document.onclick = function () { |
|||
if (isDemo || config.mode !== 1) return; |
|||
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() { |
|||
isDemo = true; |
|||
Count.of(countOver); |
|||
addHash(); |
|||
} |
|||
|
|||
// 倒计时结束 开始游戏
|
|||
function countOver() { |
|||
timeInstance.start(); |
|||
} |
|||
|
|||
// 添加hash值
|
|||
function addHash() { |
|||
location.hash = '#p'; |
|||
Demo.of(); |
|||
} |
|||
|
|||
function test() { |
|||
document.addEventListener('click', () => { |
|||
if (!isDemo) return; |
|||
main.play(config.config.directions[config.currentTimes]); |
|||
}); |
|||
} |
|||
test(); |
|||
Loading…
Reference in new issue