%PDF-
%PDF-
Mini Shell
Mini Shell
<?php $__env->startSection('content'); ?>
<div class="categories-container">
<div class="row">
<div class="col-sm-12">
<form class="needs-validation <?php echo e($errors->count() > 0 ? 'was-validated' : ''); ?>"
method="POST" autocomplete="off" action="<?php echo e(route('dashboard.posts.createOrUpdate', $id)); ?>"
enctype="multipart/form-data" novalidate>
<?php echo e(csrf_field()); ?>
<div class="form-group row">
<label for="title" class="col-sm-2 col-form-label">Title</label>
<div class="col-sm-10">
<input id="title" type="text" name="title" placeholder="Title"
class="form-control <?php echo e($errors->has('title') ? 'is-invalid' : 'is-valid'); ?>"
value="<?php echo e($post->title); ?>" required>
<?php if($errors->has('name')): ?>
<div class="invalid-feedback">
<?php echo e($errors->first('title')); ?>
</div>
<?php endif; ?>
</div>
</div>
<div class="form-group row">
<label for="title" class="col-sm-2 col-form-label">Description</label>
<div class="col-sm-10">
<input id="description" type="text" name="description" placeholder="Description"
class="form-control <?php echo e($errors->has('description') ? 'is-invalid' : 'is-valid'); ?>"
value="<?php echo e($post->description); ?>" required>
<?php if($errors->has('description')): ?>
<div class="invalid-feedback">
<?php echo e($errors->first('description')); ?>
</div>
<?php endif; ?>
</div>
</div>
<div class="form-group row">
<label for="media" class="col-sm-2 col-form-label">Image</label>
<div class="col-sm-10">
<div class="input-group">
<div class="custom-file">
<input type="file" class="custom-file-input" id="media" name="media"
accept="image/*" onchange="fileChanged(this)">
<label class="custom-file-label" id="media-input-label" for="media">Choose
file</label>
</div>
</div>
<?php if($errors->has('media')): ?>
<div class="invalid-feedback">
<?php echo e($errors->first('media')); ?>
</div>
<?php endif; ?>
</div>
</div>
<?php if($id !== 'new'): ?>
<div class="form-group row">
<label for="categories" class="col-sm-2 col-form-label">Categories</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="categories" name="categories"
data-source="<?php echo e($post->categories); ?>" placeholder="Categories"
data-is-new="<?php echo e(($post->id)); ?>" data-role="tagsinput">
</div>
</div>
<?php endif; ?>
<div class="form-group row">
<div class="col-md-6 offset-md-2">
<img class="img-fluid" id="image-preview"
src="<?php echo e($post->media()->first() ? $post->media()->first()->getUrl() : ''); ?>"/>
</div>
</div>
<div class="form-group row">
<div class="col-sm-8 offset-sm-2">
<button type="submit" class="btn btn-outline-primary">Save</button>
</div>
</div>
</form>
</div>
</div>
</div>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('script'); ?>
<script src="<?php echo e(asset('js/libs/tagsinput.js')); ?>"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.bundle.min.js"></script>
<script>
var element = $('#categories');
var postId = element.attr('data-is-new');
var skills = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('id'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: '/api/categories/actions/autoComplete?name=%QUERY%',
wildcard: '%QUERY%'
}
});
skills.initialize();
element.tagsinput({
itemValue: 'name',
itemText: 'name',
maxChars: 30,
trimValue: true,
allowDuplicates: false,
freeInput: true,
focusClass: 'form-control',
tagClass: function () {
return 'badge badge-dark';
},
onTagExists: function (item, $tag) {
$tag.hide().fadeIn();
},
typeaheadjs: [
{
hint: false,
highlight: true
},
{
name: 'categories',
itemValue: 'id',
displayKey: 'name',
source: skills.ttAdapter(),
templates: {
header: [
'<ul class="list-group">'
],
suggestion: function (data) {
return '<li class="list-group-item">' + data.name + '</li>'
}
}
}
]
});
try {
var dataSource = JSON.parse(element.attr('data-source'));
dataSource.forEach(function (value) {
element.tagsinput('add', value);
});
} catch (e) {
}
element.on('beforeItemAdd', function (event) {
$.ajax({
type: 'GET',
url: '/api/posts/' + postId + '/attachCategory/' + event.item.id,
dataType: 'json'
});
});
element.on('beforeItemRemove', function (event) {
$.ajax({
type: 'GET',
url: '/api/posts/' + postId + '/detachCategory/' + event.item.id,
dataType: 'json'
});
});
</script>
<script>
function fileChanged (input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#image-preview').attr('src', e.target.result);
$('#media-input-label').text(input.files[0].name);
};
reader.readAsDataURL(input.files[0]);
}
}
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
Zerion Mini Shell 1.0