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 Configuration Settings |
||||
|
|
||||
[couchdb] |
[couchdb] |
||||
database_dir = DATA_DIR/couch/dbs |
database_dir = DATA_DIR/couchdb/dbs |
||||
view_index_dir = DATA_DIR/couch/views |
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