skinview3d - npm Package Compare versions

Comparing version 3.0.0 to 3.0.1

libs/animation.js

@@ -175,12 +175,12 @@ import { PlayerObject } from "./model.js";
         const startProgress = clamp((t * t) / 100, 0, 1);
-        player.rotation.x = startProgress * Math.PI / 2;
-        player.skin.head.rotation.x = startProgress > .5 ? Math.PI / 4 - player.rotation.x : 0;
-        const basicArmRotationZ = Math.PI * .25 * startProgress;
+        player.rotation.x = (startProgress * Math.PI) / 2;
+        player.skin.head.rotation.x = startProgress > 0.5 ? Math.PI / 4 - player.rotation.x : 0;
+        const basicArmRotationZ = Math.PI * 0.25 * startProgress;
         player.skin.leftArm.rotation.z = basicArmRotationZ;
         player.skin.rightArm.rotation.z = -basicArmRotationZ;
-        const elytraRotationX = .34906584;
+        const elytraRotationX = 0.34906584;
         const elytraRotationZ = Math.PI / 2;
-        const interpolation = Math.pow(.9, t);
-        player.elytra.leftWing.rotation.x = elytraRotationX + interpolation * (.2617994 - elytraRotationX);
-        player.elytra.leftWing.rotation.z = elytraRotationZ + interpolation * (.2617994 - elytraRotationZ);
+        const interpolation = Math.pow(0.9, t);
+        player.elytra.leftWing.rotation.x = elytraRotationX + interpolation * (0.2617994 - elytraRotationX);
+        player.elytra.leftWing.rotation.z = elytraRotationZ + interpolation * (0.2617994 - elytraRotationZ);
         player.elytra.updateRightWing();
@@ -187,0 +187,0 @@ }

libs/model.js

@@ -1,2 +0,2 @@
-import { BoxGeometry, BufferAttribute, DoubleSide, FrontSide, Group, Mesh, MeshStandardMaterial, Object3D, Texture, Vector2 } from "three";
+import { BoxGeometry, BufferAttribute, DoubleSide, FrontSide, Group, Mesh, MeshStandardMaterial, Object3D, Texture, Vector2, } from "three";
 function setUVs(box, u, v, width, height, depth, textureWidth, textureHeight) {
@@ -7,3 +7,3 @@ const toFaceVertices = (x1, y1, x2, y2) => [
         new Vector2(x2 / textureWidth, 1.0 - y1 / textureHeight),
-        new Vector2(x1 / textureWidth, 1.0 - y1 / textureHeight)
+        new Vector2(x1 / textureWidth, 1.0 - y1 / textureHeight),
     ];
@@ -17,10 +17,17 @@ const top = toFaceVertices(u + depth, v, u + width + depth, v + depth);
     const uvAttr = box.attributes.uv;
-    uvAttr.copyVector2sArray([
-        right[3], right[2], right[0], right[1],
-        left[3], left[2], left[0], left[1],
-        top[3], top[2], top[0], top[1],
-        bottom[0], bottom[1], bottom[3], bottom[2],
-        front[3], front[2], front[0], front[1],
-        back[3], back[2], back[0], back[1]
-    ]);
+    const uvRight = [right[3], right[2], right[0], right[1]];
+    const uvLeft = [left[3], left[2], left[0], left[1]];
+    const uvTop = [top[3], top[2], top[0], top[1]];
+    const uvBottom = [bottom[0], bottom[1], bottom[3], bottom[2]];
+    const uvFront = [front[3], front[2], front[0], front[1]];
+    const uvBack = [back[3], back[2], back[0], back[1]];
+    // Create a new array to hold the modified UV data
+    const newUVData = [];
+    // Iterate over the arrays and copy the data to uvData
+    for (const uvArray of [uvRight, uvLeft, uvTop, uvBottom, uvFront, uvBack]) {
+        for (const uv of uvArray) {
+            newUVData.push(uv.x, uv.y);
+        }
+    }
+    uvAttr.set(new Float32Array(newUVData));
     uvAttr.needsUpdate = true;
@@ -139,3 +146,3 @@ }
         this.layer1Material = new MeshStandardMaterial({
-            side: FrontSide
+            side: FrontSide,
         });
@@ -145,3 +152,3 @@ this.layer2Material = new MeshStandardMaterial({
             transparent: true,
-            alphaTest: 1e-5
+            alphaTest: 1e-5,
         });
@@ -201,3 +208,3 @@ this.layer1MaterialBiased = this.layer1Material.clone();
         this.modelListeners.push(() => {
-            rightArmPivot.position.x = this.slim ? -.5 : -1;
+            rightArmPivot.position.x = this.slim ? -0.5 : -1;
         });
@@ -255,3 +262,3 @@ rightArmPivot.position.y = -4;
         this.rightLeg.position.y = -12;
-        this.rightLeg.position.z = -.1;
+        this.rightLeg.position.z = -0.1;
         this.add(this.rightLeg);
@@ -273,3 +280,3 @@ // Left Leg
         this.leftLeg.position.y = -12;
-        this.leftLeg.position.z = -.1;
+        this.leftLeg.position.z = -0.1;
         this.add(this.leftLeg);
@@ -303,6 +310,6 @@ this.modelType = "default";
     setInnerLayerVisible(value) {
-        this.getBodyParts().forEach(part => part.innerLayer.visible = value);
+        this.getBodyParts().forEach(part => (part.innerLayer.visible = value));
     }
     setOuterLayerVisible(value) {
-        this.getBodyParts().forEach(part => part.outerLayer.visible = value);
+        this.getBodyParts().forEach(part => (part.outerLayer.visible = value));
     }
@@ -335,3 +342,3 @@ resetJoints() {
             transparent: true,
-            alphaTest: 1e-5
+            alphaTest: 1e-5,
         });
@@ -344,3 +351,3 @@ // +z (front) - inside of cape
         this.cape.position.y = -8;
-        this.cape.position.z = .5;
+        this.cape.position.z = 0.5;
         this.add(this.cape);
@@ -380,3 +387,3 @@ }
             transparent: true,
-            alphaTest: 1e-5
+            alphaTest: 1e-5,
         });
@@ -403,8 +410,8 @@ const leftWingBox = new BoxGeometry(12, 22, 4);
         this.leftWing.position.x = 5;
-        this.leftWing.rotation.x = .2617994;
+        this.leftWing.rotation.x = 0.2617994;
         this.resetJoints();
     }
     resetJoints() {
-        this.leftWing.rotation.y = .01; // to avoid z-fighting
-        this.leftWing.rotation.z = .2617994;
+        this.leftWing.rotation.y = 0.01; // to avoid z-fighting
+        this.leftWing.rotation.z = 0.2617994;
         this.updateRightWing();
@@ -453,3 +460,3 @@ }
         this.material = new MeshStandardMaterial({
-            side: FrontSide
+            side: FrontSide,
         });
@@ -475,3 +482,3 @@ const earBox = new BoxGeometry(8, 8, 4 / 3);
 }
-const CapeDefaultAngle = 10.8 * Math.PI / 180;
+const CapeDefaultAngle = (10.8 * Math.PI) / 180;
 export class PlayerObject extends Group {
@@ -478,0 +485,0 @@ constructor() {

libs/nametag.js

@@ -9,3 +9,3 @@ import { CanvasTexture, NearestFilter, Sprite, SpriteMaterial } from "three";
             transparent: true,
-            alphaTest: 1e-5
+            alphaTest: 1e-5,
         });
@@ -104,3 +104,4 @@ super(material);
         canvas.width = this.margin[3] + metrics.actualBoundingBoxLeft + metrics.actualBoundingBoxRight + this.margin[1];
-        canvas.height = this.margin[0] + metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent + this.margin[2];
+        canvas.height =
+            this.margin[0] + metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent + this.margin[2];
         // After change canvas size, the context needs to be re-created
@@ -123,3 +124,3 @@ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         // Update size
-        this.scale.x = canvas.width / canvas.height * this.height;
+        this.scale.x = (canvas.width / canvas.height) * this.height;
         this.scale.y = this.height;
@@ -126,0 +127,0 @@ }

libs/viewer.d.ts

 import { type ModelType, type RemoteImage, type TextureSource } from "skinview-utils";
-import { Color, type ColorRepresentation, PointLight, Group, PerspectiveCamera, Scene, Texture, WebGLRenderer, AmbientLight, Mapping } from "three";
+import { Color, type ColorRepresentation, PointLight, Group, PerspectiveCamera, Scene, Texture, WebGLRenderer, AmbientLight, type Mapping } from "three";
 import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
@@ -273,5 +273,5 @@ import { EffectComposer } from "three/examples/jsm/postprocessing/EffectComposer.js";
     /**
-    * Renders the scene to the canvas.
-    * This method does not change the animation progress.
-    */
+     * Renders the scene to the canvas.
+     * This method does not change the animation progress.
+     */
     render(): void;
@@ -278,0 +278,0 @@ setSize(width: number, height: number): void;

libs/viewer.js

@@ -1,5 +0,6 @@
-import { inferModelType, isTextureSource, loadCapeToCanvas, loadEarsToCanvas, loadEarsToCanvasFromSkin, loadImage, loadSkinToCanvas } from "skinview-utils";
-import { Color, PointLight, EquirectangularReflectionMapping, Group, NearestFilter, PerspectiveCamera, Scene, Texture, Vector2, WebGLRenderer, AmbientLight, Mapping, CanvasTexture, WebGLRenderTarget, FloatType, DepthTexture, Clock, Object3D } from "three";
+import { inferModelType, isTextureSource, loadCapeToCanvas, loadEarsToCanvas, loadEarsToCanvasFromSkin, loadImage, loadSkinToCanvas, } from "skinview-utils";
+import { Color, PointLight, EquirectangularReflectionMapping, Group, NearestFilter, PerspectiveCamera, Scene, Texture, Vector2, WebGLRenderer, AmbientLight, CanvasTexture, WebGLRenderTarget, FloatType, DepthTexture, Clock, Object3D, } from "three";
 import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
-import { EffectComposer, FullScreenQuad } from "three/examples/jsm/postprocessing/EffectComposer.js";
+import { EffectComposer } from "three/examples/jsm/postprocessing/EffectComposer.js";
+import { FullScreenQuad } from "three/examples/jsm/postprocessing/Pass.js";
 import { RenderPass } from "three/examples/jsm/postprocessing/RenderPass.js";
@@ -77,3 +78,3 @@ import { ShaderPass } from "three/examples/jsm/postprocessing/ShaderPass.js";
             writable: true,
-            value: new AmbientLight(0xffffff, 0.4)
+            value: new AmbientLight(0xffffff, 3)
         });
@@ -252,3 +253,3 @@ Object.defineProperty(this, "cameraLight", {
             canvas: this.canvas,
-            preserveDrawingBuffer: options.preserveDrawingBuffer === true // default: false
+            preserveDrawingBuffer: options.preserveDrawingBuffer === true, // default: false
         });
@@ -280,3 +281,3 @@ this.onDevicePixelRatioChange = () => {
             renderTarget = new WebGLRenderTarget(0, 0, {
-                depthTexture: new DepthTexture(0, 0, FloatType)
+                depthTexture: new DepthTexture(0, 0, FloatType),
             });
@@ -306,3 +307,3 @@ }
                 model: options.model,
-                ears: options.ears === "current-skin"
+                ears: options.ears === "current-skin",
             });
@@ -315,3 +316,3 @@ }
             this.loadEars(options.ears.source, {
-                textureType: options.ears.textureType
+                textureType: options.ears.textureType,
             });
@@ -518,5 +519,5 @@ }
     /**
-    * Renders the scene to the canvas.
-    * This method does not change the animation progress.
-    */
+     * Renders the scene to the canvas.
+     * This method does not change the animation progress.
+     */
     render() {
@@ -570,3 +571,6 @@ this.composer.render();
         }
-        else if (!this._renderPaused && !this._disposed && !this.renderer.getContext().isContextLost() && this.animationID == null) {
+        else if (!this._renderPaused &&
+            !this._disposed &&
+            !this.renderer.getContext().isContextLost() &&
+            this.animationID == null) {
             this.animationID = window.requestAnimationFrame(() => this.draw());
@@ -603,3 +607,3 @@ }
     adjustCameraDistance() {
-        let distance = 4.5 + 16.5 / Math.tan(this.fov / 180 * Math.PI / 2) / this.zoom;
+        let distance = 4.5 + 16.5 / Math.tan(((this.fov / 180) * Math.PI) / 2) / this.zoom;
         // limit distance between 10 ~ 256 (default min / max distance of OrbitControls)
@@ -606,0 +610,0 @@ if (distance < 10) {

package.json

 {
 	"name": "skinview3d",
-	"version": "3.0.0",
+	"version": "3.0.1",
 	"description": "Three.js powered Minecraft skin viewer",
@@ -12,2 +12,3 @@ "main": "libs/skinview3d.js",
 		"build": "npm run build:modules && npm run build:bundles",
+		"format": "prettier src --write",
 		"test:lint": "eslint --ext .ts src",
@@ -27,3 +28,3 @@ "test": "npm run test:lint",
 	"contributors": [
-		"Sean Boult <[e-mail]> (https://github.com/Hacksore)",
+		"Sean Boult <[e-mail]> (https://github.com/Hacksore)",
 		"Pig Fang <[e-mail]> (https://github.com/g-plane)",
@@ -44,8 +45,7 @@ "printempw <[e-mail]> (https://github.com/printempw)",
 	"dependencies": {
-		"@types/three": "^0.142.0",
+		"@types/three": "^0.156.0",
 		"skinview-utils": "^0.7.1",
-		"three": "^0.142.0"
+		"three": "^0.156.1"
 	},
 	"devDependencies": {
-		"@gplane/tsconfig": "^6.0.0",
 		"@rollup/plugin-node-resolve": "^15.0.2",
@@ -60,2 +60,3 @@ "@swc/core": "^1.3.53",
 		"npm-run-all": "^4.1.5",
+		"prettier": "^3.0.3",
 		"rimraf": "^3.0.2",
@@ -62,0 +63,0 @@ "rollup": "^3.20.7",

README.md

@@ -23,2 +23,5 @@ skinview3d
 [Example of using skinview3d](https://bs-community.github.io/skinview3d/)
+
+[![CodeSandbox](https://img.shields.io/badge/Codesandbox-040404?style=for-the-badge&logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/skinview3d-template-vdmuh4)
+
 ```html
@@ -25,0 +28,0 @@ <canvas id="skin_container"></canvas>

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2369937

increased by6.7%

Lines of code

5635

increased by7.19%

Number of lines in readme file

152

increased by2.01%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• + Added@types/stats.js@0.17.3(transitive)

• + Added@types/three@0.156.0(transitive)

• + Addedfflate@0.6.10(transitive)

• + Addedmeshoptimizer@0.18.1(transitive)

• + Addedthree@0.156.1(transitive)

• - Removed@types/three@0.142.0(transitive)

• - Removedthree@0.142.0(transitive)

• Updated@types/three@^0.156.0

• Updatedthree@^0.156.1