mirror of
https://github.com/EsotericSoftware/spine-runtimes.git
synced 2026-03-26 22:49:01 +08:00
[ts] Player updates.
* Updated config doc comments. * Check undefined without typeof. Discussion: https://stackoverflow.com/a/22053469/187883 * Use transparent bg color by default if alpha is true. * Set bg color on parent to avoid flash. * render->create (so it doesn't seem like it's about drawing). * Sorted members. * Use addEventListener, else only the last player event handler is used. * Set the initial animation when loaded, not whenever track 0 is empty. * If an animation is not specified, play an empty animation. * If an animation is set in success(), don't set any animation. * Don't clearTracks in setAnimation, don't use AnimationState in calculateAnimationViewport -- those prevent mixing. * setAnimation returns the TrackEntry. * Added addAnimation and setViewport. * Expose play() and pause(). * Keep control bones inside the canvas. * LoadingScreen scales down. * Set minimal CSS so no external CSS is needed when !showControls. * Use screen instead of world coordinates for control bone hit detection, so it works at any size. * Choose closest control bone instead of last.
This commit is contained in:
Nathan Sweet
parent
e03fa1d5d3
commit
99f8cba35f
54
spine-ts/build/spine-all.d.ts
vendored
54
spine-ts/build/spine-all.d.ts
vendored
@ -234,13 +234,13 @@ declare module spine {
|
||||
clearTrack(trackIndex: number): void;
|
||||
clearNext(entry: TrackEntry): void;
|
||||
setCurrent(index: number, current: TrackEntry, interrupt: boolean): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop: boolean, delay: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop: boolean, delay: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration: number, delay: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration: number): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop?: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop?: boolean, delay?: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration?: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration?: number, delay?: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration?: number): void;
|
||||
expandToIndex(index: number): TrackEntry;
|
||||
trackEntry(trackIndex: number, animation: Animation, loop: boolean, last: TrackEntry): TrackEntry;
|
||||
disposeNext(entry: TrackEntry): void;
|
||||
@ -1306,10 +1306,10 @@ declare module spine.webgl {
|
||||
inverseProjectionView: Matrix4;
|
||||
projection: Matrix4;
|
||||
view: Matrix4;
|
||||
private tmp;
|
||||
constructor(viewportWidth: number, viewportHeight: number);
|
||||
update(): void;
|
||||
screenToWorld(screenCoords: Vector3, screenWidth: number, screenHeight: number): Vector3;
|
||||
worldToScreen(worldCoords: Vector3, screenWidth: number, screenHeight: number): Vector3;
|
||||
setViewport(viewportWidth: number, viewportHeight: number): void;
|
||||
}
|
||||
}
|
||||
@ -1490,7 +1490,7 @@ declare module spine.webgl {
|
||||
begin(shader: Shader): void;
|
||||
setBlendMode(srcColorBlend: number, srcAlphaBlend: number, dstBlend: number): void;
|
||||
draw(texture: GLTexture, vertices: ArrayLike<number>, indices: Array<number>): void;
|
||||
private flush;
|
||||
flush(): void;
|
||||
end(): void;
|
||||
getDrawCalls(): number;
|
||||
dispose(): void;
|
||||
@ -1809,9 +1809,9 @@ declare module spine {
|
||||
padRight: string | number;
|
||||
padTop: string | number;
|
||||
padBottom: string | number;
|
||||
animations: Map<Viewport>;
|
||||
debugRender: boolean;
|
||||
transitionTime: number;
|
||||
animations: Map<Viewport>;
|
||||
};
|
||||
alpha: boolean;
|
||||
backgroundColor: string;
|
||||
@ -1824,8 +1824,8 @@ declare module spine {
|
||||
height: number;
|
||||
};
|
||||
controlBones: string[];
|
||||
success: (widget: SpinePlayer) => void;
|
||||
error: (widget: SpinePlayer, msg: string) => void;
|
||||
success: (player: SpinePlayer) => void;
|
||||
error: (player: SpinePlayer, msg: string) => void;
|
||||
downloader: spine.Downloader;
|
||||
}
|
||||
interface Viewport {
|
||||
@ -1854,6 +1854,7 @@ declare module spine {
|
||||
private playButton;
|
||||
private skinButton;
|
||||
private animationButton;
|
||||
private playTime;
|
||||
private selectedBones;
|
||||
private cancelId;
|
||||
private lastPopup;
|
||||
@ -1861,8 +1862,7 @@ declare module spine {
|
||||
skeleton: Skeleton;
|
||||
animationState: AnimationState;
|
||||
private paused;
|
||||
private playTime;
|
||||
private speed;
|
||||
speed: number;
|
||||
private time;
|
||||
private stopRequestAnimationFrame;
|
||||
private currentViewport;
|
||||
@ -1870,22 +1870,24 @@ declare module spine {
|
||||
private viewportTransitionStart;
|
||||
constructor(parent: HTMLElement | string, config: SpinePlayerConfig);
|
||||
private validateConfig;
|
||||
private showError;
|
||||
private render;
|
||||
private create;
|
||||
private loadSkeleton;
|
||||
private setupInput;
|
||||
play(): void;
|
||||
pause(): void;
|
||||
setAnimation(animation: string | Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(animation: string | Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setViewport(animation: string | Animation): Animation;
|
||||
private percentageToWorldUnit;
|
||||
private calculateAnimationViewport;
|
||||
private drawFrame;
|
||||
private scale;
|
||||
stopRendering(): void;
|
||||
private showSpeedDialog;
|
||||
private showAnimationsDialog;
|
||||
private showSkinsDialog;
|
||||
private showSettingsDialog;
|
||||
private drawFrame;
|
||||
private scale;
|
||||
private loadSkeleton;
|
||||
private setupInput;
|
||||
private play;
|
||||
private pause;
|
||||
setAnimation(animation: string, loop?: boolean): void;
|
||||
private percentageToWorldUnit;
|
||||
private calculateAnimationViewport;
|
||||
stopRendering(): void;
|
||||
private showError;
|
||||
}
|
||||
}
|
||||
declare function CodeMirror(el: Element, config: any): void;
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
14
spine-ts/build/spine-canvas.d.ts
vendored
14
spine-ts/build/spine-canvas.d.ts
vendored
@ -234,13 +234,13 @@ declare module spine {
|
||||
clearTrack(trackIndex: number): void;
|
||||
clearNext(entry: TrackEntry): void;
|
||||
setCurrent(index: number, current: TrackEntry, interrupt: boolean): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop: boolean, delay: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop: boolean, delay: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration: number, delay: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration: number): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop?: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop?: boolean, delay?: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration?: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration?: number, delay?: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration?: number): void;
|
||||
expandToIndex(index: number): TrackEntry;
|
||||
trackEntry(trackIndex: number, animation: Animation, loop: boolean, last: TrackEntry): TrackEntry;
|
||||
disposeNext(entry: TrackEntry): void;
|
||||
|
||||
@ -2334,12 +2334,14 @@ var spine;
|
||||
this.queue.start(current);
|
||||
};
|
||||
AnimationState.prototype.setAnimation = function (trackIndex, animationName, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.setAnimationWith(trackIndex, animation, loop);
|
||||
};
|
||||
AnimationState.prototype.setAnimationWith = function (trackIndex, animation, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var interrupt = true;
|
||||
@ -2362,12 +2364,16 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addAnimation = function (trackIndex, animationName, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.addAnimationWith(trackIndex, animation, loop, delay);
|
||||
};
|
||||
AnimationState.prototype.addAnimationWith = function (trackIndex, animation, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var last = this.expandToIndex(trackIndex);
|
||||
@ -2390,12 +2396,15 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimation = function (trackIndex, mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var entry = this.setAnimationWith(trackIndex, AnimationState.emptyAnimation(), false);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addEmptyAnimation = function (trackIndex, mixDuration, delay) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var entry = this.addAnimationWith(trackIndex, AnimationState.emptyAnimation(), false, delay <= 0 ? 1 : delay);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
@ -2404,6 +2413,7 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimations = function (mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var oldDrainDisabled = this.queue.drainDisabled;
|
||||
this.queue.drainDisabled = true;
|
||||
for (var i = 0, n = this.tracks.length; i < n; i++) {
|
||||
@ -8116,7 +8126,7 @@ var spine;
|
||||
this.r = parseInt(hex.substr(0, 2), 16) / 255;
|
||||
this.g = parseInt(hex.substr(2, 2), 16) / 255;
|
||||
this.b = parseInt(hex.substr(4, 2), 16) / 255;
|
||||
this.a = (hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255);
|
||||
this.a = hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255;
|
||||
return this;
|
||||
};
|
||||
Color.prototype.add = function (r, g, b, a) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
14
spine-ts/build/spine-core.d.ts
vendored
14
spine-ts/build/spine-core.d.ts
vendored
@ -234,13 +234,13 @@ declare module spine {
|
||||
clearTrack(trackIndex: number): void;
|
||||
clearNext(entry: TrackEntry): void;
|
||||
setCurrent(index: number, current: TrackEntry, interrupt: boolean): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop: boolean, delay: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop: boolean, delay: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration: number, delay: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration: number): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop?: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop?: boolean, delay?: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration?: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration?: number, delay?: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration?: number): void;
|
||||
expandToIndex(index: number): TrackEntry;
|
||||
trackEntry(trackIndex: number, animation: Animation, loop: boolean, last: TrackEntry): TrackEntry;
|
||||
disposeNext(entry: TrackEntry): void;
|
||||
|
||||
@ -2334,12 +2334,14 @@ var spine;
|
||||
this.queue.start(current);
|
||||
};
|
||||
AnimationState.prototype.setAnimation = function (trackIndex, animationName, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.setAnimationWith(trackIndex, animation, loop);
|
||||
};
|
||||
AnimationState.prototype.setAnimationWith = function (trackIndex, animation, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var interrupt = true;
|
||||
@ -2362,12 +2364,16 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addAnimation = function (trackIndex, animationName, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.addAnimationWith(trackIndex, animation, loop, delay);
|
||||
};
|
||||
AnimationState.prototype.addAnimationWith = function (trackIndex, animation, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var last = this.expandToIndex(trackIndex);
|
||||
@ -2390,12 +2396,15 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimation = function (trackIndex, mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var entry = this.setAnimationWith(trackIndex, AnimationState.emptyAnimation(), false);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addEmptyAnimation = function (trackIndex, mixDuration, delay) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var entry = this.addAnimationWith(trackIndex, AnimationState.emptyAnimation(), false, delay <= 0 ? 1 : delay);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
@ -2404,6 +2413,7 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimations = function (mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var oldDrainDisabled = this.queue.drainDisabled;
|
||||
this.queue.drainDisabled = true;
|
||||
for (var i = 0, n = this.tracks.length; i < n; i++) {
|
||||
@ -8116,7 +8126,7 @@ var spine;
|
||||
this.r = parseInt(hex.substr(0, 2), 16) / 255;
|
||||
this.g = parseInt(hex.substr(2, 2), 16) / 255;
|
||||
this.b = parseInt(hex.substr(4, 2), 16) / 255;
|
||||
this.a = (hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255);
|
||||
this.a = hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255;
|
||||
return this;
|
||||
};
|
||||
Color.prototype.add = function (r, g, b, a) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
54
spine-ts/build/spine-player.d.ts
vendored
54
spine-ts/build/spine-player.d.ts
vendored
@ -234,13 +234,13 @@ declare module spine {
|
||||
clearTrack(trackIndex: number): void;
|
||||
clearNext(entry: TrackEntry): void;
|
||||
setCurrent(index: number, current: TrackEntry, interrupt: boolean): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop: boolean, delay: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop: boolean, delay: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration: number, delay: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration: number): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop?: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop?: boolean, delay?: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration?: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration?: number, delay?: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration?: number): void;
|
||||
expandToIndex(index: number): TrackEntry;
|
||||
trackEntry(trackIndex: number, animation: Animation, loop: boolean, last: TrackEntry): TrackEntry;
|
||||
disposeNext(entry: TrackEntry): void;
|
||||
@ -1275,10 +1275,10 @@ declare module spine.webgl {
|
||||
inverseProjectionView: Matrix4;
|
||||
projection: Matrix4;
|
||||
view: Matrix4;
|
||||
private tmp;
|
||||
constructor(viewportWidth: number, viewportHeight: number);
|
||||
update(): void;
|
||||
screenToWorld(screenCoords: Vector3, screenWidth: number, screenHeight: number): Vector3;
|
||||
worldToScreen(worldCoords: Vector3, screenWidth: number, screenHeight: number): Vector3;
|
||||
setViewport(viewportWidth: number, viewportHeight: number): void;
|
||||
}
|
||||
}
|
||||
@ -1459,7 +1459,7 @@ declare module spine.webgl {
|
||||
begin(shader: Shader): void;
|
||||
setBlendMode(srcColorBlend: number, srcAlphaBlend: number, dstBlend: number): void;
|
||||
draw(texture: GLTexture, vertices: ArrayLike<number>, indices: Array<number>): void;
|
||||
private flush;
|
||||
flush(): void;
|
||||
end(): void;
|
||||
getDrawCalls(): number;
|
||||
dispose(): void;
|
||||
@ -1713,9 +1713,9 @@ declare module spine {
|
||||
padRight: string | number;
|
||||
padTop: string | number;
|
||||
padBottom: string | number;
|
||||
animations: Map<Viewport>;
|
||||
debugRender: boolean;
|
||||
transitionTime: number;
|
||||
animations: Map<Viewport>;
|
||||
};
|
||||
alpha: boolean;
|
||||
backgroundColor: string;
|
||||
@ -1728,8 +1728,8 @@ declare module spine {
|
||||
height: number;
|
||||
};
|
||||
controlBones: string[];
|
||||
success: (widget: SpinePlayer) => void;
|
||||
error: (widget: SpinePlayer, msg: string) => void;
|
||||
success: (player: SpinePlayer) => void;
|
||||
error: (player: SpinePlayer, msg: string) => void;
|
||||
downloader: spine.Downloader;
|
||||
}
|
||||
interface Viewport {
|
||||
@ -1758,6 +1758,7 @@ declare module spine {
|
||||
private playButton;
|
||||
private skinButton;
|
||||
private animationButton;
|
||||
private playTime;
|
||||
private selectedBones;
|
||||
private cancelId;
|
||||
private lastPopup;
|
||||
@ -1765,8 +1766,7 @@ declare module spine {
|
||||
skeleton: Skeleton;
|
||||
animationState: AnimationState;
|
||||
private paused;
|
||||
private playTime;
|
||||
private speed;
|
||||
speed: number;
|
||||
private time;
|
||||
private stopRequestAnimationFrame;
|
||||
private currentViewport;
|
||||
@ -1774,22 +1774,24 @@ declare module spine {
|
||||
private viewportTransitionStart;
|
||||
constructor(parent: HTMLElement | string, config: SpinePlayerConfig);
|
||||
private validateConfig;
|
||||
private showError;
|
||||
private render;
|
||||
private create;
|
||||
private loadSkeleton;
|
||||
private setupInput;
|
||||
play(): void;
|
||||
pause(): void;
|
||||
setAnimation(animation: string | Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(animation: string | Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setViewport(animation: string | Animation): Animation;
|
||||
private percentageToWorldUnit;
|
||||
private calculateAnimationViewport;
|
||||
private drawFrame;
|
||||
private scale;
|
||||
stopRendering(): void;
|
||||
private showSpeedDialog;
|
||||
private showAnimationsDialog;
|
||||
private showSkinsDialog;
|
||||
private showSettingsDialog;
|
||||
private drawFrame;
|
||||
private scale;
|
||||
private loadSkeleton;
|
||||
private setupInput;
|
||||
private play;
|
||||
private pause;
|
||||
setAnimation(animation: string, loop?: boolean): void;
|
||||
private percentageToWorldUnit;
|
||||
private calculateAnimationViewport;
|
||||
stopRendering(): void;
|
||||
private showError;
|
||||
}
|
||||
}
|
||||
declare function CodeMirror(el: Element, config: any): void;
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
14
spine-ts/build/spine-threejs.d.ts
vendored
14
spine-ts/build/spine-threejs.d.ts
vendored
@ -234,13 +234,13 @@ declare module spine {
|
||||
clearTrack(trackIndex: number): void;
|
||||
clearNext(entry: TrackEntry): void;
|
||||
setCurrent(index: number, current: TrackEntry, interrupt: boolean): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop: boolean, delay: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop: boolean, delay: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration: number, delay: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration: number): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop?: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop?: boolean, delay?: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration?: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration?: number, delay?: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration?: number): void;
|
||||
expandToIndex(index: number): TrackEntry;
|
||||
trackEntry(trackIndex: number, animation: Animation, loop: boolean, last: TrackEntry): TrackEntry;
|
||||
disposeNext(entry: TrackEntry): void;
|
||||
|
||||
@ -2334,12 +2334,14 @@ var spine;
|
||||
this.queue.start(current);
|
||||
};
|
||||
AnimationState.prototype.setAnimation = function (trackIndex, animationName, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.setAnimationWith(trackIndex, animation, loop);
|
||||
};
|
||||
AnimationState.prototype.setAnimationWith = function (trackIndex, animation, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var interrupt = true;
|
||||
@ -2362,12 +2364,16 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addAnimation = function (trackIndex, animationName, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.addAnimationWith(trackIndex, animation, loop, delay);
|
||||
};
|
||||
AnimationState.prototype.addAnimationWith = function (trackIndex, animation, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var last = this.expandToIndex(trackIndex);
|
||||
@ -2390,12 +2396,15 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimation = function (trackIndex, mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var entry = this.setAnimationWith(trackIndex, AnimationState.emptyAnimation(), false);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addEmptyAnimation = function (trackIndex, mixDuration, delay) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var entry = this.addAnimationWith(trackIndex, AnimationState.emptyAnimation(), false, delay <= 0 ? 1 : delay);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
@ -2404,6 +2413,7 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimations = function (mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var oldDrainDisabled = this.queue.drainDisabled;
|
||||
this.queue.drainDisabled = true;
|
||||
for (var i = 0, n = this.tracks.length; i < n; i++) {
|
||||
@ -8116,7 +8126,7 @@ var spine;
|
||||
this.r = parseInt(hex.substr(0, 2), 16) / 255;
|
||||
this.g = parseInt(hex.substr(2, 2), 16) / 255;
|
||||
this.b = parseInt(hex.substr(4, 2), 16) / 255;
|
||||
this.a = (hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255);
|
||||
this.a = hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255;
|
||||
return this;
|
||||
};
|
||||
Color.prototype.add = function (r, g, b, a) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
18
spine-ts/build/spine-webgl.d.ts
vendored
18
spine-ts/build/spine-webgl.d.ts
vendored
@ -234,13 +234,13 @@ declare module spine {
|
||||
clearTrack(trackIndex: number): void;
|
||||
clearNext(entry: TrackEntry): void;
|
||||
setCurrent(index: number, current: TrackEntry, interrupt: boolean): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop: boolean, delay: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop: boolean, delay: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration: number, delay: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration: number): void;
|
||||
setAnimation(trackIndex: number, animationName: string, loop?: boolean): TrackEntry;
|
||||
setAnimationWith(trackIndex: number, animation: Animation, loop?: boolean): TrackEntry;
|
||||
addAnimation(trackIndex: number, animationName: string, loop?: boolean, delay?: number): TrackEntry;
|
||||
addAnimationWith(trackIndex: number, animation: Animation, loop?: boolean, delay?: number): TrackEntry;
|
||||
setEmptyAnimation(trackIndex: number, mixDuration?: number): TrackEntry;
|
||||
addEmptyAnimation(trackIndex: number, mixDuration?: number, delay?: number): TrackEntry;
|
||||
setEmptyAnimations(mixDuration?: number): void;
|
||||
expandToIndex(index: number): TrackEntry;
|
||||
trackEntry(trackIndex: number, animation: Animation, loop: boolean, last: TrackEntry): TrackEntry;
|
||||
disposeNext(entry: TrackEntry): void;
|
||||
@ -1275,10 +1275,10 @@ declare module spine.webgl {
|
||||
inverseProjectionView: Matrix4;
|
||||
projection: Matrix4;
|
||||
view: Matrix4;
|
||||
private tmp;
|
||||
constructor(viewportWidth: number, viewportHeight: number);
|
||||
update(): void;
|
||||
screenToWorld(screenCoords: Vector3, screenWidth: number, screenHeight: number): Vector3;
|
||||
worldToScreen(worldCoords: Vector3, screenWidth: number, screenHeight: number): Vector3;
|
||||
setViewport(viewportWidth: number, viewportHeight: number): void;
|
||||
}
|
||||
}
|
||||
@ -1459,7 +1459,7 @@ declare module spine.webgl {
|
||||
begin(shader: Shader): void;
|
||||
setBlendMode(srcColorBlend: number, srcAlphaBlend: number, dstBlend: number): void;
|
||||
draw(texture: GLTexture, vertices: ArrayLike<number>, indices: Array<number>): void;
|
||||
private flush;
|
||||
flush(): void;
|
||||
end(): void;
|
||||
getDrawCalls(): number;
|
||||
dispose(): void;
|
||||
|
||||
@ -2334,12 +2334,14 @@ var spine;
|
||||
this.queue.start(current);
|
||||
};
|
||||
AnimationState.prototype.setAnimation = function (trackIndex, animationName, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.setAnimationWith(trackIndex, animation, loop);
|
||||
};
|
||||
AnimationState.prototype.setAnimationWith = function (trackIndex, animation, loop) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var interrupt = true;
|
||||
@ -2362,12 +2364,16 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addAnimation = function (trackIndex, animationName, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var animation = this.data.skeletonData.findAnimation(animationName);
|
||||
if (!animation)
|
||||
throw new Error("Animation not found: " + animationName);
|
||||
return this.addAnimationWith(trackIndex, animation, loop, delay);
|
||||
};
|
||||
AnimationState.prototype.addAnimationWith = function (trackIndex, animation, loop, delay) {
|
||||
if (loop === void 0) { loop = false; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
if (!animation)
|
||||
throw new Error("animation cannot be null.");
|
||||
var last = this.expandToIndex(trackIndex);
|
||||
@ -2390,12 +2396,15 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimation = function (trackIndex, mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var entry = this.setAnimationWith(trackIndex, AnimationState.emptyAnimation(), false);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.addEmptyAnimation = function (trackIndex, mixDuration, delay) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
if (delay === void 0) { delay = 0; }
|
||||
var entry = this.addAnimationWith(trackIndex, AnimationState.emptyAnimation(), false, delay <= 0 ? 1 : delay);
|
||||
entry.mixDuration = mixDuration;
|
||||
entry.trackEnd = mixDuration;
|
||||
@ -2404,6 +2413,7 @@ var spine;
|
||||
return entry;
|
||||
};
|
||||
AnimationState.prototype.setEmptyAnimations = function (mixDuration) {
|
||||
if (mixDuration === void 0) { mixDuration = 0; }
|
||||
var oldDrainDisabled = this.queue.drainDisabled;
|
||||
this.queue.drainDisabled = true;
|
||||
for (var i = 0, n = this.tracks.length; i < n; i++) {
|
||||
@ -8116,7 +8126,7 @@ var spine;
|
||||
this.r = parseInt(hex.substr(0, 2), 16) / 255;
|
||||
this.g = parseInt(hex.substr(2, 2), 16) / 255;
|
||||
this.b = parseInt(hex.substr(4, 2), 16) / 255;
|
||||
this.a = (hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255);
|
||||
this.a = hex.length != 8 ? 1 : parseInt(hex.substr(6, 2), 16) / 255;
|
||||
return this;
|
||||
};
|
||||
Color.prototype.add = function (r, g, b, a) {
|
||||
@ -9025,7 +9035,6 @@ var spine;
|
||||
this.inverseProjectionView = new webgl.Matrix4();
|
||||
this.projection = new webgl.Matrix4();
|
||||
this.view = new webgl.Matrix4();
|
||||
this.tmp = new webgl.Vector3();
|
||||
this.viewportWidth = viewportWidth;
|
||||
this.viewportHeight = viewportHeight;
|
||||
this.update();
|
||||
@ -9044,14 +9053,19 @@ var spine;
|
||||
};
|
||||
OrthoCamera.prototype.screenToWorld = function (screenCoords, screenWidth, screenHeight) {
|
||||
var x = screenCoords.x, y = screenHeight - screenCoords.y - 1;
|
||||
var tmp = this.tmp;
|
||||
tmp.x = (2 * x) / screenWidth - 1;
|
||||
tmp.y = (2 * y) / screenHeight - 1;
|
||||
tmp.z = (2 * screenCoords.z) - 1;
|
||||
tmp.project(this.inverseProjectionView);
|
||||
screenCoords.set(tmp.x, tmp.y, tmp.z);
|
||||
screenCoords.x = (2 * x) / screenWidth - 1;
|
||||
screenCoords.y = (2 * y) / screenHeight - 1;
|
||||
screenCoords.z = (2 * screenCoords.z) - 1;
|
||||
screenCoords.project(this.inverseProjectionView);
|
||||
return screenCoords;
|
||||
};
|
||||
OrthoCamera.prototype.worldToScreen = function (worldCoords, screenWidth, screenHeight) {
|
||||
worldCoords.project(this.projectionView);
|
||||
worldCoords.x = screenWidth * (worldCoords.x + 1) / 2;
|
||||
worldCoords.y = screenHeight * (worldCoords.y + 1) / 2;
|
||||
worldCoords.z = (worldCoords.z + 1) / 2;
|
||||
return worldCoords;
|
||||
};
|
||||
OrthoCamera.prototype.setViewport = function (viewportWidth, viewportHeight) {
|
||||
this.viewportWidth = viewportWidth;
|
||||
this.viewportHeight = viewportHeight;
|
||||
@ -9346,6 +9360,7 @@ var spine;
|
||||
var logoImage;
|
||||
var loaded = 0;
|
||||
var FADE_IN = 1, FADE_OUT = 1;
|
||||
var logoWidth = 165, logoHeight = 108, spinnerSize = 163;
|
||||
var LoadingScreen = (function () {
|
||||
function LoadingScreen(renderer) {
|
||||
this.logo = null;
|
||||
@ -9384,11 +9399,8 @@ var spine;
|
||||
var renderer = this.renderer;
|
||||
var canvas = renderer.canvas;
|
||||
var gl = renderer.context.gl;
|
||||
renderer.resize(webgl.ResizeMode.Stretch);
|
||||
renderer.camera.zoom = 1;
|
||||
renderer.resize(webgl.ResizeMode.Expand);
|
||||
renderer.camera.position.set(canvas.width / 2, canvas.height / 2, 0);
|
||||
renderer.camera.viewportWidth = canvas.width;
|
||||
renderer.camera.viewportHeight = canvas.height;
|
||||
renderer.batcher.setBlendMode(gl.ONE, gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
|
||||
if (complete) {
|
||||
this.fadeOut += this.timeKeeper.delta * (this.timeKeeper.totalTime < 1 ? 2 : 1);
|
||||
@ -9399,6 +9411,7 @@ var spine;
|
||||
a = 1 - (a - 1) * (a - 1);
|
||||
tempColor.a *= a;
|
||||
if (tempColor.a > 0) {
|
||||
renderer.camera.zoom = 1;
|
||||
renderer.begin();
|
||||
renderer.quad(true, 0, 0, canvas.width, 0, canvas.width, canvas.height, 0, canvas.height, tempColor, tempColor, tempColor, tempColor);
|
||||
renderer.end();
|
||||
@ -9418,11 +9431,10 @@ var spine;
|
||||
this.logo = new webgl.GLTexture(renderer.context, logoImage);
|
||||
this.spinner = new webgl.GLTexture(renderer.context, spinnerImage);
|
||||
}
|
||||
var logoWidth = logoImage.width, logoHeight = logoImage.height;
|
||||
var spinnerWidth = spinnerImage.width, spinnerHeight = spinnerImage.height;
|
||||
renderer.camera.zoom = Math.max(1, spinnerSize / canvas.height);
|
||||
renderer.begin();
|
||||
renderer.drawTexture(this.logo, (canvas.width - logoWidth) / 2, (canvas.height - logoHeight) / 2, logoWidth, logoHeight, tempColor);
|
||||
renderer.drawTextureRotated(this.spinner, (canvas.width - spinnerWidth) / 2, (canvas.height - spinnerHeight) / 2, spinnerWidth, spinnerHeight, spinnerWidth / 2, spinnerHeight / 2, this.angle, tempColor);
|
||||
renderer.drawTextureRotated(this.spinner, (canvas.width - spinnerSize) / 2, (canvas.height - spinnerSize) / 2, spinnerSize, spinnerSize, spinnerSize / 2, spinnerSize / 2, this.angle, tempColor);
|
||||
renderer.end();
|
||||
};
|
||||
return LoadingScreen;
|
||||
@ -10444,8 +10456,7 @@ var spine;
|
||||
var targetRatio = targetHeight / targetWidth;
|
||||
var sourceRatio = sourceHeight / sourceWidth;
|
||||
var scale = targetRatio < sourceRatio ? targetWidth / sourceWidth : targetHeight / sourceHeight;
|
||||
this.camera.viewportWidth = sourceWidth * scale;
|
||||
this.camera.viewportHeight = sourceHeight * scale;
|
||||
this.camera.setViewport(sourceWidth * scale, sourceHeight * scale);
|
||||
}
|
||||
this.camera.update();
|
||||
};
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -34,7 +34,7 @@ module spine {
|
||||
*
|
||||
* See [Applying Animations](http://esotericsoftware.com/spine-applying-animations/) in the Spine Runtimes Guide. */
|
||||
export class AnimationState {
|
||||
private static emptyAnimation(): Animation {
|
||||
private static emptyAnimation (): Animation {
|
||||
if (!_emptyAnimation) _emptyAnimation = new Animation("<empty>", [], 0);
|
||||
return _emptyAnimation;
|
||||
}
|
||||
|
||||
@ -4,9 +4,7 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.spine-player * {
|
||||
box-sizing: border-box;
|
||||
font-family: "PT Sans",Arial,"Helvetica Neue",Helvetica,Tahoma,sans-serif;
|
||||
@ -21,23 +19,24 @@
|
||||
|
||||
.spine-player-error {
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: black;
|
||||
z-index: 10;
|
||||
border-radius: 4px;
|
||||
overflow: auto;
|
||||
-webkit-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-moz-user-select: text;
|
||||
-ms-user-select: text;
|
||||
user-select: text;
|
||||
}
|
||||
|
||||
.spine-player-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/** Canvas **/
|
||||
.spine-player canvas {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/** Slider **/
|
||||
.spine-player-slider {
|
||||
width: 100%;
|
||||
@ -45,7 +44,6 @@
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.spine-player-slider-value {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@ -53,24 +51,20 @@
|
||||
background: rgba(98, 176, 238, 0.6);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.spine-player-slider:hover .spine-player-slider-value {
|
||||
height: 4px;
|
||||
background: rgba(98, 176, 238, 1);
|
||||
transition: height 0.2s;
|
||||
}
|
||||
|
||||
.spine-player-slider-value.hovering {
|
||||
height: 4px;
|
||||
background: rgba(98, 176, 238, 1);
|
||||
transition: height 0.2s;
|
||||
}
|
||||
|
||||
.spine-player-slider.big {
|
||||
height: 12px;
|
||||
background: rgb(0, 0, 0);
|
||||
}
|
||||
|
||||
.spine-player-slider.big .spine-player-slider-value {
|
||||
height: 12px;
|
||||
background: rgba(98, 176, 238, 1);
|
||||
@ -81,7 +75,6 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.spine-player-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@ -93,30 +86,25 @@
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.spine-player-list li {
|
||||
cursor: pointer;
|
||||
margin: 8px 8px;
|
||||
}
|
||||
|
||||
.spine-player-list .selectable {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 0 !important;
|
||||
padding: 2px 20px 2px 0 !important;
|
||||
}
|
||||
|
||||
.spine-player-list li.selectable:first-child {
|
||||
margin-top: 4px !important;
|
||||
}
|
||||
.spine-player-list li.selectable:last-child {
|
||||
margin-bottom: 4px !important;
|
||||
}
|
||||
|
||||
.spine-player-list li.selectable:hover {
|
||||
background: #6e6e6e;
|
||||
}
|
||||
|
||||
.spine-player-list li.selectable .selectable-circle {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@ -129,15 +117,12 @@
|
||||
opacity: 0;
|
||||
margin: 5px 10px;
|
||||
}
|
||||
|
||||
.spine-player-list li.selectable.selected .selectable-circle {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.spine-player-list li.selectable .selectable-text {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.spine-player-list li.selectable.selected .selectable-text, .spine-player-list li.selectable:hover .selectable-text {
|
||||
color: #ddd;
|
||||
}
|
||||
@ -148,12 +133,10 @@
|
||||
flex-direction: row;
|
||||
margin: 2px 10px;
|
||||
}
|
||||
|
||||
.spine-player-switch-text {
|
||||
flex: 1;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.spine-player-switch-knob-area {
|
||||
width: 30px; /* width of the switch */
|
||||
height: 10px;
|
||||
@ -164,11 +147,9 @@
|
||||
align-self: center;
|
||||
justify-self: flex-end;
|
||||
}
|
||||
|
||||
.spine-player-switch.active .spine-player-switch-knob-area {
|
||||
background: #5EAFF1;
|
||||
}
|
||||
|
||||
.spine-player-switch-knob {
|
||||
display: block;
|
||||
width: 14px;
|
||||
@ -191,7 +172,6 @@
|
||||
.spine-player-popup-parent {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.spine-player-popup {
|
||||
user-select: none;
|
||||
position: absolute;
|
||||
@ -204,26 +184,16 @@
|
||||
overflow: auto;
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
.spine-player-popup-title {
|
||||
margin: 4px 15px 2px 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.spine-player-popup hr {
|
||||
margin: 0;
|
||||
border: 0;
|
||||
border-bottom: 1px solid #cccccc70;
|
||||
}
|
||||
|
||||
/** Canvas **/
|
||||
.spine-player canvas {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/** Player controls **/
|
||||
.spine-player-controls {
|
||||
display: flex;
|
||||
@ -235,7 +205,6 @@
|
||||
opacity: 1;
|
||||
transition: opacity 0.4s;
|
||||
}
|
||||
|
||||
.spine-player-controls-hidden {
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
@ -252,7 +221,6 @@
|
||||
border-bottom-right-radius: 4px;
|
||||
padding: 2px 8px 3px;
|
||||
}
|
||||
|
||||
.spine-player-button {
|
||||
background: none;
|
||||
outline: 0;
|
||||
@ -267,99 +235,76 @@
|
||||
padding-bottom: 3px;
|
||||
filter: drop-shadow(0 0 1px #333);
|
||||
}
|
||||
|
||||
.spine-player-button-spacer {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.spine-player-button-icon-play {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cg%20id%3D%22play%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2243%2023.3%204%2047%204%201%2043%2023.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-play:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cg%20id%3D%22play%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2243%2023.3%204%2047%204%201%2043%2023.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-play-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cg%20id%3D%22play%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2243%2023.3%204%2047%204%201%2043%2023.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-pause {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Epause%3C%2Ftitle%3E%3Cg%20id%3D%22pause%22%3E%3Crect%20class%3D%22cls-1%22%20x%3D%226%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2228%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-pause:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Epause%3C%2Ftitle%3E%3Cg%20id%3D%22pause%22%3E%3Crect%20class%3D%22cls-1%22%20x%3D%226%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2228%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-pause-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Epause%3C%2Ftitle%3E%3Cg%20id%3D%22pause%22%3E%3Crect%20class%3D%22cls-1%22%20x%3D%226%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2228%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-speed {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22playback%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplayback%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M48%2C28V20l-4.7-1.18a20.16%2C20.16%2C0%2C0%2C0-2-4.81l2.49-4.15L38.14%2C4.2%2C34%2C6.69a20.16%2C20.16%2C0%2C0%2C0-4.81-2L28%2C0H20L18.82%2C4.7A20.16%2C20.16%2C0%2C0%2C0%2C14%2C6.7L9.86%2C4.2%2C4.2%2C9.86%2C6.69%2C14a20.16%2C20.16%2C0%2C0%2C0-2%2C4.81L0%2C20v8l4.7%2C1.18A20.16%2C20.16%2C0%2C0%2C0%2C6.7%2C34L4.2%2C38.14%2C9.86%2C43.8%2C14%2C41.31a20.16%2C20.16%2C0%2C0%2C0%2C4.81%2C2L20%2C48h8l1.18-4.7a20.16%2C20.16%2C0%2C0%2C0%2C4.81-2l4.15%2C2.49%2C5.66-5.66L41.31%2C34a20.16%2C20.16%2C0%2C0%2C0%2C2-4.81ZM24%2C38A14%2C14%2C0%2C1%2C1%2C38%2C24%2C14%2C14%2C0%2C0%2C1%2C24%2C38Z%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2234%2024%2018%2033%2018%2015%2034%2024%2034%2024%22%2F%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-speed:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22playback%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplayback%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M48%2C28V20l-4.7-1.18a20.16%2C20.16%2C0%2C0%2C0-2-4.81l2.49-4.15L38.14%2C4.2%2C34%2C6.69a20.16%2C20.16%2C0%2C0%2C0-4.81-2L28%2C0H20L18.82%2C4.7A20.16%2C20.16%2C0%2C0%2C0%2C14%2C6.7L9.86%2C4.2%2C4.2%2C9.86%2C6.69%2C14a20.16%2C20.16%2C0%2C0%2C0-2%2C4.81L0%2C20v8l4.7%2C1.18A20.16%2C20.16%2C0%2C0%2C0%2C6.7%2C34L4.2%2C38.14%2C9.86%2C43.8%2C14%2C41.31a20.16%2C20.16%2C0%2C0%2C0%2C4.81%2C2L20%2C48h8l1.18-4.7a20.16%2C20.16%2C0%2C0%2C0%2C4.81-2l4.15%2C2.49%2C5.66-5.66L41.31%2C34a20.16%2C20.16%2C0%2C0%2C0%2C2-4.81ZM24%2C38A14%2C14%2C0%2C1%2C1%2C38%2C24%2C14%2C14%2C0%2C0%2C1%2C24%2C38Z%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2234%2024%2018%2033%2018%2015%2034%2024%2034%2024%22%2F%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-speed-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22playback%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplayback%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M48%2C28V20l-4.7-1.18a20.16%2C20.16%2C0%2C0%2C0-2-4.81l2.49-4.15L38.14%2C4.2%2C34%2C6.69a20.16%2C20.16%2C0%2C0%2C0-4.81-2L28%2C0H20L18.82%2C4.7A20.16%2C20.16%2C0%2C0%2C0%2C14%2C6.7L9.86%2C4.2%2C4.2%2C9.86%2C6.69%2C14a20.16%2C20.16%2C0%2C0%2C0-2%2C4.81L0%2C20v8l4.7%2C1.18A20.16%2C20.16%2C0%2C0%2C0%2C6.7%2C34L4.2%2C38.14%2C9.86%2C43.8%2C14%2C41.31a20.16%2C20.16%2C0%2C0%2C0%2C4.81%2C2L20%2C48h8l1.18-4.7a20.16%2C20.16%2C0%2C0%2C0%2C4.81-2l4.15%2C2.49%2C5.66-5.66L41.31%2C34a20.16%2C20.16%2C0%2C0%2C0%2C2-4.81ZM24%2C38A14%2C14%2C0%2C1%2C1%2C38%2C24%2C14%2C14%2C0%2C0%2C1%2C24%2C38Z%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2234%2024%2018%2033%2018%2015%2034%2024%2034%2024%22%2F%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-animations {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eanimations%3C%2Ftitle%3E%3Cg%20id%3D%22animations%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C45V43.22a6.39%2C6.39%2C0%2C0%2C0%2C.63-.81%2C27.83%2C27.83%2C0%2C0%2C1%2C3.79-4.16c.93-.84%2C2.06-1.88%2C2.86-2.71a13.83%2C13.83%2C0%2C0%2C0%2C1.53-1.9l3.9-5.24c1-1.17.95-1.1%2C2.11%2C0l3%2C2.24a4%2C4%2C0%2C0%2C0-2.29%2C2.38c-1.37%2C3-2.39%2C4-2.68%2C4.22l-.23.18c-.54.39-1.81%2C1-1.7%2C1.54l.8%2C1.49a4.5%2C4.5%2C0%2C0%2C1%2C.39%2C1l.57%2C2.15a.69.69%2C0%2C0%2C0%2C.58.48c.47.08%2C1%2C.5%2C1.33.53%2C1.29.1%2C1.79%2C0%2C1.42-.54L26.7%2C42.72a.86.86%2C0%2C0%2C1-.2-.24%2C3.64%2C3.64%2C0%2C0%2C1-.42-2.2A5.39%2C5.39%2C0%2C0%2C1%2C26.61%2C39c1.84-2%2C6.74-6.36%2C6.74-6.36%2C1.71-1.81%2C1.4-2.52.81-3.84a27.38%2C27.38%2C0%2C0%2C0-2-3c-.41-.61-2.08-2.38-2.85-3.28-.43-.5.38-2.08.87-2.82.18-.12-.41.05%2C1.72.07a23.32%2C23.32%2C0%2C0%2C0%2C3.56-.19l1.63.61c.28%2C0%2C1.18-.09%2C1.31-.35l.12-.78c.18-.39.31-1.56-.05-1.75l-.6-.52a2.28%2C2.28%2C0%2C0%2C0-1.61.07l-.2.44c-.14.15-.52.37-.71.29l-2.24%2C0c-.5.12-1.18-.42-1.81-.73L32.05%2C15a8%2C8%2C0%2C0%2C0%2C.8-3.92%2C1.22%2C1.22%2C0%2C0%2C0-.28-.82%2C7.87%2C7.87%2C0%2C0%2C0-1.15-1.06l.11-.73c-.12-.49%2C1-.82%2C1.52-.82l.76-.33c.32%2C0%2C.68-.89.78-1.21L34.94%2C4a11.26%2C11.26%2C0%2C0%2C0%2C0-1.61C34.57.08%2C30.06-1.42%2C28.78%2C2c-.14.38-.62.77.34%2C3.21a1.55%2C1.55%2C0%2C0%2C1-.3%2C1.2L28.4%2C7a4%2C4%2C0%2C0%2C1-1.19.49c-.79%2C0-1.59-.75-4%2C.54C21%2C9.16%2C18.59%2C13%2C17.7%2C14.22a3.21%2C3.21%2C0%2C0%2C0-.61%2C1.58c-.05%2C1.16.7%2C3.74.87%2C5.75.13%2C1.53.21%2C2.52.72%2C3.06%2C1.07%2C1.14%2C2.1-.18%2C2.61-1a2.74%2C2.74%2C0%2C0%2C0-.14-1.86l-.74-.1c-.15-.15-.4-.42-.39-.64-.05-3.48-.22-3.14-.18-5.39%2C1.74-1.46%2C2.4-2.45%2C2.3-2-.2%2C1.15.28%2C2.83.09%2C4.35a6.46%2C6.46%2C0%2C0%2C1-.7%2C2.58s-2.11%2C4.22-2.14%2C4.27l-1.26%2C5.6-.7%2C1.44s-.71.54-1.59%2C1.21a9.67%2C9.67%2C0%2C0%2C0-2.27%2C3.18%2C20.16%2C20.16%2C0%2C0%2C1-1.42%2C2.83l-.87%2C1.31a1.72%2C1.72%2C0%2C0%2C1-.6.61l-1.83%2C1.1a1.39%2C1.39%2C0%2C0%2C0-.16.93l.68%2C1.71a4.07%2C4.07%2C0%2C0%2C1%2C.27%2C1.07l.17%2C1.56a.75.75%2C0%2C0%2C0%2C.71.59%2C18.13%2C18.13%2C0%2C0%2C0%2C3.26-.5c.27-.09-.29-.78-.53-1s-.45-.36-.45-.36A12.78%2C12.78%2C0%2C0%2C1%2C12%2C45Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
|
||||
}
|
||||
|
||||
.spine-player-button-icon-animations:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eanimations%3C%2Ftitle%3E%3Cg%20id%3D%22animations%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C45V43.22a6.39%2C6.39%2C0%2C0%2C0%2C.63-.81%2C27.83%2C27.83%2C0%2C0%2C1%2C3.79-4.16c.93-.84%2C2.06-1.88%2C2.86-2.71a13.83%2C13.83%2C0%2C0%2C0%2C1.53-1.9l3.9-5.24c1-1.17.95-1.1%2C2.11%2C0l3%2C2.24a4%2C4%2C0%2C0%2C0-2.29%2C2.38c-1.37%2C3-2.39%2C4-2.68%2C4.22l-.23.18c-.54.39-1.81%2C1-1.7%2C1.54l.8%2C1.49a4.5%2C4.5%2C0%2C0%2C1%2C.39%2C1l.57%2C2.15a.69.69%2C0%2C0%2C0%2C.58.48c.47.08%2C1%2C.5%2C1.33.53%2C1.29.1%2C1.79%2C0%2C1.42-.54L26.7%2C42.72a.86.86%2C0%2C0%2C1-.2-.24%2C3.64%2C3.64%2C0%2C0%2C1-.42-2.2A5.39%2C5.39%2C0%2C0%2C1%2C26.61%2C39c1.84-2%2C6.74-6.36%2C6.74-6.36%2C1.71-1.81%2C1.4-2.52.81-3.84a27.38%2C27.38%2C0%2C0%2C0-2-3c-.41-.61-2.08-2.38-2.85-3.28-.43-.5.38-2.08.87-2.82.18-.12-.41.05%2C1.72.07a23.32%2C23.32%2C0%2C0%2C0%2C3.56-.19l1.63.61c.28%2C0%2C1.18-.09%2C1.31-.35l.12-.78c.18-.39.31-1.56-.05-1.75l-.6-.52a2.28%2C2.28%2C0%2C0%2C0-1.61.07l-.2.44c-.14.15-.52.37-.71.29l-2.24%2C0c-.5.12-1.18-.42-1.81-.73L32.05%2C15a8%2C8%2C0%2C0%2C0%2C.8-3.92%2C1.22%2C1.22%2C0%2C0%2C0-.28-.82%2C7.87%2C7.87%2C0%2C0%2C0-1.15-1.06l.11-.73c-.12-.49%2C1-.82%2C1.52-.82l.76-.33c.32%2C0%2C.68-.89.78-1.21L34.94%2C4a11.26%2C11.26%2C0%2C0%2C0%2C0-1.61C34.57.08%2C30.06-1.42%2C28.78%2C2c-.14.38-.62.77.34%2C3.21a1.55%2C1.55%2C0%2C0%2C1-.3%2C1.2L28.4%2C7a4%2C4%2C0%2C0%2C1-1.19.49c-.79%2C0-1.59-.75-4%2C.54C21%2C9.16%2C18.59%2C13%2C17.7%2C14.22a3.21%2C3.21%2C0%2C0%2C0-.61%2C1.58c-.05%2C1.16.7%2C3.74.87%2C5.75.13%2C1.53.21%2C2.52.72%2C3.06%2C1.07%2C1.14%2C2.1-.18%2C2.61-1a2.74%2C2.74%2C0%2C0%2C0-.14-1.86l-.74-.1c-.15-.15-.4-.42-.39-.64-.05-3.48-.22-3.14-.18-5.39%2C1.74-1.46%2C2.4-2.45%2C2.3-2-.2%2C1.15.28%2C2.83.09%2C4.35a6.46%2C6.46%2C0%2C0%2C1-.7%2C2.58s-2.11%2C4.22-2.14%2C4.27l-1.26%2C5.6-.7%2C1.44s-.71.54-1.59%2C1.21a9.67%2C9.67%2C0%2C0%2C0-2.27%2C3.18%2C20.16%2C20.16%2C0%2C0%2C1-1.42%2C2.83l-.87%2C1.31a1.72%2C1.72%2C0%2C0%2C1-.6.61l-1.83%2C1.1a1.39%2C1.39%2C0%2C0%2C0-.16.93l.68%2C1.71a4.07%2C4.07%2C0%2C0%2C1%2C.27%2C1.07l.17%2C1.56a.75.75%2C0%2C0%2C0%2C.71.59%2C18.13%2C18.13%2C0%2C0%2C0%2C3.26-.5c.27-.09-.29-.78-.53-1s-.45-.36-.45-.36A12.78%2C12.78%2C0%2C0%2C1%2C12%2C45Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
|
||||
}
|
||||
|
||||
.spine-player-button-icon-animations-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eanimations%3C%2Ftitle%3E%3Cg%20id%3D%22animations%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C45V43.22a6.39%2C6.39%2C0%2C0%2C0%2C.63-.81%2C27.83%2C27.83%2C0%2C0%2C1%2C3.79-4.16c.93-.84%2C2.06-1.88%2C2.86-2.71a13.83%2C13.83%2C0%2C0%2C0%2C1.53-1.9l3.9-5.24c1-1.17.95-1.1%2C2.11%2C0l3%2C2.24a4%2C4%2C0%2C0%2C0-2.29%2C2.38c-1.37%2C3-2.39%2C4-2.68%2C4.22l-.23.18c-.54.39-1.81%2C1-1.7%2C1.54l.8%2C1.49a4.5%2C4.5%2C0%2C0%2C1%2C.39%2C1l.57%2C2.15a.69.69%2C0%2C0%2C0%2C.58.48c.47.08%2C1%2C.5%2C1.33.53%2C1.29.1%2C1.79%2C0%2C1.42-.54L26.7%2C42.72a.86.86%2C0%2C0%2C1-.2-.24%2C3.64%2C3.64%2C0%2C0%2C1-.42-2.2A5.39%2C5.39%2C0%2C0%2C1%2C26.61%2C39c1.84-2%2C6.74-6.36%2C6.74-6.36%2C1.71-1.81%2C1.4-2.52.81-3.84a27.38%2C27.38%2C0%2C0%2C0-2-3c-.41-.61-2.08-2.38-2.85-3.28-.43-.5.38-2.08.87-2.82.18-.12-.41.05%2C1.72.07a23.32%2C23.32%2C0%2C0%2C0%2C3.56-.19l1.63.61c.28%2C0%2C1.18-.09%2C1.31-.35l.12-.78c.18-.39.31-1.56-.05-1.75l-.6-.52a2.28%2C2.28%2C0%2C0%2C0-1.61.07l-.2.44c-.14.15-.52.37-.71.29l-2.24%2C0c-.5.12-1.18-.42-1.81-.73L32.05%2C15a8%2C8%2C0%2C0%2C0%2C.8-3.92%2C1.22%2C1.22%2C0%2C0%2C0-.28-.82%2C7.87%2C7.87%2C0%2C0%2C0-1.15-1.06l.11-.73c-.12-.49%2C1-.82%2C1.52-.82l.76-.33c.32%2C0%2C.68-.89.78-1.21L34.94%2C4a11.26%2C11.26%2C0%2C0%2C0%2C0-1.61C34.57.08%2C30.06-1.42%2C28.78%2C2c-.14.38-.62.77.34%2C3.21a1.55%2C1.55%2C0%2C0%2C1-.3%2C1.2L28.4%2C7a4%2C4%2C0%2C0%2C1-1.19.49c-.79%2C0-1.59-.75-4%2C.54C21%2C9.16%2C18.59%2C13%2C17.7%2C14.22a3.21%2C3.21%2C0%2C0%2C0-.61%2C1.58c-.05%2C1.16.7%2C3.74.87%2C5.75.13%2C1.53.21%2C2.52.72%2C3.06%2C1.07%2C1.14%2C2.1-.18%2C2.61-1a2.74%2C2.74%2C0%2C0%2C0-.14-1.86l-.74-.1c-.15-.15-.4-.42-.39-.64-.05-3.48-.22-3.14-.18-5.39%2C1.74-1.46%2C2.4-2.45%2C2.3-2-.2%2C1.15.28%2C2.83.09%2C4.35a6.46%2C6.46%2C0%2C0%2C1-.7%2C2.58s-2.11%2C4.22-2.14%2C4.27l-1.26%2C5.6-.7%2C1.44s-.71.54-1.59%2C1.21a9.67%2C9.67%2C0%2C0%2C0-2.27%2C3.18%2C20.16%2C20.16%2C0%2C0%2C1-1.42%2C2.83l-.87%2C1.31a1.72%2C1.72%2C0%2C0%2C1-.6.61l-1.83%2C1.1a1.39%2C1.39%2C0%2C0%2C0-.16.93l.68%2C1.71a4.07%2C4.07%2C0%2C0%2C1%2C.27%2C1.07l.17%2C1.56a.75.75%2C0%2C0%2C0%2C.71.59%2C18.13%2C18.13%2C0%2C0%2C0%2C3.26-.5c.27-.09-.29-.78-.53-1s-.45-.36-.45-.36A12.78%2C12.78%2C0%2C0%2C1%2C12%2C45Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
|
||||
}
|
||||
|
||||
.spine-player-button-icon-skins {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eskins%3C%2Ftitle%3E%3Cg%20id%3D%22skins%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M36%2C12.54l-6.92%2C1-.79%2C1.2c-1%2C.25-2-.62-3-.55V12.33a1.35%2C1.35%2C0%2C0%2C1%2C.55-1.07c3-2.24%2C3.28-3.75%2C3.28-5.34A5.06%2C5.06%2C0%2C0%2C0%2C24%2C.76c-2.54%2C0-4.38.71-5.49%2C2.13a5.74%2C5.74%2C0%2C0%2C0-.9%2C4.57l2.48-.61a3.17%2C3.17%2C0%2C0%2C1%2C.45-2.4c.6-.75%2C1.75-1.13%2C3.42-1.13%2C2.56%2C0%2C2.56%2C1.24%2C2.56%2C2.56%2C0%2C.92%2C0%2C1.65-2.26%2C3.34a3.92%2C3.92%2C0%2C0%2C0-1.58%2C3.12v1.86c-1-.07-2%2C.8-3%2C.55l-.79-1.2-6.92-1c-2.25%2C0-4.35%2C2.09-5.64%2C3.93L1%2C24c3.83%2C5.11%2C10.22%2C5.11%2C10.22%2C5.11V41.93c0%2C2.34%2C2.68%2C3.88%2C5.59%2C4.86a22.59%2C22.59%2C0%2C0%2C0%2C14.37%2C0c2.91-1%2C5.59-2.52%2C5.59-4.86V29.15S43.17%2C29.15%2C47%2C24l-5.33-7.57C40.38%2C14.63%2C38.27%2C12.54%2C36%2C12.54ZM23.32%2C20.09%2C21%2C17l1.8-.6a3.79%2C3.79%2C0%2C0%2C1%2C2.4%2C0L27%2C17l-2.32%2C3.09A.85.85%2C0%2C0%2C1%2C23.32%2C20.09Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
width: 31px;
|
||||
height: 31px;
|
||||
}
|
||||
|
||||
.spine-player-button-icon-skins:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eskins%3C%2Ftitle%3E%3Cg%20id%3D%22skins%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M36%2C12.54l-6.92%2C1-.79%2C1.2c-1%2C.25-2-.62-3-.55V12.33a1.35%2C1.35%2C0%2C0%2C1%2C.55-1.07c3-2.24%2C3.28-3.75%2C3.28-5.34A5.06%2C5.06%2C0%2C0%2C0%2C24%2C.76c-2.54%2C0-4.38.71-5.49%2C2.13a5.74%2C5.74%2C0%2C0%2C0-.9%2C4.57l2.48-.61a3.17%2C3.17%2C0%2C0%2C1%2C.45-2.4c.6-.75%2C1.75-1.13%2C3.42-1.13%2C2.56%2C0%2C2.56%2C1.24%2C2.56%2C2.56%2C0%2C.92%2C0%2C1.65-2.26%2C3.34a3.92%2C3.92%2C0%2C0%2C0-1.58%2C3.12v1.86c-1-.07-2%2C.8-3%2C.55l-.79-1.2-6.92-1c-2.25%2C0-4.35%2C2.09-5.64%2C3.93L1%2C24c3.83%2C5.11%2C10.22%2C5.11%2C10.22%2C5.11V41.93c0%2C2.34%2C2.68%2C3.88%2C5.59%2C4.86a22.59%2C22.59%2C0%2C0%2C0%2C14.37%2C0c2.91-1%2C5.59-2.52%2C5.59-4.86V29.15S43.17%2C29.15%2C47%2C24l-5.33-7.57C40.38%2C14.63%2C38.27%2C12.54%2C36%2C12.54ZM23.32%2C20.09%2C21%2C17l1.8-.6a3.79%2C3.79%2C0%2C0%2C1%2C2.4%2C0L27%2C17l-2.32%2C3.09A.85.85%2C0%2C0%2C1%2C23.32%2C20.09Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-skins-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eskins%3C%2Ftitle%3E%3Cg%20id%3D%22skins%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M36%2C12.54l-6.92%2C1-.79%2C1.2c-1%2C.25-2-.62-3-.55V12.33a1.35%2C1.35%2C0%2C0%2C1%2C.55-1.07c3-2.24%2C3.28-3.75%2C3.28-5.34A5.06%2C5.06%2C0%2C0%2C0%2C24%2C.76c-2.54%2C0-4.38.71-5.49%2C2.13a5.74%2C5.74%2C0%2C0%2C0-.9%2C4.57l2.48-.61a3.17%2C3.17%2C0%2C0%2C1%2C.45-2.4c.6-.75%2C1.75-1.13%2C3.42-1.13%2C2.56%2C0%2C2.56%2C1.24%2C2.56%2C2.56%2C0%2C.92%2C0%2C1.65-2.26%2C3.34a3.92%2C3.92%2C0%2C0%2C0-1.58%2C3.12v1.86c-1-.07-2%2C.8-3%2C.55l-.79-1.2-6.92-1c-2.25%2C0-4.35%2C2.09-5.64%2C3.93L1%2C24c3.83%2C5.11%2C10.22%2C5.11%2C10.22%2C5.11V41.93c0%2C2.34%2C2.68%2C3.88%2C5.59%2C4.86a22.59%2C22.59%2C0%2C0%2C0%2C14.37%2C0c2.91-1%2C5.59-2.52%2C5.59-4.86V29.15S43.17%2C29.15%2C47%2C24l-5.33-7.57C40.38%2C14.63%2C38.27%2C12.54%2C36%2C12.54ZM23.32%2C20.09%2C21%2C17l1.8-.6a3.79%2C3.79%2C0%2C0%2C1%2C2.4%2C0L27%2C17l-2.32%2C3.09A.85.85%2C0%2C0%2C1%2C23.32%2C20.09Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-settings {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Esettings%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M40%2C3H8A5%2C5%2C0%2C0%2C0%2C3%2C8V40a5%2C5%2C0%2C0%2C0%2C5%2C5H40a5%2C5%2C0%2C0%2C0%2C5-5V8A5%2C5%2C0%2C0%2C0%2C40%2C3ZM16%2C40H9V33h7Zm0-12H9V21h7Zm0-12H9V9h7ZM39%2C38H20V35H39Zm0-12H20V23H39Zm0-12H20V11H39Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.spine-player-button-icon-settings:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Esettings%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M40%2C3H8A5%2C5%2C0%2C0%2C0%2C3%2C8V40a5%2C5%2C0%2C0%2C0%2C5%2C5H40a5%2C5%2C0%2C0%2C0%2C5-5V8A5%2C5%2C0%2C0%2C0%2C40%2C3ZM16%2C40H9V33h7Zm0-12H9V21h7Zm0-12H9V9h7ZM39%2C38H20V35H39Zm0-12H20V23H39Zm0-12H20V11H39Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-settings-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Esettings%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M40%2C3H8A5%2C5%2C0%2C0%2C0%2C3%2C8V40a5%2C5%2C0%2C0%2C0%2C5%2C5H40a5%2C5%2C0%2C0%2C0%2C5-5V8A5%2C5%2C0%2C0%2C0%2C40%2C3ZM16%2C40H9V33h7Zm0-12H9V21h7Zm0-12H9V9h7ZM39%2C38H20V35H39Zm0-12H20V23H39Zm0-12H20V11H39Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-fullscreen {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eexpand%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2230.14%208%2040%208%2040%2017.86%2044.5%2017.86%2044.5%203.5%2030.14%203.5%2030.14%208%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%228%2017.86%208%208%2017.86%208%2017.86%203.5%203.5%203.5%203.5%2017.86%208%2017.86%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2240%2030.14%2040%2040%2030.14%2040%2030.14%2044.5%2044.5%2044.5%2044.5%2030.14%2040%2030.14%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2217.86%2040%208%2040%208%2030.14%203.5%2030.14%203.5%2044.5%2017.86%2044.5%2017.86%2040%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.spine-player-button-icon-fullscreen:hover {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eexpand%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2230.14%208%2040%208%2040%2017.86%2044.5%2017.86%2044.5%203.5%2030.14%203.5%2030.14%208%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%228%2017.86%208%208%2017.86%208%2017.86%203.5%203.5%203.5%203.5%2017.86%208%2017.86%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2240%2030.14%2040%2040%2030.14%2040%2030.14%2044.5%2044.5%2044.5%2044.5%2030.14%2040%2030.14%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2217.86%2040%208%2040%208%2030.14%203.5%2030.14%203.5%2044.5%2017.86%2044.5%2017.86%2040%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-fullscreen-selected {
|
||||
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eexpand%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2230.14%208%2040%208%2040%2017.86%2044.5%2017.86%2044.5%203.5%2030.14%203.5%2030.14%208%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%228%2017.86%208%208%2017.86%208%2017.86%203.5%203.5%203.5%203.5%2017.86%208%2017.86%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2240%2030.14%2040%2040%2030.14%2040%2030.14%2044.5%2044.5%2044.5%2044.5%2030.14%2040%2030.14%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2217.86%2040%208%2040%208%2030.14%203.5%2030.14%203.5%2044.5%2017.86%2044.5%2017.86%2040%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||
}
|
||||
|
||||
.spine-player-button-icon-spine-logo {
|
||||
height: 20px;
|
||||
position: relative;
|
||||
@ -373,7 +318,6 @@
|
||||
box-shadow: none !important;
|
||||
filter: drop-shadow(0 0 1px #333);
|
||||
}
|
||||
|
||||
.spine-player-button-icon-spine-logo:hover {
|
||||
transform: scale(1.05);
|
||||
transition: transform 0.2s;
|
||||
@ -391,18 +335,15 @@
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.spine-player-editor-code {
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.CodeMirror {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.spine-player-editor-player {
|
||||
flex: 1;
|
||||
border: none;
|
||||
background: black;
|
||||
}
|
||||
.CodeMirror {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@ -15,8 +15,8 @@ body {
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div id="container" style="width:640px; height:380px; background:#cccccc"></div>
|
||||
<div id="container-raptor" style="width:640px; height:380px;"></div>
|
||||
<div id="container" style="width:640px; height:380px"></div>
|
||||
<div id="container-raptor" style="width:640px; height:380px"></div>
|
||||
<div>
|
||||
<button id="walk">Walk</button>
|
||||
<button id="jump">Jump</button>
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -42,8 +42,6 @@ module spine.webgl {
|
||||
projection = new Matrix4();
|
||||
view = new Matrix4();
|
||||
|
||||
private tmp = new Vector3();
|
||||
|
||||
constructor (viewportWidth: number, viewportHeight: number) {
|
||||
this.viewportWidth = viewportWidth;
|
||||
this.viewportHeight = viewportHeight;
|
||||
@ -67,15 +65,21 @@ module spine.webgl {
|
||||
|
||||
screenToWorld (screenCoords: Vector3, screenWidth: number, screenHeight: number) {
|
||||
let x = screenCoords.x, y = screenHeight - screenCoords.y - 1;
|
||||
let tmp = this.tmp;
|
||||
tmp.x = (2 * x) / screenWidth - 1;
|
||||
tmp.y = (2 * y) / screenHeight - 1;
|
||||
tmp.z = (2 * screenCoords.z) - 1;
|
||||
tmp.project(this.inverseProjectionView);
|
||||
screenCoords.set(tmp.x, tmp.y, tmp.z);
|
||||
screenCoords.x = (2 * x) / screenWidth - 1;
|
||||
screenCoords.y = (2 * y) / screenHeight - 1;
|
||||
screenCoords.z = (2 * screenCoords.z) - 1;
|
||||
screenCoords.project(this.inverseProjectionView);
|
||||
return screenCoords;
|
||||
}
|
||||
|
||||
worldToScreen (worldCoords: Vector3, screenWidth: number, screenHeight: number) {
|
||||
worldCoords.project(this.projectionView);
|
||||
worldCoords.x = screenWidth * (worldCoords.x + 1) / 2;
|
||||
worldCoords.y = screenHeight * (worldCoords.y + 1) / 2;
|
||||
worldCoords.z = (worldCoords.z + 1) / 2;
|
||||
return worldCoords;
|
||||
}
|
||||
|
||||
setViewport(viewportWidth: number, viewportHeight: number) {
|
||||
this.viewportWidth = viewportWidth;
|
||||
this.viewportHeight = viewportHeight;
|
||||
|
||||
@ -31,7 +31,9 @@ module spine.webgl {
|
||||
let spinnerImage: HTMLImageElement;
|
||||
let logoImage: HTMLImageElement;
|
||||
let loaded = 0;
|
||||
|
||||
const FADE_IN = 1, FADE_OUT = 1;
|
||||
const logoWidth = 165, logoHeight = 108, spinnerSize = 163;
|
||||
|
||||
export class LoadingScreen {
|
||||
private renderer: SceneRenderer;
|
||||
@ -77,13 +79,8 @@ module spine.webgl {
|
||||
let canvas = renderer.canvas;
|
||||
let gl = renderer.context.gl;
|
||||
|
||||
renderer.resize(ResizeMode.Stretch);
|
||||
|
||||
renderer.camera.zoom = 1;
|
||||
renderer.resize(ResizeMode.Expand);
|
||||
renderer.camera.position.set(canvas.width / 2, canvas.height / 2, 0);
|
||||
renderer.camera.viewportWidth = canvas.width;
|
||||
renderer.camera.viewportHeight = canvas.height;
|
||||
|
||||
renderer.batcher.setBlendMode(gl.ONE, gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
|
||||
|
||||
if (complete) {
|
||||
@ -94,6 +91,7 @@ module spine.webgl {
|
||||
a = 1 - (a - 1) * (a - 1);
|
||||
tempColor.a *= a;
|
||||
if (tempColor.a > 0) {
|
||||
renderer.camera.zoom = 1;
|
||||
renderer.begin();
|
||||
renderer.quad(true, 0, 0, canvas.width, 0, canvas.width, canvas.height, 0, canvas.height,
|
||||
tempColor, tempColor, tempColor, tempColor);
|
||||
@ -114,12 +112,10 @@ module spine.webgl {
|
||||
this.logo = new GLTexture(renderer.context, logoImage);
|
||||
this.spinner = new GLTexture(renderer.context, spinnerImage);
|
||||
}
|
||||
let logoWidth = logoImage.width, logoHeight = logoImage.height;
|
||||
let spinnerWidth = spinnerImage.width, spinnerHeight = spinnerImage.height;
|
||||
|
||||
renderer.camera.zoom = Math.max(1, spinnerSize / canvas.height);
|
||||
renderer.begin();
|
||||
renderer.drawTexture(this.logo, (canvas.width - logoWidth) / 2, (canvas.height - logoHeight) / 2, logoWidth, logoHeight, tempColor);
|
||||
renderer.drawTextureRotated(this.spinner, (canvas.width - spinnerWidth) / 2, (canvas.height - spinnerHeight) / 2, spinnerWidth, spinnerHeight, spinnerWidth / 2, spinnerHeight / 2, this.angle, tempColor);
|
||||
renderer.drawTextureRotated(this.spinner, (canvas.width - spinnerSize) / 2, (canvas.height - spinnerSize) / 2, spinnerSize, spinnerSize, spinnerSize / 2, spinnerSize / 2, this.angle, tempColor);
|
||||
renderer.end();
|
||||
}
|
||||
}
|
||||
|
||||
@ -98,7 +98,7 @@ module spine.webgl {
|
||||
this.mesh.setIndicesLength(this.indicesLength);
|
||||
}
|
||||
|
||||
private flush () {
|
||||
flush () {
|
||||
if (this.verticesLength == 0) return;
|
||||
|
||||
this.lastTexture.bind();
|
||||
|
||||
@ -464,8 +464,7 @@ module spine.webgl {
|
||||
let targetRatio = targetHeight / targetWidth;
|
||||
let sourceRatio = sourceHeight / sourceWidth;
|
||||
let scale = targetRatio < sourceRatio ? targetWidth / sourceWidth : targetHeight / sourceHeight;
|
||||
this.camera.viewportWidth = sourceWidth * scale;
|
||||
this.camera.viewportHeight = sourceHeight * scale;
|
||||
this.camera.setViewport(sourceWidth * scale, sourceHeight * scale);
|
||||
}
|
||||
this.camera.update();
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user