diff --git a/src/react/app.jsx b/src/react/app.jsx
index a7152a8..ed9ed0f 100644
--- a/src/react/app.jsx
+++ b/src/react/app.jsx
@@ -10,7 +10,7 @@ import { NavBar } from './navBar'
import { ToolTip } from './toolTip'
import './app.css'
-import { Help } from './help'
+import { Onboard } from './onboard'
let store
diff --git a/src/react/carousel_raf.jsx b/src/react/carousel_raf.jsx
deleted file mode 100644
index 04d63b6..0000000
--- a/src/react/carousel_raf.jsx
+++ /dev/null
@@ -1,141 +0,0 @@
-import { Bezier } from '../../extlib/cubicBezier'
-
-import React, { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
-
-const bezier = Bezier(0.4, 0.0, 0.2, 1);
-
-
-export function throttle(callback, limit) {
- let handler = null; // Initially, we're not waiting
- return (...args) => { // We return a throttled function
- if (!handler) { // If we're not waiting
- callback(...args); // Execute users function
- handler = setTimeout(() => handler = null, limit);
- }
- }
-}
-
-
-function debounce(callback, delay) {
- let handler = null;
- return (...args) => {
- clearTimeout(handler);
- handler = setTimeout(() => callback(...args), delay);
- }
-}
-
-
-export const Carousel = () => {
- const arr = [1, 2, 3]
-
-
- const [pg, setPg] = useState(0)
- const [left, setLeft] = useState(0)
- const cardSlideStartTime = useRef(null)
- const leftStart = useRef(null)
- const delta = useRef(null)
- const ref = useRef(null)
-
- const [rect, setRect] = useState({})
- window.pp = pg
-
- const cardSlideLoop = useCallback(
- function (timestamp) {
- if (!rect.width) return;
- if (!cardSlideStartTime.current) { // first req anim call
- cardSlideStartTime.current = timestamp;
- leftStart.current = left;
-
- delta.current = pg * rect.width - left;
- }
-
- const elapsed = timestamp - cardSlideStartTime.current;
-
- if (elapsed < 200) { // when animation is stil running
- setLeft(leftStart.current + bezier(elapsed / 200) * delta.current)
- requestAnimationFrame(cardSlideLoop);
- } else { // when animation completes
- setLeft(leftStart.current + delta.current)
- cardSlideStartTime.current = null;
- }
- }, [pg, rect]
- )
-
- const inc = useCallback(
- throttle(
- (dir) => setPg(state => state + dir)
- , 200
- )
- , []
- )
-
-
-
- const updateSize = useCallback(
- debounce(
- () => {
- const rect = ref.current.getBoundingClientRect()
- setRect(rect)
- setLeft(pg * rect.width)
- }
- , 200
- )
- , [pg]
- )
-
-
- useEffect(() => requestAnimationFrame(cardSlideLoop), [pg])
-
- useEffect(() => {
- setRect(ref.current.getBoundingClientRect())
- }, [])
-
-
- useLayoutEffect(() => {
-
-
- window.addEventListener('resize', updateSize)
-
- return () => window.removeEventListener('resize', updateSize)
-
- }, [pg])
-
- return <>
-
inc(1)
- }>1
- inc(-1)
- }
- >2
-
- {rect.width &&
-
- {
- arr.map((e, idx) => {
-
- return
- hi {e}
-
- })
- }
-
- }
-
- >
-
-}
diff --git a/src/react/dropDown.jsx b/src/react/dropDown.jsx
deleted file mode 100644
index d687785..0000000
--- a/src/react/dropDown.jsx
+++ /dev/null
@@ -1,87 +0,0 @@
-
-import React, { useState } from 'react';
-
-import { useDispatch } from 'react-redux'
-
-import { MdHelpOutline } from 'react-icons/md'
-
-
-const utf8decoder = new TextDecoder();
-
-export const DropDown = () => {
- const arr = [
- ['https://raw.githubusercontent.com/twpride/threeCAD/master/demo_parts/headphones-stand.json.gz', 'headphones-stand'],
- ]
-
- const dispatch = useDispatch()
- const [open, setOpen] = useState(false)
-
- const handleOutsideClick = (ev) => {
- /*
- this handles inside click as well due to bubbling,
- sets the open/close state of drop down
- */
- setOpen(state => !state) // handle click on button & dropdown, always a toggle
-
- document.addEventListener( // handles click outside buttona & dropdown
- 'pointerdown',
- (e) => {
- console.log(e.composedPath())
- !e.composedPath().includes(ev.target.parentNode) && setOpen(false) }
- ,
- { capture: false, once: true } // capture phase to allow for stopPropogation on others
- )
-
- }
-
- const handleInsideClick = async (e) => {
- // handles click inside dropdown, business logic here
- const idx = Array.prototype.indexOf.call(e.target.parentNode.children, e.target)
-
- if (idx !== -1) {
- setOpen(false)
-
- const state = sce.loadState(
- utf8decoder.decode(
- new Zlib.Gunzip(
- new Uint8Array(
- await (
- await (
- await fetch(arr[idx][0])
- ).blob()
- ).arrayBuffer()
- )
- ).decompress()
- )
- )
-
- dispatch({ type: 'restore-state', state, fileName: arr[idx][1] })
- sce.render()
- }
- }
-
- return
- {/*
- Demo Parts
-
*/}
-
- {
- open &&
-
- {arr.map(([url, name], idx) => (
-
- {name}
-
- ))}
-
-
- }
-
-}
\ No newline at end of file
diff --git a/src/react/navBar.jsx b/src/react/navBar.jsx
index cac6bc4..e58e77e 100644
--- a/src/react/navBar.jsx
+++ b/src/react/navBar.jsx
@@ -12,7 +12,7 @@ import { Dialog } from './dialog'
import { Modal } from './modal'
import { STLExport, saveFile, openFile } from './fileHelpers'
import { QuickStart } from './quickStart';
-import { Help } from './help'
+import { Onboard } from './onboard'
const visitedFlagStorage = sessionStorage
const buttonIdx = {
'line': 1,
@@ -213,7 +213,7 @@ export const NavBar = () => {
{
splash &&
-
+
}
{
diff --git a/src/react/help.jsx b/src/react/onboard.jsx
similarity index 99%
rename from src/react/help.jsx
rename to src/react/onboard.jsx
index d20bc28..73eb467 100644
--- a/src/react/help.jsx
+++ b/src/react/onboard.jsx
@@ -87,7 +87,7 @@ const arr = [
-export const Help = ({ setModal, setQs }) => {
+export const Onboard = ({ setModal, setQs }) => {
diff --git a/src/react/reducer.js b/src/react/reducer.js
index a7bde75..9d0d388 100644
--- a/src/react/reducer.js
+++ b/src/react/reducer.js
@@ -107,7 +107,6 @@ const defaultUIState = {
fileName: 'Untitled',
selectedList: [],
selectedSet: {},
- help: false
}
export function ui(state = defaultUIState, action) {