diff --git a/package-lock.json b/package-lock.json index 819dadf..81d86f6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1064,6 +1064,12 @@ "repeating": "2.0.1" } }, + "diff": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/diff/-/diff-3.4.0.tgz", + "integrity": "sha512-QpVuMTEoJMF7cKzi6bvWhRulU1fZqZnvyVQgNhPaxxuTYwyjn/j1v9falseQ/uXWwPnO56RBfwtg4h/EQXmucA==", + "dev": true + }, "doctrine": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz", @@ -3505,6 +3511,78 @@ "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=", "dev": true }, + "tslib": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.0.tgz", + "integrity": "sha512-f/qGG2tUkrISBlQZEjEqoZ3B2+npJjIf04H1wuAv9iA8i04Icp+61KRXxFdha22670NJopsZCIjhC3SnjPRKrQ==", + "dev": true + }, + "tslint": { + "version": "5.9.1", + "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.9.1.tgz", + "integrity": "sha1-ElX4ej/1frCw4fDmEKi0dIBGya4=", + "dev": true, + "requires": { + "babel-code-frame": "6.26.0", + "builtin-modules": "1.1.1", + "chalk": "2.3.0", + "commander": "2.14.1", + "diff": "3.4.0", + "glob": "7.1.2", + "js-yaml": "3.10.0", + "minimatch": "3.0.4", + "resolve": "1.5.0", + "semver": "5.4.1", + "tslib": "1.9.0", + "tsutils": "2.21.0" + }, + "dependencies": { + "ansi-styles": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz", + "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==", + "dev": true, + "requires": { + "color-convert": "1.9.1" + } + }, + "chalk": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz", + "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==", + "dev": true, + "requires": { + "ansi-styles": "3.2.0", + "escape-string-regexp": "1.0.5", + "supports-color": "4.5.0" + } + }, + "commander": { + "version": "2.14.1", + "resolved": "https://registry.npmjs.org/commander/-/commander-2.14.1.tgz", + "integrity": "sha512-+YR16o3rK53SmWHU3rEM3tPAh2rwb1yPcQX5irVn7mb0gXbwuCCrnkbV5+PBfETdfg1vui07nM6PCG1zndcjQw==", + "dev": true + }, + "supports-color": { + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz", + "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=", + "dev": true, + "requires": { + "has-flag": "2.0.0" + } + } + } + }, + "tsutils": { + "version": "2.21.0", + "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.21.0.tgz", + "integrity": "sha512-zlOHTYtTwvTiKxUyAU8wiKzPpAgwZrGjb7AY18VUlxuCgBiTMVorIl5HjrCT8V64Hm34RI1BZITJMVQpBLMxVg==", + "dev": true, + "requires": { + "tslib": "1.9.0" + } + }, "type-check": { "version": "0.3.2", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz", @@ -3520,6 +3598,12 @@ "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=", "dev": true }, + "typescript": { + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.7.1.tgz", + "integrity": "sha512-bqB1yS6o9TNA9ZC/MJxM0FZzPnZdtHj0xWK/IZ5khzVqdpGul/R/EIiHRgFXlwTD7PSIaYVnGKq1QgMCu2mnqw==", + "dev": true + }, "uglify-es": { "version": "3.3.9", "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.9.tgz", diff --git a/package.json b/package.json index 38b775e..1dc5496 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ "scripts": { "build": "rollup -c tools/rollup.module.js && rollup -c tools/rollup.browser.js && rollup -c tools/rollup.browser.min.js", "prepare": "npm test && rm -rf build && npm run build", - "test": "eslint src/** tools/**" + "test": "eslint src/** tools/** && tslint -c tslint.json types/**.ts" }, "repository": { "type": "git", @@ -33,6 +33,8 @@ "rollup-plugin-babel": "^3.0.3", "rollup-plugin-node-resolve": "^3.0.2", "rollup-plugin-uglify": "^3.0.0", + "tslint": "^5.9.1", + "typescript": "^2.7.1", "uglify-es": "^3.3.9" } } diff --git a/src/model.js b/src/model.js index 012c630..6536fe5 100644 --- a/src/model.js +++ b/src/model.js @@ -36,9 +36,11 @@ function addVertices(box, top, bottom, left, front, right, back) { const esp = 0.002; class SkinObject extends THREE.Group { - constructor(isSlim, layer1Material, layer2Material) { + constructor(slim, layer1Material, layer2Material) { super(); + this.slim = slim; + // Head this.head = new THREE.Group(); @@ -105,8 +107,8 @@ class SkinObject extends THREE.Group { this.rightArm = new THREE.Group(); let rightArmPivot = new THREE.Group(); - let rightArmBox = new THREE.BoxGeometry((isSlim ? 3 : 4) - esp, 12 - esp, 4 - esp, 0, 0, 0); - if (isSlim) { + let rightArmBox = new THREE.BoxGeometry((slim ? 3 : 4) - esp, 12 - esp, 4 - esp, 0, 0, 0); + if (slim) { addVertices(rightArmBox, toSkinVertices(44, 16, 47, 20), toSkinVertices(47, 16, 50, 20), @@ -128,8 +130,8 @@ class SkinObject extends THREE.Group { let rightArmMesh = new THREE.Mesh(rightArmBox, layer1Material); rightArmPivot.add(rightArmMesh); - let rightArm2Box = new THREE.BoxGeometry((isSlim ? 3.375 : 4.5) - esp, 13.5 - esp, 4.5 - esp, 0, 0, 0); - if (isSlim) { + let rightArm2Box = new THREE.BoxGeometry((slim ? 3.375 : 4.5) - esp, 13.5 - esp, 4.5 - esp, 0, 0, 0); + if (slim) { addVertices(rightArm2Box, toSkinVertices(44, 32, 47, 36), toSkinVertices(47, 32, 50, 36), @@ -155,7 +157,7 @@ class SkinObject extends THREE.Group { rightArmPivot.position.y = -6; this.rightArm.add(rightArmPivot); this.rightArm.position.y = -4; - this.rightArm.position.x = isSlim ? -5.5 : -6; + this.rightArm.position.x = slim ? -5.5 : -6; this.add(this.rightArm); @@ -163,8 +165,8 @@ class SkinObject extends THREE.Group { this.leftArm = new THREE.Group(); let leftArmPivot = new THREE.Group(); - let leftArmBox = new THREE.BoxGeometry((isSlim ? 3 : 4) - esp, 12 - esp, 4 - esp, 0, 0, 0); - if (isSlim) { + let leftArmBox = new THREE.BoxGeometry((slim ? 3 : 4) - esp, 12 - esp, 4 - esp, 0, 0, 0); + if (slim) { addVertices(leftArmBox, toSkinVertices(36, 48, 39, 52), toSkinVertices(39, 48, 42, 52), @@ -186,8 +188,8 @@ class SkinObject extends THREE.Group { let leftArmMesh = new THREE.Mesh(leftArmBox, layer1Material); leftArmPivot.add(leftArmMesh); - let leftArm2Box = new THREE.BoxGeometry((isSlim ? 3.375 : 4.5) - esp, 13.5 - esp, 4.5 - esp, 0, 0, 0); - if (isSlim) { + let leftArm2Box = new THREE.BoxGeometry((slim ? 3.375 : 4.5) - esp, 13.5 - esp, 4.5 - esp, 0, 0, 0); + if (slim) { addVertices(leftArm2Box, toSkinVertices(52, 48, 55, 52), toSkinVertices(55, 48, 58, 52), @@ -213,7 +215,7 @@ class SkinObject extends THREE.Group { leftArmPivot.position.y = -6; this.leftArm.add(leftArmPivot); this.leftArm.position.y = -4; - this.leftArm.position.x = isSlim ? 5.5 : 6; + this.leftArm.position.x = slim ? 5.5 : 6; this.add(this.leftArm); @@ -315,8 +317,6 @@ class PlayerObject extends THREE.Group { constructor(slim, layer1Material, layer2Material, capeMaterial) { super(); - this.slim = slim; - this.skin = new SkinObject(slim, layer1Material, layer2Material); this.skin.visible = false; this.add(this.skin); diff --git a/src/skinview3d.js b/src/skinview3d.js index cffcaab..b6d47d2 100644 --- a/src/skinview3d.js +++ b/src/skinview3d.js @@ -25,4 +25,4 @@ export { SkinObject, CapeObject, PlayerObject } from "./model"; export { SkinViewer, SkinControl } from "./viewer"; -export { CompositeAnimation, WalkAnimation } from "./animation"; +export { invokeAnimation, CompositeAnimation, WalkAnimation } from "./animation"; diff --git a/tslint.json b/tslint.json new file mode 100644 index 0000000..d688899 --- /dev/null +++ b/tslint.json @@ -0,0 +1,21 @@ +{ + "defaultSeverity": "error", + "extends": [ + "tslint:latest" + ], + "jsRules": {}, + "rules": { + "indent": [ + true, + "tabs" + ], + "eofline": true, + "linebreak-style": [ + true, + "LF" + ], + "max-classes-per-file": false, + "interface-name": false + }, + "rulesDirectory": [] +} diff --git a/types/animation.d.ts b/types/animation.d.ts index 7d410ab..8fa4d62 100644 --- a/types/animation.d.ts +++ b/types/animation.d.ts @@ -1,37 +1,31 @@ -import { PlayerObject } from './model' +import { PlayerObject } from "./model"; -type AnimationFn = (player: PlayerObject, time: number) => void -interface IAnimation { - play(player: PlayerObject, time: number): void +export interface IAnimation { + play(player: PlayerObject, time: number): void; } -export type Animation = AnimationFn | IAnimation +export type AnimationFn = (player: PlayerObject, time: number) => void; +export type Animation = AnimationFn | IAnimation; -declare function invokeAnimation( - animation: Animation, - player: PlayerObject, - time: number -): void +export function invokeAnimation( + animation: Animation, + player: PlayerObject, + time: number, +): void; -declare class AnimationHandle implements IAnimation { - readonly animation: Animation - paused: boolean - speed: number +export interface AnimationHandle extends IAnimation { + readonly animation: Animation; + paused: boolean; + speed: number; - constructor(animation: Animation) - - play(player: PlayerObject, time: number): void - - reset(): void + reset(): void; } export class CompositeAnimation implements IAnimation { - private handles: Set + constructor(); - constructor() + public add(animation: Animation): AnimationHandle; - add(animation: Animation): AnimationHandle - - play(player: PlayerObject, time: number): void + public play(player: PlayerObject, time: number): void; } -export const WalkAnimation: AnimationFn +export const WalkAnimation: AnimationFn; diff --git a/types/model.d.ts b/types/model.d.ts index 5a48b3c..122170e 100644 --- a/types/model.d.ts +++ b/types/model.d.ts @@ -1,35 +1,35 @@ -import * as THREE from 'three' +import * as THREE from "three"; export class SkinObject extends THREE.Group { - readonly head: THREE.Group - readonly body: THREE.Group - readonly rightArm: THREE.Group - readonly leftArm: THREE.Group - readonly rightLeg: THREE.Group - readonly leftLeg: THREE.Group + public readonly slim: boolean; + public readonly head: THREE.Group; + public readonly body: THREE.Group; + public readonly rightArm: THREE.Group; + public readonly leftArm: THREE.Group; + public readonly rightLeg: THREE.Group; + public readonly leftLeg: THREE.Group; - constructor( - isSlim: boolean, - layer1Material: THREE.Material, - layer2Material: THREE.Material - ) + constructor( + slim: boolean, + layer1Material: THREE.Material, + layer2Material: THREE.Material, + ); } export class CapeObject extends THREE.Group { - readonly cape: THREE.Mesh + public readonly cape: THREE.Mesh; - constructor(capeMaterial: THREE.Material) + constructor(capeMaterial: THREE.Material); } export class PlayerObject extends THREE.Group { - readonly slim: boolean - readonly skin: SkinObject - readonly cape: CapeObject + public readonly skin: SkinObject; + public readonly cape: CapeObject; - constructor( - isSlim: boolean, - layer1Material: THREE.Material, - layer2Material: THREE.Material, - capeMaterial: THREE.Material - ) + constructor( + slim: boolean, + layer1Material: THREE.Material, + layer2Material: THREE.Material, + capeMaterial: THREE.Material, + ); } diff --git a/types/skinview3d.d.ts b/types/skinview3d.d.ts index c6c854b..43581bc 100644 --- a/types/skinview3d.d.ts +++ b/types/skinview3d.d.ts @@ -1,11 +1,3 @@ -export { - CompositeAnimation, - WalkAnimation, - Animation, - AnimationFn, - IAnimation -} from './animation' - -export { SkinViewer, SkinControl } from './viewer' - -export { SkinObject, CapeObject, PlayerObject } from './model' +export * from "./model"; +export * from "./animation"; +export * from "./viewer"; diff --git a/types/viewer.d.ts b/types/viewer.d.ts index 1eb5ee9..f4bafd6 100644 --- a/types/viewer.d.ts +++ b/types/viewer.d.ts @@ -1,45 +1,44 @@ -import * as THREE from 'three' -import { CompositeAnimation, WalkAnimation } from './animation' -import { Animation } from './animation' -import { PlayerObject } from './model' +import * as THREE from "three"; +import { Animation } from "./animation"; +import { PlayerObject } from "./model"; -interface SkinViewerOptions { - domElement: Element - animation?: Animation - slim?: boolean - skinUrl?: string - capeUrl?: string - width?: number - height?: number +export interface SkinViewerOptions { + domElement: Node; + animation?: Animation; + slim?: boolean; + skinUrl?: string; + capeUrl?: string; + width?: number; + height?: number; } export class SkinViewer { - skinUrl: string - capeUrl: string - width: number - height: number - readonly domElement: Element - animation: Animation - animationPaused: boolean - animationTime: number - readonly playerObject: PlayerObject - readonly disposed: boolean - readonly camera: THREE.Camera - readonly renderer: THREE.Renderer - readonly scene: THREE.Scene + public readonly domElement: Node; + public readonly disposed: boolean; + public width: number; + public height: number; + public skinUrl: string; + public capeUrl: string; + public animation: Animation; + public animationPaused: boolean; + public animationTime: number; + public readonly playerObject: PlayerObject; + public readonly scene: THREE.Scene; + public readonly camera: THREE.PerspectiveCamera; + public readonly renderer: THREE.Renderer; - constructor(options: SkinViewerOptions) + constructor(options: SkinViewerOptions); - setSize(width: number, height: number): void + public setSize(width: number, height: number): void; - dispose(): void + public dispose(): void; } export class SkinControl { - enableAnimationControl: boolean - readonly skinViewer: SkinViewer + public enableAnimationControl: boolean; + public readonly skinViewer: SkinViewer; - constructor(skinViewer: SkinViewer) + constructor(skinViewer: SkinViewer); - dispose(): void + public dispose(): void; }