forked from tsai/budibase
Dean
4 years ago
66 changed files with 1084 additions and 529 deletions
@ -1,5 +1,5 @@ |
|||
; CouchDB Configuration Settings |
|||
|
|||
[couchdb] |
|||
database_dir = DATA_DIR/couch/dbs |
|||
view_index_dir = DATA_DIR/couch/views |
|||
database_dir = DATA_DIR/couchdb/dbs |
|||
view_index_dir = DATA_DIR/couchdb/views |
|||
|
|||
@ -1,104 +0,0 @@ |
|||
export default ` |
|||
<html> |
|||
<head> |
|||
<link rel="stylesheet" href="https://rsms.me/inter/inter.css" /> |
|||
<link rel="preconnect" href="https://fonts.gstatic.com" /> |
|||
<link |
|||
href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap" |
|||
rel="stylesheet" |
|||
/> |
|||
<link |
|||
href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" |
|||
rel="stylesheet" |
|||
/> |
|||
<style> |
|||
html, body { |
|||
padding: 0; |
|||
margin: 0; |
|||
} |
|||
html { |
|||
height: 100%; |
|||
width: 100%; |
|||
overflow: hidden; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: flex-start; |
|||
align-items: stretch; |
|||
} |
|||
body { |
|||
flex: 1 1 auto; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
*, |
|||
*:before, |
|||
*:after { |
|||
box-sizing: border-box; |
|||
} |
|||
</style> |
|||
<script src='{{ CLIENT_LIB_PATH }}'></script> |
|||
<script> |
|||
function receiveMessage(event) { |
|||
if (!event.data) { |
|||
return |
|||
} |
|||
|
|||
// Parse received message
|
|||
// If parsing fails, just ignore and wait for the next message
|
|||
let parsed |
|||
try { |
|||
parsed = JSON.parse(event.data) |
|||
} catch (error) { |
|||
console.error("Client received invalid JSON") |
|||
// Ignore
|
|||
} |
|||
if (!parsed || !parsed.isBudibaseEvent) { |
|||
return |
|||
} |
|||
|
|||
// Extract data from message
|
|||
const { |
|||
selectedComponentId, |
|||
layout, |
|||
screen, |
|||
appId, |
|||
theme, |
|||
customTheme, |
|||
previewDevice, |
|||
navigation, |
|||
hiddenComponentIds |
|||
} = parsed |
|||
|
|||
// Set some flags so the app knows we're in the builder
|
|||
window["##BUDIBASE_IN_BUILDER##"] = true |
|||
window["##BUDIBASE_APP_ID##"] = appId |
|||
window["##BUDIBASE_PREVIEW_LAYOUT##"] = layout |
|||
window["##BUDIBASE_PREVIEW_SCREEN##"] = screen |
|||
window["##BUDIBASE_SELECTED_COMPONENT_ID##"] = selectedComponentId |
|||
window["##BUDIBASE_PREVIEW_ID##"] = Math.random() |
|||
window["##BUDIBASE_PREVIEW_THEME##"] = theme |
|||
window["##BUDIBASE_PREVIEW_CUSTOM_THEME##"] = customTheme |
|||
window["##BUDIBASE_PREVIEW_DEVICE##"] = previewDevice |
|||
window["##BUDIBASE_PREVIEW_NAVIGATION##"] = navigation |
|||
window["##BUDIBASE_HIDDEN_COMPONENT_IDS##"] = hiddenComponentIds |
|||
|
|||
// Initialise app
|
|||
try { |
|||
if (window.loadBudibase) { |
|||
window.loadBudibase() |
|||
document.documentElement.classList.add("loaded") |
|||
} else { |
|||
throw "The client library couldn't be loaded" |
|||
} |
|||
} catch (error) { |
|||
window.parent.postMessage({ type: "error", error }) |
|||
} |
|||
} |
|||
|
|||
window.addEventListener("message", receiveMessage) |
|||
window.parent.postMessage({ type: "ready" }) |
|||
</script> |
|||
</head> |
|||
<body/> |
|||
</html> |
|||
` |
|||
@ -0,0 +1,38 @@ |
|||
<script> |
|||
import { createEventDispatcher } from "svelte" |
|||
import { Slider, Button } from "@budibase/bbui" |
|||
|
|||
export let customTheme |
|||
|
|||
const dispatch = createEventDispatcher() |
|||
const options = ["0", "4px", "8px", "16px"] |
|||
|
|||
$: index = options.indexOf(customTheme.buttonBorderRadius) ?? 2 |
|||
|
|||
const onChange = async e => { |
|||
dispatch("change", options[e.detail]) |
|||
} |
|||
</script> |
|||
|
|||
<div class="container"> |
|||
<Slider min={0} max={3} step={1} value={index} on:change={onChange} /> |
|||
<div class="button" style="--radius: {customTheme.buttonBorderRadius};"> |
|||
<Button primary newStyles>Button</Button> |
|||
</div> |
|||
</div> |
|||
|
|||
<style> |
|||
.container { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: flex-start; |
|||
align-items: center; |
|||
gap: var(--spacing-xl); |
|||
} |
|||
.container :global(.spectrum-Form-item) { |
|||
flex: 1 1 auto; |
|||
} |
|||
.button :global(.spectrum-Button) { |
|||
border-radius: var(--radius) !important; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,103 @@ |
|||
<html lang="en"> |
|||
<head> |
|||
<title>Budibase Builder Preview</title> |
|||
<link rel="stylesheet" href="https://rsms.me/inter/inter.css" /> |
|||
<link rel="preconnect" href="https://fonts.gstatic.com" /> |
|||
<link |
|||
href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap" |
|||
rel="stylesheet" |
|||
/> |
|||
<link |
|||
href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" |
|||
rel="stylesheet" |
|||
/> |
|||
<style> |
|||
html, body { |
|||
padding: 0; |
|||
margin: 0; |
|||
} |
|||
html { |
|||
height: 100%; |
|||
width: 100%; |
|||
overflow: hidden; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: flex-start; |
|||
align-items: stretch; |
|||
} |
|||
body { |
|||
flex: 1 1 auto; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
*, |
|||
*:before, |
|||
*:after { |
|||
box-sizing: border-box; |
|||
} |
|||
</style> |
|||
<script src='{{ clientLibPath }}'></script> |
|||
<script> |
|||
function receiveMessage(event) { |
|||
if (!event.data) { |
|||
return |
|||
} |
|||
|
|||
// Parse received message |
|||
// If parsing fails, just ignore and wait for the next message |
|||
let parsed |
|||
try { |
|||
parsed = JSON.parse(event.data) |
|||
} catch (error) { |
|||
console.error("Client received invalid JSON") |
|||
// Ignore |
|||
} |
|||
if (!parsed || !parsed.isBudibaseEvent) { |
|||
return |
|||
} |
|||
|
|||
// Extract data from message |
|||
const { |
|||
selectedComponentId, |
|||
layout, |
|||
screen, |
|||
appId, |
|||
theme, |
|||
customTheme, |
|||
previewDevice, |
|||
navigation, |
|||
hiddenComponentIds |
|||
} = parsed |
|||
|
|||
// Set some flags so the app knows we're in the builder |
|||
window["##BUDIBASE_IN_BUILDER##"] = true |
|||
window["##BUDIBASE_APP_ID##"] = appId |
|||
window["##BUDIBASE_PREVIEW_LAYOUT##"] = layout |
|||
window["##BUDIBASE_PREVIEW_SCREEN##"] = screen |
|||
window["##BUDIBASE_SELECTED_COMPONENT_ID##"] = selectedComponentId |
|||
window["##BUDIBASE_PREVIEW_ID##"] = Math.random() |
|||
window["##BUDIBASE_PREVIEW_THEME##"] = theme |
|||
window["##BUDIBASE_PREVIEW_CUSTOM_THEME##"] = customTheme |
|||
window["##BUDIBASE_PREVIEW_DEVICE##"] = previewDevice |
|||
window["##BUDIBASE_PREVIEW_NAVIGATION##"] = navigation |
|||
window["##BUDIBASE_HIDDEN_COMPONENT_IDS##"] = hiddenComponentIds |
|||
|
|||
// Initialise app |
|||
try { |
|||
if (window.loadBudibase) { |
|||
window.loadBudibase() |
|||
document.documentElement.classList.add("loaded") |
|||
} else { |
|||
throw "The client library couldn't be loaded" |
|||
} |
|||
} catch (error) { |
|||
window.parent.postMessage({ type: "error", error }) |
|||
} |
|||
} |
|||
|
|||
window.addEventListener("message", receiveMessage) |
|||
window.parent.postMessage({ type: "ready" }) |
|||
</script> |
|||
</head> |
|||
<body></body> |
|||
</html> |
|||
Loading…
Reference in new issue