text: Vue.component("region",{props:["model","content","type"],data:function(){return{itemAdded:!1}},methods:{moveItem:function(e,t){this.model.items.splice(t,0,this.model.items.splice(e,1)[0])},addItem:function(){var e=this;fetch(piranha.baseUrl+"manager/api/content/region/"+this.content+"/"+this.type+"/"+this.model.meta.id).then(function(e){return e.json()}).then(function(t){e.model.items.push(t),e.itemAdded=!0}).catch(function(e){console.log("error:",e)})},removeItem:function(e){this.model.items.splice(this.model.items.indexOf(e),1)},updateTitle:function(e){if(this.model.meta.isCollection)for(var t=0;t<this.model.items.length;t++)for(var i=this.model.items[t],n=0;n<i.fields.length;n++){if(i.fields[n].meta.uid===e.uid){this.model.items[t].title=e.title;break}}}},mounted:function(){if(this.model.meta.isCollection){var e=this;sortable("#"+this.model.meta.uid,{handle:".card-header a:first-child",items:":not(.unsortable)"})[0].addEventListener("sortupdate",function(t){e.moveItem(t.detail.origin.index,t.detail.destination.index)})}},updated:function(){this.model.meta.isCollection&&this.itemAdded&&(sortable("#"+this.model.meta.uid,"disable"),sortable("#"+this.model.meta.uid,"enable"),this.model.meta.expanded||$("#"+this.model.meta.uid+" .card:last-child .card-header > a").click(),this.itemAdded=!1)},template:'\n<div class="row" v-if="!model.meta.isCollection">\n    <div class="col-sm-12" v-if="model.meta.description != null">\n        <div class="alert alert-info" v-html="model.meta.description"></div>\n    </div>\n    <div class="form-group" :class="{ \'col-sm-6\': field.meta.isHalfWidth, \'col-sm-12\': !field.meta.isHalfWidth }" v-bind:key="\'field\' + field.meta.uid" v-for="field in model.items[0].fields">\n        <label v-if="model.items[0].fields.length > 1">{{ field.meta.name }}</label>\n        <div v-if="field.meta.description != null" v-html="field.meta.description" class="field-description small text-muted"></div>\n        <div class="field-body">\n            <div :id="\'tb-\' + field.meta.uid" class="component-toolbar"></div>\n            <component v-if="field.model != null" v-bind:is="field.meta.component" v-bind:uid="field.meta.uid" v-bind:meta="field.meta" v-bind:toolbar="\'tb-\' + field.meta.uid" v-bind:model="field.model"></component>\n        </div>\n    </div>\n</div>\n<div v-else>\n    <div v-if="model.meta.description != null">\n        <div class="alert alert-info" v-html="model.meta.description"></div>\n    </div>\n    <div :id="model.meta.uid" class="accordion sortable" :class="model.items.length !== 0 ? \'mb-3\' : \'\'">\n        <div class="card" :key="item.uid" v-for="(item) in model.items">\n            <div class="card-header">\n                <a href="#" :data-toggle="!model.meta.expanded ? \'collapse\' : false" :data-target="\'#body\' + item.uid">\n                    <div class="handle">\n                        <i class="fas fa-ellipsis-v"></i>\n                    </div>\n                    {{ item.title }}\n                </a>\n                <span class="actions float-right">\n                    <a v-on:click.prevent="removeItem(item)" href="#" class="danger"><i class="fas fa-trash"></i></a>\n                </span>\n            </div>\n            <div :id="\'body\' + item.uid" :class="{ \'collapse\' : !model.meta.expanded }" :data-parent="\'#\' + model.meta.uid">\n                <div class="card-body">\n                    <div class="row">\n                        <div class="form-group" :class="{ \'col-sm-6\': field.meta.isHalfWidth, \'col-sm-12\': !field.meta.isHalfWidth }" v-bind:key="field.meta.uid" v-for="field in item.fields">\n                            <label v-if="item.fields.length > 1 || field.meta.id !== \'Default\'">{{ field.meta.name }}</label>\n                            <div v-if="field.meta.description != null" v-html="field.meta.description" class="field-description small text-muted"></div>\n                            <div class="field-body">\n                                <div :id="\'tb-\' + field.meta.uid" class="component-toolbar"></div>\n                                <component v-if="field.model != null" v-bind:is="field.meta.component" v-bind:uid="field.meta.uid" v-bind:meta="field.meta" v-bind:toolbar="\'tb-\' + field.meta.uid" v-bind:model="field.model" v-on:update-title="updateTitle($event)"></component>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n    <a href="#" class="block-add" v-on:click.prevent="addItem()">\n        <hr>\n        <i class="fas fa-plus-circle"></i>\n    </a>\n    <div v-if="model.items.length === 0" class="empty-info unsortable">\n        <p>{{ piranha.resources.texts.emptyAddAbove }}</p>\n    </div>\n</div>\n'}),Vue.component("post-archive",{props:["uid","id"],data:function(){return{items:[],categories:[],postTypes:[],totalPosts:0,totalPages:0,index:0,status:"all",category:piranha.resources.texts.allCategories}},methods:{load:function(e){var t=this;e||(e=0),fetch(piranha.baseUrl+"manager/api/post/list/"+t.id+"/"+e).then(function(e){return e.json()}).then(function(e){t.items=e.posts,t.categories=e.categories,t.postTypes=e.postTypes,t.totalPosts=e.totalPosts,t.totalPages=e.totalPages,t.index=e.index}).catch(function(e){console.log("error:",e)})},remove:function(e){var t=this;piranha.alert.open({title:piranha.resources.texts.delete,body:piranha.resources.texts.deletePostConfirm,confirmCss:"btn-danger",confirmIcon:"fas fa-trash",confirmText:piranha.resources.texts.delete,onConfirm:function(){fetch(piranha.baseUrl+"manager/api/post/delete/"+e).then(function(e){return e.json()}).then(function(e){piranha.notifications.push(e),t.load()}).catch(function(e){console.log("error:",e)})}})},first:function(){this.hasPrev()&&this.load(0)},prev:function(){this.hasPrev()&&this.load(this.index-1)},next:function(){this.hasNext()&&this.load(this.index+1)},last:function(){this.hasNext()&&this.load(this.totalPages-1)},hasPrev:function(){return this.index>0},hasNext:function(){return this.index<this.totalPages-1},isSelected:function(e){return(this.category===piranha.resources.texts.allCategories||e.category===this.category)&&("draft"===this.status?"draft"===e.status||"unpublished"===e.status:"scheduled"!==this.status||e.isScheduled)},selectStatus:function(e){this.status=e},selectCategory:function(e){this.category=e},onSaved:function(e){this.load(this.index)}},computed:{selectedPosts:function(){var e=this;return this.items.filter(function(t){return e.isSelected(t)})}},mounted:function(){this.load(),this.eventBus.$on("onSaved",this.onSaved)},beforeDestroy:function(){this.eventBus.$off("onSaved")},template:'\n<div :id="uid">\n    <div class="mb-2">\n        <div class="btn-group" role="group">\n            <button v-on:click="selectStatus(\'all\')" class="btn btn-sm" :class="status === \'all\' ? \'btn-primary\' : \'btn-light\'" href="#">{{ piranha.resources.texts.all }}</button>\n            <button v-on:click="selectStatus(\'draft\')" class="btn btn-sm" :class="status === \'draft\' ? \'btn-primary\' : \'btn-light\'" href="#">{{ piranha.resources.texts.drafts }}</button>\n            <button v-on:click="selectStatus(\'scheduled\')" class="btn btn-sm" :class="status === \'scheduled\' ? \'btn-primary\' : \'btn-light\'" href="#">{{ piranha.resources.texts.scheduled }}</button>\n        </div>\n        <div v-if="postTypes.length > 1" class="btn-group" role="group">\n            <button type="button" class="btn btn-sm btn-light dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">\n                {{ piranha.resources.texts.all }}\n            </button>\n            <div class="dropdown-menu dropdown-menu-right">\n                <a v-for="type in postTypes" v-bind:key="type.id" href="#" class="dropdown-item">{{ type.title }}</a>\n            </div>\n        </div>\n        <div v-if="categories.length > 1" class="btn-group" role="group">\n            <button type="button" class="btn btn-sm dropdown-toggle" :class="category === piranha.resources.texts.allCategories ? \'btn-light\' : \'btn-primary\'" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">\n                {{ category }}\n            </button>\n            <div class="dropdown-menu dropdown-menu-right">\n                <a v-on:click.prevent="selectCategory(piranha.resources.texts.allCategories)" href="#" class="dropdown-item">{{ piranha.resources.texts.allCategories }}</a>\n                <a v-on:click.prevent="selectCategory(category.title)" v-for="category in categories" v-bind:key="category.slug" href="#" class="dropdown-item">{{ category.title }}</a>\n            </div>\n        </div>\n        <div v-if="postTypes.length > 1 && piranha.permissions.posts.add" class="btn-group float-right">\n            <button id="addPostGroup" class="btn btn-sm btn-primary btn-labeled dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-plus"></i>{{ piranha.resources.texts.add }}</button>\n            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="addPostGroup">\n                <a class="dropdown-item" :href="piranha.baseUrl + type.addUrl + id + \'/\' + type.id" v-bind:key="\'add-\' + type.id" v-for="type in postTypes">{{ type.title }}</a>\n            </div>\n        </div>\n        <a v-if="postTypes.length === 1 && piranha.permissions.posts.add" :href="piranha.baseUrl + postTypes[0].addUrl + id + \'/\' + postTypes[0].id" class="btn btn-sm btn-primary btn-labeled float-right"><i class="fas fa-plus"></i>{{ piranha.resources.texts.add }}</a>\n    </div>\n    <table v-if="items.length > 0" class="table">\n        <tbody>\n            <tr v-bind:key="post.id" v-for="post in selectedPosts" :class="{ unpublished: post.status === \'unpublished\' || post.isScheduled }">\n                <td>\n                    <a :href="piranha.baseUrl + post.editUrl + post.id">{{ post.title }}</a>\n                    <small v-if="post.status === \'published\' || post.status === \'draft\'" class="text-muted">| {{ post.published }}</small>\n                    <small v-else-if="post.status === \'unpublished\'" class="text-muted">| Unpublished</small>\n                    <span v-if="post.status === \'draft\'" class="badge badge-info float-right">{{ piranha.resources.texts.draft }}</span>\n                    <span v-if="post.isScheduled" class="badge badge-info float-right">{{ piranha.resources.texts.scheduled }}</span>\n                </td>\n                <td>\n                    {{ post.typeName }}\n                </td>\n                <td>\n                    {{ post.category }}\n                </td>\n                <td class="actions one">\n                    <a v-if="piranha.permissions.posts.delete" v-on:click.prevent="remove(post.id)" class="danger"><i class="fas fa-trash"></i></a>\n                </td>\n            </tr>\n        </tbody>\n    </table>\n    <div v-else class="empty-info">\n        <p>Looks like there\'s no posts here. Click on the Add button above to get started!</p>\n    </div>\n    <nav v-if="totalPages > 1">\n        <ul class="pagination justify-content-center">\n            <li class="page-item" :class="{ disabled: !hasPrev() }"><button v-on:click.prevent="first()" :disabled="!hasPrev()" class="page-link" href="#"><i class="fas fa-angle-double-left"></i></button></li>\n            <li class="page-item" :class="{ disabled: !hasPrev() }"><button v-on:click.prevent="prev()" :disabled="!hasPrev()" class="page-link" href="#"><i class="fas fa-chevron-left"></i></button></li>\n            <li class="page-item disabled"><span class="page-link">{{ index + 1}} / {{ totalPages }}</span></li>\n            <li class="page-item" :class="{ disabled: !hasNext() }"><button v-on:click.prevent="next()" :disabled="!hasNext()" class="page-link" href="#"><i class="fas fa-chevron-right"></i></button></li>\n            <li class="page-item" :class="{ disabled: !hasNext() }"><button v-on:click.prevent="last()" :disabled="!hasNext()" class="page-link" href="#"><i class="fas fa-angle-double-right"></i></button></li>\n        </ul>\n    </nav>\n</div>\n'}),Vue.component("block-group",{props:["uid","toolbar","model"],methods:{selectItem:function(e){for(var t=0;t<this.model.items.length;t++)this.model.items[t]==e?this.model.items[t].isActive=!0:this.model.items[t].isActive=!1},removeItem:function(e){var t=e.isActive,i=this.model.items.indexOf(e);this.model.items.splice(i,1),t&&this.selectItem(this.model.items[Math.min(i,this.model.items.length-1)])},addGroupBlock:function(e,t){var i=this;fetch(piranha.baseUrl+"manager/api/content/block/"+e).then(function(e){return e.json()}).then(function(e){i.model.items.push(e.body),i.selectItem(e.body)}).catch(function(e){console.log("error:",e)})},updateTitle:function(e){for(var t=0;t<this.model.items.length;t++)if(this.model.items[t].meta.uid===e.uid){this.model.items[t].meta.title=e.title;break}},toggleHeader:function(){this.model.meta.showHeader=!this.model.meta.showHeader},moveItem:function(e,t){this.model.items.splice(t,0,this.model.items.splice(e,1)[0])}},mounted:function(){var e=this;sortable("#"+this.uid+" .list-group",{items:":not(.unsortable)"})[0].addEventListener("sortupdate",function(t){e.moveItem(t.detail.origin.index,t.detail.destination.index)})},template:'\n<div :id="uid" class="block-group">\n    <div v-if="model.fields.length > 0" class="actions block-group-actions">\n        <button v-on:click.prevent="toggleHeader()" class="btn btn-sm" :class="{ selected: model.meta.showHeader }">\n            <i class="fas fa-list"></i>\n        </button>\n    </div>\n    <div class="block-group-header">\n        <div v-if="model.meta.showHeader" class="row">\n            <div class="form-group" :class="{ \'col-sm-6\': field.meta.isHalfWidth, \'col-sm-12\': !field.meta.isHalfWidth }" v-bind:key="field.meta.id" v-for="field in model.fields">\n                <label>{{ field.meta.name }}</label>\n                <div v-if="field.meta.description != null" v-html="field.meta.description" class="field-description small text-muted"></div>\n                <component v-bind:is="field.meta.component" v-bind:uid="field.meta.uid" v-bind:meta="field.meta" v-bind:toolbar="toolbar" v-bind:model="field.model"></component>\n            </div>\n        </div>\n    </div>\n    <div class="row">\n        <div class="col-md-4">\n            <div class="list-group list-group-flush">\n                <div class="list-group-item" :class="{ active: child.isActive }" v-for="child in model.items" v-bind:key="child.meta.uid">\n                    <a href="#" v-on:click.prevent="selectItem(child)">\n                        <div class="handle">\n                            <i class="fas fa-ellipsis-v"></i>\n                        </div>\n                        {{ child.meta.title }}\n                    </a>\n                    <span class=\'actions\'>\n                        <a v-on:click.prevent="removeItem(child)" href="#" class="danger"><i class="fas fa-trash"></i></a>\n                    </span>\n                </div>\n            </div>\n            <button v-on:click.prevent="piranha.blockpicker.open(addGroupBlock, 0, model.type)" class="btn btn-sm btn-primary btn-labeled mt-3">\n                <i class="fas fa-plus"></i>{{ piranha.resources.texts.add }}\n            </button>\n        </div>\n        <div class=\'col-md-8\'>\n            <div v-if="model.items.length === 0" class="empty-info unsortable">\n                <p>{{ piranha.resources.texts.emptyAddLeft }}</p>\n            </div>\n            <template v-for="child in model.items">\n                <div class="block" :class="child.meta.component" v-if="child.isActive" v-bind:key="\'details-\' + child.meta.uid">\n                    <component v-bind:is="child.meta.component" v-bind:uid="child.meta.uid" v-bind:toolbar="toolbar" v-bind:model="child.model" v-on:update-title="updateTitle($event)"></component>\n                </div>\n            </template>\n        </div>\n    </div>\n</div>\n'}),Vue.component("block-group-horizontal",{props:["uid","toolbar","model"],methods:{removeItem:function(e){var t=this.model.items.indexOf(e);this.model.items.splice(t,1)},addGroupBlock:function(e,t){var i=this;fetch(piranha.baseUrl+"manager/api/content/block/"+e).then(function(e){return e.json()}).then(function(e){sortable("#"+i.uid+" .block-group-items","destroy"),i.model.items.push(e.body),Vue.nextTick(function(){sortable("#"+i.uid+" .block-group-items",{handle:".handle",items:":not(.unsortable)",placeholderClass:"col sortable-placeholder"})[0].addEventListener("sortupdate",function(e){i.moveItem(e.detail.origin.index,e.detail.destination.index)})})}).catch(function(e){console.log("error:",e)})},toggleHeader:function(){this.model.meta.showHeader=!this.model.meta.showHeader},moveItem:function(e,t){this.model.items.splice(t,0,this.model.items.splice(e,1)[0])}},mounted:function(){var e=this;sortable("#"+this.uid+" .block-group-items",{handle:".handle",items:":not(.unsortable)",placeholderClass:"col sortable-placeholder"})[0].addEventListener("sortupdate",function(t){e.moveItem(t.detail.origin.index,t.detail.destination.index)})},template:'\n<div :id="uid" class="block-group">\n    <div class="actions block-group-actions">\n        <button v-on:click.prevent="piranha.blockpicker.open(addGroupBlock, 0, model.type)" class="btn btn-sm add">\n            <i class="fas fa-plus"></i>\n        </button>\n        <button v-on:click.prevent=\'toggleHeader()\' v-if=\'model.fields.length > 0\' class=\'btn btn-sm\' :class=\'{ selected: model.meta.showHeader }\'>\n            <i class="fas fa-list"></i>\n        </button>\n    </div>\n    <div v-if="model.meta.showHeader && model.fields.length > 0" class="block-group-header">\n        <div class="row">\n            <div class="form-group" :class="{ \'col-sm-6\': field.meta.isHalfWidth, \'col-sm-12\': !field.meta.isHalfWidth }" v-bind:key="field.meta.id" v-for="field in model.fields">\n                <label>{{ field.meta.name }}</label>\n                <div v-if="field.meta.description != null" v-html="field.meta.description" class="field-description small text-muted"></div>\n                <component v-bind:is=\'field.meta.component\' v-bind:uid=\'field.meta.uid\' v-bind:meta=\'field.meta\' v-bind:toolbar=\'toolbar\' v-bind:model=\'field.model\'></component>\n            </div>\n        </div>\n    </div>\n    <div class="row block-group-items">\n        <div v-if="model.items.length === 0" class="col">\n            <div class="empty-info unsortable">\n                <p>{{ piranha.resources.texts.emptyAddAbove }}</p>\n            </div>\n        </div>\n        <div v-for="child in model.items" v-bind:key="child.meta.uid" class="col">\n            <div class="block" :class="child.meta.component">\n                <div class="block-header">\n                    <div class="title">\n                        <i :class="child.meta.icon"></i><strong>{{ child.meta.name }}</strong>\n                    </div>\n                    <div class="actions">\n                        <span class="btn btn-sm handle">\n                            <i class="fas fa-ellipsis-v"></i>\n                        </span>\n                        <button v-on:click.prevent="removeItem(child)" class="btn btn-sm danger" tabindex="-1">\n                            <i class="fas fa-trash"></i>\n                        </button>\n                    </div>\n                </div>\n                <component v-bind:is="child.meta.component" v-bind:uid="child.meta.uid" v-bind:toolbar="toolbar" v-bind:model="child.model"></component>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("block-group-vertical",{props:["uid","toolbar","model"],methods:{collapseItem:function(e){e.meta.isCollapsed=!e.meta.isCollapsed},removeItem:function(e){var t=this.model.items.indexOf(e);this.model.items.splice(t,1)},addGroupBlock:function(e,t){var i=this;fetch(piranha.baseUrl+"manager/api/content/block/"+e).then(function(e){return e.json()}).then(function(e){sortable("#"+i.uid+" .block-group-items","destroy"),i.model.items.splice(t,0,e.body),Vue.nextTick(function(){sortable("#"+i.uid+" .block-group-items",{handle:".handle",items:":not(.unsortable)",placeholderClass:"sortable-placeholder"})[0].addEventListener("sortupdate",function(e){i.moveItem(e.detail.origin.index,e.detail.destination.index)})})}).catch(function(e){console.log("error:",e)})},toggleHeader:function(){this.model.meta.showHeader=!this.model.meta.showHeader},moveItem:function(e,t){this.model.items.splice(t,0,this.model.items.splice(e,1)[0])}},mounted:function(){var e=this;sortable("#"+this.uid+" .block-group-items",{handle:".handle",items:":not(.unsortable)",placeholderClass:"sortable-placeholder"})[0].addEventListener("sortupdate",function(t){e.moveItem(t.detail.origin.index,t.detail.destination.index)})},template:'\n<div :id="uid" class="block-group">\n    <div class="actions block-group-actions">\n        <button v-on:click.prevent="toggleHeader()" v-if="model.fields.length > 0" class="btn btn-sm" :class="{ selected: model.meta.showHeader }">\n            <i class="fas fa-list"></i>\n        </button>\n    </div>\n    <div v-if="model.meta.showHeader && model.fields.length > 0" class="block-group-header">\n        <div class="row">\n            <div class="form-group" :class="{ \'col-sm-6\': field.meta.isHalfWidth, \'col-sm-12\': !field.meta.isHalfWidth }" v-bind:key="field.meta.uid" v-for="field in model.fields">\n                <label>{{ field.meta.name }}</label>\n                <div v-if="field.meta.description != null" v-html="field.meta.description" class="field-description small text-muted"></div>\n                <component v-bind:is="field.meta.component" v-bind:uid="field.meta.uid" v-bind:meta="field.meta" v-bind:toolbar="toolbar" v-bind:model="field.model"></component>\n            </div>\n        </div>\n    </div>\n    <div class="block-group-items">\n        <a href="#" class="block-add unsortable" v-on:click.prevent="piranha.blockpicker.open(addGroupBlock, 0, model.type)">\n            <hr>\n            <i class="fas fa-plus-circle"></i>\n        </a>\n        <div v-if="model.items.length === 0" class="col">\n            <div class="empty-info unsortable">\n                <p>{{ piranha.resources.texts.emptyAddAbove }}</p>\n            </div>\n        </div>\n        <div v-for="(child, index) in model.items" v-bind:key="child.meta.uid">\n            <div class="block" :class="child.meta.component + (child.meta.isCollapsed ? \' collapsed\' : \'\')">\n                <div class="block-header">\n                    <div class="title">\n                        <i :class="child.meta.icon"></i><strong>{{ child.meta.name }}</strong>\n                    </div>\n                    <div class="actions">\n                        <span v-on:click.prevent="collapseItem(child)" class="btn btn-sm">\n                            <i v-if="child.meta.isCollapsed" class="fas fa-chevron-down"></i>\n                            <i v-else class="fas fa-chevron-up"></i>\n                        </span>\n                        <span class="btn btn-sm handle">\n                            <i class="fas fa-ellipsis-v"></i>\n                        </span>\n                        <button v-on:click.prevent="removeItem(child)" class="btn btn-sm danger" tabindex="-1">\n                            <i class="fas fa-trash"></i>\n                        </button>\n                    </div>\n                </div>\n                <component v-bind:is="child.meta.component" v-bind:uid="child.meta.uid" v-bind:toolbar="toolbar" v-bind:model="child.model"></component>\n            </div>\n            <a href="#" class="block-add unsortable" v-on:click.prevent="piranha.blockpicker.open(addGroupBlock, index + 1, model.type)">\n                <hr>\n                <i class="fas fa-plus-circle"></i>\n            </a>\n        </div>\n    </div>\n</div>\n'}),Vue.component("generic-block",{props:["uid","toolbar","model"],methods:{updateTitle:function(e){this.$emit("update-title",{uid:this.uid,title:e.title})}},template:'\n<div class="block-body">\n    <div class="row">\n        <div class="form-group" :class="{ \'col-sm-6\': field.meta.isHalfWidth, \'col-sm-12\': !field.meta.isHalfWidth }" v-bind:key="\'field\' + field.meta.uid" v-for="field in model">\n            <label>{{ field.meta.name }}</label>\n            <div v-if="field.meta.description != null" v-html="field.meta.description" class="field-description small text-muted"></div>\n            <component v-bind:is="field.meta.component" v-bind:uid="field.meta.uid" v-bind:meta="field.meta" v-bind:toolbar="toolbar" v-bind:model="field.model" v-on:update-title="updateTitle($event)"></component>\n        </div>\n    </div>\n</div>\n'}),Vue.component("audio-block",{props:["uid","model"],methods:{clear:function(){},select:function(){null!=this.model.body.media?piranha.mediapicker.open(this.update,"Audio",this.model.body.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Audio")},remove:function(){this.model.body.id=null,this.model.body.media=null},update:function(e){"Audio"===e.type?(this.model.body.id=e.id,this.model.body.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,contentType:e.contentType,publicUrl:e.publicUrl},this.$emit("update-title",{uid:this.uid,title:this.model.body.media.filename})):console.log("No video was selected")}},computed:{isEmpty:function(){return null==this.model.body.media},mediaUrl:function(){if(null!=this.model.body.media)return piranha.utils.formatUrl(this.model.body.media.publicUrl)}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?this.model.media.filename:"No audio selected"}},template:'\n<div class="block-body has-media-picker d-flex align-items-center" :class="{ empty: isEmpty }">\n    <audio class="flex-grow-1 w-50" :src="mediaUrl" controls></audio>\n    <div class="media-picker slide-in">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                &nbsp;\n            </div>\n            <div class="card-body" v-else>\n                {{ model.body.media.filename }}\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("content-block",{props:["uid","model"],methods:{select:function(){piranha.contentpicker.open(null,this.update)},remove:function(){this.model.body.id=null,this.model.body.content=null},update:function(e){if(null!==e){var t=this;fetch(piranha.baseUrl+"manager/api/content/info/"+e.id).then(function(e){return e.json()}).then(function(e){t.model.body.id=e.id,t.model.body.content=e,t.$emit("update-title",{uid:t.uid,title:t.model.body.content.title})}).catch(function(e){console.log("error:",e)})}else console.log("No content was selected")}},computed:{isEmpty:function(){return null==this.model.body.content},contentImage:function(){return this.hasContentImage?piranha.baseUrl+"manager/api/media/url/"+this.model.body.content.primaryImage.id+"/446/220":piranha.utils.formatUrl("~/manager/assets/img/empty-image.png")},hasContentImage:function(){return null!==this.model.body.content&&null!==this.model.body.content.primaryImage.media},contentTitle:function(){return this.hasContentTitle?this.model.body.content.title:"Lorem Ipsum"},hasContentTitle:function(){return null!==this.model.body.content},contentExcerpt:function(){return this.hasContentExcerpt?this.model.body.content.excerpt:"Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Integer posuere erat a ante venenatis dapibus posuere velit aliquet."},hasContentExcerpt:function(){return null!==this.model.body.content&&null!==this.model.body.content.excerpt}},mounted:function(){this.model.getTitle=function(){return null!==this.model.body.content?this.model.body.content.title:"No content selected"}},template:'\n<div class="block-body has-media-picker rounded clearfix" :class="{ empty: isEmpty }">\n    <div>\n        <div class="page-image" :style="\'background-image:url(\' + contentImage + \')\'">\n            <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/primaryimage-placeholder.png\')">\n        </div>\n        <h3 :class="{ \'text-light\': !hasContentTitle }">{{ contentTitle }}</h3>\n        <p :class="{ \'text-light\': !hasContentExcerpt }" v-html="contentExcerpt"></p>\n    </div>\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                &nbsp;\n            </div>\n            <div class="card-body" v-else>\n                <a :href="piranha.baseUrl + \'manager/content/edit/\' + model.body.content.typeId + \'/\' + model.body.content.id" target="_blank">{{ model.body.content.title }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("html-block",{props:["uid","toolbar","model"],data:function(){return{body:this.model.body.value}},methods:{onBlur:function(e){this.model.body.value=tinyMCE.activeEditor.getContent()},onChange:function(e){this.model.body.value=e}},computed:{isEmpty:function(){return piranha.utils.isEmptyHtml(this.model.body.value)}},mounted:function(){piranha.editor.addInline(this.uid,this.toolbar,this.onChange)},beforeDestroy:function(){piranha.editor.remove(this.uid)},template:'\n<div class="block-body" :class="{ empty: isEmpty }">\n    <div contenteditable="true" :id="uid" v-html="body" v-on:blur="onBlur"></div>\n</div>\n'}),Vue.component("html-column-block",{props:["uid","toolbar","model"],data:function(){return{column1:this.model.column1.value,column2:this.model.column2.value}},methods:{onBlurCol1:function(e){this.model.column1.value=tinyMCE.activeEditor.getContent()},onBlurCol2:function(e){this.model.column2.value=tinyMCE.activeEditor.getContent()},onChangeCol1:function(e){this.model.column1.value=e},onChangeCol2:function(e){this.model.column2.value=e}},computed:{isEmpty1:function(){return piranha.utils.isEmptyHtml(this.model.column1.value)},isEmpty2:function(){return piranha.utils.isEmptyHtml(this.model.column2.value)}},mounted:function(){piranha.editor.addInline(this.uid+1,this.toolbar,this.onChangeCol1),piranha.editor.addInline(this.uid+2,this.toolbar,this.onChangeCol2)},beforeDestroy:function(){piranha.editor.remove(this.uid+1),piranha.editor.remove(this.uid+2)},template:'\n<div class="row block-body">\n    <div class="col-md-6">\n        <div :class="{ empty: isEmpty1 }">\n            <div :id="uid + 1" contenteditable="true" v-html="column1" v-on:blur="onBlurCol1"></div>\n        </div>\n    </div>\n    <div class=\'col-md-6\'>\n        <div :class=\'{ empty: isEmpty2 }\'>\n            <div :id="uid + 2" contenteditable="true" v-html="column2" v-on:blur="onBlurCol2"></div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("image-block",{props:["uid","model"],methods:{clear:function(){},select:function(){null!=this.model.body.media?piranha.mediapicker.open(this.update,"Image",this.model.body.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Image")},remove:function(){this.model.body.id=null,this.model.body.media=null},update:function(e){"Image"===e.type?(this.model.body.id=e.id,this.model.body.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,contentType:e.contentType,publicUrl:e.publicUrl},this.$emit("update-title",{uid:this.uid,title:this.model.body.media.filename})):console.log("No image was selected")},selectAspect:function(e){this.model.aspect.value=e},isAspectSelected(e){return this.model.aspect.value===e}},computed:{isEmpty:function(){return null==this.model.body.media},mediaUrl:function(){return null!=this.model.body.media?piranha.utils.formatUrl(this.model.body.media.publicUrl):piranha.utils.formatUrl("~/manager/assets/img/empty-image.png")},iconUrl:function(){if(this.model.aspect.value>0){if(1===this.model.aspect.value||3===this.model.aspect.value)return piranha.utils.formatUrl("~/manager/assets/img/icons/img-landscape.svg");if(2==this.model.aspect.value)return piranha.utils.formatUrl("~/manager/assets/img/icons/img-portrait.svg");if(4==this.model.aspect.value)return piranha.utils.formatUrl("~/manager/assets/img/icons/img-square.svg")}return null}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?this.model.media.filename:"No image selected"}},template:'\n<div class="block-body has-media-picker rounded" :class="{ empty: isEmpty }">\n    <img class="rounded" :src="mediaUrl">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button :id="uid + \'-aspect\'" class="btn btn-info btn-aspect text-center" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">\n                <i v-if="model.aspect.value === 0" class="fas fa-cog"></i>\n                <img v-else :src="iconUrl">\n            </button>\n            <div class="dropdown-menu aspect-menu" :aria-labelledby="uid + \'-aspect\'">\n                <label class="mb-0">{{ piranha.resources.texts.aspectLabel }}</label>\n                <div class="dropdown-divider"></div>\n                <a v-on:click.prevent="selectAspect(0)" class="dropdown-item" :class="{ active: isAspectSelected(0) }" href="#">\n                    <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/icons/img-original.svg\')"><span>{{ piranha.resources.texts.aspectOriginal }}</span>\n                </a>\n                <a v-on:click.prevent="selectAspect(1)" class="dropdown-item" :class="{ active: isAspectSelected(1) }" href="#">\n                    <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/icons/img-landscape.svg\')"><span>{{ piranha.resources.texts.aspectLandscape }}</span>\n                </a>\n                <a v-on:click.prevent="selectAspect(2)" class="dropdown-item" :class="{ active: isAspectSelected(2) }" href="#">\n                    <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/icons/img-portrait.svg\')"><span>{{ piranha.resources.texts.aspectPortrait }}</span>\n                </a>\n                <a v-on:click.prevent="selectAspect(3)" class="dropdown-item" :class="{ active: isAspectSelected(3) }" href="#">\n                    <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/icons/img-landscape.svg\')"><span>{{ piranha.resources.texts.aspectWidescreen }}</span>\n                </a>\n                <a v-on:click.prevent="selectAspect(4)" class="dropdown-item" :class="{ active: isAspectSelected(4) }" href="#">\n                    <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/icons/img-square.svg\')"><span>{{ piranha.resources.texts.aspectSquare }}</span>\n                </a>\n            </div>\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                &nbsp;\n            </div>\n            <div class="card-body" v-else>\n                {{ model.body.media.filename }}\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("missing-block",{props:["model"],template:'\n<div class="alert alert-danger text-center" role="alert">No component registered for <code>{{ model.type }}</code></div>\n'}),Vue.component("page-block",{props:["uid","model"],methods:{select:function(){piranha.pagepicker.open(this.update)},remove:function(){this.model.body.id=null,this.model.body.page=null},update:function(e){if(null!==e){var t=this;fetch(piranha.baseUrl+"manager/api/page/info/"+e.id).then(function(e){return e.json()}).then(function(e){t.model.body.id=e.id,t.model.body.page=e,t.$emit("update-title",{uid:t.uid,title:t.model.body.page.title})}).catch(function(e){console.log("error:",e)})}else console.log("No page was selected")}},computed:{isEmpty:function(){return null==this.model.body.page},pageImage:function(){return this.hasPageImage?piranha.baseUrl+"manager/api/media/url/"+this.model.body.page.primaryImage.id+"/446/220":piranha.utils.formatUrl("~/manager/assets/img/empty-image.png")},hasPageImage:function(){return null!==this.model.body.page&&null!==this.model.body.page.primaryImage.media},pageTitle:function(){return this.hasPageTitle?this.model.body.page.title:"Lorem Ipsum"},hasPageTitle:function(){return null!==this.model.body.page},pageExcerpt:function(){return this.hasPageExcerpt?this.model.body.page.excerpt:"Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Integer posuere erat a ante venenatis dapibus posuere velit aliquet."},hasPageExcerpt:function(){return null!==this.model.body.page&&null!==this.model.body.page.excerpt}},mounted:function(){this.model.getTitle=function(){return null!==this.model.body.page?this.model.body.page.title:"No page selected"}},template:'\n<div class="block-body has-media-picker rounded clearfix" :class="{ empty: isEmpty }">\n    <div>\n        <div class="page-image" :style="\'background-image:url(\' + pageImage + \')\'">\n            <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/primaryimage-placeholder.png\')">\n        </div>\n        <h3 :class="{ \'text-light\': !hasPageTitle }">{{ pageTitle }}</h3>\n        <p :class="{ \'text-light\': !hasPageExcerpt }" v-html="pageExcerpt"></p>\n    </div>\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                &nbsp;\n            </div>\n            <div class="card-body" v-else>\n                <a :href="piranha.baseUrl + \'manager/page/edit/\' + model.body.page.id" target="_blank">{{ model.body.page.title }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("post-block",{props:["uid","model"],methods:{select:function(){piranha.postpicker.open(this.update)},remove:function(){this.model.body.id=null,this.model.body.post=null},update:function(e){if(null!==e){var t=this;fetch(piranha.baseUrl+"manager/api/post/info/"+e.id).then(function(e){return e.json()}).then(function(e){t.model.body.id=e.id,t.model.body.post=e,t.$emit("update-title",{uid:t.uid,title:t.model.body.post.title})}).catch(function(e){console.log("error:",e)})}else console.log("No post was selected")}},computed:{isEmpty:function(){return null==this.model.body.post},postImage:function(){return this.hasPostImage?piranha.baseUrl+"manager/api/media/url/"+this.model.body.post.primaryImage.id+"/446/220":piranha.utils.formatUrl("~/manager/assets/img/empty-image.png")},hasPostImage:function(){return null!==this.model.body.post&&null!==this.model.body.post.primaryImage.media},postTitle:function(){return this.hasPostTitle?this.model.body.post.title:"Lorem Ipsum"},hasPostTitle:function(){return null!==this.model.body.post},postExcerpt:function(){return this.hasPostExcerpt?this.model.body.post.excerpt:"Donec id elit non mi porta gravida at eget metus. Cras mattis consectetur purus sit amet fermentum. Integer posuere erat a ante venenatis dapibus posuere velit aliquet."},hasPostExcerpt:function(){return null!==this.model.body.post&&null!==this.model.body.post.excerpt}},mounted:function(){this.model.getTitle=function(){return null!==this.model.body.post?this.model.body.post.title:"No post selected"}},template:'\n<div class="block-body has-media-picker rounded clearfix" :class="{ empty: isEmpty }">\n    <div>\n        <div class="page-image" :style="\'background-image:url(\' + postImage + \')\'">\n            <img :src="piranha.utils.formatUrl(\'~/manager/assets/img/primaryimage-placeholder.png\')">\n        </div>\n        <h3 :class="{ \'text-light\': !hasPostTitle }">{{ postTitle }}</h3>\n        <p :class="{ \'text-light\': !hasPostExcerpt }" v-html="postExcerpt"></p>\n    </div>\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                &nbsp;\n            </div>\n            <div class="card-body" v-else>\n                <a :href="piranha.baseUrl + \'manager/post/edit/\' + model.body.post.id" target="_blank">{{ model.body.post.title }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("quote-block",{props:["uid","model"],data:function(){return{placeholder:{body:"",author:""}}},methods:{onAuthorBlur:function(e){this.model.author.value=e.target.innerText},onBodyBlur:function(e){this.model.body.value=e.target.innerText;var t=this.model.body.value.replace(/(<([^>]+)>)/gi,"");t.length>40&&(t=t.substring(0,40)+"..."),this.$emit("update-title",{uid:this.uid,title:t})}},created:function(){var e=[{author:"Nelson Mandela",body:"The greatest glory in living lies not in never falling, but in rising every time we fall."},{author:"Walt Disney",body:"The way to get started is to quit talking and begin doing."},{author:"Eleanor Roosevelt",body:"The future belongs to those who believe in the beauty of their dreams."},{author:"John Lennon",body:"Life is what happens when you're busy making other plans."},{author:"Audrey Hepburn",body:"Nothing is impossible, the word itself says, 'I'm possible!'"},{author:"Mark Twain",body:"Twenty years from now you will be more disappointed by the things that you didn't do than by the ones you did do."},{author:"Maya Angelou",body:"You will face many defeats in life, but never let yourself be defeated."}];this.placeholder=e[Math.floor(Math.random()*e.length)]},template:'\n<div class="block-body">\n    <blockquote class="blockquote">\n        <p contenteditable="true" class="blockquote-body" v-html="model.body.value" v-on:blur="onBodyBlur" :data-placeholder="placeholder.body"></p>\n        <footer contenteditable="true" class="blockquote-footer" v-html="model.author.value" v-on:blur="onAuthorBlur" :data-placeholder="placeholder.author"></footer>\n    </blockquote>\n</div>\n'}),Vue.component("separator-block",{props:["model"],template:"\n<div class='block-body'>\n    <hr>\n</div>\n"}),Vue.component("text-block",{props:["uid","model"],methods:{onBlur:function(e){var t=this.model.body.value.replace(/(<([^>]+)>)/gi,"");t.length>40&&(t=t.substring(0,40)+"..."),this.$emit("update-title",{uid:this.uid,title:t})}},computed:{isEmpty:function(){return piranha.utils.isEmptyText(this.model.body.value)}},template:'\n<div class="block-body" :class="{ empty: isEmpty }">\n    <pre class="invisible" v-html="model.body.value"></pre>\n    <textarea v-model="model.body.value" v-on:blur="onBlur"></textarea>\n</div>\n'}),Vue.component("video-block",{props:["uid","model"],methods:{clear:function(){},select:function(){null!=this.model.body.media?piranha.mediapicker.open(this.update,"Video",this.model.body.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Video")},remove:function(){this.model.body.id=null,this.model.body.media=null},update:function(e){"Video"===e.type?(this.model.body.id=e.id,this.model.body.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,contentType:e.contentType,publicUrl:e.publicUrl},this.$emit("update-title",{uid:this.uid,title:this.model.body.media.filename})):console.log("No video was selected")}},computed:{isEmpty:function(){return null==this.model.body.media},mediaUrl:function(){if(null!=this.model.body.media)return piranha.utils.formatUrl(this.model.body.media.publicUrl)}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?this.model.media.filename:"No video selected"}},template:'\n<div class="block-body has-media-picker" :class="{ empty: isEmpty }">\n    <video class="w-100 mx-100" :src="mediaUrl" controls></video>\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                &nbsp;\n            </div>\n            <div class="card-body" v-else>\n                {{ model.body.media.filename }}\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("audio-field",{props:["uid","model","meta"],methods:{select:function(){null!=this.model.media?piranha.mediapicker.open(this.update,"Audio",this.model.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Audio")},remove:function(){this.model.id=null,this.model.media=null},update:function(e){"Audio"===e.type?(this.model.id=e.id,this.model.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,title:e.title,contentType:e.contentType,publicUrl:e.publicUrl},this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename})):console.log("No audio was selected")}},computed:{isEmpty:function(){return null==this.model.media}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename:"No audio selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else-if="model.media.title != null">\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.title }} ({{ model.media.filename }})</a>\n            </div>\n            <div class="card-body" v-else>\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.filename }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("checkbox-field",{props:["uid","model","meta"],template:'\n<div class="form-group form-check">\n    <input type="checkbox" class="form-check-input" :id="meta.uid" v-model="model.value">\n    <label class="form-check-label" :for="meta.uid">{{ meta.placeholder}}</label>\n</div>\n'}),Vue.component("color-field",{props:["uid","model","meta"],methods:{update:function(){this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.value})},readonly:function(){return null!=this.meta.settings.DisallowInput&&this.meta.settings.DisallowInput}},template:'\n<div class="input-group color-field">\n    <div class="input-group-prepend">\n        <div class="color-preview" :style="{ backgroundColor: model.value }"></div>\n        <input class="form-control" type="color" v-model="model.value">\n    </div>\n    <input class="form-control" type="text" v-model="model.value" v-on:change="update()" :readonly="readonly()" :placeholder="meta.placeholder">\n</div>    \n'}),Vue.component("content-field",{props:["uid","model","meta"],methods:{select:function(){piranha.contentpicker.open(this.meta.settings.Group,this.update)},remove:function(){this.model.id=null,this.model.content=null},update:function(e){this.model.id=e.id,this.model.content=e,this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.content.title})}},computed:{isEmpty:function(){return null==this.model.content}},mounted:function(){this.model.getTitle=function(){return null!=this.model.content?this.model.content.title:"No content selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else>\n                <a :href="piranha.baseUrl + \'manager/content/edit/\' + model.content.typeId + \'/\' + model.content.id" target="_blank">{{ model.content.title }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("data-select-field",{props:["uid","model","meta"],methods:{update:function(){this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.items.$values.find(e=>e.id===this.model.id).name})}},template:'\n<select class="form-control" v-model="model.id" v-on:change="update()">\n    <option v-for="(item) in model.items.$values" v-bind:key="item.id" v-bind:value="item.id">\n        {{ item.name }}\n    </option>\n</select>\n'}),Vue.component("date-field",{props:["uid","model","meta"],components:{datepicker:vuejsDatepicker},methods:{onClosed:function(){var e=this.model.value,t=e.getFullYear()+"-"+(e.getMonth()<9?"0":"")+(e.getMonth()+1)+"-"+(e.getDate()<10?"0":"")+e.getDate();this.model.value=t,this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.value})}},created:function(){this._options={bootstrapStyling:!0,mondayFirst:!0,format:"yyyy-MM-dd",typeable:!0}},template:'\n<datepicker v-on:closed="onClosed($event)" v-model="model.value" :format="_options.format" :monday-first="_options.mondayFirst" :typeable="_options.typeable" :bootstrap-styling="_options.bootstrapStyling"></datepicker>\n'}),Vue.component("document-field",{props:["uid","model","meta"],methods:{select:function(){null!=this.model.media?piranha.mediapicker.open(this.update,"Document",this.model.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Document")},remove:function(){this.model.id=null,this.model.media=null},update:function(e){"Document"===e.type?(this.model.id=e.id,this.model.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,title:e.title,contentType:e.contentType,publicUrl:e.publicUrl},this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename})):console.log("No document was selected")}},computed:{isEmpty:function(){return null==this.model.media}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename:"No document selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else-if="model.media.title != null">\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.title }} ({{ model.media.filename }})</a>\n            </div>\n            <div class="card-body" v-else>\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.filename }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("html-field",{props:["uid","toolbar","model","meta"],data:function(){return{body:this.model.value}},methods:{onBlur:function(e){if(this.model.value=tinyMCE.activeEditor.getContent(),this.meta.notifyChange){var t=this.model.value.replace(/(<([^>]+)>)/gi,"");t.length>40&&(t=t.substring(0,40)+"..."),this.$emit("update-title",{uid:this.uid,title:t})}},onChange:function(e){if(this.model.value=e,this.meta.notifyChange){var t=this.model.value.replace(/(<([^>]+)>)/gi,"");t.length>40&&(t=t.substring(0,40)+"..."),this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:t})}}},computed:{isEmpty:function(){return piranha.utils.isEmptyHtml(this.model.value)}},mounted:function(){piranha.editor.addInline(this.uid,this.toolbar,this.onChange)},beforeDestroy:function(){piranha.editor.remove(this.uid)},template:'\n<div class="field html-field" :class="{ empty: isEmpty }">\n    <div contenteditable="true" :id="uid" v-html="body" v-on:blur="onBlur"></div>\n</div>\n'}),Vue.component("image-field",{props:["uid","model","meta"],methods:{select:function(){null!=this.model.media?piranha.mediapicker.open(this.update,"Image",this.model.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Image")},remove:function(){this.model.id=null,this.model.media=null},update:function(e){"Image"===e.type?(this.model.id=e.id,this.model.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,title:e.title,contentType:e.contentType,publicUrl:e.publicUrl},this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename})):console.log("No image was selected")}},computed:{isEmpty:function(){return null==this.model.media}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename:"No image selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else-if="model.media.title != null">\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.title }} ({{ model.media.filename }})</a>\n            </div>\n            <div class="card-body" v-else>\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.filename }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("markdown-field",{props:["uid","model","meta"],data:function(){return{body:this.model.value}},methods:{update:function(e){if(this.model.value=e,this.meta.notifyChange){var t=this.model.value;t.length>40&&(t=t.substring(0,40)+"..."),this.$emit("update-title",{uid:this.uid,title:t})}}},computed:{isEmpty:function(){return null==this.model.value||""===this.model.value}},mounted:function(){piranha.editor.addInlineMarkdown(this.uid,this.model.value,this.update)},beforeDestroy:function(){piranha.editor.remove(this.uid)},template:'\n<div class="markdown-field" :class="{ empty: isEmpty }">\n    <textarea :id="uid" v-html="model.value"></textarea>\n    <div class="markdown-preview"></div>\n</div>\n'}),Vue.component("media-field",{props:["uid","model","meta"],methods:{select:function(){null!=this.model.media?piranha.mediapicker.open(this.update,null,this.model.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,null)},remove:function(){this.model.id=null,this.model.media=null},update:function(e){this.model.id=e.id,this.model.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,title:e.title,contentType:e.contentType,publicUrl:e.publicUrl},this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename})}},computed:{isEmpty:function(){return null==this.model.media}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename:"No media selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else-if="model.media.title != null">\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.title }} ({{ model.media.filename }})</a>\n            </div>\n            <div class="card-body" v-else>\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.filename }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("missing-field",{props:["meta","model"],template:'\n<div class="alert alert-danger text-center" role="alert">No component registered for <code>{{ meta.type }}</code></div>\n'}),Vue.component("number-field",{props:["uid","model","meta"],template:'\n<input class="form-control" type="text" :placeholder="meta.placeholder" v-model="model.value">\n'}),Vue.component("page-field",{props:["uid","model","meta"],methods:{select:function(){var e=null;this.model.page?e=this.model.page.siteId:piranha.pageedit&&(e=piranha.pageedit.siteId),piranha.pagepicker.open(this.update,e)},remove:function(){this.model.id=null,this.model.page=null},update:function(e){this.model.id=e.id,this.model.page=e,this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.page.title})}},computed:{isEmpty:function(){return null==this.model.page}},mounted:function(){this.model.getTitle=function(){return null!=this.model.page?this.model.page.title:"No page selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else>\n                <a href="piranha.baseUrl + \'manager/page/edit/\' + model.page.id" target="_blank">{{ model.page.title }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("post-field",{props:["uid","model","meta"],methods:{select:function(){piranha.postpicker.open(this.update)},remove:function(){this.model.id=null,this.model.post=null},update:function(e){this.model.id=e.id,this.model.post=e,this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.post.title})}},computed:{isEmpty:function(){return null==this.model.post}},mounted:function(){this.model.getTitle=function(){return null!=this.model.post?this.model.post.title:"No post selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else>\n                <a href="piranha.baseUrl + \'manager/post/edit/\' + model.post.id" target="_blank">{{ model.post.title }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'}),Vue.component("readonly-field",{props:["uid","model","meta"],template:'\n<div class="alert alert-secondary mb-0">\n    <pre class="mb-0">{{ model.value }}</pre>\n</div>\n'}),Vue.component("select-field",{props:["uid","model","meta"],methods:{update:function(){this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.meta.options[this.model.value]})}},template:'\n<select class="form-control" v-model="model.value" v-on:change="update()">\n    <option v-for="(name, value) in meta.options" v-bind:key="value" v-bind:value="value">\n        {{ name }}\n    </option>\n</select>\n'}),Vue.component("string-field",{props:["uid","model","meta"],methods:{update:function(){this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:this.model.value})},maxLength:function(){return null!=this.meta.settings.MaxLength&&this.meta.settings.MaxLength>0?this.meta.settings.MaxLength:null},isRequired:function(){return!1}},template:'\n<div>\n    <div v-if="maxLength() > 0" class="input-group">\n        <input class="form-control" type="text" :maxlength="maxLength()" :required="isRequired()" :placeholder="meta.placeholder" v-model="model.value" v-on:change="update()">\n        <div class="input-group-append">\n            <div class="input-group-text text-muted">\n                {{ piranha.utils.strLength(model.value) + "/" + maxLength() }}\n            </div>\n        </div>\n    </div>\n    <input v-else class="form-control" type="text" :maxlength="maxLength()" :required="isRequired()" :placeholder="meta.placeholder" v-model="model.value" v-on:change="update()">\n</div>\n'}),Vue.component("text-field",{props:["uid","model","meta"],methods:{update:function(){if(this.meta.notifyChange){var e=this.model.value;e.length>40&&(e=e.substring(0,40)+"..."),this.$emit("update-title",{uid:this.uid,title:e})}},maxLength:function(){return null!=this.meta.settings.MaxLength&&this.meta.settings.MaxLength>0?this.meta.settings.MaxLength:null},isRequired:function(){return!1}},template:'\n<div>\n    <div v-if="maxLength() > 0" class="input-group">\n        <textarea class="form-control" rows="4" :maxlength="maxLength()" :required="isRequired()" :placeholder="meta.placeholder" v-model="model.value" v-on:change="update()"></textarea>\n        <div class="input-group-append">\n            <div class="input-group-text text-muted">\n                {{ piranha.utils.strLength(model.value) + "/" + maxLength() }}\n            </div>\n        </div>\n    </div>\n    <textarea v-else class="form-control" rows="4" :maxlength="maxLength()" :required="isRequired()" :placeholder="meta.placeholder" v-model="model.value" v-on:change="update()"></textarea>\n</div>\n'}),Vue.component("video-field",{props:["uid","model","meta"],methods:{clear:function(){},select:function(){null!=this.model.media?piranha.mediapicker.open(this.update,"Video",this.model.media.folderId):piranha.mediapicker.openCurrentFolder(this.update,"Video")},remove:function(){this.model.id=null,this.model.media=null},update:function(e){"Video"===e.type?(this.model.id=e.id,this.model.media={id:e.id,folderId:e.folderId,type:e.type,filename:e.filename,title:e.title,contentType:e.contentType,publicUrl:e.publicUrl},this.meta.notifyChange&&this.$emit("update-title",{uid:this.uid,title:null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename})):console.log("No video was selected")}},computed:{isEmpty:function(){return null==this.model.media}},mounted:function(){this.model.getTitle=function(){return null!=this.model.media?null!=this.model.media.title?this.model.media.title+" ("+this.model.media.filename+")":this.model.media.filename:"No video selected"}},template:'\n<div class="media-field" :class="{ empty: isEmpty }">\n    <div class="media-picker">\n        <div class="btn-group float-right">\n            <button v-on:click.prevent="select" class="btn btn-primary text-center">\n                <i class="fas fa-plus"></i>\n            </button>\n            <button v-on:click.prevent="remove" class="btn btn-danger text-center">\n                <i class="fas fa-times"></i>\n            </button>\n        </div>\n        <div class="card text-left">\n            <div class="card-body" v-if="isEmpty">\n                <span v-if="meta.placeholder != null" class="text-secondary">{{ meta.placeholder }}</span>\n                <span v-if="meta.placeholder == null" class="text-secondary">&nbsp;</span>\n            </div>\n            <div class="card-body" v-else-if="model.media.title != null">\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.title }} ({{ model.media.filename }})</a>\n            </div>\n            <div class="card-body" v-else>\n                <a href="#" v-on:click.prevent="piranha.preview.open(model.id)">{{ model.media.filename }}</a>\n            </div>\n        </div>\n    </div>\n</div>\n'});