diff --git a/src/editor/components/modals/ScenesModal/ScenesModal.component.jsx b/src/editor/components/modals/ScenesModal/ScenesModal.component.jsx index a068cb29..0058f6be 100644 --- a/src/editor/components/modals/ScenesModal/ScenesModal.component.jsx +++ b/src/editor/components/modals/ScenesModal/ScenesModal.component.jsx @@ -7,7 +7,7 @@ import { createElementsForScenesFromJSON, fileJSON, inputStreetmix -} from '../../../lib/toolbar'; +} from '@/editor/lib/SceneUtils.js'; import { getCommunityScenes, getUserScenes } from '../../../api/scene'; import { Load24Icon, Loader, Upload24Icon } from '../../../icons'; import { signIn } from '../../../api'; diff --git a/src/editor/components/modals/ScreenshotModal/ScreenshotModal.component.jsx b/src/editor/components/modals/ScreenshotModal/ScreenshotModal.component.jsx index ccf15723..bdf65f30 100644 --- a/src/editor/components/modals/ScreenshotModal/ScreenshotModal.component.jsx +++ b/src/editor/components/modals/ScreenshotModal/ScreenshotModal.component.jsx @@ -4,12 +4,12 @@ import { signIn } from '../../../api'; import { useAuthContext } from '../../../contexts'; import { Copy32Icon, Save24Icon } from '../../../icons'; import { Button, Dropdown, Input } from '../../components'; -import Toolbar from '../../scenegraph/Toolbar'; import Modal from '../Modal.jsx'; import posthog from 'posthog-js'; import { saveBlob } from '../../../lib/utils'; import { uploadThumbnailImage, saveScreenshot } from '../../../api/scene'; import useStore from '@/store'; +import { convertToObject } from '@/editor/lib/SceneUtils'; const filterHelpers = (scene, visible) => { scene.traverse((o) => { @@ -80,7 +80,12 @@ function ScreenshotModal() { { value: '.3dstreet.json', label: '.3dstreet.json', - onClick: Toolbar.convertToObject + onClick: () => { + posthog.capture('convert_to_json_clicked', { + scene_id: STREET.utils.getCurrentSceneId() + }); + convertToObject(); + } } ]; diff --git a/src/editor/components/scenegraph/Toolbar.js b/src/editor/components/scenegraph/Toolbar.js index 157f91ec..0bb6a456 100644 --- a/src/editor/components/scenegraph/Toolbar.js +++ b/src/editor/components/scenegraph/Toolbar.js @@ -87,34 +87,6 @@ export default class Toolbar extends Component { } }; - static convertToObject = () => { - try { - posthog.capture('convert_to_json_clicked', { - scene_id: STREET.utils.getCurrentSceneId() - }); - const entity = document.getElementById('street-container'); - - const data = STREET.utils.convertDOMElToObject(entity); - - const jsonString = `data:text/json;chatset=utf-8,${encodeURIComponent( - STREET.utils.filterJSONstreet(data) - )}`; - - const link = document.createElement('a'); - link.href = jsonString; - link.download = 'data.json'; - - link.click(); - link.remove(); - STREET.notify.successMessage('3DStreet JSON file saved successfully.'); - } catch (error) { - STREET.notify.errorMessage( - `Error trying to save 3DStreet JSON file. Error: ${error}` - ); - console.error(error); - } - }; - cloudSaveHandlerWithImageUpload = async (doSaveAs) => { this.makeScreenshot(); const currentSceneId = await this.cloudSaveHandler({ doSaveAs }); @@ -127,6 +99,7 @@ export default class Toolbar extends Component { newHandler = () => { posthog.capture('new_scene_clicked'); AFRAME.INSPECTOR.selectEntity(null); + useStore.getState().newScene(); STREET.utils.newScene(); AFRAME.scenes[0].emit('newScene'); }; @@ -180,7 +153,7 @@ export default class Toolbar extends Component { // we want to save, so if we *still* have no sceneID at this point, then create a new one if (!currentSceneId || !!doSaveAs) { // ask user for scene title here currentSceneTitle - let newSceneTitle = prompt('Scene Title:', currentSceneTitle); + let newSceneTitle = prompt('Scene Title:', currentSceneTitle || ''); if (newSceneTitle) { currentSceneTitle = newSceneTitle; @@ -221,6 +194,7 @@ export default class Toolbar extends Component { // Change the hash URL without reloading window.location.hash = `#/scenes/${currentSceneId}.json`; + this.toggleSaveActionState(); this.setState({ savedScene: true }); this.setSavedSceneFalse(); @@ -283,33 +257,12 @@ export default class Toolbar extends Component { screenshotEl.setAttribute('screentock', 'takeScreenshot', true); }; - toggleScenePlaying = () => { - if (this.state.isPlaying) { - AFRAME.scenes[0].pause(); - this.setState((prevState) => ({ ...prevState, isPlaying: false })); - Events.emit('sceneplayingtoggle', false); - AFRAME.scenes[0].isPlaying = true; - document.getElementById('aframeInspectorMouseCursor').play(); - return; - } - AFRAME.scenes[0].isPlaying = false; - AFRAME.scenes[0].play(); - this.setState((prevState) => ({ ...prevState, isPlaying: true })); - Events.emit('sceneplayingtoggle', true); - }; - toggleSaveActionState = () => { this.setState((prevState) => ({ isSaveActionActive: !prevState.isSaveActionActive })); }; - toggleLoadActionState = () => { - this.setState((prevState) => ({ - isLoadActionActive: !prevState.isLoadActionActive - })); - }; - render() { const isEditor = !!this.state.inspectorEnabled; return ( diff --git a/src/editor/lib/toolbar.js b/src/editor/lib/SceneUtils.js similarity index 66% rename from src/editor/lib/toolbar.js rename to src/editor/lib/SceneUtils.js index 646ea50a..e558bbca 100644 --- a/src/editor/lib/toolbar.js +++ b/src/editor/lib/SceneUtils.js @@ -47,3 +47,28 @@ export function fileJSON(event) { reader.readAsText(event.target.files[0]); } + +export function convertToObject() { + try { + const entity = document.getElementById('street-container'); + + const data = STREET.utils.convertDOMElToObject(entity); + + const jsonString = `data:text/json;chatset=utf-8,${encodeURIComponent( + STREET.utils.filterJSONstreet(data) + )}`; + + const link = document.createElement('a'); + link.href = jsonString; + link.download = 'data.json'; + + link.click(); + link.remove(); + STREET.notify.successMessage('3DStreet JSON file saved successfully.'); + } catch (error) { + STREET.notify.errorMessage( + `Error trying to save 3DStreet JSON file. Error: ${error}` + ); + console.error(error); + } +} diff --git a/src/store.js b/src/store.js index a0169675..f5f7b5e1 100644 --- a/src/store.js +++ b/src/store.js @@ -23,6 +23,8 @@ const useStore = create( setSceneId: (newSceneId) => set({ sceneId: newSceneId }), sceneTitle: null, setSceneTitle: (newSceneTitle) => set({ sceneTitle: newSceneTitle }), + newScene: () => + set({ sceneId: null, sceneTitle: null, authorId: null }), authorId: null, setAuthorId: (newAuthorId) => set({ authorId: newAuthorId }), modal: firstModal(),