Skip to content

G
game-stydy
Commit b1c1c5bc authored by wildfirecode13's avatar wildfirecode13
Browse files
Options

init

parents
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 550 additions and 0 deletions
.gitignore 0 → 100644
View file @ b1c1c5bc
node_modules
\ No newline at end of file
dist/bundle.js 0 → 100644
View file @ b1c1c5bc
/*
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
* This devtool is neither made for production nor for readable output files.
* It uses "eval()" calls to create a separate source file in the browser devtools.
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
* or disable the default devtool with "devtool: false".
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
*/
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./src/drag.ts":
/*!*********************!*\
!*** ./src/drag.ts ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"addDragDemo\": () => (/* binding */ addDragDemo)\n/* harmony export */ });\nvar _this = undefined;\nvar addDragDemo = function (stage) {\n var pic = FYGE.Sprite.fromUrl('//yun.duiba.com.cn/aurora/assets/b64757cc9839c1dcc80692f6b7db9d97d269c315.png');\n stage.addChild(pic);\n //鼠标按下起始点\n var startPoint;\n //图片起始位置\n var picOriginPos;\n var onStageMove = function (event) {\n console.log('触发了onStageMove事件，当前时间戳=>', Date.now());\n //鼠标当前位置\n var currentPoint = { x: event.stageX, y: event.stageY };\n //鼠标按下点到鼠标当前点的偏移量\n var mouseOffsetX = currentPoint.x - startPoint.x;\n var mouseOffsetY = currentPoint.y - startPoint.y;\n pic.x = picOriginPos.x + mouseOffsetX;\n pic.y = picOriginPos.y + mouseOffsetY;\n };\n var onMouseUp_pic = function () {\n //鼠标抬起后应该移出舞台移动事件，否则会重复添加事件\n stage.removeEventListener(FYGE.MouseEvent.MOUSE_MOVE, onStageMove, _this);\n };\n var onMouseDown_pic = function (event) {\n //图片鼠标弹起事件，事件触发一次即移除，否则会重复添加鼠标弹起事件\n pic.once(FYGE.MouseEvent.MOUSE_UP, onMouseUp_pic, _this);\n //添加舞台移动事件，鼠标移动即触发\n //FYGE.MouseEvent.MOUSE_MOVE 会在鼠标移动过程中触发\n stage.addEventListener(FYGE.MouseEvent.MOUSE_MOVE, onStageMove, _this);\n //event事件对象\n //event.stageX，event.stageY当前鼠标在舞台的位置\n startPoint = { x: event.stageX, y: event.stageY };\n picOriginPos = { x: pic.x, y: pic.y };\n };\n //增加鼠标按下事件\n pic.addEventListener(FYGE.MouseEvent.MOUSE_DOWN, onMouseDown_pic, _this);\n};\n\n\n//# sourceURL=webpack:///./src/drag.ts?");
/***/ }),
/***/ "./src/main.ts":
/*!*********************!*\
!*** ./src/main.ts ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _drag__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./drag */ \"./src/drag.ts\");\n\nvar canvas = document.getElementById(\"canvas\");\ncanvas.width = document.body.clientWidth * 1;\ncanvas.height = document.body.clientHeight * 1;\nvar stage = new FYGE.Stage(canvas, 750, 1624, canvas.width, canvas.height, FYGE.RENDERER_TYPE.CANVAS, false, false);\nvar mouseEvent = stage.onMouseEvent.bind(stage);\ncanvas.addEventListener(\"touchstart\", mouseEvent, false);\ncanvas.addEventListener('touchmove', mouseEvent, false);\ncanvas.addEventListener('touchend', mouseEvent, false);\nstage.addEventListener(FYGE.Event.INIT_STAGE, onInitStage, undefined);\nfunction onInitStage() {\n (0,_drag__WEBPACK_IMPORTED_MODULE_0__.addDragDemo)(stage);\n}\n(function loop() {\n FYGE.Tween.flush();\n stage.flush();\n requestAnimationFrame(loop);\n})();\n\n\n//# sourceURL=webpack:///./src/main.ts?");
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module can't be inlined because the eval devtool is used.
/******/ var __webpack_exports__ = __webpack_require__("./src/main.ts");
/******/
/******/ })()
;
\ No newline at end of file
libs/FYGE.d.ts 0 → 100644
View file @ b1c1c5bc
This diff is collapsed.
libs/SvgaParser.d.ts 0 → 100644
View file @ b1c1c5bc
declare module SvgaParser {
/**
* 加载方法
* @param url 资源路径
* @param success
* @param failure
*/
export function loadSvga(url: string, success: (videoItem: VideoEntity) => void, failure?: (err: string) => void): void;
/**
* 导出只是当作类型接口用
*/
export interface VideoEntity {
/**
* SVGA 文件版本
*/
version: string;
/**
* 影片尺寸
*/
videoSize: {
width: number;
height: number;
};
/**
* 帧率，60，30等每秒
*/
FPS: number;
/**
* 总帧数
*/
frames: number;
/**
* base64图片数据记录
*/
images: {
[key: string]: string
};
/**
* 图片是否已被缓存，缓存全局，注意名字覆盖
*/
hasBeenCached: boolean;
/**
* sprite对象数据
*/
sprites: SpriteEntity[];
}
interface SpriteEntity {
/**
* 标识
*/
matteKey: string;
/**
* 图片key值
*/
imageKey: string;
/**
* 帧数据数组
*/
frames: FrameEntity[];
}
/**
* 还有很多其他数据，暂不需要，比如矢量路径和遮罩路径暂时都无
*/
interface FrameEntity {
/**
* 透明度
*/
alpha: number;
/**
* 2维矩阵数据
*/
transform: {
a: number,
b: number,
c: number,
d: number,
tx: number,
ty: number,
};
}
}
declare module "svga-parser" { export = SvgaParser; }
\ No newline at end of file
libs/howler.d.ts 0 → 100644
View file @ b1c1c5bc
// Type definitions for howler.js v2.1.1
// Project: https://github.com/goldfire/howler.js
// Definitions by: Pedro Casaubon <https://github.com/xperiments>
// Alexander Leon <https://github.com/alien35>
// Nicholas Higgins <https://github.com/nicholashza>
// Carlos Urango <https://github.com/cjurango>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
interface HowlerGlobal {
mute(muted: boolean): this;
volume(): number;
volume(volume: number): this;
codecs(ext: string): boolean;
unload(): this;
usingWebAudio: boolean;
html5PoolSize: number;
noAudio: boolean;
autoUnlock: boolean;
autoSuspend: boolean;
ctx: AudioContext;
masterGain: GainNode;
stereo(pan: number): this;
pos(x: number, y: number, z: number): this | void;
orientation(x: number, y: number, z: number, xUp: number, yUp: number, zUp: number): this | void;
}
declare let Howler: HowlerGlobal;
interface IHowlSoundSpriteDefinition {
[name: string]: [number, number] | [number, number, boolean]
}
interface IHowlProperties {
src: string | string[];
volume?: number;
html5?: boolean;
loop?: boolean;
preload?: boolean;
autoplay?: boolean;
mute?: boolean;
sprite?: IHowlSoundSpriteDefinition;
rate?: number;
pool?: number;
format?: string[] | string;
xhrWithCredentials?: boolean;
onload?: () => void;
onloaderror?: (soundId: number, error: any) => void;
onplay?: (soundId: number) => void;
onplayerror?: (soundId: number, error: any) => void;
onend?: (soundId: number) => void;
onpause?: (soundId: number) => void;
onstop?: (soundId: number) => void;
onmute?: (soundId: number) => void;
onvolume?: (soundId: number) => void;
onrate?: (soundId: number) => void;
onseek?: (soundId: number) => void;
onfade?: (soundId: number) => void;
onunlock?: (soundId: number) => void;
}
interface Howl {
play(spriteOrId?: string | number): number; // .play() is not chainable; the other methods are
pause(id?: number): this;
stop(id?: number): this;
mute(): boolean;
mute(muted: boolean, id?: number): this;
volume(): number;
volume(idOrSetVolume: number): this | number;
volume(volume: number, id: number): this;
fade(from: number, to: number, duration: number, id?: number): this;
rate(): number;
rate(idOrSetRate: number): this | number;
rate(rate: number, id: number): this;
seek(seek?: number, id?: number): this | number;
loop(id?: number): boolean;
loop(loop: boolean, id?: number): this;
playing(id?: number): boolean;
duration(id?: number): number;
state(): 'unloaded' | 'loading' | 'loaded';
load(): this;
unload(): void;
on(event: 'load', callback: () => void, id?: number): this;
on(event: 'loaderror', callback: (soundId: number, error: any) => void, id?: number): this;
on(event: 'play', callback: (soundId: number) => void, id?: number): this;
on(event: 'playerror', callback: (soundId: number, error: any) => void, id?: number): this;
on(event: 'end', callback: (soundId: number) => void, id?: number): this;
on(event: 'pause', callback: (soundId: number) => void, id?: number): this;
on(event: 'stop', callback: (soundId: number) => void, id?: number): this;
on(event: 'mute', callback: (soundId: number) => void, id?: number): this;
on(event: 'volume', callback: (soundId: number) => void, id?: number): this;
on(event: 'rate', callback: (soundId: number) => void, id?: number): this;
on(event: 'seek', callback: (soundId: number) => void, id?: number): this;
on(event: 'fade', callback: (soundId: number) => void, id?: number): this;
on(event: string, callback: Function, id?: number): this;
on(event: 'unlock', callback: (soundId: number) => void, id?: number): this;
once(event: 'load', callback: () => void, id?: number): this;
once(event: 'loaderror', callback: (soundId: number, error: any) => void, id?: number): this;
once(event: 'play', callback: (soundId: number) => void, id?: number): this;
once(event: 'playerror', callback: (soundId: number, error: any) => void, id?: number): this;
once(event: 'end', callback: (soundId: number) => void, id?: number): this;
once(event: 'pause', callback: (soundId: number) => void, id?: number): this;
once(event: 'stop', callback: (soundId: number) => void, id?: number): this;
once(event: 'mute', callback: (soundId: number) => void, id?: number): this;
once(event: 'volume', callback: (soundId: number) => void, id?: number): this;
once(event: 'rate', callback: (soundId: number) => void, id?: number): this;
once(event: 'seek', callback: (soundId: number) => void, id?: number): this;
once(event: 'fade', callback: (soundId: number) => void, id?: number): this;
once(event: string, callback: Function, id?: number): this;
once(event: 'unlock', callback: (soundId: number) => void, id?: number): this;
off(event: string, callback?: Function, id?: number): this;
off(): this;
stereo(pan: number, id?: number): this | void;
pos(x: number, y: number, z: number, id?: number): this | void;
orientation(x: number, y: number, z: number, xUp: number, yUp: number, zUp: number): this | void;
pannerAttr(o: {
coneInnerAngle?: number,
coneOuterAngle?: number, coneOuterGain?: number,
distanceModel: 'inverse' | 'linear', maxDistance: number,
panningModel: 'HRTF' | 'equalpower', refDistance: number, rolloffFactor: number
}, id?: number): this;
}
interface HowlStatic {
new(properties: IHowlProperties): Howl;
}
declare let Howl: HowlStatic;
declare module "howler" {
export let Howler: HowlerGlobal;
export let Howl: HowlStatic;
}
package.json 0 → 100644
View file @ b1c1c5bc
{
"scripts": {
"start": "webpack serve --open",
"build": "webpack"
},
"devDependencies": {
"ts-loader": "^9.2.6",
"typescript": "^4.4.4",
"webpack": "^5.61.0",
"webpack-cli": "^4.9.1",
"webpack-dev-server": "^4.4.0"
}
}
public/bundle.js 0 → 100644
View file @ b1c1c5bc
/*
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
* This devtool is neither made for production nor for readable output files.
* It uses "eval()" calls to create a separate source file in the browser devtools.
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
* or disable the default devtool with "devtool: false".
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
*/
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./src/drag.ts":
/*!*********************!*\
!*** ./src/drag.ts ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"addDragDemo\": () => (/* binding */ addDragDemo)\n/* harmony export */ });\nvar _this = undefined;\nvar addDragDemo = function (stage) {\n var pic = FYGE.Sprite.fromUrl('//yun.duiba.com.cn/aurora/assets/b64757cc9839c1dcc80692f6b7db9d97d269c315.png');\n stage.addChild(pic);\n //鼠标按下起始点\n var startPoint;\n //图片起始位置\n var picOriginPos;\n var onStageMove = function (event) {\n console.log('触发了onStageMove事件，当前时间戳=>', Date.now());\n //鼠标当前位置\n var currentPoint = { x: event.stageX, y: event.stageY };\n //鼠标按下点到鼠标当前点的偏移量\n var mouseOffsetX = currentPoint.x - startPoint.x;\n var mouseOffsetY = currentPoint.y - startPoint.y;\n pic.x = picOriginPos.x + mouseOffsetX;\n pic.y = picOriginPos.y + mouseOffsetY;\n };\n var onMouseUp_pic = function () {\n //鼠标抬起后应该移出舞台移动事件，否则会重复添加事件\n stage.removeEventListener(FYGE.MouseEvent.MOUSE_MOVE, onStageMove, _this);\n };\n var onMouseDown_pic = function (event) {\n //图片鼠标弹起事件，事件触发一次即移除，否则会重复添加鼠标弹起事件\n pic.once(FYGE.MouseEvent.MOUSE_UP, onMouseUp_pic, _this);\n //添加舞台移动事件，鼠标移动即触发\n //FYGE.MouseEvent.MOUSE_MOVE 会在鼠标移动过程中触发\n stage.addEventListener(FYGE.MouseEvent.MOUSE_MOVE, onStageMove, _this);\n //event事件对象\n //event.stageX，event.stageY当前鼠标在舞台的位置\n startPoint = { x: event.stageX, y: event.stageY };\n picOriginPos = { x: pic.x, y: pic.y };\n };\n //增加鼠标按下事件\n pic.addEventListener(FYGE.MouseEvent.MOUSE_DOWN, onMouseDown_pic, _this);\n};\n\n\n//# sourceURL=webpack:///./src/drag.ts?");
/***/ }),
/***/ "./src/main.ts":
/*!*********************!*\
!*** ./src/main.ts ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _drag__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./drag */ \"./src/drag.ts\");\n\nvar canvas = document.getElementById(\"canvas\");\ncanvas.width = document.body.clientWidth * 1;\ncanvas.height = document.body.clientHeight * 1;\nvar stage = new FYGE.Stage(canvas, 750, 1624, canvas.width, canvas.height, FYGE.RENDERER_TYPE.CANVAS, false, false);\nvar mouseEvent = stage.onMouseEvent.bind(stage);\ncanvas.addEventListener(\"touchstart\", mouseEvent, false);\ncanvas.addEventListener('touchmove', mouseEvent, false);\ncanvas.addEventListener('touchend', mouseEvent, false);\nstage.addEventListener(FYGE.Event.INIT_STAGE, onInitStage, undefined);\nfunction onInitStage() {\n (0,_drag__WEBPACK_IMPORTED_MODULE_0__.addDragDemo)(stage);\n}\n(function loop() {\n FYGE.Tween.flush();\n stage.flush();\n requestAnimationFrame(loop);\n})();\n\n\n//# sourceURL=webpack:///./src/main.ts?");
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module can't be inlined because the eval devtool is used.
/******/ var __webpack_exports__ = __webpack_require__("./src/main.ts");
/******/
/******/ })()
;
\ No newline at end of file
public/index.html 0 → 100644
View file @ b1c1c5bc
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="http://yun.duiba.com.cn/db_games/libs0924/fyge2018.minSpine.js" crossorigin="anonymous"></script>
<style>
html,
body {
padding: 0;
margin: 0;
border: 0;
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
background-color: #9a3636;
/* background: linear-gradient(#93dbb7,#ff0,#b5d89a); */
/* background: linear-gradient(#93dbb7,#b5d89a); */
/* 背景图片，解决加载太慢，白屏问题,加了这个下面的__loading__可以删掉了 */
/* background-size: 100%;
background-position: center;
background-image: url("https://yun.duiba.com.cn/db_games/activity/game/1550472986/resource/assets/playscene/playscenebg.jpg"); */
}
</style>
</head>
<body>
<div id="cusEngine" style="line-height:0;font-size:0">
<canvas id="canvas" style="width: 100%;height: 100%"></canvas>
</div>
<script src="bundle.js"></script>
</body>
</html>
\ No newline at end of file
src/addGame.ts 0 → 100644
View file @ b1c1c5bc
export function addGame(stage:FYGE.Stage) {
}
\ No newline at end of file
src/main.ts 0 → 100644
View file @ b1c1c5bc
import { addGame } from "./addGame";
var canvas: any = document.getElementById("canvas")
canvas.width = document.body.clientWidth * 1
canvas.height = document.body.clientHeight * 1
var stage = new FYGE.Stage(
canvas,
750,
1624,
canvas.width,
canvas.height,
FYGE.RENDERER_TYPE.CANVAS,
false,
false
)
var mouseEvent = stage.onMouseEvent.bind(stage);
canvas.addEventListener("touchstart", mouseEvent, false);
canvas.addEventListener('touchmove', mouseEvent, false);
canvas.addEventListener('touchend', mouseEvent, false);
stage.addEventListener(FYGE.Event.INIT_STAGE, onInitStage, this);
function onInitStage() {
new addGame(stage)
}
(function loop() {
FYGE.Tween.flush()
stage.flush();
requestAnimationFrame(loop);
})();
\ No newline at end of file
tsconfig.json 0 → 100644
View file @ b1c1c5bc
{
"compilerOptions": {
"outDir": "./dist/",
"noImplicitAny": false,
"module": "es6",
"target": "es5",
"jsx": "react",
"allowJs": true
}
}
\ No newline at end of file
webpack.config.js 0 → 100644
View file @ b1c1c5bc
const path = require('path');
module.exports = {
mode: 'development',
devtool: 'eval',
entry: './src/main.ts',
module: {
rules: [
{
test: /\.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/,
},
],
},
resolve: {
extensions: ['.tsx', '.ts', '.js'],
},
output: {
filename: 'bundle.js',
},
};
yarn.lock 0 → 100644
View file @ b1c1c5bc
This diff is collapsed.
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