Files
storyteller-bevy/studio/assets/gltf/room.gltf
T
Danny McGee cba70a62ae Single-object viewer POC (#14)
This commit implements a Sketchfab-style single-object viewer as a minimal
proof-of-concept.

### `@storyteller/studio-web`
This is a new package to house web components for interfacing with the
`@storyteller/studio` WASM library. It currently includes a single component,
`<sts-viewer />`, which is exported from `@storyteller/studio-web/viewer`.

### `react-frontend`
This is a new application intended as a proof-of-concept and testbed for React
interop with `@storyteller/studio-web`.

Web components are currently a little bit fiddly to use in a React application.
`react-frontend/src/app/studio-viewer.tsx` demonstrates how a React-idiomatic
component can be written as a thin wrapper around a web component, and
`react-frontend/src/app/app.tsx` demonstrates that wrapper component in use.
2023-12-07 15:46:32 -05:00

1155 lines
17 KiB
JSON

{
"asset":{
"generator":"Khronos glTF Blender I/O v3.6.27",
"version":"2.0"
},
"extensionsUsed":[
"KHR_materials_specular",
"KHR_materials_ior",
"KHR_materials_emissive_strength"
],
"scene":0,
"scenes":[
{
"name":"Scene",
"nodes":[
0,
1,
2,
3,
4,
5,
6,
7
]
}
],
"nodes":[
{
"mesh":0,
"name":"Baseboard_East",
"rotation":[
0,
-0.7071067094802856,
0,
0.7071068286895752
],
"translation":[
2.153424024581909,
0.039698000997304916,
-0.4814305007457733
]
},
{
"mesh":1,
"name":"Baseboard_North",
"translation":[
0.24029964208602905,
0.039698000997304916,
-2.394653081893921
]
},
{
"mesh":2,
"name":"Curtain",
"rotation":[
0,
-0.7071067094802856,
0,
0.7071068286895752
],
"scale":[
0.6226665377616882,
0.6226665377616882,
0.6226665377616882
],
"translation":[
2.1330113410949707,
0.4595690965652466,
-1.6383798122406006
]
},
{
"mesh":3,
"name":"Outlet",
"rotation":[
0.7071068286895752,
0,
0,
0.7071068286895752
],
"scale":[
0.04890819638967514,
1,
0.0815136507153511
],
"translation":[
-0.8214811682701111,
0.4262259900569916,
-2.398066759109497
]
},
{
"mesh":4,
"name":"Outlet.001",
"rotation":[
0.5,
-0.5,
0.4999999403953552,
0.5000000596046448
],
"scale":[
0.04890819638967514,
1,
0.0815136507153511
],
"translation":[
2.1570370197296143,
0.4262259900569916,
0.5945216417312622
]
},
{
"mesh":5,
"name":"Room",
"scale":[
0.7999998927116394,
0.7920000553131104,
0.7999998927116394
],
"translation":[
2.159121513366699,
0.006022334098815918,
-2.401069402694702
]
},
{
"mesh":6,
"name":"WindowFrame",
"scale":[
0.800000011920929,
0.800000011920929,
0.800000011920929
],
"translation":[
0.23912161588668823,
0.7980223894119263,
-0.48106950521469116
]
},
{
"mesh":7,
"name":"WindowGlow",
"scale":[
0.11602067947387695,
0.8444026708602905,
0.5314261317253113
],
"translation":[
2.319279670715332,
1.2862733602523804,
-1.6605206727981567
]
}
],
"materials":[
{
"doubleSided":true,
"name":"roomTrim",
"pbrMetallicRoughness":{
"baseColorFactor":[
0.6653817892074585,
0.5798784494400024,
0.8999999761581421,
1
],
"metallicFactor":0,
"roughnessFactor":0.5
}
},
{
"alphaMode":"BLEND",
"doubleSided":true,
"name":"Archisketch_349875_Frame_132x230_butterfly fold",
"normalTexture":{
"index":0
},
"pbrMetallicRoughness":{
"baseColorTexture":{
"index":1
},
"metallicRoughnessTexture":{
"index":2
}
}
},
{
"doubleSided":true,
"name":"Material.005",
"pbrMetallicRoughness":{
"baseColorTexture":{
"index":3
},
"metallicFactor":0,
"roughnessFactor":0.5
}
},
{
"doubleSided":true,
"extensions":{
"KHR_materials_specular":{
"specularColorFactor":[
0,
0,
0
]
},
"KHR_materials_ior":{
"ior":1.4500000476837158
}
},
"name":"Material.001",
"pbrMetallicRoughness":{
"baseColorFactor":[
0.28365927934646606,
0.16648055613040924,
0.11277373135089874,
1
],
"metallicFactor":0,
"roughnessFactor":0.5
}
},
{
"doubleSided":true,
"extensions":{
"KHR_materials_specular":{
"specularColorFactor":[
2.371357614441398,
2.371357614441398,
2.371357614441398
]
},
"KHR_materials_ior":{
"ior":1.4500000476837158
}
},
"name":"Material.002",
"pbrMetallicRoughness":{
"baseColorTexture":{
"index":4
},
"metallicFactor":0,
"roughnessFactor":0.5
}
},
{
"doubleSided":true,
"name":"roomTrim",
"pbrMetallicRoughness":{
"baseColorFactor":[
0.6653817892074585,
0.5798784494400024,
0.8999999761581421,
1
],
"metallicFactor":0,
"roughnessFactor":0.5
}
},
{
"doubleSided":true,
"name":"Material.006",
"pbrMetallicRoughness":{
"baseColorFactor":[
0,
0,
0,
1
],
"metallicFactor":0,
"roughnessFactor":0.5
}
},
{
"doubleSided":true,
"extensions":{
"KHR_materials_specular":{
"specularColorFactor":[
0,
0,
0
]
},
"KHR_materials_ior":{
"ior":1.4500000476837158
}
},
"name":"Material.003",
"pbrMetallicRoughness":{
"baseColorFactor":[
0.011267414316534996,
0.009524816647171974,
0.009296494536101818,
1
],
"metallicFactor":0,
"roughnessFactor":0.7210526466369629
}
},
{
"emissiveFactor":[
1,
0.3515322208404541,
0.1529262363910675
],
"extensions":{
"KHR_materials_emissive_strength":{
"emissiveStrength":15.000001907348633
},
"KHR_materials_specular":{
"specularColorFactor":[
0,
0,
0
]
},
"KHR_materials_ior":{
"ior":1.4500000476837158
}
},
"name":"Material.004",
"pbrMetallicRoughness":{
"baseColorFactor":[
0.03544355928897858,
0.0344034768640995,
0.06072176620364189,
1
],
"metallicFactor":0,
"roughnessFactor":0.5
}
}
],
"meshes":[
{
"name":"Baseboard_East",
"primitives":[
{
"attributes":{
"POSITION":0,
"NORMAL":1,
"TEXCOORD_0":2
},
"indices":3,
"material":0
}
]
},
{
"name":"Baseboard_North",
"primitives":[
{
"attributes":{
"POSITION":4,
"NORMAL":5,
"TEXCOORD_0":6
},
"indices":3,
"material":0
}
]
},
{
"name":"Curtain",
"primitives":[
{
"attributes":{
"POSITION":7,
"NORMAL":8,
"TEXCOORD_0":9
},
"indices":10,
"material":1
}
]
},
{
"name":"Outlet",
"primitives":[
{
"attributes":{
"POSITION":11,
"NORMAL":12,
"TEXCOORD_0":13
},
"indices":14,
"material":2
}
]
},
{
"name":"Outlet.001",
"primitives":[
{
"attributes":{
"POSITION":15,
"NORMAL":16,
"TEXCOORD_0":17
},
"indices":14,
"material":2
}
]
},
{
"name":"Room",
"primitives":[
{
"attributes":{
"POSITION":18,
"NORMAL":19,
"TEXCOORD_0":20
},
"indices":21,
"material":3
},
{
"attributes":{
"POSITION":22,
"NORMAL":23,
"TEXCOORD_0":24
},
"indices":25,
"material":4
},
{
"attributes":{
"POSITION":26,
"NORMAL":27,
"TEXCOORD_0":28
},
"indices":29,
"material":5
},
{
"attributes":{
"POSITION":30,
"NORMAL":31,
"TEXCOORD_0":32
},
"indices":33,
"material":6
}
]
},
{
"name":"WindowFrame",
"primitives":[
{
"attributes":{
"POSITION":34,
"NORMAL":35,
"TEXCOORD_0":36
},
"indices":37,
"material":7
}
]
},
{
"name":"WindowGlow",
"primitives":[
{
"attributes":{
"POSITION":38,
"NORMAL":39,
"TEXCOORD_0":40
},
"indices":41,
"material":8
}
]
}
],
"textures":[
{
"sampler":0,
"source":0
},
{
"sampler":0,
"source":1
},
{
"sampler":0,
"source":2
},
{
"sampler":0,
"source":3
},
{
"sampler":0,
"source":4
}
],
"images":[
{
"mimeType":"image/png",
"name":"archisketch_349875_frame_132x230_butterfly-fold_normal",
"uri":"../textures/archisketch_349875_frame_132x230_butterfly-fold_normal.png"
},
{
"mimeType":"image/png",
"name":"archisketch_349875_frame_132x230_butterfly-fold_basecolor",
"uri":"../textures/archisketch_349875_frame_132x230_butterfly-fold_basecolor.png"
},
{
"mimeType":"image/png",
"name":"archisketch_349875_frame_132x230_butterfly-fold_occlusionroughnessmetallic",
"uri":"../textures/archisketch_349875_frame_132x230_butterfly-fold_occlusionroughnessmetallic.png"
},
{
"mimeType":"image/png",
"name":"standard-us-power-outlet",
"uri":"../textures/standard-us-power-outlet.png"
},
{
"mimeType":"image/png",
"name":"tcom_parquet_m",
"uri":"../textures/tcom_parquet_m.png"
}
],
"accessors":[
{
"bufferView":0,
"componentType":5126,
"count":68,
"max":[
1.920363426208496,
0.053730130195617676,
0.008425231091678143
],
"min":[
-1.9203640222549438,
-0.03378676623106003,
-0.007054212037473917
],
"type":"VEC3"
},
{
"bufferView":1,
"componentType":5126,
"count":68,
"type":"VEC3"
},
{
"bufferView":2,
"componentType":5126,
"count":68,
"type":"VEC2"
},
{
"bufferView":3,
"componentType":5123,
"count":144,
"type":"SCALAR"
},
{
"bufferView":4,
"componentType":5126,
"count":68,
"max":[
1.920363426208496,
0.053730130195617676,
0.008425231091678143
],
"min":[
-1.9203640222549438,
-0.03378676623106003,
-0.007054212037473917
],
"type":"VEC3"
},
{
"bufferView":5,
"componentType":5126,
"count":68,
"type":"VEC3"
},
{
"bufferView":6,
"componentType":5126,
"count":68,
"type":"VEC2"
},
{
"bufferView":7,
"componentType":5126,
"count":36440,
"max":[
0.6971994638442993,
2.2995495796203613,
0.06156124547123909
],
"min":[
-0.7164189219474792,
0.013429881073534489,
-0.05848976969718933
],
"type":"VEC3"
},
{
"bufferView":8,
"componentType":5126,
"count":36440,
"type":"VEC3"
},
{
"bufferView":9,
"componentType":5126,
"count":36440,
"type":"VEC2"
},
{
"bufferView":10,
"componentType":5123,
"count":133341,
"type":"SCALAR"
},
{
"bufferView":11,
"componentType":5126,
"count":24,
"max":[
1.0160410404205322,
0,
1.0160410404205322
],
"min":[
-1.0160410404205322,
-0.002117000287398696,
-1.0160410404205322
],
"type":"VEC3"
},
{
"bufferView":12,
"componentType":5126,
"count":24,
"type":"VEC3"
},
{
"bufferView":13,
"componentType":5126,
"count":24,
"type":"VEC2"
},
{
"bufferView":14,
"componentType":5123,
"count":36,
"type":"SCALAR"
},
{
"bufferView":15,
"componentType":5126,
"count":24,
"max":[
1.0160410404205322,
0,
1.0160410404205322
],
"min":[
-1.0160410404205322,
-0.002117000287398696,
-1.0160410404205322
],
"type":"VEC3"
},
{
"bufferView":16,
"componentType":5126,
"count":24,
"type":"VEC3"
},
{
"bufferView":17,
"componentType":5126,
"count":24,
"type":"VEC2"
},
{
"bufferView":18,
"componentType":5126,
"count":24,
"max":[
-2.384185791015625e-07,
2.880000114440918,
4.800000190734863
],
"min":[
-4.800000190734863,
0,
2.384185791015625e-07
],
"type":"VEC3"
},
{
"bufferView":19,
"componentType":5126,
"count":24,
"type":"VEC3"
},
{
"bufferView":20,
"componentType":5126,
"count":24,
"type":"VEC2"
},
{
"bufferView":21,
"componentType":5123,
"count":66,
"type":"SCALAR"
},
{
"bufferView":22,
"componentType":5126,
"count":8,
"max":[
-2.384185791015625e-07,
0,
4.800000190734863
],
"min":[
-4.800000190734863,
0,
2.384185791015625e-07
],
"type":"VEC3"
},
{
"bufferView":23,
"componentType":5126,
"count":8,
"type":"VEC3"
},
{
"bufferView":24,
"componentType":5126,
"count":8,
"type":"VEC2"
},
{
"bufferView":25,
"componentType":5123,
"count":18,
"type":"SCALAR"
},
{
"bufferView":26,
"componentType":5126,
"count":24,
"max":[
0.14999976754188538,
2.880000114440918,
4.800000190734863
],
"min":[
-4.800000190734863,
-0.15000000596046448,
-0.14999978244304657
],
"type":"VEC3"
},
{
"bufferView":27,
"componentType":5126,
"count":24,
"type":"VEC3"
},
{
"bufferView":28,
"componentType":5126,
"count":24,
"type":"VEC2"
},
{
"bufferView":29,
"componentType":5123,
"count":66,
"type":"SCALAR"
},
{
"bufferView":30,
"componentType":5126,
"count":62,
"max":[
0.14999976754188538,
2.880000114440918,
4.800000190734863
],
"min":[
-4.800000190734863,
-0.15000000596046448,
-0.14999978244304657
],
"type":"VEC3"
},
{
"bufferView":31,
"componentType":5126,
"count":62,
"type":"VEC3"
},
{
"bufferView":32,
"componentType":5126,
"count":62,
"type":"VEC2"
},
{
"bufferView":33,
"componentType":5123,
"count":126,
"type":"SCALAR"
},
{
"bufferView":34,
"componentType":5126,
"count":136,
"max":[
2.6025426387786865,
1.5082554817199707,
-0.7282028198242188
],
"min":[
2.304885149002075,
-0.5152735710144043,
-2.184389114379883
],
"type":"VEC3"
},
{
"bufferView":35,
"componentType":5126,
"count":136,
"type":"VEC3"
},
{
"bufferView":36,
"componentType":5126,
"count":136,
"type":"VEC2"
},
{
"bufferView":37,
"componentType":5123,
"count":300,
"type":"SCALAR"
},
{
"bufferView":38,
"componentType":5126,
"count":12,
"max":[
-0.15531468391418457,
0.7160215973854065,
0.8602643013000488
],
"min":[
-1,
-0.9297141432762146,
-0.9027057886123657
],
"type":"VEC3"
},
{
"bufferView":39,
"componentType":5126,
"count":12,
"type":"VEC3"
},
{
"bufferView":40,
"componentType":5126,
"count":12,
"type":"VEC2"
},
{
"bufferView":41,
"componentType":5123,
"count":30,
"type":"SCALAR"
}
],
"bufferViews":[
{
"buffer":0,
"byteLength":816,
"byteOffset":0,
"target":34962
},
{
"buffer":0,
"byteLength":816,
"byteOffset":816,
"target":34962
},
{
"buffer":0,
"byteLength":544,
"byteOffset":1632,
"target":34962
},
{
"buffer":0,
"byteLength":288,
"byteOffset":2176,
"target":34963
},
{
"buffer":0,
"byteLength":816,
"byteOffset":2464,
"target":34962
},
{
"buffer":0,
"byteLength":816,
"byteOffset":3280,
"target":34962
},
{
"buffer":0,
"byteLength":544,
"byteOffset":4096,
"target":34962
},
{
"buffer":0,
"byteLength":437280,
"byteOffset":4640,
"target":34962
},
{
"buffer":0,
"byteLength":437280,
"byteOffset":441920,
"target":34962
},
{
"buffer":0,
"byteLength":291520,
"byteOffset":879200,
"target":34962
},
{
"buffer":0,
"byteLength":266682,
"byteOffset":1170720,
"target":34963
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1437404,
"target":34962
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1437692,
"target":34962
},
{
"buffer":0,
"byteLength":192,
"byteOffset":1437980,
"target":34962
},
{
"buffer":0,
"byteLength":72,
"byteOffset":1438172,
"target":34963
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1438244,
"target":34962
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1438532,
"target":34962
},
{
"buffer":0,
"byteLength":192,
"byteOffset":1438820,
"target":34962
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1439012,
"target":34962
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1439300,
"target":34962
},
{
"buffer":0,
"byteLength":192,
"byteOffset":1439588,
"target":34962
},
{
"buffer":0,
"byteLength":132,
"byteOffset":1439780,
"target":34963
},
{
"buffer":0,
"byteLength":96,
"byteOffset":1439912,
"target":34962
},
{
"buffer":0,
"byteLength":96,
"byteOffset":1440008,
"target":34962
},
{
"buffer":0,
"byteLength":64,
"byteOffset":1440104,
"target":34962
},
{
"buffer":0,
"byteLength":36,
"byteOffset":1440168,
"target":34963
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1440204,
"target":34962
},
{
"buffer":0,
"byteLength":288,
"byteOffset":1440492,
"target":34962
},
{
"buffer":0,
"byteLength":192,
"byteOffset":1440780,
"target":34962
},
{
"buffer":0,
"byteLength":132,
"byteOffset":1440972,
"target":34963
},
{
"buffer":0,
"byteLength":744,
"byteOffset":1441104,
"target":34962
},
{
"buffer":0,
"byteLength":744,
"byteOffset":1441848,
"target":34962
},
{
"buffer":0,
"byteLength":496,
"byteOffset":1442592,
"target":34962
},
{
"buffer":0,
"byteLength":252,
"byteOffset":1443088,
"target":34963
},
{
"buffer":0,
"byteLength":1632,
"byteOffset":1443340,
"target":34962
},
{
"buffer":0,
"byteLength":1632,
"byteOffset":1444972,
"target":34962
},
{
"buffer":0,
"byteLength":1088,
"byteOffset":1446604,
"target":34962
},
{
"buffer":0,
"byteLength":600,
"byteOffset":1447692,
"target":34963
},
{
"buffer":0,
"byteLength":144,
"byteOffset":1448292,
"target":34962
},
{
"buffer":0,
"byteLength":144,
"byteOffset":1448436,
"target":34962
},
{
"buffer":0,
"byteLength":96,
"byteOffset":1448580,
"target":34962
},
{
"buffer":0,
"byteLength":60,
"byteOffset":1448676,
"target":34963
}
],
"samplers":[
{
"magFilter":9729,
"minFilter":9987
}
],
"buffers":[
{
"byteLength":1448736,
"uri":"room.bin"
}
]
}