Skip to content

Commit

Permalink
updates to SpineMap class
Browse files Browse the repository at this point in the history
  • Loading branch information
flyover committed Mar 30, 2018
1 parent 970e070 commit 101c541
Show file tree
Hide file tree
Showing 13 changed files with 1,562 additions and 1,771 deletions.
5 changes: 2 additions & 3 deletions demo/atlas.js

Large diffs are not rendered by default.

13 changes: 6 additions & 7 deletions demo/atlas.ts
Original file line number Diff line number Diff line change
Expand Up @@ -31,21 +31,20 @@ export class Data {
public pages: Page[] = [];
public sites: {[key: string]: Site} = {};

public drop(): Data {
public free(): void {
this.pages = [];
this.sites = {};
return this;
}

public import(text: string): Data {
public import(text: string): this {
return this.importAtlasText(text);
}

public export(text: string = ""): string {
return this.exportAtlasText(text);
}

public importAtlasText(text: string): Data {
public importAtlasText(text: string): this {
const lines: string[] = text.split(/\n|\r\n/);
return this.importAtlasTextLines(lines);
}
Expand All @@ -55,7 +54,7 @@ export class Data {
return text + lines.join("\n");
}

public importAtlasTextLines(lines: string[]): Data {
public importAtlasTextLines(lines: string[]): this {
this.pages = [];
this.sites = {};
let page: Page | null = null;
Expand Down Expand Up @@ -153,13 +152,13 @@ export class Data {
return lines;
}

public importTpsText(tps_text: string): Data {
public importTpsText(tps_text: string): this {
this.pages = [];
this.sites = {};
return this.importTpsTextPage(tps_text, 0);
}

public importTpsTextPage(tps_text: string, page_index: number = 0): Data {
public importTpsTextPage(tps_text: string, page_index: number = 0): this {
const tps_json: any = JSON.parse(tps_text);
const page: Page = this.pages[page_index] = new Page();
if (tps_json.meta) {
Expand Down
6 changes: 3 additions & 3 deletions demo/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta charset="utf-8" />
<title>Spine TypeScript Demo</title>
<style>body { background-image: url("bg.png"); background-repeat: repeat; }</style>
<script type="text/javascript" src="https://unpkg.com/systemjs@0.20.0-rc.1/dist/system.js"></script>
<script type="text/javascript" src="https://unpkg.com/systemjs@0.21.0/dist/system.js"></script>
<!--script type="text/javascript" src="../node_modules/systemjs/dist/system.js"></script-->
<script type="text/javascript">
function boot(event) {
Expand All @@ -17,9 +17,9 @@
"plugin-typescript": { "main": "lib/plugin.js" }
},
map: {
"typescript": "https://unpkg.com/typescript@2.1.4",
"typescript": "https://unpkg.com/typescript@2.8.1",
///"typescript": "../node_modules/typescript",
"plugin-typescript": "https://unpkg.com/plugin-typescript@5.3.1",
"plugin-typescript": "https://unpkg.com/plugin-typescript@8.0.0",
///"plugin-typescript": "../node_modules/plugin-typescript"
},
transpiler: "plugin-typescript",
Expand Down
28 changes: 15 additions & 13 deletions demo/main.js

Large diffs are not rendered by default.

26 changes: 14 additions & 12 deletions demo/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -104,9 +104,9 @@ export function start(): void {
function loadFile(file: any, callback: () => void): void {
render_ctx2d.dropData(spine_data, atlas_data);
render_webgl.dropData(spine_data, atlas_data);
spine_pose.drop();
spine_pose_next.drop();
spine_data.drop();
spine_pose.free();
spine_pose_next.free();
spine_data.free();
atlas_data = null;

const images: Spine.Map<string, HTMLImageElement> = new Spine.Map<string, HTMLImageElement>();
Expand Down Expand Up @@ -189,7 +189,7 @@ export function start(): void {

///addFile("Mario/", "export/Mario.json", "export/Mario.atlas");

addFile("Splatoon-FanArt/", "Data/splatoon.json", "Data/splatoon.Atlas.txt", 0.5);
addFile("Splatoon-FanArt/", "Data/splatoon.json", "Data/splatoon.atlas.txt", 0.5);
addFile("ExplorerQ/", "ExplorerQ.json");
addFile("examples/alien/", "export/alien.json", "export/alien.atlas");
addFile("examples/dragon/", "export/dragon.json", "export/dragon.atlas");
Expand Down Expand Up @@ -264,14 +264,15 @@ export function start(): void {
}

function updateSkin() {
const skin_keys: string[] = spine_data.skins.keys;
const skin_key: string = skin_keys[skin_index];
//const skin_keys: string[] = spine_data.skins._keys;
//const skin_key: string = skin_keys[skin_index];
const skin_key: string = spine_data.skins.key(skin_index);
spine_pose.setSkin(skin_key);
spine_pose_next.setSkin(skin_key);
}

function updateAnim() {
const anim_keys: string[] = file.anim_keys || spine_data.anims.keys;
const anim_keys: string[] = file.anim_keys || spine_data.anims._keys;
const anim_key: string = anim_keys[anim_index];
spine_pose.setAnim(anim_key);
const anim_key_next: string = anim_keys[(anim_index + 1) % anim_keys.length];
Expand Down Expand Up @@ -305,10 +306,10 @@ export function start(): void {
anim_time += dt * anim_rate;

if (anim_time >= (anim_length * anim_repeat)) {
const anim_keys: string[] = file.anim_keys || spine_data.anims.keys;
const anim_keys: string[] = file.anim_keys || spine_data.anims._keys;
if (++anim_index >= anim_keys.length) {
anim_index = 0;
const skin_keys: string[] = spine_data.skins.keys;
const skin_keys: string[] = spine_data.skins._keys;
if (++skin_index >= skin_keys.length) {
skin_index = 0;
if (files.length > 1) {
Expand All @@ -330,9 +331,10 @@ export function start(): void {
updateAnim();
}

const skin_keys: string[] = spine_data.skins.keys;
const skin_key: string = skin_keys[skin_index];
const anim_keys: string[] = file.anim_keys || spine_data.anims.keys;
//const skin_keys: string[] = spine_data.skins._keys;
//const skin_key: string = skin_keys[skin_index];
const skin_key: string = spine_data.skins.key(skin_index);
const anim_keys: string[] = file.anim_keys || spine_data.anims._keys;
const anim_key: string = anim_keys[anim_index];
const anim_key_next: string = anim_keys[(anim_index + 1) % anim_keys.length];
messages.innerHTML = "skin: " + skin_key + ", anim: " + anim_key + ", next anim: " + anim_key_next + "<br>" + file.path + file.json_url;
Expand Down
17 changes: 10 additions & 7 deletions demo/render-ctx2d.js

Large diffs are not rendered by default.

15 changes: 9 additions & 6 deletions demo/render-ctx2d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -391,8 +391,9 @@ class RenderWeightedMeshAttachment implements RenderAttachment {
position.x = attachment.vertices[index++];
position.y = attachment.vertices[index++];
const weight: number = attachment.vertices[index++];
const bone_key: string = spine_data.bones.keys[bone_index];
const bone: Spine.Bone | undefined = spine_data.bones.get(bone_key);
///const bone_key: string = spine_data.bones._keys[bone_index];
///const bone: Spine.Bone | undefined = spine_data.bones.get(bone_key);
const bone: Spine.Bone | undefined = spine_data.bones.getByIndex(bone_index);
bone && Spine.Space.transform(bone.world_space, position, position);
setup_position_x += position.x * weight;
setup_position_y += position.y * weight;
Expand Down Expand Up @@ -433,8 +434,9 @@ class RenderWeightedMeshAttachment implements RenderAttachment {
position.x = attachment.vertices[index++];
position.y = attachment.vertices[index++];
const weight: number = attachment.vertices[index++];
const bone_key: string = spine_pose.bones.keys[bone_index];
const bone: Spine.Bone | undefined = spine_pose.bones.get(bone_key);
///const bone_key: string = spine_pose.bones._keys[bone_index];
///const bone: Spine.Bone | undefined = spine_pose.bones.get(bone_key);
const bone: Spine.Bone | undefined = spine_pose.bones.getByIndex(bone_index);
const x0: number = ffd_keyframe0.vertices[ffd_index - ffd_keyframe0.offset] || 0;
const x1: number = ffd_keyframe1.vertices[ffd_index - ffd_keyframe1.offset] || 0;
position.x += Spine.tween(x0, x1, ffd_weight); ++ffd_index;
Expand All @@ -460,8 +462,9 @@ class RenderWeightedMeshAttachment implements RenderAttachment {
position.x = attachment.vertices[index++];
position.y = attachment.vertices[index++];
const weight: number = attachment.vertices[index++];
const bone_key: string = spine_pose.bones.keys[bone_index];
const bone: Spine.Bone | undefined = spine_pose.bones.get(bone_key);
///const bone_key: string = spine_pose.bones._keys[bone_index];
///const bone: Spine.Bone | undefined = spine_pose.bones.get(bone_key);
const bone: Spine.Bone | undefined = spine_pose.bones.getByIndex(bone_index);
bone && Spine.Space.transform(bone.world_space, position, position);
blend_position_x += position.x * weight;
blend_position_y += position.y * weight;
Expand Down
45 changes: 26 additions & 19 deletions demo/render-webgl.js

Large diffs are not rendered by default.

45 changes: 26 additions & 19 deletions demo/render-webgl.ts
Original file line number Diff line number Diff line change
Expand Up @@ -359,6 +359,8 @@ class RenderMeshAttachment implements RenderAttachment {
const image_key: string = (page && page.name) || attachment.path || attachment.name || attachment_key;
const texture: RenderTexture | undefined = this.render.textures.get(image_key);
if (!texture) { return; }
mat3x3ApplyAtlasPageTexcoord(this.render.texmatrix, page);
mat3x3ApplyAtlasSiteTexcoord(this.render.texmatrix, site);
bone && mat4x4ApplySpace(this.render.modelview, bone.world_space);
mat4x4ApplyAtlasSitePosition(this.render.modelview, site);
const anim: Spine.Animation | undefined = spine_pose.data.anims.get(spine_pose.anim_key);
Expand Down Expand Up @@ -445,8 +447,9 @@ class RenderWeightedMeshAttachment implements RenderAttachment {
blender_array.forEach((blender: Blender): void => { blender.weight /= weight_sum; });
const position: Spine.Vector = new Spine.Vector();
blender_array.forEach((blender: Blender, blender_index: number): void => {
const bone_key: string = spine_data.bones.keys[blender.bone_index];
const bone: Spine.Bone | undefined = spine_data.bones.get(bone_key);
///const bone_key: string = spine_data.bones._keys[blender.bone_index];
///const bone: Spine.Bone | undefined = spine_data.bones.get(bone_key);
const bone: Spine.Bone | undefined = spine_data.bones.getByIndex(blender.bone_index);
const blend_position: Spine.Vector = new Spine.Vector();
bone && Spine.Space.transform(bone.world_space, blender.position, blend_position);
position.selfAdd(blend_position.selfScale(blender.weight));
Expand Down Expand Up @@ -482,8 +485,9 @@ class RenderWeightedMeshAttachment implements RenderAttachment {
parse_index = parseBlenders(attachment.vertices, parse_index, (blender: Blender): void => { blender_array.push(blender); });
const position_morph: Spine.Vector = new Spine.Vector();
blender_array.forEach((blender: Blender): void => {
const bone_key: string = spine_data.bones.keys[blender.bone_index];
const bone: Spine.Bone | undefined = spine_data.bones.get(bone_key);
///const bone_key: string = spine_data.bones._keys[blender.bone_index];
///const bone: Spine.Bone | undefined = spine_data.bones.get(bone_key);
const bone: Spine.Bone | undefined = spine_data.bones.getByIndex(blender.bone_index);
const blend_position: Spine.Vector = new Spine.Vector();
blend_position.x = ffd_keyframe.vertices[ffd_index - ffd_keyframe.offset] || 0; ++ffd_index;
blend_position.y = ffd_keyframe.vertices[ffd_index - ffd_keyframe.offset] || 0; ++ffd_index;
Expand Down Expand Up @@ -528,7 +532,8 @@ class RenderWeightedMeshAttachment implements RenderAttachment {
for (let index: number = 0; index < blend_bone_index_array.length; ++index) {
if (index < this.render.skin_shader_modelview_count) {
const bone_index: number = blend_bone_index_array[index];
const bone_key: string = spine_pose.bones.keys[bone_index];
///const bone_key: string = spine_pose.bones._keys[bone_index];
const bone_key: string = spine_pose.bones.key(bone_index);
const bone: Spine.Bone | undefined = spine_pose.bones.get(bone_key);
const render_bone: RenderBone | undefined = this.render.bone_map.get(bone_key);
const modelview: Float32Array = this.render.skin_shader_modelview_array.subarray(index * 16, (index + 1) * 16);
Expand Down Expand Up @@ -619,7 +624,7 @@ class RenderVertex {
public type: number; // FLOAT, BYTE, UNSIGNED_BYTE, SHORT, UNSIGNED_SHORT, INT, UNSIGNED_INT
public size: number; // size in elements per vertex
public count: number; // number of vertices
public type_array: RenderVertexType;
public typed_array: RenderVertexType;
public buffer: WebGLBuffer | null;
public buffer_type: number; // ARRAY_BUFFER or ELEMENT_ARRAY_BUFFER
public buffer_draw: number; // STREAM_DRAW, STATIC_DRAW or DYNAMIC_DRAW
Expand Down Expand Up @@ -922,24 +927,24 @@ export function glDropShader(gl: WebGLRenderingContext, shader: RenderShader): v
shader.program = null;
}

export function glMakeVertex(gl: WebGLRenderingContext, type_array: RenderVertexType, size: number, buffer_type: number, buffer_draw: number): RenderVertex {
export function glMakeVertex(gl: WebGLRenderingContext, typed_array: RenderVertexType, size: number, buffer_type: number, buffer_draw: number): RenderVertex {
const vertex: RenderVertex = new RenderVertex();
if (type_array instanceof Float32Array) { vertex.type = gl.FLOAT; }
else if (type_array instanceof Int8Array) { vertex.type = gl.BYTE; }
else if (type_array instanceof Uint8Array) { vertex.type = gl.UNSIGNED_BYTE; }
else if (type_array instanceof Int16Array) { vertex.type = gl.SHORT; }
else if (type_array instanceof Uint16Array) { vertex.type = gl.UNSIGNED_SHORT; }
else if (type_array instanceof Int32Array) { vertex.type = gl.INT; }
else if (type_array instanceof Uint32Array) { vertex.type = gl.UNSIGNED_INT; }
if (typed_array instanceof Float32Array) { vertex.type = gl.FLOAT; }
else if (typed_array instanceof Int8Array) { vertex.type = gl.BYTE; }
else if (typed_array instanceof Uint8Array) { vertex.type = gl.UNSIGNED_BYTE; }
else if (typed_array instanceof Int16Array) { vertex.type = gl.SHORT; }
else if (typed_array instanceof Uint16Array) { vertex.type = gl.UNSIGNED_SHORT; }
else if (typed_array instanceof Int32Array) { vertex.type = gl.INT; }
else if (typed_array instanceof Uint32Array) { vertex.type = gl.UNSIGNED_INT; }
else { vertex.type = gl.NONE; throw new Error(); }
vertex.size = size;
vertex.count = type_array.length / vertex.size;
vertex.type_array = type_array;
vertex.count = typed_array.length / vertex.size;
vertex.typed_array = typed_array;
vertex.buffer = gl.createBuffer();
vertex.buffer_type = buffer_type;
vertex.buffer_draw = buffer_draw;
gl.bindBuffer(vertex.buffer_type, vertex.buffer);
gl.bufferData(vertex.buffer_type, vertex.type_array, vertex.buffer_draw);
gl.bufferData(vertex.buffer_type, vertex.typed_array, vertex.buffer_draw);
return vertex;
}

Expand All @@ -955,7 +960,9 @@ export function glMakeTexture(gl: WebGLRenderingContext, image: HTMLImageElement
const texture: RenderTexture = new RenderTexture();
texture.texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture.texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
if (image) {
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
}
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, min_filter);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, mag_filter);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrap_s);
Expand All @@ -974,7 +981,7 @@ export function glDropTexture(gl: WebGLRenderingContext, texture: RenderTexture)
export function glSetupAttribute(gl: WebGLRenderingContext, shader: RenderShader, format: string, vertex: RenderVertex, count: number = 0): void {
gl.bindBuffer(vertex.buffer_type, vertex.buffer);
if (count > 0) {
const sizeof_vertex: number = vertex.type_array.BYTES_PER_ELEMENT * vertex.size; // in bytes
const sizeof_vertex: number = vertex.typed_array.BYTES_PER_ELEMENT * vertex.size; // in bytes
const stride: number = sizeof_vertex * count;
for (let index: number = 0; index < count; ++index) {
const offset: number = sizeof_vertex * index;
Expand Down
11 changes: 6 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
{
"name": "spine.ts",
"name": "@flyover/spine",
"version": "1.0.0",
"description": "spine.ts",
"main": "index.js",
"types": "index.ts",
"dependencies": {
"@types/systemjs": "^0.19.33",
"plugin-typescript": "^5.3.3",
"systemjs": "^0.20.14",
"typescript": "^2.3.4"
"@types/systemjs": "^0.20.6",
"plugin-typescript": "^8.0.0",
"systemjs": "^0.21.0",
"typescript": "^2.8.1"
},
"devDependencies": {},
"scripts": {
Expand Down
Loading

0 comments on commit 101c541

Please sign in to comment.