@plurid/plurid-react 0.0.0-25 → 0.0.0-28

package/distribution/index.js

@@ -308,6 +308,8 @@ const getSpace = state => state.space;
 
 const getLoading = state => state.space.loading;
 
+const getResolvedLayout = state => state.space.resolvedLayout;
+
 const getTransformMatrix = state => state.space.transform;
 
 const getAnimatedTransform = state => state.space.animatedTransform;
@@ -355,6 +357,7 @@ var selectors$3 = Object.freeze({
     __proto__: null,
     getSpace: getSpace,
     getLoading: getLoading,
+    getResolvedLayout: getResolvedLayout,
     getTransformMatrix: getTransformMatrix,
     getAnimatedTransform: getAnimatedTransform,
     getTransformTime: getTransformTime,
@@ -379,6 +382,7 @@ const {toRadians: toRadians} = pluridFunctions.mathematics.geometry;
 
 const initialState$2 = {
     loading: true,
+    resolvedLayout: false,
     transform: "matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1)",
     animatedTransform: false,
     transformTime: 450,
@@ -753,20 +757,6 @@ const store = store$1;
 
 const StateContext = React__default["default"].createContext({});
 
-const loadStateFromContext = (context, space) => {
-    if (!context) {
-        return;
-    }
-    if (!space) {
-        if (typeof window === "undefined") {
-            return;
-        }
-        const defaultContext = context.states[window.location.pathname];
-        return defaultContext;
-    }
-    return context.states[space];
-};
-
 function __awaiter(thisArg, _arguments, P, generator) {
     function adopt(value) {
         return value instanceof P ? value : new P((function(resolve) {
@@ -816,17 +806,8 @@ const {getTransformRotate: getTransformRotate, getTransformTranslate: getTransfo
 
 const {rotateMatrix: rotateMatrix$1, translateMatrix: translateMatrixArray, scaleMatrix: scaleMatrix$1, multiplyArrayOfMatrices: multiplyArrayOfMatrices$1} = matrix;
 
-const computeApplication = (planes, configuration, view) => {
+const computeApplication = (planes, configuration, view, origin = "origin") => {
     const appConfiguration = pluridEngine.general.configuration.merge(configuration);
-    if (planes) {
-        for (const plane of planes) {
-            const planeData = resolvePluridPlaneData(plane);
-            const linkPath = pluridEngine.routing.resolveRoute(planeData.route);
-            if (!linkPath) {
-                continue;
-            }
-        }
-    }
     const currentView = view || [];
     const absoluteView = [];
     for (const viewItem of currentView) {
@@ -838,7 +819,6 @@ const computeApplication = (planes, configuration, view) => {
             absoluteView.push(viewPath.route);
         }
     }
-    const origin = "localhost:63000";
     const registrar = new PluridPlanesRegistrar(planes, origin);
     const registrarPlanes = registrar.getAll();
     const spaceTree = new pluridEngine.space.tree.Tree({
@@ -1092,8 +1072,6 @@ const closeActivePlane = (state, pubsub) => {
     });
 };
 
-const {direction: directionLogic} = pluridEngine.interaction;
-
 const handleGlobalShortcuts = (dispatch, state, pubsub, event, firstPerson, locks) => {
     if (event.defaultPrevented) {
         return;
@@ -1103,128 +1081,165 @@ const handleGlobalShortcuts = (dispatch, state, pubsub, event, firstPerson, lock
         return;
     }
     const noModifiers = !event.shiftKey && !event.altKey && !event.ctrlKey && !event.metaKey;
+    const handleEvent = () => {
+        event.preventDefault();
+    };
     if (event.code === "KeyF" && noModifiers) {
+        handleEvent();
         return dispatch(actions.configuration.toggleConfigurationSpaceFirstPerson());
     }
     if (firstPerson) {
         if (event.code === "KeyW" && noModifiers && locks.translationZ) {
+            handleEvent();
             return dispatch(actions.space.viewCameraMoveForward());
         }
         if (event.code === "KeyS" && noModifiers && locks.translationZ) {
+            handleEvent();
             return dispatch(actions.space.viewCameraMoveBackward());
         }
         if (event.code === "KeyA" && noModifiers && locks.translationX) {
+            handleEvent();
             return dispatch(actions.space.viewCameraMoveLeft());
         }
         if (event.code === "KeyA" && event.shiftKey && locks.rotationY) {
+            handleEvent();
             return dispatch(actions.space.viewCameraTurnLeft());
         }
         if (event.code === "KeyD" && noModifiers && locks.translationX) {
+            handleEvent();
             return dispatch(actions.space.viewCameraMoveRight());
         }
         if (event.code === "KeyD" && event.shiftKey && locks.rotationY) {
+            handleEvent();
             return dispatch(actions.space.viewCameraTurnRight());
         }
         if (event.code === "KeyQ" && noModifiers && locks.rotationX) {
+            handleEvent();
             return dispatch(actions.space.viewCameraTurnUp());
         }
         if (event.code === "KeyZ" && noModifiers && locks.rotationX) {
+            handleEvent();
             return dispatch(actions.space.viewCameraTurnDown());
         }
         if (event.code === "KeyE" && noModifiers && locks.translationY) {
+            handleEvent();
             return dispatch(actions.space.viewCameraMoveUp());
         }
         if (event.code === "KeyC" && noModifiers && locks.translationY) {
+            handleEvent();
             return dispatch(actions.space.viewCameraMoveDown());
         }
     }
     if (event.code === "KeyR" && noModifiers) {
+        handleEvent();
         return dispatch(actions.configuration.setConfigurationSpaceTransformMode(pluridData.TRANSFORM_MODES.ROTATION));
     }
     if (event.code === "KeyT" && noModifiers) {
+        handleEvent();
         return dispatch(actions.configuration.setConfigurationSpaceTransformMode(pluridData.TRANSFORM_MODES.TRANSLATION));
     }
     if (event.code === "KeyS" && noModifiers && !firstPerson) {
+        handleEvent();
         return dispatch(actions.configuration.setConfigurationSpaceTransformMode(pluridData.TRANSFORM_MODES.SCALE));
     }
     if (event.key === "ArrowRight") {
         if (event.shiftKey && locks.rotationY) {
+            handleEvent();
             return dispatch(actions.space.rotateLeft());
         }
         if (event.altKey && locks.translationX) {
+            handleEvent();
             return dispatch(actions.space.translateRight());
         }
     }
     if (event.key === "ArrowLeft") {
         if (event.shiftKey && locks.rotationY) {
+            handleEvent();
             return dispatch(actions.space.rotateRight());
         }
         if (event.altKey && locks.translationX) {
+            handleEvent();
             return dispatch(actions.space.translateLeft());
         }
     }
     if (event.key === "ArrowUp") {
         if (event.shiftKey && event.altKey && locks.translationZ) {
+            handleEvent();
             return dispatch(actions.space.translateIn());
         }
         if (event.shiftKey && !event.altKey && locks.rotationX) {
+            handleEvent();
             return dispatch(actions.space.rotateUp());
         }
         if (event.altKey && !event.shiftKey && locks.translationY) {
+            handleEvent();
             return dispatch(actions.space.translateUp());
         }
         if (event.metaKey || event.ctrlKey && locks.scale) {
+            handleEvent();
             return dispatch(actions.space.scaleUp());
         }
     }
     if (event.key === "ArrowDown") {
         if (event.shiftKey && event.altKey && locks.translationZ) {
+            handleEvent();
             return dispatch(actions.space.translateOut());
         }
         if (event.shiftKey && !event.altKey && locks.rotationX) {
+            handleEvent();
             return dispatch(actions.space.rotateDown());
         }
         if (event.altKey && !event.shiftKey && locks.translationY) {
+            handleEvent();
             return dispatch(actions.space.translateDown());
         }
         if (event.metaKey || event.ctrlKey && locks.scale) {
+            handleEvent();
             return dispatch(actions.space.scaleDown());
         }
     }
     if (event.altKey && event.code === "KeyF") {
+        handleEvent();
         focusActivePlane(dispatch, state);
         return;
     }
     if (event.altKey && event.code === "KeyB") {
+        handleEvent();
         focusParentActivePlane(dispatch, state);
         return;
     }
     if (event.altKey && event.code === "KeyR") {
+        handleEvent();
         refreshActivePlane(state, pubsub);
         return;
     }
     if (event.altKey && event.code === "KeyE") {
+        handleEvent();
         isolateActivePlane(state, pubsub);
         return;
     }
     if (event.altKey && event.shiftKey && event.code === "KeyT") {
+        handleEvent();
         openClosedPlane(pubsub);
         return;
     }
     if (event.altKey && event.code === "KeyW") {
+        handleEvent();
         closeActivePlane(state, pubsub);
         return;
     }
     if (event.altKey && event.code === "KeyA") {
+        handleEvent();
         focusPreviousRoot(dispatch, state);
         return;
     }
     if (event.altKey && event.code === "KeyD") {
+        handleEvent();
         focusNextRoot(dispatch, state);
         return;
     }
     if (event.altKey && event.code === "Tab") {
-        event.preventDefault();
+        handleEvent();
         if (event.shiftKey) {
             focusPreviousRoot(dispatch, state);
         } else {
@@ -1233,6 +1248,7 @@ const handleGlobalShortcuts = (dispatch, state, pubsub, event, firstPerson, lock
         return;
     }
     if (event.altKey && event.code.startsWith("Digit")) {
+        handleEvent();
         const index = parseInt(event.code.replace("Digit", "")) - 1;
         focusRootIndex(dispatch, state, index);
         return;
@@ -1249,7 +1265,7 @@ const handleGlobalWheel = (dispatch, event, modes, locks) => {
         deltaY: event.deltaY
     };
     const absoluteThreshold = 100;
-    const direction = directionLogic.getWheelDirection(deltas, absoluteThreshold);
+    const direction = pluridEngine.interaction.direction.getWheelDirection(deltas, absoluteThreshold);
     if (modes.rotation) {
         if (direction === pluridData.directions.left && locks.rotationY) {
             return dispatch(actions.space.rotateLeft());
@@ -2113,24 +2129,13 @@ const ConnectedPluridRoots = reactRedux.connect(mapStateToProperties$g, mapDispa
     context: StateContext
 })(PluridRoots);
 
-const fadeIn = styled.keyframes`
-    from {
-        opacity: 0%;
-    }
-
-    to {
-        opacity: 100%;
-    }
-`;
-
-const fadeInAnimation = fadeInTime => styled.css`${fadeIn} ${fadeInTime}ms linear 100ms forwards`;
-
 const StyledPluridSpace = styled__default["default"].div`
     position: relative;
     height: 100%;
     overflow: hidden;
     perspective: 2000px;
     outline: none;
+    transition: opacity ${({fadeInTime: fadeInTime}) => fadeInTime}ms linear;
 
     background: ${({opaque: opaque, theme: theme}) => {
     if (opaque) {
@@ -2140,24 +2145,10 @@ const StyledPluridSpace = styled__default["default"].div`
     }
     return "transparent";
 }};
-
-    /* TOFIX */
-    /* opacity: ${({fadeInTime: fadeInTime}) => {
-    if (fadeInTime) {
-        return "0";
-    }
-    return "1";
-}};
-    animation: ${({isMounted: isMounted, fadeInTime: fadeInTime}) => {
-    if (isMounted && fadeInTime) {
-        return fadeInAnimation(fadeInTime);
-    }
-    return "";
-}}; */
 `;
 
 const PluridSpace = properties => {
-    const {stateConfiguration: stateConfiguration, stateGeneralTheme: stateGeneralTheme} = properties;
+    const {stateConfiguration: stateConfiguration, stateGeneralTheme: stateGeneralTheme, stateResolvedLayout: stateResolvedLayout} = properties;
     const {space: space} = stateConfiguration;
     const {opaque: opaque, fadeInTime: fadeInTime} = space;
     const [isMounted, setIsMounted] = React.useState(false);
@@ -2169,13 +2160,17 @@ const PluridSpace = properties => {
         opaque: opaque,
         isMounted: isMounted,
         fadeInTime: fadeInTime,
-        "data-plurid-entity": pluridData.PLURID_ENTITY_SPACE
+        "data-plurid-entity": pluridData.PLURID_ENTITY_SPACE,
+        style: {
+            opacity: stateResolvedLayout ? 1 : 0
+        }
     }, React__default["default"].createElement(ConnectedPluridRoots, null));
 };
 
 const mapStateToProperties$f = state => ({
     stateConfiguration: selectors.configuration.getConfiguration(state),
-    stateGeneralTheme: selectors.themes.getGeneralTheme(state)
+    stateGeneralTheme: selectors.themes.getGeneralTheme(state),
+    stateResolvedLayout: selectors.space.getResolvedLayout(state)
 });
 
 const mapDispatchToProperties$f = dispatch => ({});
@@ -2243,6 +2238,18 @@ const ConnectedOrigin = reactRedux.connect(mapStateToProperties$e, mapDispatchTo
     context: StateContext
 })(Origin);
 
+const fadeIn = styled.keyframes`
+    from {
+        opacity: 0%;
+    }
+
+    to {
+        opacity: 100%;
+    }
+`;
+
+const fadeInAnimation = fadeInTime => styled.css`${fadeIn} ${fadeInTime}ms linear 100ms forwards`;
+
 var MENUS;
 
 (function(MENUS) {
@@ -4319,7 +4326,7 @@ const ConnectedPluridViewcube = reactRedux.connect(mapStateToProperties$8, mapDi
 const PluridViewContainer = _properties => React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(ConnectedPluridSpace, null), React__default["default"].createElement(ConnectedOrigin, null), React__default["default"].createElement(ConnectedPluridToolbar, null), React__default["default"].createElement(ConnectedPluridViewcube, null));
 
 const PluridView = properties => {
-    const {planesRegistrar: planesRegistrar, customPlane: customPlane, planeContext: planeContext, planeContextValue: planeContextValue, pubsub: pubsub, planeNotFound: planeNotFound, planeRenderError: planeRenderError, matchedRoute: matchedRoute, hostname: hostname, state: state, stateConfiguration: stateConfiguration, stateTransform: stateTransform, stateSpaceView: stateSpaceView, stateTree: stateTree, stateGeneralTheme: stateGeneralTheme, dispatch: dispatch, dispatchSetConfiguration: dispatchSetConfiguration, dispatchSetGeneralTheme: dispatchSetGeneralTheme, dispatchSetInteractionTheme: dispatchSetInteractionTheme, dispatchSetSpaceField: dispatchSetSpaceField, dispatchSetSpaceLocation: dispatchSetSpaceLocation, dispatchSetAnimatedTransform: dispatchSetAnimatedTransform, dispatchSetTransformTime: dispatchSetTransformTime, dispatchSetTree: dispatchSetTree, dispatchRotateXWith: dispatchRotateXWith, dispatchRotateX: dispatchRotateX, dispatchRotateYWith: dispatchRotateYWith, dispatchRotateY: dispatchRotateY, dispatchTranslateXWith: dispatchTranslateXWith, dispatchTranslateYWith: dispatchTranslateYWith, dispatchTranslateZWith: dispatchTranslateZWith, dispatchScaleUpWith: dispatchScaleUpWith, dispatchScaleDownWith: dispatchScaleDownWith, dispatchSpaceSetViewSize: dispatchSpaceSetViewSize, dispatchSpaceSetView: dispatchSpaceSetView} = properties;
+    const {planesRegistrar: planesRegistrar, customPlane: customPlane, planeContext: planeContext, planeContextValue: planeContextValue, pubsub: pubsub, planeNotFound: planeNotFound, planeRenderError: planeRenderError, matchedRoute: matchedRoute, hostname: hostname, state: state, stateConfiguration: stateConfiguration, stateResolvedLayout: stateResolvedLayout, stateTransform: stateTransform, stateSpaceView: stateSpaceView, stateTree: stateTree, stateGeneralTheme: stateGeneralTheme, dispatch: dispatch, dispatchSetConfiguration: dispatchSetConfiguration, dispatchSetGeneralTheme: dispatchSetGeneralTheme, dispatchSetInteractionTheme: dispatchSetInteractionTheme, dispatchSetSpaceField: dispatchSetSpaceField, dispatchSetSpaceLocation: dispatchSetSpaceLocation, dispatchSetAnimatedTransform: dispatchSetAnimatedTransform, dispatchSetTransformTime: dispatchSetTransformTime, dispatchSetTree: dispatchSetTree, dispatchRotateXWith: dispatchRotateXWith, dispatchRotateX: dispatchRotateX, dispatchRotateYWith: dispatchRotateYWith, dispatchRotateY: dispatchRotateY, dispatchTranslateXWith: dispatchTranslateXWith, dispatchTranslateYWith: dispatchTranslateYWith, dispatchTranslateZWith: dispatchTranslateZWith, dispatchScaleUpWith: dispatchScaleUpWith, dispatchScaleDownWith: dispatchScaleDownWith, dispatchSpaceSetViewSize: dispatchSpaceSetViewSize, dispatchSpaceSetView: dispatchSpaceSetView} = properties;
     const viewElement = React.useRef(null);
     const scrollTimeout = React.useRef();
     const [pluridPubSub, setPluridPubSub] = React.useState(pubsub ? [ pubsub ] : [ new PluridPubSub__default["default"] ]);
@@ -4333,6 +4340,10 @@ const PluridView = properties => {
             setPreventOverscroll(false);
         }), pluridData.PLURID_DEFAULT_PREVENT_OVERSCROLL_TIMEOUT);
     };
+    const resolveLayout = () => {
+        const layout = true;
+        treeUpdate(stateSpaceView, stateConfiguration, layout);
+    };
     const shortcutsCallback = React.useCallback((event => {
         const {transformLocks: transformLocks} = stateConfiguration.space;
         handleGlobalShortcuts(dispatch, state, pluridPubSub[0], event, stateConfiguration.space.firstPerson, transformLocks);
@@ -4347,12 +4358,13 @@ const PluridView = properties => {
         };
         handleGlobalWheel(dispatch, event, transformModes, transformLocks);
     }), [ dispatch, stateConfiguration.space.transformMode, stateConfiguration.space.transformLocks ]);
-    const treeUpdate = (view, configuration = stateConfiguration) => {
+    const treeUpdate = (view, configuration = stateConfiguration, layout) => {
         const planes = getRegisteredPlanes(planesRegistrar);
         const spaceTree = new pluridEngine.space.tree.Tree({
             planes: planes,
             configuration: configuration,
-            view: view
+            view: view,
+            layout: layout
         }, hostname);
         const computedTree = spaceTree.compute();
         for (const statePlane of stateTree) {
@@ -4368,7 +4380,7 @@ const PluridView = properties => {
         dispatchSetTree(computedTree);
     };
     const treeUpdateCallback = React.useCallback((() => {
-        treeUpdate(stateSpaceView);
+        treeUpdate(stateSpaceView, stateConfiguration);
     }), [ hostname, stateSpaceView, stateConfiguration, JSON.stringify(stateTree) ]);
     const handlePubSubSubscribe = pubsub => {
         const subscriptions = [ {
@@ -4869,6 +4881,15 @@ const PluridView = properties => {
     React.useEffect((() => {
         treeUpdateCallback();
     }), []);
+    React.useEffect((() => {
+        if (!stateResolvedLayout) {
+            resolveLayout();
+            dispatchSetSpaceField({
+                field: "resolvedLayout",
+                value: true
+            });
+        }
+    }), [ stateResolvedLayout ]);
     const pluridContext = {
         planesRegistrar: planesRegistrar,
         planeContext: planeContext,
@@ -4898,6 +4919,7 @@ const mapStateToProperties$7 = state => ({
     state: state,
     stateConfiguration: selectors.configuration.getConfiguration(state),
     stateTransform: selectors.space.getTransform(state),
+    stateResolvedLayout: selectors.space.getResolvedLayout(state),
     stateTree: selectors.space.getTree(state),
     stateSpaceLoading: selectors.space.getLoading(state),
     stateSpaceView: selectors.space.getView(state),
@@ -4938,8 +4960,8 @@ class PluridApplication extends React.Component {
         super(properties);
         this.storeID = properties.id || "default";
         this.context = context;
-        const defaultStore = this.computeStore();
-        this.store = store(defaultStore);
+        this.prepare();
+        this.store = store(this.computeStore());
         this.subscribeStore();
     }
     componentDidUpdate() {
@@ -4958,15 +4980,20 @@ class PluridApplication extends React.Component {
         return React__default["default"].createElement(reactRedux.Provider, {
             store: this.store,
             context: StateContext
-        }, React__default["default"].createElement(ConnectedPluridView, Object.assign({}, this.props)));
+        }, React__default["default"].createElement(ConnectedPluridView, Object.assign({}, this.props, {
+            planesRegistrar: this.planesRegistrar
+        })));
+    }
+    prepare() {
+        this.planesRegistrar = typeof window === "undefined" && !this.props.planesRegistrar ? new PluridPlanesRegistrar(this.props.planes, this.props.hostname) : this.props.planesRegistrar;
     }
     computeStore() {
-        const {view: view, planes: planes, configuration: configuration, precomputedState: precomputedState, planesRegistrar: planesRegistrar, useLocalStorage: useLocalStorage, hostname: hostname, space: space} = this.props;
-        registerPlanes(planes, planesRegistrar, hostname);
+        const {view: view, planes: planes, configuration: configuration, precomputedState: precomputedState, useLocalStorage: useLocalStorage, hostname: hostname, space: space} = this.props;
+        registerPlanes(planes, this.planesRegistrar, hostname);
         const currentState = this.store ? this.store.getState() : undefined;
         const localState = pluridEngine.state.local.load(this.storeID, useLocalStorage);
-        const contextState = loadStateFromContext(this.context, space);
-        const store = pluridEngine.state.compute(view, configuration, planesRegistrar, currentState, localState, precomputedState, contextState, hostname);
+        const contextState = undefined;
+        const store = pluridEngine.state.compute(view, configuration, this.planesRegistrar, currentState, localState, precomputedState, contextState, hostname);
         return store;
     }
     subscribeStore() {
@@ -6355,14 +6382,13 @@ const ConnectedPluridSpaceDebugger = reactRedux.connect(mapStateToProperties, ma
     context: StateContext
 })(PluridSpaceDebugger);
 
-const serverComputeMetastate = (isoMatch, paths, globals) => __awaiter(void 0, void 0, void 0, (function*() {
+const serverComputeMetastate = (isoMatch, paths, globals, hostname = "origin") => __awaiter(void 0, void 0, void 0, (function*() {
     const protocol = "http";
-    const host = "localhost:63000";
-    const pluridApplications = yield collectApplicationsFromPath(isoMatch, protocol, host, globals);
+    const pluridApplications = yield collectApplicationsFromPath(isoMatch, protocol, hostname, globals);
     const states = {};
     for (const application of pluridApplications) {
         const {planes: planes, view: view, configuration: configuration} = application;
-        const {computedTree: computedTree, appConfiguration: appConfiguration} = computeApplication(planes, isoMatch.data.defaultConfiguration, view);
+        const {computedTree: computedTree, appConfiguration: appConfiguration} = computeApplication(planes, isoMatch.data.defaultConfiguration, view, hostname);
         const state = {
             configuration: Object.assign({}, appConfiguration),
             shortcuts: {
@@ -6377,6 +6403,7 @@ const serverComputeMetastate = (isoMatch, paths, globals) => __awaiter(void 0, v
             },
             space: {
                 loading: false,
+                resolvedLayout: false,
                 animatedTransform: false,
                 transform: "matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1)",
                 scale: 1,