diff --git a/src/components/journeys/driver-journey/driver-journey.jsx b/src/components/journeys/driver-journey/driver-journey.jsx index dfe7fa5f0..965cfecf3 100644 --- a/src/components/journeys/driver-journey/driver-journey.jsx +++ b/src/components/journeys/driver-journey/driver-journey.jsx @@ -7,9 +7,8 @@ require('driver.js/dist/driver.css'); const DriverJourney = ({configProps, driverObj}) => { const [renderState, setRenderState] = useState(); - const {steps, ...restConfig} = configProps; - useEffect(() => { + const {steps, ...restConfig} = configProps; const driverSteps = steps.map((step, index) => { const {sectionComponents = {}, callback, ...popoverProps} = step.popover; return { @@ -43,10 +42,10 @@ const DriverJourney = ({configProps, driverObj}) => { driverObj.setConfig({...restConfig, steps: driverSteps}); driverObj.drive(); - }, [driverObj, steps]); + }, [driverObj, configProps]); if (!renderState) return null; - if (!steps[renderState.stepIndex]) return null; + if (!configProps.steps[renderState.stepIndex]) return null; return ( <> diff --git a/src/components/journeys/editor-journey/editor-journey.jsx b/src/components/journeys/editor-journey/editor-journey.jsx index 32e2b3288..75dffc66c 100644 --- a/src/components/journeys/editor-journey/editor-journey.jsx +++ b/src/components/journeys/editor-journey/editor-journey.jsx @@ -4,96 +4,96 @@ const FlexRow = require('../../flex-row/flex-row.jsx'); const Button = require('../../forms/button.jsx'); const DriverJourney = require('../driver-journey/driver-journey.jsx'); const {defineMessages, useIntl} = require('react-intl'); -const {useMemo, useState} = require('react'); +const {useMemo, useState, useCallback} = require('react'); const PropTypes = require('prop-types'); require('./editor-journey.scss'); const messages = defineMessages({ - createTitle: { + createStepTitle: { id: 'gui.journey.controls.create', defaultMessage: 'Create', - description: 'Create modal title' + description: 'Create step title' }, - projectGenreTitle: { + projectGenreStepTitle: { id: 'gui.journey.controls.choose.projectGenre', defaultMessage: 'What do you whant to create?', - description: 'Choose project genre modal title' + description: 'Choose project genre step title' }, - typeTitle: { + typeStepTitle: { id: 'gui.journey.controls.choose.type', defaultMessage: 'Which type?', - description: 'Choose project type modal title' + description: 'Choose project type step title' }, - startTitle: { + startStepTitle: { id: 'gui.journey.controls.choose.start', defaultMessage: 'How do you want to start?', - description: 'Choose way to start modal title' + description: 'Choose way to start step title' }, - gameTitle: { + gameButtonText: { id: 'gui.journey.controls.game', defaultMessage: 'Game', - description: 'Game button title' + description: 'Game button text' }, - animiationTitle: { + animiationButtonText: { id: 'gui.journey.controls.animation', defaultMessage: 'Animation', - description: 'Animation button title' + description: 'Animation button text' }, - musicTitle: { + musicButtonText: { id: 'gui.journey.controls.music', defaultMessage: 'Music', - description: 'Music button title' + description: 'Music button text' }, - clickerGameTitle: { + clickerGameButtonText: { id: 'gui.journey.controls.game.clicker', defaultMessage: 'Clicker Game', - description: 'Clicker game button title' + description: 'Clicker game button text' }, - pongGameTitle: { + pongGameButtonText: { id: 'gui.journey.controls.game.pong', defaultMessage: 'Pong Game', - description: 'Pong game button title' + description: 'Pong game button text' }, - characterAnimationTitle: { + characterAnimationButtonText: { id: 'gui.journey.controls.animation.character', defaultMessage: 'Animate a character', - description: 'Animate a character button title' + description: 'Animate a character button text' }, - flyAnimationTitle: { + flyAnimationButtonText: { id: 'gui.journey.controls.animation.fly', defaultMessage: 'Make it fly', - description: 'Make it fly animation button title' + description: 'Make it fly animation button text' }, - recordSoundTitle: { + recordSoundButtonText: { id: 'gui.journey.controls.music.record', defaultMessage: 'Record a sound', - description: 'Record a sound button title' + description: 'Record a sound button text' }, - makeMusicTitle: { + makeMusicButtonText: { id: 'gui.journey.controls.music.make', defaultMessage: 'Make music', - description: 'Make music button title' + description: 'Make music button text' }, - tutorialTitle: { + tutorialButtonText: { id: 'gui.journey.controls.tutorial', defaultMessage: 'Tutorial', - description: 'Tutorial button title' + description: 'Tutorial button text' }, - starterProjectTitle: { + starterProjectButtonText: { id: 'gui.journey.controls.starterProject', defaultMessage: 'Starter project', - description: 'Starter project button title' + description: 'Starter project button text' }, - onMyOwnTitle: { + onMyOwnButtonText: { id: 'gui.journey.controls.onMyOwn', defaultMessage: 'On my own', - description: 'On my own button title' + description: 'On my own button text' } }); -const projects = { - clicker: '10128368', +const projectIds = { + clicker: '10000252', pong: '10128515', animateCharacter: '10128067', makeItFly: '114019829', @@ -101,7 +101,7 @@ const projects = { makeMusic: '10012676' }; -const tutorials = { +const tutorialIds = { clicker: 'Make-A-Game', pong: 'pong', animateCharacter: 'Animate-A-Character', @@ -110,20 +110,6 @@ const tutorials = { makeMusic: 'Make-Music' }; -const redirectToProject = projectId => { - location.href = `/projects/${projectId}?showJourney=true`; -}; - -const openTutorial = (onActivateDeck, tutorialId, driverObj) => { - onActivateDeck(tutorialId); - driverObj.destroy(); -}; - -const ownOptingPicked = (setCanViewTutorialsHighlight, driverObg) => { - setCanViewTutorialsHighlight(true); - driverObg.destroy(); -}; - const EditorJourneyDescription = ({title, descriptionData}) => ( <>
{title}
@@ -146,288 +132,178 @@ const EditorJourneyDescription = ({title, descriptionData}) => ( ); -const EditorJourney = ({onActivateDeck, setCanViewTutorialsHighlight}) => { +const EditorJourney = ({onActivateDeck, setCanViewTutorialsHighlight, setShowJourney}) => { const [driverObj] = useState(() => ( driver() )); const intl = useIntl(); - const steps = useMemo( - () => [{ - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: driverObj.moveTo(1) - }, - { - imgSrc: '/images/onboarding-journeys/Animation-Icon.png', - text: intl.formatMessage(messages.animiationTitle), - handleOnClick: () => driverObj.moveTo(2) - }, - { - imgSrc: '/images/onboarding-journeys/Music-Icon.png', - text: intl.formatMessage(messages.musicTitle), - handleOnClick: () => driverObj.moveTo(3) - } - ]} - /> + const createStep = useCallback((projectId, tutorialId) => ({ + title: intl.formatMessage(messages.createStepTitle), + showButtons: ['close'], + sectionComponents: { + description: { + onActivateDeck(tutorialId); + setShowJourney(false); + driverObj.destroy(); + } + }, + { + imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.svg', + text: intl.formatMessage(messages.starterProjectButtonText), + handleOnClick: () => { + location.href = `/projects/${projectId}?showJourney=true`; + setShowJourney(false); + driverObj.destroy(); + } + }, + { + imgSrc: '/images/onboarding-journeys/On-Own-Icon.svg', + text: intl.formatMessage(messages.onMyOwnButtonText), + handleOnClick: () => { + setCanViewTutorialsHighlight(true); + setShowJourney(false); + driverObj.destroy(); + } + } + ]} + /> + } + }), [onActivateDeck, setCanViewTutorialsHighlight, setShowJourney, driverObj, intl]); + + const configProps = useMemo( + () => ({ + popoverClass: 'gui-journey', + overlayOpacity: 0, + onDestroyed: () => { + setShowJourney(false); + }, + steps: [{ + popover: { + title: intl.formatMessage(messages.createStepTitle), + showButtons: ['close'], + sectionComponents: { + description: driverObj.moveTo(1) + }, + { + imgSrc: '/images/onboarding-journeys/Animation-Icon.svg', + text: intl.formatMessage(messages.animiationButtonText), + handleOnClick: () => driverObj.moveTo(2) + }, + { + imgSrc: '/images/onboarding-journeys/Music-Icon.svg', + text: intl.formatMessage(messages.musicButtonText), + handleOnClick: () => driverObj.moveTo(3) + } + ]} + /> + } } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: driverObj.moveTo(4) - }, - { - imgSrc: '/images/onboarding-journeys/Pong-Game.jpg', - text: intl.formatMessage(messages.pongGameTitle), - handleOnClick: () => driverObj.moveTo(5) - } - ]} - /> + }, + { + popover: { + title: intl.formatMessage(messages.createStepTitle), + showButtons: ['close'], + sectionComponents: { + description: driverObj.moveTo(4) + }, + { + imgSrc: '/images/onboarding-journeys/Pong-Game.jpg', + text: intl.formatMessage(messages.pongGameButtonText), + handleOnClick: () => driverObj.moveTo(5) + } + ]} + /> + } } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: driverObj.moveTo(6) - }, - { - imgSrc: '/images/onboarding-journeys/Fly-Animation.jpg', - text: intl.formatMessage(messages.flyAnimationTitle), - handleOnClick: () => driverObj.moveTo(7) - } - ]} - /> + }, + { + popover: { + title: intl.formatMessage(messages.createStepTitle), + showButtons: ['close'], + sectionComponents: { + description: driverObj.moveTo(6) + }, + { + imgSrc: '/images/onboarding-journeys/Fly-Animation.jpg', + text: intl.formatMessage(messages.flyAnimationButtonText), + handleOnClick: () => driverObj.moveTo(7) + } + ]} + /> + } } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: driverObj.moveTo(8) - }, - { - imgSrc: '/images/onboarding-journeys/Make-Music.jpg', - text: intl.formatMessage(messages.makeMusicTitle), - handleOnClick: () => driverObj.moveTo(9) - } - ]} - /> + }, + { + popover: { + title: intl.formatMessage(messages.createStepTitle), + showButtons: ['close'], + sectionComponents: { + description: driverObj.moveTo(8) + }, + { + imgSrc: '/images/onboarding-journeys/Make-Music.jpg', + text: intl.formatMessage(messages.makeMusicButtonText), + handleOnClick: () => driverObj.moveTo(9) + } + ]} + /> + } } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: openTutorial(onActivateDeck, tutorials.clicker, driverObj) - }, - { - imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.png', - text: intl.formatMessage(messages.starterProjectTitle), - handleOnClick: () => redirectToProject(projects.clicker) - }, - { - imgSrc: '/images/onboarding-journeys/On-Own-Icon.png', - text: intl.formatMessage(messages.onMyOwnTitle), - handleOnClick: () => ownOptingPicked(setCanViewTutorialsHighlight, driverObj) - } - ]} - /> - } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: openTutorial(onActivateDeck, tutorials.pong, driverObj) - }, - { - imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.png', - text: intl.formatMessage(messages.starterProjectTitle), - handleOnClick: () => redirectToProject(projects.pong) - }, - { - imgSrc: '/images/onboarding-journeys/On-Own-Icon.png', - text: intl.formatMessage(messages.onMyOwnTitle), - handleOnClick: () => ownOptingPicked(setCanViewTutorialsHighlight, driverObj) - } - ]} - /> - } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: - openTutorial(onActivateDeck, tutorials.animateCharacter, driverObj) - }, - { - imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.png', - text: intl.formatMessage(messages.starterProjectTitle), - handleOnClick: () => redirectToProject(projects.animateCharacter) - }, - { - imgSrc: '/images/onboarding-journeys/On-Own-Icon.png', - text: intl.formatMessage(messages.onMyOwnTitle), - handleOnClick: () => ownOptingPicked(setCanViewTutorialsHighlight, driverObj) - } - ]} - /> - } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: openTutorial(onActivateDeck, tutorials.makeItFly, driverObj) - }, - { - imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.png', - text: intl.formatMessage(messages.starterProjectTitle), - handleOnClick: () => redirectToProject(projects.makeItFly) - }, - { - imgSrc: '/images/onboarding-journeys/On-Own-Icon.png', - text: intl.formatMessage(messages.onMyOwnTitle), - handleOnClick: () => ownOptingPicked(setCanViewTutorialsHighlight, driverObj) - } - ]} - /> - } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: openTutorial(onActivateDeck, tutorials.recordSound, driverObj) - }, - { - imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.png', - text: intl.formatMessage(messages.starterProjectTitle), - handleOnClick: () => redirectToProject(projects.recordSound) - }, - { - imgSrc: '/images/onboarding-journeys/On-Own-Icon.png', - text: intl.formatMessage(messages.onMyOwnTitle), - handleOnClick: () => ownOptingPicked(setCanViewTutorialsHighlight, driverObj) - } - ]} - /> - } - } - }, - { - popover: { - title: intl.formatMessage(messages.createTitle), - showButtons: ['close'], - sectionComponents: { - description: openTutorial(onActivateDeck, tutorials.makeMusic, driverObj) - }, - { - imgSrc: '/images/onboarding-journeys/Starter-Projects-Icon.png', - text: intl.formatMessage(messages.starterProjectTitle), - handleOnClick: () => redirectToProject(projects.makeMusic) - }, - { - imgSrc: '/images/onboarding-journeys/On-Own-Icon.png', - text: intl.formatMessage(messages.onMyOwnTitle), - handleOnClick: () => ownOptingPicked(setCanViewTutorialsHighlight, driverObj) - } - ]} - /> - } - } - }], [onActivateDeck, setCanViewTutorialsHighlight] + }, + { + popover: createStep(projectIds.clicker, tutorialIds.clicker) + }, + { + popover: createStep(projectIds.pong, tutorialIds.pong) + }, + { + popover: createStep(projectIds.animateCharacter, tutorialIds.animateCharacter) + }, + { + popover: createStep(projectIds.makeItFly, tutorialIds.makeItFly) + }, + { + popover: createStep(projectIds.recordSound, tutorialIds.recordSound) + }, + { + popover: createStep(projectIds.makeMusic, tutorialIds.makeMusic) + }]}), [driverObj, intl, createStep, setShowJourney] ); return ( ); @@ -444,7 +320,8 @@ EditorJourneyDescription.propTypes = { EditorJourney.propTypes = { onActivateDeck: PropTypes.func, - setCanViewTutorialsHighlight: PropTypes.func + setCanViewTutorialsHighlight: PropTypes.func, + setShowJourney: PropTypes.func }; module.exports = EditorJourney; diff --git a/src/components/journeys/editor-journey/editor-journey.scss b/src/components/journeys/editor-journey/editor-journey.scss index 32bdcef9b..c20aaf9c9 100644 --- a/src/components/journeys/editor-journey/editor-journey.scss +++ b/src/components/journeys/editor-journey/editor-journey.scss @@ -50,7 +50,7 @@ .description-wrapper { flex-direction: row; justify-content: space-evenly; - gap: 2rem; + gap: 3rem; margin: 3rem 4rem; .journey-option { @@ -59,7 +59,7 @@ gap: 1rem; img { - max-height: $cols2; + height: $cols2; } } } diff --git a/src/components/journeys/project-journey/project-journey.jsx b/src/components/journeys/project-journey/project-journey.jsx index 8b765259a..e91d67898 100644 --- a/src/components/journeys/project-journey/project-journey.jsx +++ b/src/components/journeys/project-journey/project-journey.jsx @@ -9,7 +9,7 @@ require('./project-journey.scss'); const messages = defineMessages({ playProject: { id: 'project.journey.play', - defaultMessage: 'Click green flag to play', + defaultMessage: 'Click the green flag to see what this project does.', description: 'Play project' }, remixProject: { @@ -19,7 +19,7 @@ const messages = defineMessages({ } }); -const ProjectJourney = ({setCanViewProjectJourney}) => { +const ProjectJourney = ({setCanViewProjectJourney, setShouldStopProject}) => { const [driverObj] = useState(() => ( driver() )); @@ -34,6 +34,10 @@ const ProjectJourney = ({setCanViewProjectJourney}) => { greenFlagButton.addEventListener('click', () => { setCanViewProjectJourney(false); driverObj.destroy(); + setTimeout(() => { + setShouldStopProject(true); + driverObj.drive(1); + }, 8000); }); }, description: intl.formatMessage(messages.playProject) @@ -58,14 +62,11 @@ const ProjectJourney = ({setCanViewProjectJourney}) => { configProps={{ popoverClass: 'project-journey', showButtons: [ - 'next', - 'previous' + 'close' ], onDestroyed: () => { setCanViewProjectJourney(false); }, - nextBtnText: 'Next', - prevBtnText: 'Previous', showProgress: false, steps: steps }} @@ -75,7 +76,8 @@ const ProjectJourney = ({setCanViewProjectJourney}) => { }; ProjectJourney.propTypes = { - setCanViewProjectJourney: PropTypes.func + setCanViewProjectJourney: PropTypes.func, + setShouldStopProject: PropTypes.func }; module.exports = ProjectJourney; diff --git a/src/components/journeys/project-journey/project-journey.scss b/src/components/journeys/project-journey/project-journey.scss index 4c67ca5b1..ad1637e23 100644 --- a/src/components/journeys/project-journey/project-journey.scss +++ b/src/components/journeys/project-journey/project-journey.scss @@ -1,8 +1,21 @@ @import "../../../colors"; .driver-popover.project-journey { + display: flex; + flex-direction: column; background-color: $ui-purple-dark; + .driver-popover-close-btn { + height: 2.5rem; + width: 2.5rem; + border-radius: 50%; + margin: 0.5rem; + font-size: 2rem; + font-weight: bold; + color: $type-white; + background-color: $ui-purple-dark; + } + .driver-popover-arrow-side-left.driver-popover-arrow { border-left-color: $ui-purple-dark;; } @@ -25,26 +38,4 @@ font-weight: 700; font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; } - - .driver-popover-navigation-btns { - display: flex; - justify-content: space-evenly; - - .driver-popover-btn-disabled { - opacity: 1; - } - - button { - display: inline-block; - border: 0; - border-radius: 2rem; - cursor: pointer; - padding: 0.75rem 1rem; - font-size: 0.8rem; - font-weight: bold; - - background-color: $ui-white; - color: $ui-purple-dark; - } - } } \ No newline at end of file diff --git a/src/lib/use-previous.js b/src/lib/use-previous.js deleted file mode 100644 index b266132db..000000000 --- a/src/lib/use-previous.js +++ /dev/null @@ -1,22 +0,0 @@ -import {useState} from 'react'; - -export const usePrevious = ( - value, - comparator = (prev, current) => prev === current -) => { - const [state, setState] = useState({ - value: value, - prev: null - }); - - const current = state.value; - - if (!comparator(current, value)) { - setState({ - value: value, - prev: current - }); - } - - return state.prev; -}; diff --git a/src/views/preview/presentation.jsx b/src/views/preview/presentation.jsx index 70dcd8932..c37bf49ef 100644 --- a/src/views/preview/presentation.jsx +++ b/src/views/preview/presentation.jsx @@ -153,6 +153,7 @@ const PreviewPresentation = ({ const [canViewProjectJourney, setCanViewProjectJourney] = useState( queryString.parse(location.search, {parseBooleans: true}).showJourney ); + const [shouldStopProject, setShouldStopProject] = useState(false); const shareDate = ((projectInfo.history && projectInfo.history.shared)) ? projectInfo.history.shared : ''; const revisedDate = ((projectInfo.history && projectInfo.history.modified)) ? projectInfo.history.modified : ''; const showInstructions = editable || projectInfo.instructions || @@ -263,7 +264,10 @@ const PreviewPresentation = ({ { isProjectLoaded && canViewProjectJourney && - + } {showEmailConfirmationBanner && diff --git a/src/views/preview/project-view.jsx b/src/views/preview/project-view.jsx index 10f09ac11..7f94b4018 100644 --- a/src/views/preview/project-view.jsx +++ b/src/views/preview/project-view.jsx @@ -57,14 +57,14 @@ const IntlGUIWithProjectHandler = ({...props}) => { const isTutorialOpen = !!queryString.parse(location.search).tutorial; if ( + (prevProjectId === 0 || prevProjectId === '0') && props.projectId && - prevProjectId === '0' && props.projectId !== '0' && !isTutorialOpen ) { setShowJourney(true); } - }, [props.projectId, prevProjectId, location]); + }, [props.projectId, prevProjectId]); return ( <> @@ -73,6 +73,7 @@ const IntlGUIWithProjectHandler = ({...props}) => { )} {canViewTutorialsHighlight && ( diff --git a/static/images/onboarding-journeys/Animation-Icon.png b/static/images/onboarding-journeys/Animation-Icon.png deleted file mode 100644 index 1d13a85c0..000000000 Binary files a/static/images/onboarding-journeys/Animation-Icon.png and /dev/null differ diff --git a/static/images/onboarding-journeys/Animation-Icon.svg b/static/images/onboarding-journeys/Animation-Icon.svg new file mode 100644 index 000000000..80483ace8 --- /dev/null +++ b/static/images/onboarding-journeys/Animation-Icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/onboarding-journeys/Games-Icon.png b/static/images/onboarding-journeys/Games-Icon.png deleted file mode 100644 index 071762baa..000000000 Binary files a/static/images/onboarding-journeys/Games-Icon.png and /dev/null differ diff --git a/static/images/onboarding-journeys/Games-Icon.svg b/static/images/onboarding-journeys/Games-Icon.svg new file mode 100644 index 000000000..116bbab6b --- /dev/null +++ b/static/images/onboarding-journeys/Games-Icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/onboarding-journeys/Music-Icon.png b/static/images/onboarding-journeys/Music-Icon.png deleted file mode 100644 index 87e8a6ba9..000000000 Binary files a/static/images/onboarding-journeys/Music-Icon.png and /dev/null differ diff --git a/static/images/onboarding-journeys/Music-Icon.svg b/static/images/onboarding-journeys/Music-Icon.svg new file mode 100644 index 000000000..5dcde8d4b --- /dev/null +++ b/static/images/onboarding-journeys/Music-Icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/onboarding-journeys/On-Own-Icon.png b/static/images/onboarding-journeys/On-Own-Icon.png deleted file mode 100644 index e9468d46e..000000000 Binary files a/static/images/onboarding-journeys/On-Own-Icon.png and /dev/null differ diff --git a/static/images/onboarding-journeys/On-Own-Icon.svg b/static/images/onboarding-journeys/On-Own-Icon.svg new file mode 100644 index 000000000..9e827aeee --- /dev/null +++ b/static/images/onboarding-journeys/On-Own-Icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/onboarding-journeys/Starter-Projects-Icon.png b/static/images/onboarding-journeys/Starter-Projects-Icon.png deleted file mode 100644 index 4e752deec..000000000 Binary files a/static/images/onboarding-journeys/Starter-Projects-Icon.png and /dev/null differ diff --git a/static/images/onboarding-journeys/Starter-Projects-Icon.svg b/static/images/onboarding-journeys/Starter-Projects-Icon.svg new file mode 100644 index 000000000..1828a5910 --- /dev/null +++ b/static/images/onboarding-journeys/Starter-Projects-Icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/onboarding-journeys/Tutorials-Icon.png b/static/images/onboarding-journeys/Tutorials-Icon.png deleted file mode 100644 index 0855c5665..000000000 Binary files a/static/images/onboarding-journeys/Tutorials-Icon.png and /dev/null differ diff --git a/static/images/onboarding-journeys/Tutorials-Icon.svg b/static/images/onboarding-journeys/Tutorials-Icon.svg new file mode 100644 index 000000000..7865ebe19 --- /dev/null +++ b/static/images/onboarding-journeys/Tutorials-Icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/webpack.config.js b/webpack.config.js index 304e7aae1..fc7eddbaa 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -272,11 +272,11 @@ module.exports = { 'process.env.ASSET_HOST': `"${process.env.ASSET_HOST || 'https://assets.scratch.mit.edu'}"`, 'process.env.BACKPACK_HOST': `"${process.env.BACKPACK_HOST || 'https://backpack.scratch.mit.edu'}"`, 'process.env.CLOUDDATA_HOST': `"${process.env.CLOUDDATA_HOST || 'clouddata.scratch.mit.edu'}"`, - 'process.env.PROJECT_HOST': `"${process.env.PROJECT_HOST || 'http://localhost:8444'}"`, + 'process.env.PROJECT_HOST': `"${process.env.PROJECT_HOST || 'https://projects.scratch.mit.edu'}"`, 'process.env.STATIC_HOST': `"${process.env.STATIC_HOST || 'https://uploads.scratch.mit.edu'}"`, 'process.env.SCRATCH_ENV': `"${process.env.SCRATCH_ENV || 'development'}"`, - 'process.env.THUMBNAIL_URI': `"${process.env.THUMBNAIL_URI || '/projects/{}/thumbnail'}"`, - 'process.env.THUMBNAIL_HOST': `"${process.env.THUMBNAIL_HOST || 'http://localhost:4001'}"`, + 'process.env.THUMBNAIL_URI': `"${process.env.THUMBNAIL_URI || '/internalapi/project/thumbnail/{}/set/'}"`, + 'process.env.THUMBNAIL_HOST': `"${process.env.THUMBNAIL_HOST || ''}"`, 'process.env.DEBUG': Boolean(process.env.DEBUG), 'process.env.GA_ID': `"${process.env.GA_ID || 'UA-000000-01'}"`, 'process.env.GTM_ENV_AUTH': `"${process.env.GTM_ENV_AUTH || ''}"`,