Commit ec2e75d9 authored by rockyl's avatar rockyl

修改tween,增加host

parent 4716345f
/**
* Created by rockyl on 2018/11/23.
*/
import {Entity, traverse, traversePostorder} from "./Entity";
import {injectProp} from "../tools/utils";
import {setupContext as setupInteractContext} from "./context/InteractContext";
import {clear, ScaleMode, setupContext as setupRenderContext} from "./context/RenderContext";
import './requestAnimationFrame';
/**
* 创建引擎实例
* @param options
*/
export function createEngineInstance(options?) {
let instance = new ScillaEngine();
instance.setup(options);
}
/**
* 引擎类
*/
class ScillaEngine {
/**
* 默认配置
*/
options: any = {
fps: 60,
designWidth: 750,
designHeight: 1334,
scaleMode: ScaleMode.FIXED_WIDTH,
touchEnabled: true,
};
_flush: number = 0;
_currentFlush: number = 0;
tsStart: number;
tsLast: number;
lastFPS: number = 0;
private readonly root: Entity;
constructor() {
this.root = new Entity('root');
this.root._restrict();
}
setup(options?){
injectProp(this.options, options);
const {canvas, designWidth, designHeight, scaleMode, modifyCanvasSize, touchEnabled} = options;
let canvasElement = typeof canvas == 'object' ? canvas : document.getElementById(canvas);
setupInteractContext({
canvas: canvasElement,
touchHandler: {
onTouchBegin: this.onTouchBegin.bind(this),
onTouchMove: this.onTouchMove.bind(this),
onTouchEnd: this.onTouchEnd.bind(this),
},
touchEnabled,
});
setupRenderContext({
canvas: canvasElement,
designWidth,
designHeight,
scaleMode,
modifyCanvasSize,
});
}
/**
* 开始引擎
*/
start() {
this.root.enabled = true;
this.tsStart = Date.now();
this.startTick();
}
/**
* 暂停引擎
*/
pause() {
this.root.enabled = false;
this.stopTick();
}
/**
* 获取节点路径
* @param entity
*/
getEntityPath(entity?: Entity): string {
let path = '';
let current = entity || this.root;
while (current.parent) {
path = current.parent.children.indexOf(current) + (path.length > 0 ? '|' : '') + path;
current = current.parent;
}
return path;
}
/**
* 根据节点路径获取节点
* @param path
*/
getEntityByPath(path?: string): Entity {
let target = this.root;
if (path.length > 0) {
let arr = path.split('|');
for (let item of arr) {
target = target.children[item];
if (!target) {
target = null;
break;
}
}
}
return target;
}
/**
* 获取当前帧率
*/
get fps() {
return this.lastFPS;
}
/**
* 开始时钟
*/
private startTick() {
this._flush = 60 / this.options.fps - 1 >> 0;
if (this._flush < 0) {
this._flush = 0;
}
requestAnimationFrame(this.flush);
}
/**
* 停止时钟
*/
private stopTick() {
}
/**
* 时钟触发
*/
private flush(tsNow): void {
if (this._flush == 0) {
this.onFrameTick(tsNow);
} else {
if (this._currentFlush == 0) {
this.onFrameTick(tsNow);
this._currentFlush = this._flush;
} else {
this._currentFlush--;
}
}
requestAnimationFrame(this.flush);
}
nextTicks = [];
nextTick(func, tickCount = 1) {
this.nextTicks.push({func, tickCount});
}
private onFrameTick(tsNow) {
clear();
this.lastFPS = Math.floor(1000 / (tsNow - this.tsLast));
this.tsLast = tsNow;
const ts = tsNow - this.tsStart;
traverse(this.root, function (child) {
if (!child.isFree && child.enabled) {
child.onUpdate(ts);
} else {
return true;
}
}, -1, true, function (current) {
current.afterUpdate();
});
//const tsPass = Date.now() - tsNow;
for (let i = 0, li = this.nextTicks.length; i < li; i++) {
const item = this.nextTicks[i];
item.tickCount--;
if (item.tickCount <= 0) {
item.func(ts);
this.nextTicks.splice(i, 1);
i--;
li--;
}
}
}
/**
* 代理出来的onTouchBegin方法
* @param event
*/
private onTouchBegin(event) {
traversePostorder(this.root, function (child) {
return child.onInteract(0, event);
})
}
/**
* 代理出来的onTouchMove方法
* @param event
*/
private onTouchMove(event) {
traversePostorder(this.root, function (child) {
return child.onInteract(1, event);
})
}
/**
* 代理出来的onTouchEnd方法
* @param event
*/
private onTouchEnd(event) {
traversePostorder(this.root, function (child) {
return child.onInteract(2, event);
})
}
}
......@@ -7,12 +7,14 @@ const commonjs = require('rollup-plugin-commonjs');
const typescript = require('rollup-plugin-typescript2');
const {uglify} = require('rollup-plugin-uglify');
const name = 'scilla';
export default {
input: 'src/index.ts',
output: {
file: 'dist/bundle.js',
file: `dist/${name}.js`,
format: 'umd',
name: 'scilla',
name,
},
plugins: [
resolve({
......
......@@ -7,7 +7,6 @@ import {injectProp} from "../tools/utils";
import {setupContext as setupInteractContext} from "./context/InteractContext";
import {clear, ScaleMode, setupContext as setupRenderContext} from "./context/RenderContext";
import './requestAnimationFrame';
import {EngineConfig} from "../engine-config";
/**
* 默认配置
......
......@@ -13,11 +13,11 @@ let resUUIDs;
/**
* 启动场景
* @param name
* @param url
* @param progress
*/
export async function launchScene(name, progress?) {
const scene = await loadScene(`scenes/${name}.scene`, 'scene_' + name);
export async function launchScene(url, progress?) {
const scene = await loadScene(url, 'scene_' + url);
resUUIDs = getAllResUuids();
......
......@@ -31,17 +31,18 @@ export interface TweenOptions {
/**
* 补间动画
* @param host
* @param target
* @param override
* @param options
* @param plugins
*/
export function createTween(target: ScillaComponent, override = false, options?: TweenOptions, plugins = []) {
export function createTween(host: any, target: any, override = false, options?: TweenOptions, plugins = []) {
if (override) {
killTweens(target);
}
const tween = new Tween(target, options);
const tween = new Tween(host, target, options);
addTween(target, tween);
return tween;
......@@ -51,7 +52,7 @@ export function createTween(target: ScillaComponent, override = false, options?:
* 移除对象上所有的Tween实例
* @param target
*/
export function killTweens(target: ScillaComponent) {
export function killTweens(target: any) {
let tweens: Tween[] = target['tweens'];
if (tweens) {
for (let tween of tweens) {
......@@ -71,7 +72,8 @@ function addTween(target, tween: Tween) {
}
export class Tween extends HashObject {
target: ScillaComponent;
host: any;
target: any;
loop: number;
queue = [];
......@@ -93,9 +95,10 @@ export class Tween extends HashObject {
ease: Function;
duration: number;
constructor(target: ScillaComponent, options?: TweenOptions, plugins = []) {
constructor(host: any, target: any, options?: TweenOptions, plugins = []) {
super();
this.host = host;
this.target = target;
this.loop = options ? options.loop : 0;
this.autoPlay = options ? (options.hasOwnProperty('autoPlay') ? options.autoPlay : true) : true;
......@@ -221,7 +224,7 @@ export class Tween extends HashObject {
stop() {
this.status = STATUS.IDLE;
this.target.cancelOnNextTick(this.onUpdate);
this.host.cancelOnNextTick(this.onUpdate);
}
_set(props) {
......@@ -266,9 +269,9 @@ export class Tween extends HashObject {
if(resetLoopCounting){
this.loopCounting = 0;
}
this.target.callOnNextTick(this._readyStart);
this.host.callOnNextTick(this._readyStart);
this.target.callOnNextTick(this.onUpdate, false);
this.host.callOnNextTick(this.onUpdate, false);
}
_readyStart = (t) => {
......
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