Add loading spinner on scroll

This commit is contained in:
Kurt Hutten
2021-03-12 19:48:33 +11:00
parent a1c3d7a300
commit 23e34a0a64

View File

@@ -6,7 +6,7 @@ import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
extend({ OrbitControls }) extend({ OrbitControls })
let debounceTimeoutId let debounceTimeoutId
function Controls({ onCameraChange }) { function Controls({ onCameraChange, onDragStart }) {
const controls = useRef() const controls = useRef()
const { scene, camera, gl } = useThree() const { scene, camera, gl } = useThree()
useEffect(() => { useEffect(() => {
@@ -47,7 +47,10 @@ function Controls({ onCameraChange }) {
}) })
}, 400) }, 400)
} }
const dragStart = () => clearTimeout(debounceTimeoutId) const dragStart = () => {
onDragStart()
clearTimeout(debounceTimeoutId)
}
controls.current.addEventListener('end', dragCallback) controls.current.addEventListener('end', dragCallback)
controls.current.addEventListener('start', dragStart) controls.current.addEventListener('start', dragStart)
const oldCurrent = controls.current const oldCurrent = controls.current
@@ -120,6 +123,7 @@ const IdeViewer = () => {
> >
<Canvas> <Canvas>
<Controls <Controls
onDragStart={() => setIsDragging(true)}
onCameraChange={({ position, rotation }) => { onCameraChange={({ position, rotation }) => {
dispatch({ dispatch({
type: 'render', type: 'render',