admin/core
1
0
Fork 0
mirror of https://github.com/jbcr/core.git synced 2026-04-22 16:18:30 +02:00
Code Issues Packages Projects Releases Wiki Activity

added Base Of Image Vue Component

Browse Source
This commit is contained in:
Jack
2018-10-20 19:24:30 +02:00
parent 39413808e2
commit da69cd76b1
16 changed files with 711 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/js/Components/Editor/DateTime.vue
+1 -1
View File
@@ -15,7 +15,7 @@
</flat-pickr>
<div class="input-group-append">
<button
class="btn btn-outline-primary"
class="btn btn-secondary"
:class="{'btn-outline-secondary': readonly == 1}"
type="button"
:disabled="readonly == 1"
assets/js/Components/Editor/Image.vue
+102 -4
View File
@@ -1,7 +1,47 @@
<template>
<div class="form-group">
<label>{{ label }}</label>
{{val}}
<div
class="form-group field__image"
@dragenter="onDragEnter"
@dragleave="onDragLeave"
@dragover.prevent
>
<transition name="fade">
<div class="field__image--dragging" v-show="isDragging">
<i class="fas fa-upload"></i>
</div>
</transition>
<div class="row">
<div class="col-8">
<label>{{ label }}</label>
<div class="input-group mb-3">
<input :name="name + '[alt]'" type="text" class="form-control" placeholder="alt text" :value="alt">
</div>
<div class="input-group mb-3">
<input :name="name + '[title]'" type="text" class="form-control" placeholder="title" :value="title">
</div>
<div class="btn-toolbar" role="toolbar" >
<div class="btn-group mr-2" role="group">
<button type="button" class="btn btn-secondary" @click="selectFile">
<i class="fas fa-fw fa-upload"></i> Upload
</button>
</div>
<div class="btn-group mr-2" role="group">
<button type="button" class="btn btn-secondary">
<i class="fas fa-fw fa-th"></i> From Library
</button>
</div>
</div>
</div>
<div class="col-4">
<label>Preview:</label>
<div
class="field__image--preview"
:style="`background-image: url('${previewImage}')`"
></div>
</div>
</div>
<input :name="fieldName" type="file" @change="getFile" ref="selectFile" class="field__image--upload">
<input :name="name + '[filename]'" type="hidden" :value="val">
</div>
</template>
@@ -10,7 +50,65 @@ import field from '../../helpers/mixins/fieldValue';
export default {
name: "editor-image",
props: ['value', 'label', 'name'],
props: ['label', 'name', 'value', 'thumbnail', 'alt', 'title'],
mixins: [field],
mounted(){
this.previewImage = this.thumbnail
this.currentPreviewImage = this.thumbnail
},
data: () => {
return {
currentPreviewImage: null,
previewImage: null,
newPreviewImage: null,
isDragging: false,
dragCount: 0,
};
},
methods: {
selectFile(){
this.$refs.selectFile.click()
},
onDragEnter(e) {
e.preventDefault();
this.dragCount++;
this.isDragging = true;
return false;
},
onDragLeave(e) {
e.preventDefault();
this.dragCount--;
if (this.dragCount <= 0)
this.isDragging = false;
},
getFile(e){
const reader = new FileReader();
const image = e.target.files[0];
reader.readAsDataURL(image);
reader.onload = (event) => {
this.newPreviewImage = event.target.result;
};
return this.uploadFile(e.target.files[0])
},
uploadFile(file){
const fd = new FormData();
fd.append('filepond[]', file);
this.$axios.post('/async/upload', fd, {
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(res => {
console.log(res);
})
.catch(err => {
console.log(err);
})
}
},
computed:{
fieldName(){
return this.name + '[]'
}
}
};
</script>
assets/js/Components/Editor/Select.vue
+2 -2
View File
@@ -1,7 +1,7 @@
<template>
<div class="form-group">
<label>{{ label }}</label>
<select class="custom-select" :id="id" :name="selectName" :form="form" v-model="val">
<select class="custom-select" :id="id" :name="fieldName" :form="form" v-model="val">
<option
v-for="(option, index) in selectOptions"
:key="index"
@@ -22,7 +22,7 @@ export default {
selectOptions(){
return JSON.parse(this.options);
},
selectName(){
fieldName(){
return this.name + '[]'
}
}
assets/js/Components/Editor/Slug.vue
+9 -2
View File
@@ -14,8 +14,15 @@
v-model="val"
>
<div class="input-group-append" >
<button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-fw" :class="`fa-${icon}`"></i> {{buttonText}}
<button
type="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
class="btn dropdown-toggle"
:class="[{'btn-primary': edit}, {'btn-secondary': !edit}]"
>
<i class="fas fa-fw" :class="`fa-${icon}`"></i> {{buttonText}}
</button>
<div class="dropdown-menu">
<a class="dropdown-item" @click="editSlug">
assets/js/Components/Editor/TextArea.vue
+3 -2
View File
@@ -2,9 +2,10 @@
<div class="form-group">
<label>{{ label }}</label>
<textarea
class="form-control"
:name="name"
v-bind="val"
cols="25"
v-model="val"
rows="10"
></textarea>
</div>
</template>
assets/js/Views/editor.js
+1 -1
View File
@@ -3,7 +3,7 @@ import Vue from "vue";
* Editor Components
*/
import Slug from "../Components/Editor/Slug.vue";
import TextArea from "../Components/Editor/TextArea.vue";
import TextArea from "../Components/Editor/Textarea.vue";
import Markdown from "../Components/Editor/Markdown.vue";
import Html from "../Components/Editor/Html.vue";
import DateTime from "../Components/Editor/DateTime.vue";
assets/js/bolt.js
+6 -8
View File
@@ -1,28 +1,26 @@
"use strict";
import Vue from "vue";
/**
* Vue Core | Config
*/
import "./helpers/filters";
// import './registerServiceWorker'
/**
* Bootstrap Javascript
*/
import "bootstrap";
/**
* Styling
*/
import "../scss/bolt.scss";
/**
* Set Axios
*/
import Axios from 'axios'
Vue.prototype.$axios = Axios;
/**
* Vue Components
*/
import "./Views/editor";
import "./Views/base";
// This loads jquery, And sets a global $ and jQuery variable. We should keep it,
// for extensions / modules that require a global `$`.
const $ = require("jquery");
global.$ = global.jQuery = $;
assets/scss/bolt.scss
+2
View File
@@ -1,5 +1,7 @@
//** Styling
@import './vendor/vendor';
@import './modules/modules';
@import "settings";
@import "textstyles";
@import "layout";
assets/scss/modules/fields/_image.scss
+44
View File
@@ -0,0 +1,44 @@
//** Image Field
.field__image{
position: relative;
&.is-dragging{
background: red;
}
&--dragging{
position: absolute;
left: 0;
top: 0;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
color: $white;
width: 100%;
height: 100%;
background: transparentize($secondary, 0.15);
z-index: 1000;
font-size: 3.5rem;
border-radius: $border-radius;
}
&--upload{
@include sr-only;
@include sr-only-focusable;
}
&--preview{
width: 100%;
height: 200px;
border-radius: $border-radius;
background-color: gray("200");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
}
.fade-enter-active, .fade-leave-active {
transition: opacity .2s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
assets/scss/modules/fields/fields.scss
+3
View File
@@ -0,0 +1,3 @@
//** Bootstrap
@import '_image.scss';
assets/scss/modules/modules.scss
+4
View File
@@ -0,0 +1,4 @@
//** Modules
@import './fields/fields';
config/bolt/contenttypes.yml
+3
View File
@@ -75,6 +75,9 @@ pages:
body:
type: html
height: 300px
textarea:
type: textarea
postfix: "<p><em>This is a plain text area. the contents will not be processed.</em></p>"
template:
type: templateselect
filter: '*.twig'
package-lock.json
Generated
+23
View File
@@ -3719,6 +3719,21 @@
"integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
"dev": true
},
"filepond": {
"version": "3.1.4",
"resolved": "https://registry.npmjs.org/filepond/-/filepond-3.1.4.tgz",
"integrity": "sha512-YPRFg2ydzNAnZECNalNIVJTh8cl/56cSr3RKkfPdW7nfa22hh4ky3RPE9ko9qpImVlp4uKURKent5a8vCGJj1Q=="
},
"filepond-plugin-file-validate-type": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/filepond-plugin-file-validate-type/-/filepond-plugin-file-validate-type-1.2.0.tgz",
"integrity": "sha512-oXck6wr37TwN1qcb64ktXIsi15Mfqqfd65T9gp5RP2nkXkwXtvgb5q5PANRqNEAYyJv3Od5DfL8m4BzfBXiBtg=="
},
"filepond-plugin-image-preview": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/filepond-plugin-image-preview/-/filepond-plugin-image-preview-3.0.0.tgz",
"integrity": "sha512-UfcXa0GRvg1++lAcUSdbVpqETqiPBg9uedQ1b7kwyI0d5y/ZTh1z4R1BD0gxCYmWU7ddIUtrPOTmY4p6mXYImg=="
},
"fill-range": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
@@ -10264,6 +10279,14 @@
}
}
},
"vue-filepond": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/vue-filepond/-/vue-filepond-4.0.0.tgz",
"integrity": "sha512-4Oysuowt7ZiddexpmJXKfeE6Z1glpe8wueH8vBQaRXkhyGexFkKLorwxraIiavSoamme9mcOysTRYNloqJh3zA==",
"requires": {
"filepond": "^3.0.2"
}
},
"vue-flatpickr-component": {
"version": "8.0.0",
"resolved": "https://registry.npmjs.org/vue-flatpickr-component/-/vue-flatpickr-component-8.0.0.tgz",
package.json
+3
View File
@@ -27,11 +27,14 @@
"axios": "^0.18.0",
"bootstrap": "^4.1.3",
"codemirror": "^5.40.2",
"filepond-plugin-file-validate-type": "^1.2.0",
"filepond-plugin-image-preview": "^3.0.0",
"jquery": "^3.3.1",
"moment": "^2.22.2",
"popper.js": "^1.14.4",
"simplemde": "^1.11.2",
"vue": "^2.5.17",
"vue-filepond": "^4.0.0",
"vue-flatpickr-component": "^8.0.0",
"vue-simplemde": "^0.4.8",
"vue-trumbowyg": "^3.4.0"
public/assets/bolt.css
+71 -1
View File
File diff suppressed because one or more lines are too long
public/assets/bolt.js
+434 -30
View File
@@ -551,6 +551,70 @@ if (false) {(function () {
/* harmony default export */ __webpack_exports__["a"] = (Component.exports);
/***/ }),
/***/ "./assets/js/Components/Editor/Textarea.vue":
/*!**************************************************!*\
!*** ./assets/js/Components/Editor/Textarea.vue ***!
\**************************************************/
/*! exports provided: default */
/*! exports used: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_cacheDirectory_true_presets_env_modules_false_targets_browsers_1_uglify_true_useBuiltIns_true_plugins_node_modules_vue_loader_lib_selector_type_script_index_0_Textarea_vue__ = __webpack_require__(/*! !babel-loader?{"cacheDirectory":true,"presets":[["env",{"modules":false,"targets":{"browsers":"> 1%","uglify":true},"useBuiltIns":true}]],"plugins":[]}!../../../../node_modules/vue-loader/lib/selector?type=script&index=0!./Textarea.vue */ "./node_modules/babel-loader/lib/index.js?{\"cacheDirectory\":true,\"presets\":[[\"env\",{\"modules\":false,\"targets\":{\"browsers\":\"> 1%\",\"uglify\":true},\"useBuiltIns\":true}]],\"plugins\":[]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./assets/js/Components/Editor/Textarea.vue");
/* unused harmony namespace reexport */
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_3dec346a_hasScoped_true_optionsId_0_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Textarea_vue__ = __webpack_require__(/*! !../../../../node_modules/vue-loader/lib/template-compiler/index?{"id":"data-v-3dec346a","hasScoped":true,"optionsId":"0","buble":{"transforms":{}}}!../../../../node_modules/vue-loader/lib/selector?type=template&index=0!./Textarea.vue */ "./node_modules/vue-loader/lib/template-compiler/index.js?{\"id\":\"data-v-3dec346a\",\"hasScoped\":true,\"optionsId\":\"0\",\"buble\":{\"transforms\":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./assets/js/Components/Editor/Textarea.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__node_modules_vue_loader_lib_runtime_component_normalizer__ = __webpack_require__(/*! ../../../../node_modules/vue-loader/lib/runtime/component-normalizer */ "./node_modules/vue-loader/lib/runtime/component-normalizer.js");
var disposed = false
function injectStyle (context) {
if (disposed) return
__webpack_require__(/*! !../../../../node_modules/extract-text-webpack-plugin/dist/loader.js?{"omit":1,"remove":true}!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false,"importLoaders":0}!../../../../node_modules/vue-loader/lib/style-compiler/index?{"optionsId":"0","vue":true,"id":"data-v-3dec346a","scoped":true,"sourceMap":false}!../../../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Textarea.vue */ "./node_modules/extract-text-webpack-plugin/dist/loader.js?{\"omit\":1,\"remove\":true}!./node_modules/vue-style-loader/index.js!./node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false,\"importLoaders\":0}!./node_modules/vue-loader/lib/style-compiler/index.js?{\"optionsId\":\"0\",\"vue\":true,\"id\":\"data-v-3dec346a\",\"scoped\":true,\"sourceMap\":false}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./assets/js/Components/Editor/Textarea.vue")
}
/* script */
/* template */
/* template functional */
var __vue_template_functional__ = false
/* styles */
var __vue_styles__ = injectStyle
/* scopeId */
var __vue_scopeId__ = "data-v-3dec346a"
/* moduleIdentifier (server only) */
var __vue_module_identifier__ = null
var Component = Object(__WEBPACK_IMPORTED_MODULE_2__node_modules_vue_loader_lib_runtime_component_normalizer__["a" /* default */])(
__WEBPACK_IMPORTED_MODULE_0__babel_loader_cacheDirectory_true_presets_env_modules_false_targets_browsers_1_uglify_true_useBuiltIns_true_plugins_node_modules_vue_loader_lib_selector_type_script_index_0_Textarea_vue__["a" /* default */],
__WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_3dec346a_hasScoped_true_optionsId_0_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Textarea_vue__["a" /* render */],
__WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_3dec346a_hasScoped_true_optionsId_0_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Textarea_vue__["b" /* staticRenderFns */],
__vue_template_functional__,
__vue_styles__,
__vue_scopeId__,
__vue_module_identifier__
)
Component.options.__file = "assets/js/Components/Editor/Textarea.vue"
/* hot reload */
if (false) {(function () {
var hotAPI = require("vue-hot-reload-api")
hotAPI.install(require("vue"), false)
if (!hotAPI.compatible) return
module.hot.accept()
if (!module.hot.data) {
hotAPI.createRecord("data-v-3dec346a", Component.options)
} else {
hotAPI.reload("data-v-3dec346a", Component.options)
}
module.hot.dispose(function (data) {
disposed = true
})
})()}
/* harmony default export */ __webpack_exports__["a"] = (Component.exports);
/***/ }),
/***/ "./assets/js/Components/Sidebar.vue":
@@ -728,11 +792,12 @@ new __WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */]({ el: "dashboardnews",
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_vue__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__Components_Editor_Slug_vue__ = __webpack_require__(/*! ../Components/Editor/Slug.vue */ "./assets/js/Components/Editor/Slug.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Components_Editor_Markdown_vue__ = __webpack_require__(/*! ../Components/Editor/Markdown.vue */ "./assets/js/Components/Editor/Markdown.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__Components_Editor_Html_vue__ = __webpack_require__(/*! ../Components/Editor/Html.vue */ "./assets/js/Components/Editor/Html.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__Components_Editor_DateTime_vue__ = __webpack_require__(/*! ../Components/Editor/DateTime.vue */ "./assets/js/Components/Editor/DateTime.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__Components_Editor_Select_vue__ = __webpack_require__(/*! ../Components/Editor/Select.vue */ "./assets/js/Components/Editor/Select.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__Components_Editor_Image_vue__ = __webpack_require__(/*! ../Components/Editor/Image.vue */ "./assets/js/Components/Editor/Image.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Components_Editor_Textarea_vue__ = __webpack_require__(/*! ../Components/Editor/Textarea.vue */ "./assets/js/Components/Editor/Textarea.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__Components_Editor_Markdown_vue__ = __webpack_require__(/*! ../Components/Editor/Markdown.vue */ "./assets/js/Components/Editor/Markdown.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__Components_Editor_Html_vue__ = __webpack_require__(/*! ../Components/Editor/Html.vue */ "./assets/js/Components/Editor/Html.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__Components_Editor_DateTime_vue__ = __webpack_require__(/*! ../Components/Editor/DateTime.vue */ "./assets/js/Components/Editor/DateTime.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__Components_Editor_Select_vue__ = __webpack_require__(/*! ../Components/Editor/Select.vue */ "./assets/js/Components/Editor/Select.vue");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__Components_Editor_Image_vue__ = __webpack_require__(/*! ../Components/Editor/Image.vue */ "./assets/js/Components/Editor/Image.vue");
/**
* Editor Components
@@ -748,12 +813,12 @@ new __WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */]({ el: "dashboardnews",
* Register Components
*/
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-slug", __WEBPACK_IMPORTED_MODULE_1__Components_Editor_Slug_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-textarea", __WEBPACK_IMPORTED_MODULE_1__Components_Editor_Slug_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-markdown", __WEBPACK_IMPORTED_MODULE_2__Components_Editor_Markdown_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-html", __WEBPACK_IMPORTED_MODULE_3__Components_Editor_Html_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-datetime", __WEBPACK_IMPORTED_MODULE_4__Components_Editor_DateTime_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-select", __WEBPACK_IMPORTED_MODULE_5__Components_Editor_Select_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-image", __WEBPACK_IMPORTED_MODULE_6__Components_Editor_Image_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-textarea", __WEBPACK_IMPORTED_MODULE_2__Components_Editor_Textarea_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-markdown", __WEBPACK_IMPORTED_MODULE_3__Components_Editor_Markdown_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-html", __WEBPACK_IMPORTED_MODULE_4__Components_Editor_Html_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-datetime", __WEBPACK_IMPORTED_MODULE_5__Components_Editor_DateTime_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-select", __WEBPACK_IMPORTED_MODULE_6__Components_Editor_Select_vue__["a" /* default */]);
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].component("editor-image", __WEBPACK_IMPORTED_MODULE_7__Components_Editor_Image_vue__["a" /* default */]);
new __WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */]({ el: "#editcontent", name: "admin-editor" });
new __WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */]({ el: "#metadata", name: "admin-meta" });
@@ -770,19 +835,23 @@ new __WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */]({ el: "#metadata", name
"use strict";
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__helpers_filters__ = __webpack_require__(/*! ./helpers/filters */ "./assets/js/helpers/filters.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_bootstrap__ = __webpack_require__(/*! bootstrap */ "./node_modules/bootstrap/dist/js/bootstrap.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_bootstrap___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_bootstrap__);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__scss_bolt_scss__ = __webpack_require__(/*! ../scss/bolt.scss */ "./assets/scss/bolt.scss");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__scss_bolt_scss___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__scss_bolt_scss__);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__Views_editor__ = __webpack_require__(/*! ./Views/editor */ "./assets/js/Views/editor.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__Views_base__ = __webpack_require__(/*! ./Views/base */ "./assets/js/Views/base.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_vue__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__helpers_filters__ = __webpack_require__(/*! ./helpers/filters */ "./assets/js/helpers/filters.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_bootstrap__ = __webpack_require__(/*! bootstrap */ "./node_modules/bootstrap/dist/js/bootstrap.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_bootstrap___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2_bootstrap__);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__scss_bolt_scss__ = __webpack_require__(/*! ../scss/bolt.scss */ "./assets/scss/bolt.scss");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__scss_bolt_scss___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_3__scss_bolt_scss__);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_axios__ = __webpack_require__(/*! axios */ "./node_modules/axios/index.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4_axios___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_4_axios__);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__Views_editor__ = __webpack_require__(/*! ./Views/editor */ "./assets/js/Views/editor.js");
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__Views_base__ = __webpack_require__(/*! ./Views/base */ "./assets/js/Views/base.js");
/**
* Vue Core | Config
*/
// import './registerServiceWorker'
/**
* Bootstrap Javascript
@@ -792,6 +861,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
* Styling
*/
/**
* Set Axios
*/
__WEBPACK_IMPORTED_MODULE_0_vue__["a" /* default */].prototype.$axios = __WEBPACK_IMPORTED_MODULE_4_axios___default.a;
/**
* Vue Components
*/
@@ -2887,13 +2961,112 @@ module.exports = {
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
/* harmony default export */ __webpack_exports__["a"] = ({
name: "editor-image",
props: ['value', 'label', 'name'],
mixins: [__WEBPACK_IMPORTED_MODULE_0__helpers_mixins_fieldValue__["a" /* default */]]
props: ['label', 'name', 'value', 'thumbnail', 'alt', 'title'],
mixins: [__WEBPACK_IMPORTED_MODULE_0__helpers_mixins_fieldValue__["a" /* default */]],
mounted: function mounted() {
this.previewImage = this.thumbnail;
this.currentPreviewImage = this.thumbnail;
},
data: function data() {
return {
currentPreviewImage: null,
previewImage: null,
newPreviewImage: null,
isDragging: false,
dragCount: 0
};
},
methods: {
selectFile: function selectFile() {
this.$refs.selectFile.click();
},
onDragEnter: function onDragEnter(e) {
e.preventDefault();
this.dragCount++;
this.isDragging = true;
return false;
},
onDragLeave: function onDragLeave(e) {
e.preventDefault();
this.dragCount--;
if (this.dragCount <= 0) this.isDragging = false;
},
getFile: function getFile(e) {
var _this = this;
var reader = new FileReader();
var image = e.target.files[0];
reader.readAsDataURL(image);
reader.onload = function (event) {
_this.newPreviewImage = event.target.result;
};
return this.uploadFile(e.target.files[0]);
},
uploadFile: function uploadFile(file) {
var fd = new FormData();
fd.append('filepond[]', file);
this.$axios.post('/async/upload', fd, {
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(function (res) {
console.log(res);
}).catch(function (err) {
console.log(err);
});
}
},
computed: {
fieldName: function fieldName() {
return this.name + '[]';
}
}
});
/***/ }),
@@ -2974,7 +3147,7 @@ module.exports = {
selectOptions: function selectOptions() {
return JSON.parse(this.options);
},
selectName: function selectName() {
fieldName: function fieldName() {
return this.name + '[]';
}
}
@@ -3029,6 +3202,13 @@ module.exports = {
//
//
//
//
//
//
//
//
//
//
@@ -3067,6 +3247,39 @@ module.exports = {
/***/ }),
/***/ "./node_modules/babel-loader/lib/index.js?{\"cacheDirectory\":true,\"presets\":[[\"env\",{\"modules\":false,\"targets\":{\"browsers\":\"> 1%\",\"uglify\":true},\"useBuiltIns\":true}]],\"plugins\":[]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./assets/js/Components/Editor/Textarea.vue":
/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/babel-loader/lib?{"cacheDirectory":true,"presets":[["env",{"modules":false,"targets":{"browsers":"> 1%","uglify":true},"useBuiltIns":true}]],"plugins":[]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./assets/js/Components/Editor/Textarea.vue ***!
\******************************************************************************************************************************************************************************************************************************************************************************************/
/*! exports provided: default */
/*! exports used: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__helpers_mixins_fieldValue__ = __webpack_require__(/*! ../../helpers/mixins/fieldValue */ "./assets/js/helpers/mixins/fieldValue.js");
//
//
//
//
//
//
//
//
//
//
//
//
/* harmony default export */ __webpack_exports__["a"] = ({
name: "editor-textarea",
props: ['value', 'label', 'name'],
mixins: [__WEBPACK_IMPORTED_MODULE_0__helpers_mixins_fieldValue__["a" /* default */]]
});
/***/ }),
/***/ "./node_modules/babel-loader/lib/index.js?{\"cacheDirectory\":true,\"presets\":[[\"env\",{\"modules\":false,\"targets\":{\"browsers\":\"> 1%\",\"uglify\":true},\"useBuiltIns\":true}]],\"plugins\":[]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./assets/js/Components/Sidebar.vue":
/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/babel-loader/lib?{"cacheDirectory":true,"presets":[["env",{"modules":false,"targets":{"browsers":"> 1%","uglify":true},"useBuiltIns":true}]],"plugins":[]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./assets/js/Components/Sidebar.vue ***!
@@ -21295,6 +21508,18 @@ if (!CodeMirror.mimeModes.hasOwnProperty("text/html"))
/***/ }),
/***/ "./node_modules/extract-text-webpack-plugin/dist/loader.js?{\"omit\":1,\"remove\":true}!./node_modules/vue-style-loader/index.js!./node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false,\"importLoaders\":0}!./node_modules/vue-loader/lib/style-compiler/index.js?{\"optionsId\":\"0\",\"vue\":true,\"id\":\"data-v-3dec346a\",\"scoped\":true,\"sourceMap\":false}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./assets/js/Components/Editor/Textarea.vue":
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/extract-text-webpack-plugin/dist/loader.js?{"omit":1,"remove":true}!./node_modules/vue-style-loader!./node_modules/css-loader?{"minimize":false,"sourceMap":false,"importLoaders":0}!./node_modules/vue-loader/lib/style-compiler?{"optionsId":"0","vue":true,"id":"data-v-3dec346a","scoped":true,"sourceMap":false}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./assets/js/Components/Editor/Textarea.vue ***!
\*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! dynamic exports provided */
/*! all exports used */
/***/ (function(module, exports) {
// removed by extract-text-webpack-plugin
/***/ }),
/***/ "./node_modules/extract-text-webpack-plugin/dist/loader.js?{\"omit\":1,\"remove\":true}!./node_modules/vue-style-loader/index.js!./node_modules/css-loader/index.js?{\"minimize\":false,\"sourceMap\":false,\"importLoaders\":0}!./node_modules/vue-loader/lib/style-compiler/index.js?{\"optionsId\":\"0\",\"vue\":true,\"scoped\":false,\"sourceMap\":false}!./node_modules/resolve-url-loader/index.js?{\"sourceMap\":false}!./node_modules/sass-loader/lib/loader.js?{\"sourceMap\":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./assets/js/Components/Sidebar.vue":
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/extract-text-webpack-plugin/dist/loader.js?{"omit":1,"remove":true}!./node_modules/vue-style-loader!./node_modules/css-loader?{"minimize":false,"sourceMap":false,"importLoaders":0}!./node_modules/vue-loader/lib/style-compiler?{"optionsId":"0","vue":true,"scoped":false,"sourceMap":false}!./node_modules/resolve-url-loader?{"sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./assets/js/Components/Sidebar.vue ***!
@@ -61517,6 +61742,54 @@ if (false) {
/***/ }),
/***/ "./node_modules/vue-loader/lib/template-compiler/index.js?{\"id\":\"data-v-3dec346a\",\"hasScoped\":true,\"optionsId\":\"0\",\"buble\":{\"transforms\":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./assets/js/Components/Editor/Textarea.vue":
/*!******************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-3dec346a","hasScoped":true,"optionsId":"0","buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./assets/js/Components/Editor/Textarea.vue ***!
\******************************************************************************************************************************************************************************************************************************************************/
/*! exports provided: render, staticRenderFns */
/*! exports used: render, staticRenderFns */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return render; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return staticRenderFns; });
var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c("div", { staticClass: "form-group" }, [
_c("label", [_vm._v(_vm._s(_vm.label))]),
_vm._v(" "),
_c("textarea", {
directives: [
{ name: "model", rawName: "v-model", value: _vm.val, expression: "val" }
],
staticClass: "form-control",
attrs: { name: _vm.name, rows: "10" },
domProps: { value: _vm.val },
on: {
input: function($event) {
if ($event.target.composing) {
return
}
_vm.val = $event.target.value
}
}
})
])
}
var staticRenderFns = []
render._withStripped = true
if (false) {
module.hot.accept()
if (module.hot.data) {
require("vue-hot-reload-api") .rerender("data-v-3dec346a", { render: render, staticRenderFns: staticRenderFns })
}
}
/***/ }),
/***/ "./node_modules/vue-loader/lib/template-compiler/index.js?{\"id\":\"data-v-5c860b88\",\"hasScoped\":false,\"optionsId\":\"0\",\"buble\":{\"transforms\":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./assets/js/Components/Editor/Html.vue":
/*!***************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-5c860b88","hasScoped":false,"optionsId":"0","buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./assets/js/Components/Editor/Html.vue ***!
@@ -61711,7 +61984,7 @@ var render = function() {
_c(
"button",
{
staticClass: "btn btn-outline-primary",
staticClass: "btn btn-secondary",
class: { "btn-outline-secondary": _vm.readonly == 1 },
attrs: {
type: "button",
@@ -61806,7 +62079,11 @@ var render = function() {
_c(
"button",
{
staticClass: "btn btn-secondary dropdown-toggle",
staticClass: "btn dropdown-toggle",
class: [
{ "btn-primary": _vm.edit },
{ "btn-secondary": !_vm.edit }
],
attrs: {
type: "button",
"data-toggle": "dropdown",
@@ -61902,7 +62179,7 @@ var render = function() {
}
],
staticClass: "custom-select",
attrs: { id: _vm.id, name: _vm.selectName, form: _vm.form },
attrs: { id: _vm.id, name: _vm.fieldName, form: _vm.form },
on: {
change: function($event) {
var $$selectedVal = Array.prototype.filter
@@ -61952,12 +62229,139 @@ var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c("div", { staticClass: "form-group" }, [
_c("label", [_vm._v(_vm._s(_vm.label))]),
_vm._v("\n " + _vm._s(_vm.val) + "\n")
])
return _c(
"div",
{
staticClass: "form-group field__image",
on: {
dragenter: _vm.onDragEnter,
dragleave: _vm.onDragLeave,
dragover: function($event) {
$event.preventDefault()
}
}
},
[
_c("transition", { attrs: { name: "fade" } }, [
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.isDragging,
expression: "isDragging"
}
],
staticClass: "field__image--dragging"
},
[_c("i", { staticClass: "fas fa-upload" })]
)
]),
_vm._v(" "),
_c("div", { staticClass: "row" }, [
_c("div", { staticClass: "col-8" }, [
_c("label", [_vm._v(_vm._s(_vm.label))]),
_vm._v(" "),
_c("div", { staticClass: "input-group mb-3" }, [
_c("input", {
staticClass: "form-control",
attrs: {
name: _vm.name + "[alt]",
type: "text",
placeholder: "alt text"
},
domProps: { value: _vm.alt }
})
]),
_vm._v(" "),
_c("div", { staticClass: "input-group mb-3" }, [
_c("input", {
staticClass: "form-control",
attrs: {
name: _vm.name + "[title]",
type: "text",
placeholder: "title"
},
domProps: { value: _vm.title }
})
]),
_vm._v(" "),
_c(
"div",
{ staticClass: "btn-toolbar", attrs: { role: "toolbar" } },
[
_c(
"div",
{ staticClass: "btn-group mr-2", attrs: { role: "group" } },
[
_c(
"button",
{
staticClass: "btn btn-secondary",
attrs: { type: "button" },
on: { click: _vm.selectFile }
},
[
_c("i", { staticClass: "fas fa-fw fa-upload" }),
_vm._v(" Upload\n ")
]
)
]
),
_vm._v(" "),
_vm._m(0)
]
)
]),
_vm._v(" "),
_c("div", { staticClass: "col-4" }, [
_c("label", [_vm._v("Preview:")]),
_vm._v(" "),
_c("div", {
staticClass: "field__image--preview",
style: "background-image: url('" + _vm.previewImage + "')"
})
])
]),
_vm._v(" "),
_c("input", {
ref: "selectFile",
staticClass: "field__image--upload",
attrs: { name: _vm.fieldName, type: "file" },
on: { change: _vm.getFile }
}),
_vm._v(" "),
_c("input", {
attrs: { name: _vm.name + "[filename]", type: "hidden" },
domProps: { value: _vm.val }
})
],
1
)
}
var staticRenderFns = []
var staticRenderFns = [
function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c(
"div",
{ staticClass: "btn-group mr-2", attrs: { role: "group" } },
[
_c(
"button",
{ staticClass: "btn btn-secondary", attrs: { type: "button" } },
[
_c("i", { staticClass: "fas fa-fw fa-th" }),
_vm._v(" From Library\n ")
]
)
]
)
}
]
render._withStripped = true
if (false) {