2020-11-14 04:42:32 +13:00
|
|
|
import ClientApp from "./components/ClientApp.svelte"
|
2022-10-01 00:31:16 +13:00
|
|
|
import {
|
|
|
|
builderStore,
|
|
|
|
appStore,
|
|
|
|
devToolsStore,
|
2022-09-13 22:31:45 +12:00
|
|
|
blockStore,
|
|
|
|
componentStore,
|
2022-10-01 00:31:16 +13:00
|
|
|
environmentStore,
|
2022-10-15 01:37:14 +13:00
|
|
|
dndStore,
|
2022-10-24 21:02:50 +13:00
|
|
|
eventStore,
|
2022-10-01 00:31:16 +13:00
|
|
|
} from "./stores"
|
2021-09-01 22:41:48 +12:00
|
|
|
import loadSpectrumIcons from "@budibase/bbui/spectrum-icons-rollup.js"
|
2022-06-10 02:03:43 +12:00
|
|
|
import { get } from "svelte/store"
|
2022-08-19 22:09:20 +12:00
|
|
|
import { initWebsocket } from "./websocket.js"
|
2021-09-01 22:41:48 +12:00
|
|
|
|
2022-08-10 23:04:58 +12:00
|
|
|
// Provide svelte and svelte/internal as globals for custom components
|
|
|
|
import * as svelte from "svelte"
|
|
|
|
import * as internal from "svelte/internal"
|
|
|
|
window.svelte_internal = internal
|
|
|
|
window.svelte = svelte
|
2021-09-01 22:41:48 +12:00
|
|
|
|
|
|
|
// Initialise spectrum icons
|
|
|
|
loadSpectrumIcons()
|
2019-09-07 17:50:35 +12:00
|
|
|
|
2020-11-24 03:28:02 +13:00
|
|
|
let app
|
|
|
|
|
2022-10-01 00:31:16 +13:00
|
|
|
const loadBudibase = async () => {
|
2020-11-24 22:31:54 +13:00
|
|
|
// Update builder store with any builder flags
|
|
|
|
builderStore.set({
|
2022-10-07 20:05:44 +13:00
|
|
|
...get(builderStore),
|
2020-11-24 22:31:54 +13:00
|
|
|
inBuilder: !!window["##BUDIBASE_IN_BUILDER##"],
|
2020-11-28 05:36:31 +13:00
|
|
|
layout: window["##BUDIBASE_PREVIEW_LAYOUT##"],
|
2020-11-24 22:31:54 +13:00
|
|
|
screen: window["##BUDIBASE_PREVIEW_SCREEN##"],
|
2020-12-01 01:11:50 +13:00
|
|
|
selectedComponentId: window["##BUDIBASE_SELECTED_COMPONENT_ID##"],
|
|
|
|
previewId: window["##BUDIBASE_PREVIEW_ID##"],
|
2021-06-28 23:55:11 +12:00
|
|
|
theme: window["##BUDIBASE_PREVIEW_THEME##"],
|
2021-09-02 22:38:41 +12:00
|
|
|
customTheme: window["##BUDIBASE_PREVIEW_CUSTOM_THEME##"],
|
2021-09-08 20:40:25 +12:00
|
|
|
previewDevice: window["##BUDIBASE_PREVIEW_DEVICE##"],
|
2022-04-29 04:30:48 +12:00
|
|
|
navigation: window["##BUDIBASE_PREVIEW_NAVIGATION##"],
|
2022-07-15 21:46:37 +12:00
|
|
|
hiddenComponentIds: window["##BUDIBASE_HIDDEN_COMPONENT_IDS##"],
|
2022-08-12 04:05:42 +12:00
|
|
|
usedPlugins: window["##BUDIBASE_USED_PLUGINS##"],
|
2022-08-19 22:09:20 +12:00
|
|
|
location: window["##BUDIBASE_LOCATION##"],
|
2020-05-30 01:06:10 +12:00
|
|
|
})
|
2020-11-24 22:31:54 +13:00
|
|
|
|
2021-07-01 07:35:02 +12:00
|
|
|
// Set app ID - this window flag is set by both the preview and the real
|
|
|
|
// server rendered app HTML
|
2022-06-10 02:03:43 +12:00
|
|
|
appStore.actions.setAppId(window["##BUDIBASE_APP_ID##"])
|
|
|
|
|
2022-10-01 00:31:16 +13:00
|
|
|
// Fetch environment info
|
2022-10-24 21:13:05 +13:00
|
|
|
if (!get(environmentStore)?.loaded) {
|
2022-10-24 21:03:50 +13:00
|
|
|
await environmentStore.actions.fetchEnvironment()
|
|
|
|
}
|
2022-10-01 00:31:16 +13:00
|
|
|
|
2022-06-10 02:03:43 +12:00
|
|
|
// Enable dev tools or not. We need to be using a dev app and not inside
|
|
|
|
// the builder preview to enable them.
|
|
|
|
const enableDevTools = !get(builderStore).inBuilder && get(appStore).isDevApp
|
|
|
|
devToolsStore.actions.setEnabled(enableDevTools)
|
2021-07-01 07:35:02 +12:00
|
|
|
|
2022-08-24 06:05:38 +12:00
|
|
|
// Register handler for runtime events from the builder
|
2022-10-24 21:02:50 +13:00
|
|
|
window.handleBuilderRuntimeEvent = (type, data) => {
|
2022-08-24 06:05:38 +12:00
|
|
|
if (!window["##BUDIBASE_IN_BUILDER##"]) {
|
|
|
|
return
|
|
|
|
}
|
2022-10-24 21:02:50 +13:00
|
|
|
if (type === "event-completed") {
|
|
|
|
eventStore.actions.resolveEvent(data)
|
|
|
|
} else if (type === "eject-block") {
|
|
|
|
const block = blockStore.actions.getBlock(data)
|
2022-08-24 06:05:38 +12:00
|
|
|
block?.eject()
|
2022-10-24 21:02:50 +13:00
|
|
|
} else if (type === "dragging-new-component") {
|
|
|
|
const { dragging, component } = data
|
2022-10-15 01:37:14 +13:00
|
|
|
if (dragging) {
|
2022-10-15 06:16:19 +13:00
|
|
|
const definition =
|
|
|
|
componentStore.actions.getComponentDefinition(component)
|
|
|
|
dndStore.actions.startDraggingNewComponent({ component, definition })
|
2022-10-15 01:37:14 +13:00
|
|
|
} else {
|
|
|
|
dndStore.actions.reset()
|
|
|
|
}
|
2022-08-24 06:05:38 +12:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-11 02:34:00 +12:00
|
|
|
// Register any custom components
|
|
|
|
if (window["##BUDIBASE_CUSTOM_COMPONENTS##"]) {
|
|
|
|
window["##BUDIBASE_CUSTOM_COMPONENTS##"].forEach(component => {
|
|
|
|
componentStore.actions.registerCustomComponent(component)
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
2022-08-13 01:34:44 +12:00
|
|
|
// Make a callback available for custom component bundles to register
|
|
|
|
// themselves at runtime
|
|
|
|
window.registerCustomComponent =
|
|
|
|
componentStore.actions.registerCustomComponent
|
|
|
|
|
2022-08-19 22:09:20 +12:00
|
|
|
// Initialise websocket
|
|
|
|
initWebsocket()
|
|
|
|
|
2020-11-24 22:31:54 +13:00
|
|
|
// Create app if one hasn't been created yet
|
|
|
|
if (!app) {
|
|
|
|
app = new ClientApp({
|
|
|
|
target: window.document.body,
|
|
|
|
})
|
|
|
|
}
|
2020-02-03 22:24:25 +13:00
|
|
|
}
|
|
|
|
|
2020-11-14 04:42:32 +13:00
|
|
|
// Attach to window so the HTML template can call this when it loads
|
|
|
|
window.loadBudibase = loadBudibase
|