Create build.html
Browse files- build.html +95 -0
build.html
ADDED
|
@@ -0,0 +1,95 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html>
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="utf-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
| 6 |
+
|
| 7 |
+
<title></title>
|
| 8 |
+
|
| 9 |
+
<!-- GrapeJs -->
|
| 10 |
+
<link rel="stylesheet" href="assets/css/grapes.min.css">
|
| 11 |
+
<script src="assets/js/grapes.min.js"></script>
|
| 12 |
+
|
| 13 |
+
<!-- UIKit -->
|
| 14 |
+
<link rel="stylesheet" href="assets/uikit-3.3.3/css/uikit.min.css" />
|
| 15 |
+
<script src="assets/uikit-3.3.3/js/uikit.min.js"></script>
|
| 16 |
+
<script src="assets/uikit-3.3.3/js/uikit-icons.min.js"></script>
|
| 17 |
+
|
| 18 |
+
<!-- Style -->
|
| 19 |
+
<link rel="stylesheet" href="assets/css/style.css">
|
| 20 |
+
|
| 21 |
+
<!-- Plugins -->
|
| 22 |
+
<script src="editor/plugins/custom-page-manager.js"></script>
|
| 23 |
+
<script src="editor/plugins/custom-code-editor.js"></script>
|
| 24 |
+
<script src="editor/plugins/customize-devices.js"></script>
|
| 25 |
+
<script src="editor/plugins/customize-options.js"></script>
|
| 26 |
+
<script src="editor/plugins/customize-views.js"></script>
|
| 27 |
+
|
| 28 |
+
<!-- JQuery -->
|
| 29 |
+
<!-- <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script> -->
|
| 30 |
+
</head>
|
| 31 |
+
<body>
|
| 32 |
+
<div id="gjs"></div>
|
| 33 |
+
|
| 34 |
+
<!--Script -->
|
| 35 |
+
<script type="text/javascript">
|
| 36 |
+
const categories = {
|
| 37 |
+
'layout': 'Layout <span class="gjs-title-tags">Elements</span>',
|
| 38 |
+
'basic': 'Basic <span class="gjs-title-tags">Elements</span>',
|
| 39 |
+
'typography': 'Typography <span class="gjs-title-tags">Elements</span>',
|
| 40 |
+
'media': 'Media <span class="gjs-title-tags">Elements</span>',
|
| 41 |
+
'components': 'Components <span class="gjs-title-tags">Layout structure</span>',
|
| 42 |
+
'pages': 'Pages <span class="gjs-title-tags">Fully constructed layouts</span>',
|
| 43 |
+
'uikit': 'UIKit Component <a target="_blank" href="https://getuikit.com/docs/accordion">UIKit Doc</a>',
|
| 44 |
+
'mylinkpreview': '<a target="_blank" href="https://mylinkpreview.com/">MylinkPreview</a> Blocks'
|
| 45 |
+
}
|
| 46 |
+
|
| 47 |
+
const editor = grapesjs.init({
|
| 48 |
+
container : '#gjs',
|
| 49 |
+
height: '100vh',
|
| 50 |
+
|
| 51 |
+
canvas: {
|
| 52 |
+
styles: [
|
| 53 |
+
'http://192.168.2.31/template-builder/assets/uikit-3.3.3/css/uikit.min.css',
|
| 54 |
+
],
|
| 55 |
+
scripts: [
|
| 56 |
+
'http://192.168.2.31/template-builder/assets/uikit-3.3.3/js/uikit.min.js',
|
| 57 |
+
'http://192.168.2.31/template-builder/assets/uikit-3.3.3/js/uikit-icons.min.js'
|
| 58 |
+
]
|
| 59 |
+
},
|
| 60 |
+
|
| 61 |
+
plugins: [
|
| 62 |
+
'customPageManager',
|
| 63 |
+
'customCodeEditor',
|
| 64 |
+
'customizeDevices',
|
| 65 |
+
'customizeOptions',
|
| 66 |
+
'customizeViews',
|
| 67 |
+
// Plugin temporary code
|
| 68 |
+
editor => {
|
| 69 |
+
|
| 70 |
+
},
|
| 71 |
+
],
|
| 72 |
+
|
| 73 |
+
storageManager: {
|
| 74 |
+
type: 'remote',
|
| 75 |
+
autosave: true, // Store data automatically
|
| 76 |
+
stepsBeforeSave: 1,
|
| 77 |
+
contentTypeJson: true,
|
| 78 |
+
urlStore: 'http://192.168.2.31/template-builder/storage/save.php',
|
| 79 |
+
urlLoad: 'http://192.168.2.31/template-builder/storage/save.php',
|
| 80 |
+
}
|
| 81 |
+
|
| 82 |
+
// Disable the storage manager for the moment
|
| 83 |
+
// storageManager: false,
|
| 84 |
+
});
|
| 85 |
+
|
| 86 |
+
// Vars for other scripts like pages.js, elements.js
|
| 87 |
+
const blockManager = editor.BlockManager;
|
| 88 |
+
const commands = editor.Commands;
|
| 89 |
+
</script>
|
| 90 |
+
|
| 91 |
+
<!-- Blocks -->
|
| 92 |
+
<script src="editor/blocks/pages.js"></script>
|
| 93 |
+
<script src="editor/blocks/elements.js"></script>
|
| 94 |
+
</body>
|
| 95 |
+
</html>
|