yanis/rate
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Svelthree

Browse Source
This commit is contained in:
Kumkwats 2022-09-29 12:18:15 +02:00
parent 9b34ac3012
commit 76e135dad9
5 changed files with 66 additions and 185 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

146
www/package-lock.json generated
View File

@ -9,8 +9,6 @@
"version": "1.0.0",
"license": "ISC",
"dependencies": {
"@threlte/core": "^4.3.2",
"@threlte/extras": "^4.3.0",
"sirv-cli": "^2.0.0",
"three": "^0.145.0"
},
@ -28,6 +26,7 @@
"svelte": "^3.0.0",
"svelte-check": "^2.0.0",
"svelte-preprocess": "^4.0.0",
"svelthree": "^0.119.0-5",
"tslib": "^2.0.0",
"typescript": "^4.0.0"
}
@ -252,19 +251,6 @@
"integrity": "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==",
"dev": true
},
"node_modules/@threlte/core": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/@threlte/core/-/core-4.3.2.tgz",
"integrity": "sha512-CiXT8CCpqxg0Ss15xn2fpJtMGtXxH1hKjhkf/zfETdU/ZtkuPSMQxnuE7exnXMySHsccmyGH66o1cgKZZ1UE4A=="
},
"node_modules/@threlte/extras": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/@threlte/extras/-/extras-4.3.0.tgz",
"integrity": "sha512-9C6A+dGuaL0AWfxfARAa7Y07khAtfZQ5a3tkd+lbJLhIjO0XO6ESKTXfPJlRPurUPS7Tlmuu+Uw/xo3QlbZ2/g==",
"dependencies": {
"troika-three-text": "^0.46.4"
}
},
"node_modules/@tsconfig/svelte": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-2.0.1.tgz",
@ -365,14 +351,6 @@
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
"dev": true
},
"node_modules/bidi-js": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.2.tgz",
"integrity": "sha512-rzSy/k7WdX5zOyeHHCOixGXbCHkyogkxPKL2r8QtzHmVQDiWCXUWa18bLdMWT9CYMLOYTjWpTHawuev2ouYJVw==",
"dependencies": {
"require-from-string": "^2.0.2"
}
},
"node_modules/binary-extensions": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@ -1075,14 +1053,6 @@
"node": ">=8.10.0"
}
},
"node_modules/require-from-string": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
"integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/require-relative": {
"version": "0.8.7",
"resolved": "https://registry.npmjs.org/require-relative/-/require-relative-0.8.7.tgz",
@ -1529,6 +1499,21 @@
}
}
},
"node_modules/svelthree": {
"version": "0.119.0-5",
"resolved": "https://registry.npmjs.org/svelthree/-/svelthree-0.119.0-5.tgz",
"integrity": "sha512-5niteQrl5l7evhSSkfcf/I8FSccZD39kLnEZBKmnSJYwUon87fDnO8+maOzxcFBaWEOM1RdRcGy9J0LdXbLfrQ==",
"dev": true,
"dependencies": {
"svelthree-three": "git+https://github.com/vatro/svelthree-three.git#119"
}
},
"node_modules/svelthree-three": {
"version": "0.119.1",
"resolved": "git+ssh://git@github.com/vatro/svelthree-three.git#3a0c78631b9382179828c1ace0edb83df541a6a1",
"dev": true,
"license": "MIT"
},
"node_modules/terser": {
"version": "5.15.0",
"resolved": "https://registry.npmjs.org/terser/-/terser-5.15.0.tgz",
@ -1580,33 +1565,6 @@
"node": ">=6"
}
},
"node_modules/troika-three-text": {
"version": "0.46.4",
"resolved": "https://registry.npmjs.org/troika-three-text/-/troika-three-text-0.46.4.tgz",
"integrity": "sha512-Qsv0HhUKTZgSmAJs5wvO7YlBoJSP9TGPLmrg+K9pbQq4lseQdcevbno/WI38bwJBZ/qS56hvfqEzY0zUEFzDIw==",
"dependencies": {
"bidi-js": "^1.0.2",
"troika-three-utils": "^0.46.0",
"troika-worker-utils": "^0.46.0",
"webgl-sdf-generator": "1.1.1"
},
"peerDependencies": {
"three": ">=0.103.0"
}
},
"node_modules/troika-three-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-three-utils/-/troika-three-utils-0.46.0.tgz",
"integrity": "sha512-llHyrXAcwzr0bpg80GxsIp73N7FuImm4WCrKDJkAqcAsWmE5pfP9+Qzw+oMWK1P/AdHQ79eOrOl9NjyW4aOw0w==",
"peerDependencies": {
"three": ">=0.103.0"
}
},
"node_modules/troika-worker-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-worker-utils/-/troika-worker-utils-0.46.0.tgz",
"integrity": "sha512-bzOx5f2ZBxkFhXtIvDJlLn2AI3bzCkGVbCndl/2dL5QZrwHEKl45OEIilCxYQQWJG1rEbOD9O80tMjoYjw19OA=="
},
"node_modules/tslib": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
@ -1626,11 +1584,6 @@
"node": ">=4.2.0"
}
},
"node_modules/webgl-sdf-generator": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/webgl-sdf-generator/-/webgl-sdf-generator-1.1.1.tgz",
"integrity": "sha512-9Z0JcMTFxeE+b2x1LJTdnaT8rT8aEp7MVxkNwoycNmJWwPdzoXzMh0BjJSh/AEFP+KPYZUli814h8bJZFIZ2jA=="
},
"node_modules/wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
@ -1824,19 +1777,6 @@
}
}
},
"@threlte/core": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/@threlte/core/-/core-4.3.2.tgz",
"integrity": "sha512-CiXT8CCpqxg0Ss15xn2fpJtMGtXxH1hKjhkf/zfETdU/ZtkuPSMQxnuE7exnXMySHsccmyGH66o1cgKZZ1UE4A=="
},
"@threlte/extras": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/@threlte/extras/-/extras-4.3.0.tgz",
"integrity": "sha512-9C6A+dGuaL0AWfxfARAa7Y07khAtfZQ5a3tkd+lbJLhIjO0XO6ESKTXfPJlRPurUPS7Tlmuu+Uw/xo3QlbZ2/g==",
"requires": {
"troika-three-text": "^0.46.4"
}
},
"@tsconfig/svelte": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-2.0.1.tgz",
@ -1925,14 +1865,6 @@
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
"dev": true
},
"bidi-js": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.2.tgz",
"integrity": "sha512-rzSy/k7WdX5zOyeHHCOixGXbCHkyogkxPKL2r8QtzHmVQDiWCXUWa18bLdMWT9CYMLOYTjWpTHawuev2ouYJVw==",
"requires": {
"require-from-string": "^2.0.2"
}
},
"binary-extensions": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@ -2467,11 +2399,6 @@
"picomatch": "^2.2.1"
}
},
"require-from-string": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
"integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="
},
"require-relative": {
"version": "0.8.7",
"resolved": "https://registry.npmjs.org/require-relative/-/require-relative-0.8.7.tgz",
@ -2756,6 +2683,20 @@
"strip-indent": "^3.0.0"
}
},
"svelthree": {
"version": "0.119.0-5",
"resolved": "https://registry.npmjs.org/svelthree/-/svelthree-0.119.0-5.tgz",
"integrity": "sha512-5niteQrl5l7evhSSkfcf/I8FSccZD39kLnEZBKmnSJYwUon87fDnO8+maOzxcFBaWEOM1RdRcGy9J0LdXbLfrQ==",
"dev": true,
"requires": {
"svelthree-three": "git+https://github.com/vatro/svelthree-three.git#119"
}
},
"svelthree-three": {
"version": "git+ssh://git@github.com/vatro/svelthree-three.git#3a0c78631b9382179828c1ace0edb83df541a6a1",
"dev": true,
"from": "svelthree-three@git+https://github.com/vatro/svelthree-three.git#119"
},
"terser": {
"version": "5.15.0",
"resolved": "https://registry.npmjs.org/terser/-/terser-5.15.0.tgz",
@ -2792,28 +2733,6 @@
"resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.0.tgz",
"integrity": "sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw=="
},
"troika-three-text": {
"version": "0.46.4",
"resolved": "https://registry.npmjs.org/troika-three-text/-/troika-three-text-0.46.4.tgz",
"integrity": "sha512-Qsv0HhUKTZgSmAJs5wvO7YlBoJSP9TGPLmrg+K9pbQq4lseQdcevbno/WI38bwJBZ/qS56hvfqEzY0zUEFzDIw==",
"requires": {
"bidi-js": "^1.0.2",
"troika-three-utils": "^0.46.0",
"troika-worker-utils": "^0.46.0",
"webgl-sdf-generator": "1.1.1"
}
},
"troika-three-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-three-utils/-/troika-three-utils-0.46.0.tgz",
"integrity": "sha512-llHyrXAcwzr0bpg80GxsIp73N7FuImm4WCrKDJkAqcAsWmE5pfP9+Qzw+oMWK1P/AdHQ79eOrOl9NjyW4aOw0w==",
"requires": {}
},
"troika-worker-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-worker-utils/-/troika-worker-utils-0.46.0.tgz",
"integrity": "sha512-bzOx5f2ZBxkFhXtIvDJlLn2AI3bzCkGVbCndl/2dL5QZrwHEKl45OEIilCxYQQWJG1rEbOD9O80tMjoYjw19OA=="
},
"tslib": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
@ -2826,11 +2745,6 @@
"integrity": "sha512-goMHfm00nWPa8UvR/CPSvykqf6dVV8x/dp0c5mFTMTIu0u0FlGWRioyy7Nn0PGAdHxpJZnuO/ut+PpQ8UiHAig==",
"dev": true
},
"webgl-sdf-generator": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/webgl-sdf-generator/-/webgl-sdf-generator-1.1.1.tgz",
"integrity": "sha512-9Z0JcMTFxeE+b2x1LJTdnaT8rT8aEp7MVxkNwoycNmJWwPdzoXzMh0BjJSh/AEFP+KPYZUli814h8bJZFIZ2jA=="
},
"wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",

7
www/package.json
View File

@ -6,8 +6,8 @@
"private": true,
"scripts": {
"build": "rollup -c",
"dev": "rollup -c -w",
"start": "sirv public --no-clear",
"dev": "rollup -c -w ",
"start": "sirv public --no-clear --host",
"check": "svelte-check --tsconfig ./tsconfig.json"
},
"devDependencies": {
@ -24,12 +24,11 @@
"svelte": "^3.0.0",
"svelte-check": "^2.0.0",
"svelte-preprocess": "^4.0.0",
"svelthree": "^0.119.0-5",
"tslib": "^2.0.0",
"typescript": "^4.0.0"
},
"dependencies": {
"@threlte/core": "^4.3.2",
"@threlte/extras": "^4.3.0",
"sirv-cli": "^2.0.0",
"three": "^0.145.0"
},

5
www/rollup.config.js
View File

@ -63,10 +63,7 @@ export default {
commonjs(),
typescript({
sourceMap: !production,
inlineSources: !production,
compilerOptions: {
module: 'commonjs'
}
inlineSources: !production
}),
// In dev mode, call `npm run start` once

89
www/src/components/test3D.svelte
View File

@ -1,70 +1,43 @@
<script>
import {
CircleBufferGeometry,
MeshStandardMaterial,
BoxBufferGeometry,
DoubleSide,
} from "three";
import { DEG2RAD } from "three/src/math/MathUtils";
import {
AmbientLight,
Canvas,
DirectionalLight,
Group,
HemisphereLight,
Mesh,
OrbitControls,
Scene,
PerspectiveCamera,
} from "@threlte/core";
import { spring } from "svelte/motion";
DirectionalLight,
AmbientLight,
BoxBufferGeometry,
Mesh,
MeshStandardMaterial,
WebGLRenderer,
} from 'svelthree';
const scale = spring(1);
let cubeGeometry = new BoxBufferGeometry(1, 1, 1);
let cubeMaterial = new MeshStandardMaterial();
</script>
<div>
<Canvas>
<PerspectiveCamera position={{ x: 10, y: 10, z: 10 }} fov={24}>
<OrbitControls
maxPolarAngle={DEG2RAD * 80}
autoRotate={false}
enableZoom={false}
target={{ y: 0.5 }}
/>
</PerspectiveCamera>
<Canvas let:sti w={500} h={500}>
<DirectionalLight shadow position={{ x: 3, y: 10, z: 10 }} />
<DirectionalLight position={{ x: -3, y: 10, z: -10 }} intensity={0.2} />
<AmbientLight intensity={0.2} />
<Scene {sti} let:scene id="scene1" props={{ background: 0xedf2f7 }}>
<!-- Cube -->
<Group scale={$scale}>
<Mesh
interactive
on:pointerenter={() => ($scale = 2)}
on:pointerleave={() => ($scale = 1)}
position={{ y: 0.5 }}
castShadow
geometry={new BoxBufferGeometry(1, 1, 1)}
material={new MeshStandardMaterial({ color: "#333333" })}
/>
</Group>
<PerspectiveCamera {scene} id="cam1" pos={[0, 0, 3]} lookAt={[0, 0, 0]} />
<AmbientLight {scene} intensity={1.25} />
<DirectionalLight {scene} pos={[3, 3, 3]} />
<!-- Floor -->
<Mesh
receiveShadow
rotation={{ x: -90 * (Math.PI / 180) }}
geometry={new CircleBufferGeometry(3, 72)}
material={new MeshStandardMaterial({
side: DoubleSide,
color: "white",
})}
/>
</Canvas>
</div>
{scene}
geometry={cubeGeometry}
material={cubeMaterial}
mat={{ roughness: 0.5, metalness: 0.5, color: 0xff3e00 }}
pos={[0, 0, 0]}
rot={[0.5, 0.6, 0]}
scale={[1, 1, 1]} />
<style>
div {
height: 100%;
width: 100%;
}
</style>
</Scene>
<WebGLRenderer
{sti}
sceneId="scene1"
camId="cam1"
config={{ antialias: true, alpha: true }} />
</Canvas>

4
www/src/main.ts
View File

@ -2,9 +2,7 @@ import App from './App.svelte';
const app = new App({
target: document.body,
// props: {
// name: 'tout tout le monde'
// }
props: {}
});
export default app;