diff --git a/src/app.js b/src/scripts/app.js similarity index 95% rename from src/app.js rename to src/scripts/app.js index 034e657..05f1397 100644 --- a/src/app.js +++ b/src/scripts/app.js @@ -1,8 +1,8 @@ import React from 'react'; import { createRoot } from 'react-dom/client'; -import Main from './components/Main'; -import { H5PContext } from './context/H5PContext'; -import './playlist-widget/widget'; +import Main from '@components/Main.js'; +import { H5PContext } from '@context/H5PContext.js'; +import '@scripts/playlist-widget/widget.js'; export default class NDLAThreeImage { /** diff --git a/src/components/ControlBar/ControlBar.js b/src/scripts/components/ControlBar/ControlBar.js similarity index 91% rename from src/components/ControlBar/ControlBar.js rename to src/scripts/components/ControlBar/ControlBar.js index 0bbe8a2..e31fb88 100644 --- a/src/components/ControlBar/ControlBar.js +++ b/src/scripts/components/ControlBar/ControlBar.js @@ -1,13 +1,13 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { SceneEditingType } from '../EditingDialog/SceneEditor'; +import { SceneEditingType } from '@components/EditingDialog/SceneEditor.js'; +import { H5PContext } from '@context/H5PContext.js'; +import { SceneTypes } from '@components/Scene/Scene.js'; +import { getSceneFromId } from '@h5phelpers/sceneParams.js'; +import SceneList from './SceneSelector/SceneList.js'; +import SceneSelectorSubmenu from './SceneSelector/Row/Submenu/SceneSelectorSubmenu.js'; +import SceneSelector from './SceneSelector/SceneSelector.js'; import './ControlBar.scss'; -import { H5PContext } from '../../context/H5PContext'; -import { SceneTypes } from '../Scene/Scene'; -import { getSceneFromId } from '../../h5phelpers/sceneParams'; -import SceneList from './SceneSelector/SceneList'; -import SceneSelectorSubmenu from './SceneSelector/Row/Submenu/SceneSelectorSubmenu'; -import SceneSelector from './SceneSelector/SceneSelector'; export default class ControlBar extends Component { /** diff --git a/src/components/ControlBar/ControlBar.scss b/src/scripts/components/ControlBar/ControlBar.scss similarity index 100% rename from src/components/ControlBar/ControlBar.scss rename to src/scripts/components/ControlBar/ControlBar.scss diff --git a/src/components/ControlBar/SceneSelector/ExpandedSceneSelector.js b/src/scripts/components/ControlBar/SceneSelector/ExpandedSceneSelector.js similarity index 100% rename from src/components/ControlBar/SceneSelector/ExpandedSceneSelector.js rename to src/scripts/components/ControlBar/SceneSelector/ExpandedSceneSelector.js diff --git a/src/components/ControlBar/SceneSelector/ExpandedSceneSelector.scss b/src/scripts/components/ControlBar/SceneSelector/ExpandedSceneSelector.scss similarity index 100% rename from src/components/ControlBar/SceneSelector/ExpandedSceneSelector.scss rename to src/scripts/components/ControlBar/SceneSelector/ExpandedSceneSelector.scss diff --git a/src/components/ControlBar/SceneSelector/Row/ActiveSceneRow.js b/src/scripts/components/ControlBar/SceneSelector/Row/ActiveSceneRow.js similarity index 90% rename from src/components/ControlBar/SceneSelector/Row/ActiveSceneRow.js rename to src/scripts/components/ControlBar/SceneSelector/Row/ActiveSceneRow.js index 032f304..52d271b 100644 --- a/src/components/ControlBar/SceneSelector/Row/ActiveSceneRow.js +++ b/src/scripts/components/ControlBar/SceneSelector/Row/ActiveSceneRow.js @@ -1,8 +1,8 @@ +import PropTypes from 'prop-types'; import React from 'react'; -import { sceneType } from '../../../../types/types'; +import { sceneType } from '@types/types'; +import { SceneTypes } from '@components/Scene/Scene.js'; import './ActiveSceneRow.scss'; -import { SceneTypes } from '../../../Scene/Scene'; -import PropTypes from 'prop-types'; /** * @param {object} props React props. diff --git a/src/components/ControlBar/SceneSelector/Row/ActiveSceneRow.scss b/src/scripts/components/ControlBar/SceneSelector/Row/ActiveSceneRow.scss similarity index 94% rename from src/components/ControlBar/SceneSelector/Row/ActiveSceneRow.scss rename to src/scripts/components/ControlBar/SceneSelector/Row/ActiveSceneRow.scss index b942fbe..8deb0f2 100644 --- a/src/components/ControlBar/SceneSelector/Row/ActiveSceneRow.scss +++ b/src/scripts/components/ControlBar/SceneSelector/Row/ActiveSceneRow.scss @@ -1,4 +1,4 @@ -@import '../../../../styles/icons'; +@import '@styles/icons.scss'; .active-scene { padding: 0.5em; diff --git a/src/components/ControlBar/SceneSelector/Row/SceneRow.js b/src/scripts/components/ControlBar/SceneSelector/Row/SceneRow.js similarity index 94% rename from src/components/ControlBar/SceneSelector/Row/SceneRow.js rename to src/scripts/components/ControlBar/SceneSelector/Row/SceneRow.js index 14b2201..abb334c 100644 --- a/src/components/ControlBar/SceneSelector/Row/SceneRow.js +++ b/src/scripts/components/ControlBar/SceneSelector/Row/SceneRow.js @@ -1,9 +1,8 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { SceneTypes } from '../../../Scene/Scene'; +import { SceneTypes } from '@components/Scene/Scene.js'; +import { H5PContext, getImageSource } from '@context/H5PContext.js'; import './SceneRow.scss'; -import { getImageSource } from '../../../../context/H5PContext'; -import { H5PContext } from '../../../../context/H5PContext'; export default class SceneRow extends Component { /** diff --git a/src/components/ControlBar/SceneSelector/Row/SceneRow.scss b/src/scripts/components/ControlBar/SceneSelector/Row/SceneRow.scss similarity index 98% rename from src/components/ControlBar/SceneSelector/Row/SceneRow.scss rename to src/scripts/components/ControlBar/SceneSelector/Row/SceneRow.scss index 2271a30..dae95e1 100644 --- a/src/components/ControlBar/SceneSelector/Row/SceneRow.scss +++ b/src/scripts/components/ControlBar/SceneSelector/Row/SceneRow.scss @@ -1,4 +1,4 @@ -@import '../../../../styles/icons'; +@import '@styles/icons.scss'; .h5p-scene-row { padding: 0.625em; diff --git a/src/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.js b/src/scripts/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.js similarity index 100% rename from src/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.js rename to src/scripts/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.js diff --git a/src/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.scss b/src/scripts/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.scss similarity index 97% rename from src/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.scss rename to src/scripts/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.scss index 1879858..d03eaff 100644 --- a/src/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.scss +++ b/src/scripts/components/ControlBar/SceneSelector/Row/Submenu/SceneSelectorSubmenu.scss @@ -1,4 +1,4 @@ -@import '../../../../../styles/icons'; +@import '@styles/icons.scss'; .scene-selector-submenu { display: inline-block; diff --git a/src/components/ControlBar/SceneSelector/SceneList.js b/src/scripts/components/ControlBar/SceneSelector/SceneList.js similarity index 100% rename from src/components/ControlBar/SceneSelector/SceneList.js rename to src/scripts/components/ControlBar/SceneSelector/SceneList.js diff --git a/src/components/ControlBar/SceneSelector/SceneSelector.js b/src/scripts/components/ControlBar/SceneSelector/SceneSelector.js similarity index 91% rename from src/components/ControlBar/SceneSelector/SceneSelector.js rename to src/scripts/components/ControlBar/SceneSelector/SceneSelector.js index 8b6ea51..982af1e 100644 --- a/src/components/ControlBar/SceneSelector/SceneSelector.js +++ b/src/scripts/components/ControlBar/SceneSelector/SceneSelector.js @@ -1,9 +1,9 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { H5PContext } from '../../../context/H5PContext'; +import { H5PContext } from '@context/H5PContext.js'; +import ActiveSceneRow from './Row/ActiveSceneRow.js'; +import ExpandedSceneSelector from './ExpandedSceneSelector.js'; import './SceneSelector.scss'; -import ActiveSceneRow from './Row/ActiveSceneRow'; -import ExpandedSceneSelector from './ExpandedSceneSelector'; export default class SceneSelector extends React.Component { /** diff --git a/src/components/ControlBar/SceneSelector/SceneSelector.scss b/src/scripts/components/ControlBar/SceneSelector/SceneSelector.scss similarity index 96% rename from src/components/ControlBar/SceneSelector/SceneSelector.scss rename to src/scripts/components/ControlBar/SceneSelector/SceneSelector.scss index 638741d..fa1e141 100644 --- a/src/components/ControlBar/SceneSelector/SceneSelector.scss +++ b/src/scripts/components/ControlBar/SceneSelector/SceneSelector.scss @@ -1,4 +1,4 @@ -@import '../../../styles/icons'; +@import '@styles/icons.scss'; .scene-selector-wrapper { position: relative; @@ -64,4 +64,4 @@ .h5p-select-handle:before { font-family: "360-image"; content: $dropdown; -} \ No newline at end of file +} diff --git a/src/components/EditingDialog/EditingDialog.js b/src/scripts/components/EditingDialog/EditingDialog.js similarity index 100% rename from src/components/EditingDialog/EditingDialog.js rename to src/scripts/components/EditingDialog/EditingDialog.js diff --git a/src/components/EditingDialog/EditingDialog.scss b/src/scripts/components/EditingDialog/EditingDialog.scss similarity index 100% rename from src/components/EditingDialog/EditingDialog.scss rename to src/scripts/components/EditingDialog/EditingDialog.scss diff --git a/src/components/EditingDialog/GoToScene/GoToSceneWrapper.js b/src/scripts/components/EditingDialog/GoToScene/GoToSceneWrapper.js similarity index 93% rename from src/components/EditingDialog/GoToScene/GoToSceneWrapper.js rename to src/scripts/components/EditingDialog/GoToScene/GoToSceneWrapper.js index f28ebd0..dfeab32 100644 --- a/src/components/EditingDialog/GoToScene/GoToSceneWrapper.js +++ b/src/scripts/components/EditingDialog/GoToScene/GoToSceneWrapper.js @@ -1,8 +1,8 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import GoToScene from './Selector/GoToScene'; -import { createSceneForm, getDefaultSceneParams } from '../../../h5phelpers/forms/sceneForm'; -import { H5PContext } from '../../../context/H5PContext'; +import GoToScene from './Selector/GoToScene.js'; +import { createSceneForm, getDefaultSceneParams } from '@h5phelpers/forms/sceneForm.js'; +import { H5PContext } from '@context/H5PContext.js'; export default class GoToSceneWrapper extends Component { /** diff --git a/src/components/EditingDialog/GoToScene/Selector/GoToScene.js b/src/scripts/components/EditingDialog/GoToScene/Selector/GoToScene.js similarity index 94% rename from src/components/EditingDialog/GoToScene/Selector/GoToScene.js rename to src/scripts/components/EditingDialog/GoToScene/Selector/GoToScene.js index 7b7aaa5..c8e5239 100644 --- a/src/components/EditingDialog/GoToScene/Selector/GoToScene.js +++ b/src/scripts/components/EditingDialog/GoToScene/Selector/GoToScene.js @@ -1,8 +1,8 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { H5PContext } from '../../../../context/H5PContext'; +import { H5PContext } from '@context/H5PContext.js'; +import GoToSceneSelector from './GoToSceneSelector.js'; import './GoToScene.scss'; -import GoToSceneSelector from './GoToSceneSelector'; export default class GoToScene extends Component { /** diff --git a/src/components/EditingDialog/GoToScene/Selector/GoToScene.scss b/src/scripts/components/EditingDialog/GoToScene/Selector/GoToScene.scss similarity index 100% rename from src/components/EditingDialog/GoToScene/Selector/GoToScene.scss rename to src/scripts/components/EditingDialog/GoToScene/Selector/GoToScene.scss diff --git a/src/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.js b/src/scripts/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.js similarity index 92% rename from src/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.js rename to src/scripts/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.js index b26521b..07cc4f6 100644 --- a/src/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.js +++ b/src/scripts/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.js @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import SceneList from '../../../ControlBar/SceneSelector/SceneList'; +import SceneList from '@components/ControlBar/SceneSelector/SceneList.js'; import './GoToSceneSelector.scss'; /** diff --git a/src/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.scss b/src/scripts/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.scss similarity index 100% rename from src/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.scss rename to src/scripts/components/EditingDialog/GoToScene/Selector/GoToSceneSelector.scss diff --git a/src/components/EditingDialog/InteractionEditor.js b/src/scripts/components/EditingDialog/InteractionEditor.js similarity index 93% rename from src/components/EditingDialog/InteractionEditor.js rename to src/scripts/components/EditingDialog/InteractionEditor.js index a6e2474..4e696c8 100644 --- a/src/components/EditingDialog/InteractionEditor.js +++ b/src/scripts/components/EditingDialog/InteractionEditor.js @@ -1,19 +1,19 @@ import React from 'react'; import PropTypes from 'prop-types'; -import EditingDialog from './EditingDialog'; -import { H5PContext } from '../../context/H5PContext'; -import './InteractionEditor.scss'; -import { SceneTypes } from '../Scene/Scene'; -import { getDefaultLibraryParams, isGoToScene } from '../../h5phelpers/libraryParams'; -import { getSceneFromId } from '../../h5phelpers/sceneParams'; -import { getLibraryDataFromFields } from '../../h5phelpers/editorForms'; +import EditingDialog from './EditingDialog.js'; +import { H5PContext } from '@context/H5PContext.js'; +import { SceneTypes } from '@components/Scene/Scene.js'; +import { getDefaultLibraryParams, isGoToScene } from '@h5phelpers/libraryParams.js'; +import { getSceneFromId } from '@h5phelpers/sceneParams.js'; +import { getLibraryDataFromFields } from '@h5phelpers/editorForms.js'; import { createInteractionForm, sanitizeInteractionParams, validateInteractionForm -} from '../../h5phelpers/forms/interactionForm'; -import GoToSceneWrapper from './GoToScene/GoToSceneWrapper'; -import { sanitizeSceneForm, sanitizeInteractionGeometry, validateSceneForm } from '../../h5phelpers/forms/sceneForm'; +} from '@h5phelpers/forms/interactionForm.js'; +import GoToSceneWrapper from './GoToScene/GoToSceneWrapper.js'; +import { sanitizeSceneForm, sanitizeInteractionGeometry, validateSceneForm } from '@h5phelpers/forms/sceneForm.js'; +import './InteractionEditor.scss'; export const InteractionEditingType = { NOT_EDITING: null, diff --git a/src/components/EditingDialog/InteractionEditor.scss b/src/scripts/components/EditingDialog/InteractionEditor.scss similarity index 96% rename from src/components/EditingDialog/InteractionEditor.scss rename to src/scripts/components/EditingDialog/InteractionEditor.scss index 76427bc..92df18b 100644 --- a/src/components/EditingDialog/InteractionEditor.scss +++ b/src/scripts/components/EditingDialog/InteractionEditor.scss @@ -1,4 +1,4 @@ -@import "../../styles/icons"; +@import "@styles/icons.scss"; .h5p-editing-dialog-body { .field.library .libwrap { @@ -12,7 +12,7 @@ .semantics-wrapper{ &.go-to-scene { margin-top: 0; - + .library { display: none; } @@ -78,4 +78,4 @@ .h5p-blanks:before { content: $blanks; } -} \ No newline at end of file +} diff --git a/src/components/EditingDialog/SceneEditor.js b/src/scripts/components/EditingDialog/SceneEditor.js similarity index 88% rename from src/components/EditingDialog/SceneEditor.js rename to src/scripts/components/EditingDialog/SceneEditor.js index b19138a..50feee7 100644 --- a/src/components/EditingDialog/SceneEditor.js +++ b/src/scripts/components/EditingDialog/SceneEditor.js @@ -1,18 +1,18 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { editingSceneType } from '../../types/types'; -import EditingDialog from './EditingDialog'; -import { H5PContext } from '../../context/H5PContext'; -import './SceneEditor.scss'; -import { getSceneFromId } from '../../h5phelpers/sceneParams'; -import { createSceneForm } from '../../h5phelpers/forms/sceneForm'; -import { showConfirmationDialog } from '../../h5phelpers/h5pComponents'; +import { editingSceneType } from '@types/types.js'; +import EditingDialog from './EditingDialog.js'; +import { H5PContext } from '@context/H5PContext.js'; +import { getSceneFromId } from '@h5phelpers/sceneParams.js'; +import { createSceneForm } from '@h5phelpers/forms/sceneForm.js'; +import { showConfirmationDialog } from '@h5phelpers/h5pComponents.js'; import { getDefaultSceneParams, isInteractionsValid, sanitizeSceneForm, validateSceneForm -} from '../../h5phelpers/forms/sceneForm'; +} from '@h5phelpers/forms/sceneForm.js'; +import './SceneEditor.scss'; export const SceneEditingType = { NOT_EDITING: null, diff --git a/src/components/EditingDialog/SceneEditor.scss b/src/scripts/components/EditingDialog/SceneEditor.scss similarity index 77% rename from src/components/EditingDialog/SceneEditor.scss rename to src/scripts/components/EditingDialog/SceneEditor.scss index d0ebf9e..1fda78d 100644 --- a/src/components/EditingDialog/SceneEditor.scss +++ b/src/scripts/components/EditingDialog/SceneEditor.scss @@ -1,8 +1,8 @@ -@import '../../styles/icons'; +@import '@styles/icons.scss'; .h5p-editing-dialog-header { .title.scene:before { font-family: "360-image"; content: $scene; } -} \ No newline at end of file +} diff --git a/src/components/InteractionsBar/InteractionsBar.js b/src/scripts/components/InteractionsBar/InteractionsBar.js similarity index 95% rename from src/components/InteractionsBar/InteractionsBar.js rename to src/scripts/components/InteractionsBar/InteractionsBar.js index fafdbc9..f766df4 100644 --- a/src/components/InteractionsBar/InteractionsBar.js +++ b/src/scripts/components/InteractionsBar/InteractionsBar.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import './InteractionsBar.scss'; -import { getLibraries, H5PContext } from '../../context/H5PContext'; +import { getLibraries, H5PContext } from '@context/H5PContext.js'; export default class InteractionsBar extends React.Component { /** diff --git a/src/components/InteractionsBar/InteractionsBar.scss b/src/scripts/components/InteractionsBar/InteractionsBar.scss similarity index 98% rename from src/components/InteractionsBar/InteractionsBar.scss rename to src/scripts/components/InteractionsBar/InteractionsBar.scss index d6d3774..1708f18 100644 --- a/src/components/InteractionsBar/InteractionsBar.scss +++ b/src/scripts/components/InteractionsBar/InteractionsBar.scss @@ -1,4 +1,4 @@ -@import "../../styles/icons"; +@import "@styles/icons.scss"; .h5p-interactions-bar { padding: 0.5em; diff --git a/src/components/Main.js b/src/scripts/components/Main.js similarity index 95% rename from src/components/Main.js rename to src/scripts/components/Main.js index 7d1770c..1c0e186 100644 --- a/src/components/Main.js +++ b/src/scripts/components/Main.js @@ -1,16 +1,16 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Scene, { SceneTypes } from './Scene/Scene'; -import ControlBar from './ControlBar/ControlBar'; -import SceneEditor, { SceneEditingType } from './EditingDialog/SceneEditor'; -import InteractionsBar from './InteractionsBar/InteractionsBar'; -import './Main.scss'; -import InteractionEditor, { InteractionEditingType } from './EditingDialog/InteractionEditor'; -import { H5PContext } from '../context/H5PContext'; -import { deleteScene, getSceneFromId, setScenePositionFromCamera, updateScene } from '../h5phelpers/sceneParams'; -import { getInteractionFromElement, isGoToScene, updatePosition } from '../h5phelpers/libraryParams'; -import { showConfirmationDialog } from '../h5phelpers/h5pComponents'; -import { addBehavioralListeners } from '../h5phelpers/editorForms'; +import Scene, { SceneTypes } from '@components/Scene/Scene.js'; +import ControlBar from './ControlBar/ControlBar.js'; +import SceneEditor, { SceneEditingType } from '@components/EditingDialog/SceneEditor.js'; +import InteractionsBar from '@components/InteractionsBar/InteractionsBar.js'; +import InteractionEditor, { InteractionEditingType } from '@components/EditingDialog/InteractionEditor.js'; +import { H5PContext } from '@context/H5PContext.js'; +import { deleteScene, getSceneFromId, setScenePositionFromCamera, updateScene } from '@h5phelpers/sceneParams.js'; +import { getInteractionFromElement, isGoToScene, updatePosition } from '@h5phelpers/libraryParams.js'; +import { showConfirmationDialog } from '@h5phelpers/h5pComponents.js'; +import { addBehavioralListeners } from '@h5phelpers/editorForms.js'; +import '@components/Main.scss'; export default class Main extends React.Component { /** diff --git a/src/components/Main.scss b/src/scripts/components/Main.scss similarity index 76% rename from src/components/Main.scss rename to src/scripts/components/Main.scss index eac618a..18ec55f 100644 --- a/src/components/Main.scss +++ b/src/scripts/components/Main.scss @@ -1,10 +1,10 @@ @font-face { font-family: '360-image'; - src: url('../assets/360-image.eot?nghxo3'); - src: url('../assets/360-image.eot?nghxo3#iefix') format('embedded-opentype'), - url('../assets/360-image.ttf?nghxo3') format('truetype'), - url('../assets/360-image.woff?nghxo3') format('woff'), - url('../assets/360-image.svg?nghxo3#360-image') format('svg'); + src: url('@assets/360-image.eot?nghxo3'); + src: url('@assets/360-image.eot?nghxo3#iefix') format('embedded-opentype'), + url('@assets/360-image.ttf?nghxo3') format('truetype'), + url('@assets/360-image.woff?nghxo3') format('woff'), + url('@assets/360-image.svg?nghxo3#360-image') format('svg'); font-weight: normal; font-style: normal; } diff --git a/src/components/Scene/NoScene.js b/src/scripts/components/Scene/NoScene.js similarity index 90% rename from src/components/Scene/NoScene.js rename to src/scripts/components/Scene/NoScene.js index 21ee846..d1c53a5 100644 --- a/src/components/Scene/NoScene.js +++ b/src/scripts/components/Scene/NoScene.js @@ -1,6 +1,6 @@ import React from 'react'; +import { H5PContext } from '@context/H5PContext.js'; import './NoScene.scss'; -import { H5PContext } from '../../context/H5PContext'; export default class NoScene extends React.Component { /** diff --git a/src/components/Scene/NoScene.scss b/src/scripts/components/Scene/NoScene.scss similarity index 60% rename from src/components/Scene/NoScene.scss rename to src/scripts/components/Scene/NoScene.scss index c8bb7f3..d92b275 100644 --- a/src/components/Scene/NoScene.scss +++ b/src/scripts/components/Scene/NoScene.scss @@ -1,4 +1,4 @@ -@import '../../styles/icons'; +@import '@styles/icons.scss'; .no-scene-container { min-height: 30em; diff --git a/src/components/Scene/Scene.js b/src/scripts/components/Scene/Scene.js similarity index 95% rename from src/components/Scene/Scene.js rename to src/scripts/components/Scene/Scene.js index 9415138..cafe153 100644 --- a/src/components/Scene/Scene.js +++ b/src/scripts/components/Scene/Scene.js @@ -1,9 +1,9 @@ import React from 'react'; import PropTypes from 'prop-types'; import NoScene from './NoScene'; +import { H5PContext } from '@context/H5PContext.js'; +import { initializeThreeSixtyPreview } from '@h5phelpers/h5pComponents.js'; import './Scene.scss'; -import { H5PContext } from '../../context/H5PContext'; -import { initializeThreeSixtyPreview } from '../../h5phelpers/h5pComponents'; export const SceneTypes = { THREE_SIXTY_SCENE: '360', diff --git a/src/components/Scene/Scene.scss b/src/scripts/components/Scene/Scene.scss similarity index 100% rename from src/components/Scene/Scene.scss rename to src/scripts/components/Scene/Scene.scss diff --git a/src/context/H5PContext.js b/src/scripts/context/H5PContext.js similarity index 93% rename from src/context/H5PContext.js rename to src/scripts/context/H5PContext.js index cb5ac08..4a1cb98 100644 --- a/src/context/H5PContext.js +++ b/src/scripts/context/H5PContext.js @@ -1,5 +1,5 @@ import React from 'react'; -import { getInteractionsField } from '../h5phelpers/editorForms'; +import { getInteractionsField } from '@h5phelpers/editorForms.js'; /** * Get loaded libraries that are available of the ones defined by action diff --git a/src/h5phelpers/editorForms.js b/src/scripts/h5phelpers/editorForms.js similarity index 98% rename from src/h5phelpers/editorForms.js rename to src/scripts/h5phelpers/editorForms.js index 967388e..0e67be8 100644 --- a/src/h5phelpers/editorForms.js +++ b/src/scripts/h5phelpers/editorForms.js @@ -1,4 +1,4 @@ -import { getLibraries } from '../context/H5PContext'; +import { getLibraries } from '@context/H5PContext.js'; /** * Get scenes field from Three Image semantics structure. diff --git a/src/h5phelpers/forms/interactionForm.js b/src/scripts/h5phelpers/forms/interactionForm.js similarity index 97% rename from src/h5phelpers/forms/interactionForm.js rename to src/scripts/h5phelpers/forms/interactionForm.js index ecb3441..52aafda 100644 --- a/src/h5phelpers/forms/interactionForm.js +++ b/src/scripts/h5phelpers/forms/interactionForm.js @@ -1,4 +1,4 @@ -import { getInteractionsField, areChildrenValid } from '../editorForms'; +import { getInteractionsField, areChildrenValid } from '@h5phelpers/editorForms.js'; /** * Create interaction form and append it to wrapper. diff --git a/src/h5phelpers/forms/playlistForm.js b/src/scripts/h5phelpers/forms/playlistForm.js similarity index 93% rename from src/h5phelpers/forms/playlistForm.js rename to src/scripts/h5phelpers/forms/playlistForm.js index 5340c52..51a22f5 100644 --- a/src/h5phelpers/forms/playlistForm.js +++ b/src/scripts/h5phelpers/forms/playlistForm.js @@ -1,4 +1,4 @@ -import { getPlaylistField, areChildrenValid } from '../editorForms'; +import { getPlaylistField, areChildrenValid } from '@h5phelpers/editorForms.js'; /** * Creates playlist form and appends it to wrapper diff --git a/src/h5phelpers/forms/sceneForm.js b/src/scripts/h5phelpers/forms/sceneForm.js similarity index 98% rename from src/h5phelpers/forms/sceneForm.js rename to src/scripts/h5phelpers/forms/sceneForm.js index bad82b0..7910d20 100644 --- a/src/h5phelpers/forms/sceneForm.js +++ b/src/scripts/h5phelpers/forms/sceneForm.js @@ -1,5 +1,5 @@ -import { getSceneField, areChildrenValid } from '../editorForms'; -import { SceneTypes } from './../../components/Scene/Scene'; +import { getSceneField, areChildrenValid } from '@h5phelpers/editorForms.js'; +import { SceneTypes } from '@components/Scene/Scene.js'; /** @typedef {{ playlistId: string, title: string, audioTracks: object }} Playlist */ /** @typedef {{ playlist: Playlist }} Scene */ diff --git a/src/h5phelpers/h5pComponents.js b/src/scripts/h5phelpers/h5pComponents.js similarity index 100% rename from src/h5phelpers/h5pComponents.js rename to src/scripts/h5phelpers/h5pComponents.js diff --git a/src/h5phelpers/libraryParams.js b/src/scripts/h5phelpers/libraryParams.js similarity index 100% rename from src/h5phelpers/libraryParams.js rename to src/scripts/h5phelpers/libraryParams.js diff --git a/src/h5phelpers/playlistParams.js b/src/scripts/h5phelpers/playlistParams.js similarity index 90% rename from src/h5phelpers/playlistParams.js rename to src/scripts/h5phelpers/playlistParams.js index 2d9a275..26f2378 100644 --- a/src/h5phelpers/playlistParams.js +++ b/src/scripts/h5phelpers/playlistParams.js @@ -1,4 +1,4 @@ -import { PlaylistEditingType } from '../playlist-widget/widget-components/PlaylistEditor'; +import { PlaylistEditingType } from '@scripts/playlist-widget/widget-components/PlaylistEditor.js'; /** @typedef {{ playlistId: string, title: string, audioTracks: object }} Playlist */ diff --git a/src/h5phelpers/sceneParams.js b/src/scripts/h5phelpers/sceneParams.js similarity index 96% rename from src/h5phelpers/sceneParams.js rename to src/scripts/h5phelpers/sceneParams.js index b177ed4..b7706a9 100644 --- a/src/h5phelpers/sceneParams.js +++ b/src/scripts/h5phelpers/sceneParams.js @@ -1,4 +1,4 @@ -import { SceneEditingType } from '../components/EditingDialog/SceneEditor'; +import { SceneEditingType } from '@components/EditingDialog/SceneEditor.js'; import { isGoToScene } from './libraryParams'; /** @typedef {{ playlistId: string, title: string, audioTracks: object }} Playlist */ diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js similarity index 96% rename from src/playlist-widget/widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js index 1e7adff..1000959 100644 --- a/src/playlist-widget/widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js +++ b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import ChoosePlaylist from './Selector/ChoosePlaylist'; -import { H5PContext } from '../../../context/H5PContext'; +import { H5PContext } from '@context/H5PContext.js'; export default class ChoosePlaylistWrapper extends Component { /** diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.js b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.js similarity index 95% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.js rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.js index 1a5fcbf..0268d01 100644 --- a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.js +++ b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.js @@ -1,8 +1,8 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { H5PContext } from '../../../../context/H5PContext'; -import './ChoosePlaylist.scss'; +import { H5PContext } from '@context/H5PContext.js'; import ChoosePlaylistSelector from './ChoosePlaylistSelector'; +import './ChoosePlaylist.scss'; export default class ChoosePlaylist extends Component { /** diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.scss b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.scss similarity index 100% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.scss rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylist.scss diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.js b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.js similarity index 100% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.js rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.js diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.scss b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.scss similarity index 100% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.scss rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/ChoosePlaylistSelector.scss diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistList.js b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistList.js similarity index 100% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistList.js rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistList.js diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.js b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.js similarity index 97% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.js rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.js index ab8647d..ac81b7a 100644 --- a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.js +++ b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import { H5PContext } from '@context/H5PContext.js'; import './PlaylistRow.scss'; -import { H5PContext } from '../../../../../context/H5PContext'; export default class PlaylistRow extends Component { /** diff --git a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.scss b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.scss similarity index 97% rename from src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.scss rename to src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.scss index 8f567fc..c7bfe81 100644 --- a/src/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.scss +++ b/src/scripts/playlist-widget/widget-components/ChoosePlaylist/Selector/List/PlaylistRow.scss @@ -1,4 +1,4 @@ -@import '../../../../../styles/icons'; +@import '@styles/icons.scss'; .h5p-playlist-listitem { display: block; diff --git a/src/playlist-widget/widget-components/PlaylistEditor.js b/src/scripts/playlist-widget/widget-components/PlaylistEditor.js similarity index 90% rename from src/playlist-widget/widget-components/PlaylistEditor.js rename to src/scripts/playlist-widget/widget-components/PlaylistEditor.js index 8ad3b8e..a603e4e 100644 --- a/src/playlist-widget/widget-components/PlaylistEditor.js +++ b/src/scripts/playlist-widget/widget-components/PlaylistEditor.js @@ -1,15 +1,15 @@ import React from 'react'; import PropTypes from 'prop-types'; -import EditingDialog from '../../components/EditingDialog/EditingDialog'; -import { H5PContext } from '../../context/H5PContext'; -import './PlaylistEditor.scss'; -import { getPlaylistFromId } from '../../h5phelpers/playlistParams'; +import EditingDialog from '@components/EditingDialog/EditingDialog.js'; +import { H5PContext } from '@context/H5PContext.js'; +import { getPlaylistFromId } from '@h5phelpers/playlistParams.js'; import { createPlaylistForm, getDefaultPlaylistParams, validatePlaylistForm -} from '../../h5phelpers/forms/playlistForm'; -import { getFocussableElements } from '../../utils/dom'; +} from '@h5phelpers/forms/playlistForm.js'; +import { getFocussableElements } from '@scripts/utils/dom.js'; +import './PlaylistEditor.scss'; export const PlaylistEditingType = { NOT_EDITING: null, diff --git a/src/playlist-widget/widget-components/PlaylistEditor.scss b/src/scripts/playlist-widget/widget-components/PlaylistEditor.scss similarity index 87% rename from src/playlist-widget/widget-components/PlaylistEditor.scss rename to src/scripts/playlist-widget/widget-components/PlaylistEditor.scss index 2c46ce8..569d6fc 100644 --- a/src/playlist-widget/widget-components/PlaylistEditor.scss +++ b/src/scripts/playlist-widget/widget-components/PlaylistEditor.scss @@ -1,4 +1,4 @@ -@import '../../styles/icons'; +@import '@styles/icons.scss'; .h5p-editing-dialog-header { .title.playlist:before { diff --git a/src/playlist-widget/widget.js b/src/scripts/playlist-widget/widget.js similarity index 98% rename from src/playlist-widget/widget.js rename to src/scripts/playlist-widget/widget.js index adb5fea..9fc6a20 100644 --- a/src/playlist-widget/widget.js +++ b/src/scripts/playlist-widget/widget.js @@ -1,10 +1,10 @@ import React from 'react'; import { createRoot } from 'react-dom/client'; -import { updatePlaylist } from '../h5phelpers/playlistParams'; -import ChoosePlaylistWrapper from './widget-components/ChoosePlaylist/ChoosePlaylistWrapper'; +import { updatePlaylist } from '@h5phelpers/playlistParams.js'; +import ChoosePlaylistWrapper from './widget-components/ChoosePlaylist/ChoosePlaylistWrapper.js'; import PlaylistEditor, { PlaylistEditingType, -} from './widget-components/PlaylistEditor'; +} from './widget-components/PlaylistEditor.js'; import './widget.scss'; /** @typedef {{ playlistId: string, title: string, audioTracks: object }} Playlist */ diff --git a/src/playlist-widget/widget.scss b/src/scripts/playlist-widget/widget.scss similarity index 100% rename from src/playlist-widget/widget.scss rename to src/scripts/playlist-widget/widget.scss diff --git a/src/types/types.js b/src/scripts/types/types.js similarity index 74% rename from src/types/types.js rename to src/scripts/types/types.js index 73e64c0..34fb51c 100644 --- a/src/types/types.js +++ b/src/scripts/types/types.js @@ -1,6 +1,6 @@ import PropTypes from 'prop-types'; -import { SceneTypes } from '../components/Scene/Scene'; -import { InteractionEditingType } from '../components/EditingDialog/InteractionEditor'; +import { SceneTypes } from '@components/Scene/Scene.js'; +import { InteractionEditingType } from '@components/EditingDialog/InteractionEditor.js'; export const sceneType = PropTypes.shape({ sceneType: PropTypes.oneOf(Object.values(SceneTypes)).isRequired, @@ -14,4 +14,4 @@ export const sceneType = PropTypes.shape({ export const editingSceneType = PropTypes.oneOfType([ PropTypes.number, PropTypes.oneOf(Object.values(InteractionEditingType)), -]); \ No newline at end of file +]); diff --git a/src/utils/dom.js b/src/scripts/utils/dom.js similarity index 100% rename from src/utils/dom.js rename to src/scripts/utils/dom.js diff --git a/webpack.config.js b/webpack.config.js index b173316..daee31d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -7,13 +7,25 @@ const libraryName = process.env.npm_package_name; module.exports = { mode: mode, + resolve: { + alias: { + '@assets': path.resolve(__dirname, 'src/assets'), + '@components': path.resolve(__dirname, 'src/scripts/components'), + '@context': path.resolve(__dirname, 'src/scripts/context'), + '@h5phelpers': path.resolve(__dirname, 'src/scripts/h5phelpers'), + '@scripts': path.resolve(__dirname, 'src/scripts'), + '@services': path.resolve(__dirname, 'src/scripts/services'), + '@styles': path.resolve(__dirname, 'src/styles'), + '@types': path.resolve(__dirname, 'src/scripts/types'), + } + }, plugins: [ new MiniCssExtractPlugin({ filename: `${libraryName}.css` }) ], entry: { - dist: './src/app.js' + dist: './src/scripts/app.js' }, output: { filename: `${libraryName}.js`,