How to use most - 10 common examples
To help you get started, we’ve selected a few most examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
Wonder-Technology / Wonder-Editor / lib / es6_global / src / core / utils / engine / MainUtils.js View on Github 
function init(editorState) {
return Most.drain(Most.map((function (editEngineState) {
StateEngineService$WonderEditor.setIsDebug(true);
var match = GameObjectEngineService$WonderEditor.create(editEngineState);
var scene = match[1];
var match$1 = DefaultSceneUtils$WonderEditor.prepareSpecificGameObjectsForEditEngineState(scene, match[0]);
var match$2 = DefaultSceneUtils$WonderEditor.computeDiffValue(editorState, match$1[0]);
var match$3 = DefaultSceneUtils$WonderEditor.createDefaultScene(scene, match$2[1]);
var editEngineState$1 = DirectorEngineService$WonderEditor.init(GameObjectUtils$WonderEditor.setParentKeepOrder(match$3[1], match$1[1], GameObjectEngineService$WonderEditor.setGameObjectName("scene", scene, match$3[0])));
StateLogicService$WonderEditor.setEditEngineState(DirectorEngineService$WonderEditor.loopBody(0, InitEventUtils$WonderEditor.initEvent(ViewService$Wonderjs.unsafeGetCanvas(editEngineState$1[/* viewRecord */8]), EngineStateDataEditorService$WonderEditor.getEditEngineStateData(/* () */0), /* tuple */[
StateEngineService$WonderEditor.getStateFromData,
StateEngineService$WonderEditor.setStateToData
], editEngineState$1)));
StateEditorService$WonderEditor.setState(match$2[0]);
return /* () */0;
}), _getLoadData("edit")).concat(Most.map((function (runEngineState) {
var editorState = StateEditorService$WonderEditor.getState(/* () */0);
var match = GameObjectEngineService$WonderEditor.create(runEngineState);
var scene = match[1];
var match$1 = DefaultSceneUtils$WonderEditor.createDefaultScene(scene, match[0]);
var runEngineState$1 = DirectorEngineService$WonderEditor.init(GameObjectEngineService$WonderEditor.setGameObjectName("scene", scene, match$1[0]));
StateLogicService$WonderEditor.setRunEngineState(DirectorEngineService$WonderEditor.loopBody(0, InitEventUtils$WonderEditor.initEvent(ViewService$Wonderjs.unsafeGetCanvas(runEngineState$1[/* viewRecord */8]), EngineStateDataEditorService$WonderEditor.getRunEngineStateData(/* () */0), /* tuple */[
StateEngineService$WonderEditor.getStateFromData,
StateEngineService$WonderEditor.setStateToData
], runEngineState$1)));
StateEditorService$WonderEditor.setState(SceneEditorService$WonderEditor.setScene(scene, editorState));
return /* () */0;
}), _getLoadData("run")))).then((function () {
return Promise.resolve(StateEditorService$WonderEditor.getState(/* () */0));
}));
}// non visual related actions
const setErrors$ = most.mergeArray([
sources.solidWorker.filter(event => 'error' in event)
])
.map(data => ({type: 'setErrors', data}))
const clearErrors$ = most.never() /* sources.state$
.filter(state => state.error !== undefined)
.map(state => state.error)
.skipRepeats()
.map(x => undefined)
.map(data => ({type: 'clearErrors', data}))
.delay(30000) */
// .forEach(x => console.log('clear errors', x))
const setAppUpdatesAvailable$ = most.mergeArray([
sources
.appUpdates
.map(data => ({type: 'setAppUpdatesAvailable', data})),
sources
.appUpdates
.delay(15000)// hide after 30 s
.map(data => ({type: 'setAppUpdatesAvailable', data: {available: false}}))
])
return {
// generic key shortuct handler
actionsFromKey$,
// generic clear error action
clearErrors$,
setErrors$,
// app updates}
// zoomToFit main mesh bounds
const zoomToFit$ = most.mergeArray([
gestures.taps.filter(taps => taps.nb === 3)
.map(_ => ({ type: 'zoomToFit', data: { origin: 'demand' } })),
state$
.filter(state => state.behaviours.zoomToFitOn.includes('new-entities'))
.map(state => state.entities).skipRepeatsWith(areEntitiesIdentical)
.map(_ => ({ type: 'zoomToFit', data: { origin: 'new-entities' } }))
// .multicast().tap(x => console.log('zoomToFit on new entities'))
])
.multicast()
/* const update$ = heartBeat$.thru(limitFlow(33))
.map(_ => ({type: 'update', data: undefined}))*/
const update$ = most.mergeArray([
rotations$,
zoom$,
reset$,
zoomToFit$,
resizes$
]).map(_ => ({ type: 'update', data: undefined }))
return [
rotations$,
pan$,
zoom$,
reset$,
zoomToFit$,
resizes$,
update$sources.dom.select('#themeSwitcher').events('change')
.map(e => e.target.value),
sources.store.map(data => data.themeName)
])
.map(data => ({type: 'changeTheme', data}))
// non visual related actions
const toggleAutoReload$ = most.mergeArray([
sources.dom.select('#autoReload').events('click')
.map(e => e.target.checked),
sources.store
.map(data => data.autoReload)
])
.map(data => ({type: 'toggleAutoReload', data}))
const toggleInstantUpdate$ = most.mergeArray([
sources.dom.select('#instantUpdate').events('click').map(event => event.target.checked),
sources.store.map(data => data.instantUpdate)
])
.map(data => ({type: 'toggleInstantUpdate', data}))
const changeExportFormat$ = sources.dom.select('#exportFormats').events('change')
.map(e => e.target.value)
.map(data => ({type: 'changeExportFormat', data}))
const exportRequested$ = sources.dom.select('#exportBtn').events('click')
.sample(function (state, event) {
const defaultExportFilePath = state.exportFilePath
return {defaultExportFilePath, exportFormat: state.exportFormat, data: state.design.solids}
}, sources.state$)
.map(function ({defaultExportFilePath, exportFormat, data}) {
// console.log('exporting data to', defaultExportFilePath)const sources$ = {
// data streams
params$: params$.filter(x => x !== undefined).multicast(), // we filter out pointless data from the get go
data$: data$.filter(x => x !== undefined), // we filter out pointless data from the get go
state$, // thanks to proxying, we also have access to the state observable/stream inside our actions
// inputs$: inputs$.filter(x => x !== undefined), // custom user inputs
// live ui elements only
gestures: state.useGestures ? require('most-gestures').pointerGestures(element) : {drags: most.never(), zooms: most.never(), taps: most.never()},
resizes$: state.useGestures ? require('./cameraAndControls/elementSizing')(element) : most.never(),
heartBeat$: require('./observable-utils/rafStream').rafStream() // state.useGestures ? require('./observable-utils/rafStream').rafStream() : most.never() // heartbeat provided by requestAnimationFrame
}
// create our action streams
const cameraControlsActions = makeCameraControlsActions(sources$)
const dataParamsActions = makeDataParamsActions(sources$)
const actions = most.mergeArray(dataParamsActions.concat(cameraControlsActions))
// combine proxy state & real state
attach(makeState(actions, state, regl))
// .startWith(state)
// skipRepeatsWith
// re-render whenever state changes, since visuals are a function of the state
state$.forEach(state => {
// console.log('sending data for render', state)
state.render(state)
})
// dispatch initial params/state
params$.next(state)
/** main viewer function : call this one with different parameters and/or data to update the viewer
* @param {Object} options={}
* @param {Object} datafunction drags ({mouseDowns$, mouseUps$, mouseMoves$, touchStarts$, touchEnds$, longTaps$, touchMoves$}, settings) {
touchMoves$ = touchMoves$.filter(t => t.touches.length === 1)
const drags$ = merge(
mouseDrags(mouseDowns$, mouseUps$, mouseMoves$, settings),
touchDrags(touchStarts$, touchEnds$, touchMoves$, settings)
)
// .merge(merge(touchEnds$, mouseUps$).map(undefined))
// .tap(e=>console.log('dragMoves',e))
// .takeUntil(longTaps$) // .repeat() // no drag moves if there is a context action already taking place
return drags$
}function startDirector(state) {
var match = WorkerDetectMainService$Wonderjs.isUseWorker(state);
if (match) {
Most.drain(_workerInit(StateDataMain$Wonderjs.stateData, StateDataMainService$Wonderjs.setState(StateDataMain$Wonderjs.stateData, state)).concat(_createWorkerLoopStream(/* () */0)));
return /* () */0;
} else {
_noWorkerLoop(0, NoWorkerJobMainService$Wonderjs.execNoWorkerInitJobs(state));
return /* () */0;
}
}function start(state) {
var match = WorkerDetectMainService$Wonderjs.isUseWorker(state);
if (match !== 0) {
Most.drain(_workerInit(StateDataMain$Wonderjs.stateData, StateDataMainService$Wonderjs.setState(StateDataMain$Wonderjs.stateData, state)).concat(_createWorkerLoopStream(/* () */0)));
return /* () */0;
} else {
_noWorkerLoop(0, NoWorkerJobMainService$Wonderjs.execNoWorkerInitJobs(state));
return /* () */0;
}
}function init(editorState) {
return Most.drain(Most.map((function (editEngineState) {
StateEngineService$WonderEditor.setIsDebug(true);
var match = GameObjectEngineService$WonderEditor.create(editEngineState);
var scene = match[1];
var match$1 = DefaultSceneUtils$WonderEditor.prepareSpecificGameObjectsForEditEngineState(scene, match[0]);
var match$2 = DefaultSceneUtils$WonderEditor.computeDiffValue(editorState, match$1[0]);
var match$3 = DefaultSceneUtils$WonderEditor.createDefaultScene(scene, match$2[1]);
var editEngineState$1 = DirectorEngineService$WonderEditor.init(GameObjectUtils$WonderEditor.setParentKeepOrder(match$3[1], match$1[1], GameObjectEngineService$WonderEditor.setGameObjectName("scene", scene, match$3[0])));
StateLogicService$WonderEditor.setEditEngineState(DirectorEngineService$WonderEditor.loopBody(0, InitEventUtils$WonderEditor.initEvent(ViewService$Wonderjs.unsafeGetCanvas(editEngineState$1[/* viewRecord */8]), EngineStateDataEditorService$WonderEditor.getEditEngineStateData(/* () */0), /* tuple */[
StateEngineService$WonderEditor.getStateFromData,
StateEngineService$WonderEditor.setStateToData
], editEngineState$1)));
StateEditorService$WonderEditor.setState(match$2[0]);
return /* () */0;
}), _getLoadData("edit")).concat(Most.map((function (runEngineState) {
var editorState = StateEditorService$WonderEditor.getState(/* () */0);
var match = GameObjectEngineService$WonderEditor.create(runEngineState);const regl = require('regl')(reglOptions)
// note we keep the render function around, until we need to swap it out in case of new data
state.render = prepareRender(regl, state)
state.regl = regl
state.drawCommands.drawGrid = () => {}
state.drawCommands.drawCSGs = []
const sources$ = {
// data streams
params$: params$.filter(x => x !== undefined).multicast(), // we filter out pointless data from the get go
data$: data$.filter(x => x !== undefined), // we filter out pointless data from the get go
state$, // thanks to proxying, we also have access to the state observable/stream inside our actions
// inputs$: inputs$.filter(x => x !== undefined), // custom user inputs
// live ui elements only
gestures: state.useGestures ? require('most-gestures').pointerGestures(element) : {drags: most.never(), zooms: most.never(), taps: most.never()},
resizes$: state.useGestures ? require('./cameraAndControls/elementSizing')(element) : most.never(),
heartBeat$: require('./observable-utils/rafStream').rafStream() // state.useGestures ? require('./observable-utils/rafStream').rafStream() : most.never() // heartbeat provided by requestAnimationFrame
}
// create our action streams
const cameraControlsActions = makeCameraControlsActions(sources$)
const dataParamsActions = makeDataParamsActions(sources$)
const actions = most.mergeArray(dataParamsActions.concat(cameraControlsActions))
// combine proxy state & real state
attach(makeState(actions, state, regl))
// .startWith(state)
// skipRepeatsWith
// re-render whenever state changes, since visuals are a function of the state
state$.forEach(state => {
// console.log('sending data for render', state)
state.render(state)
