removed CodeEditor (not used)
This commit is contained in:
parent
001902da96
commit
fcc8cdd148
|
@ -1,111 +0,0 @@
|
||||||
<script>
|
|
||||||
import { store } from "builderStore"
|
|
||||||
import UIkit from "uikit"
|
|
||||||
import ActionButton from "components/common/ActionButton.svelte"
|
|
||||||
import ButtonGroup from "components/common/ButtonGroup.svelte"
|
|
||||||
import CodeMirror from "codemirror"
|
|
||||||
import "codemirror/mode/javascript/javascript.js"
|
|
||||||
|
|
||||||
export let onCodeChanged
|
|
||||||
export let code
|
|
||||||
|
|
||||||
export const show = () => {
|
|
||||||
UIkit.modal(codeModal).show()
|
|
||||||
}
|
|
||||||
|
|
||||||
let codeModal
|
|
||||||
let editor
|
|
||||||
let cmInstance
|
|
||||||
|
|
||||||
$: currentCode = code
|
|
||||||
$: originalCode = code
|
|
||||||
$: {
|
|
||||||
if (editor) {
|
|
||||||
if (!cmInstance) {
|
|
||||||
cmInstance = CodeMirror.fromTextArea(editor, {
|
|
||||||
mode: "javascript",
|
|
||||||
lineNumbers: false,
|
|
||||||
lineWrapping: true,
|
|
||||||
smartIndent: true,
|
|
||||||
matchBrackets: true,
|
|
||||||
readOnly: false,
|
|
||||||
})
|
|
||||||
cmInstance.on("change", () => (currentCode = cmInstance.getValue()))
|
|
||||||
}
|
|
||||||
cmInstance.focus()
|
|
||||||
cmInstance.setValue(code || "")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const cancel = () => {
|
|
||||||
UIkit.modal(codeModal).hide()
|
|
||||||
currentCode = originalCode
|
|
||||||
}
|
|
||||||
|
|
||||||
const save = () => {
|
|
||||||
originalCode = currentCode
|
|
||||||
onCodeChanged(currentCode)
|
|
||||||
UIkit.modal(codeModal).hide()
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div bind:this={codeModal} uk-modal>
|
|
||||||
<div class="uk-modal-dialog" uk-overflow-auto>
|
|
||||||
|
|
||||||
<div class="uk-modal-header">
|
|
||||||
<h3>Code</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="uk-modal-body uk-form-horizontal">
|
|
||||||
|
|
||||||
<p>
|
|
||||||
Use the code box below to control how this component is displayed, with
|
|
||||||
javascript.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<div class="editor-code-surround">
|
|
||||||
function(render, context, state, route) {'{'}
|
|
||||||
</div>
|
|
||||||
<div class="editor">
|
|
||||||
<textarea bind:this={editor} />
|
|
||||||
</div>
|
|
||||||
<div class="editor-code-surround">{'}'}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="uk-modal-footer">
|
|
||||||
<ButtonGroup>
|
|
||||||
<ActionButton primary on:click={save}>Save</ActionButton>
|
|
||||||
<ActionButton alert on:click={cancel}>Close</ActionButton>
|
|
||||||
</ButtonGroup>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
h3 {
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-size: 13px;
|
|
||||||
font-weight: 700;
|
|
||||||
color: #8997ab;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 13px;
|
|
||||||
color: #333;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.editor {
|
|
||||||
border-style: dotted;
|
|
||||||
border-width: 1px;
|
|
||||||
border-color: gainsboro;
|
|
||||||
padding: 10px 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.editor-code-surround {
|
|
||||||
font-family: "Courier New", Courier, monospace;
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -11,7 +11,6 @@
|
||||||
CircleIndicator,
|
CircleIndicator,
|
||||||
EventsIcon,
|
EventsIcon,
|
||||||
} from "components/common/Icons/"
|
} from "components/common/Icons/"
|
||||||
import CodeEditor from "./CodeEditor.svelte"
|
|
||||||
import LayoutEditor from "./LayoutEditor.svelte"
|
import LayoutEditor from "./LayoutEditor.svelte"
|
||||||
import EventsEditor from "./EventsEditor"
|
import EventsEditor from "./EventsEditor"
|
||||||
import panelStructure from "./temporaryPanelStructure.js"
|
import panelStructure from "./temporaryPanelStructure.js"
|
||||||
|
|
Loading…
Reference in New Issue