Compare commits
No commits in common. "aabacdbc1152ae3a0069ef2ae610a0543e3b3520" and "b0e9724451501ce757563226fb50d9da7aecfe7f" have entirely different histories.
aabacdbc11
...
b0e9724451
15
README.md
15
README.md
@ -1,17 +1,2 @@
|
||||
# play.webxr.dev
|
||||
|
||||
## Keeping the Template Updated
|
||||
|
||||
Periodically we should make sure that the template is up to date. To do this,
|
||||
we can use the `npm-check-updates` package. To run it, run the following
|
||||
command, it will show you what needs updating:
|
||||
|
||||
```bash
|
||||
npx npm-check-updates
|
||||
```
|
||||
|
||||
then to apply the changes:
|
||||
|
||||
```bash
|
||||
npx npm-check-updates -u
|
||||
```
|
||||
|
||||
@ -1,10 +0,0 @@
|
||||
import globals from "globals";
|
||||
import pluginJs from "@eslint/js";
|
||||
import pluginReactConfig from "eslint-plugin-react/configs/recommended.js";
|
||||
|
||||
|
||||
export default [
|
||||
{languageOptions: { globals: globals.browser }},
|
||||
pluginJs.configs.recommended,
|
||||
pluginReactConfig,
|
||||
];
|
||||
4931
stereo-exp1/package-lock.json
generated
4931
stereo-exp1/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -1,25 +0,0 @@
|
||||
{
|
||||
"name": "stereo-exp1",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.0.0",
|
||||
"@vitejs/plugin-react": "4.2",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-react": "^7.34.1",
|
||||
"globals": "^15.0.0",
|
||||
"vite": "^5.2.8"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-three/drei": "^9.105.4",
|
||||
"@react-three/fiber": "^8.16.2",
|
||||
"react": "18.2",
|
||||
"react-dom": "18.2",
|
||||
"three": "^0.163.0"
|
||||
}
|
||||
}
|
||||
@ -1,24 +0,0 @@
|
||||
import { useThree, extend } from '@react-three/fiber'
|
||||
import { OrbitControls, useTexture } from '@react-three/drei'
|
||||
import { DoubleSide } from 'three'
|
||||
|
||||
export default function Experience()
|
||||
{
|
||||
const { camera, gl } = useThree()
|
||||
// const harborSealRockTexture = useTexture('./MARS-Harbor-Seal-Rock-in-Jezero-Crater-cross-eyed-Manzoni_May-1662x2048.jpg')
|
||||
const goliathTexture = useTexture('https://tile.loc.gov/storage-services/service/pnp/stereo/1s00000/1s00000/1s00600/1s00612v.jpg')
|
||||
const texture = goliathTexture
|
||||
const {width, height} = texture.image
|
||||
|
||||
return <>
|
||||
<OrbitControls />
|
||||
|
||||
<directionalLight position={ [ 1, 2, 3 ] } intensity={ 4.5 } />
|
||||
<ambientLight intensity={ 1.5 } />
|
||||
|
||||
<mesh position-y={ 5 } scale={ .01 }>
|
||||
<planeGeometry args={[width, height]}/>
|
||||
<meshStandardMaterial map={texture} side={DoubleSide} />
|
||||
</mesh>
|
||||
</>
|
||||
}
|
||||
@ -1,12 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Stereo Experiment 1</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="./index.jsx"></script></body>
|
||||
</html>
|
||||
@ -1,19 +0,0 @@
|
||||
import './style.css'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import { Canvas } from '@react-three/fiber'
|
||||
import Experience from './Experience.jsx'
|
||||
|
||||
const root = ReactDOM.createRoot(document.querySelector('#root'))
|
||||
|
||||
root.render(
|
||||
<Canvas
|
||||
camera={ {
|
||||
fov: 45,
|
||||
near: 0.1,
|
||||
far: 200,
|
||||
position: [ 0, 5, 20 ]
|
||||
} }
|
||||
>
|
||||
<Experience />
|
||||
</Canvas>
|
||||
)
|
||||
@ -1,11 +0,0 @@
|
||||
html,
|
||||
body,
|
||||
#root
|
||||
{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: ivory;
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
import react from '@vitejs/plugin-react'
|
||||
import { transformWithEsbuild } from 'vite'
|
||||
|
||||
export default {
|
||||
root: 'src/',
|
||||
publicDir: '../public/',
|
||||
base: './',
|
||||
plugins:
|
||||
[
|
||||
// React support
|
||||
react(),
|
||||
|
||||
// .js file support as if it was JSX
|
||||
{
|
||||
name: 'load+transform-js-files-as-jsx',
|
||||
async transform(code, id)
|
||||
{
|
||||
if (!id.match(/src\/.*\.js$/))
|
||||
return null
|
||||
|
||||
return transformWithEsbuild(code, id, {
|
||||
loader: 'jsx',
|
||||
jsx: 'automatic',
|
||||
});
|
||||
},
|
||||
},
|
||||
],
|
||||
server:
|
||||
{
|
||||
host: true, // Open to local network and display URL
|
||||
open: !('SANDBOX_URL' in process.env || 'CODESANDBOX_HOST' in process.env) // Open if it's not a CodeSandbox
|
||||
},
|
||||
build:
|
||||
{
|
||||
outDir: '../dist', // Output in the dist/ folder
|
||||
emptyOutDir: true, // Empty the folder first
|
||||
sourcemap: true // Add sourcemap
|
||||
},
|
||||
}
|
||||
1006
template/package-lock.json
generated
1006
template/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -12,10 +12,9 @@
|
||||
"vite": "^5.2.8"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-three/drei": "^9.105.4",
|
||||
"@react-three/fiber": "^8.16.2",
|
||||
"react": "18.2",
|
||||
"react-dom": "18.2",
|
||||
"@react-three/fiber": "^8.16.2",
|
||||
"three": "^0.163.0"
|
||||
}
|
||||
}
|
||||
@ -1,5 +1,7 @@
|
||||
import { useThree, extend } from '@react-three/fiber'
|
||||
import { OrbitControls } from '@react-three/drei'
|
||||
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'
|
||||
|
||||
extend({ OrbitControls })
|
||||
|
||||
export default function Experience()
|
||||
{
|
||||
@ -7,7 +9,7 @@ export default function Experience()
|
||||
|
||||
return <>
|
||||
|
||||
<OrbitControls />
|
||||
<orbitControls args={ [ camera, gl.domElement ] } />
|
||||
|
||||
<directionalLight position={ [ 1, 2, 3 ] } intensity={ 4.5 } />
|
||||
<ambientLight intensity={ 1.5 } />
|
||||
@ -19,7 +21,7 @@ export default function Experience()
|
||||
|
||||
<mesh position-y={ - 1 } rotation-x={ - Math.PI * 0.5 } scale={ 10 }>
|
||||
<planeGeometry />
|
||||
<meshStandardMaterial color="grey" />
|
||||
<meshStandardMaterial color="greenyellow" />
|
||||
</mesh>
|
||||
|
||||
</>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user