kuvia/resources/views/gallery/images.blade.php
2021-01-20 00:26:23 +01:00

84 lines
3.8 KiB
PHP

@extends('layout/template')
@section('content')
<div class="row" style="margin-top: 20px;">
<div class="col-md-12">
@foreach($images as $image)
<div class="card col-md-2 editImage" data-name="{{ $image->name }}" data-description="{{ $image->description }}" data-rating="{{ $image->rating }}" x-id="{{ $image->id }}" x-name="{{ $image->filename }}" x-image-url="/{{ $tenant->url }}/{{ $gallery->url }}/{{ $image->id }}/file?size=medium" style="float:left;cursor: pointer;" >
<div class="card-body" style="text-align: center;">
<img class="card-img-top" src="/{{ $tenant->url }}/{{ $gallery->url }}/{{ $image->id }}/file?size=small" style="height: 200px;width: auto; max-width: 100%;">
<h5 class="card-title">
{{ $image->filename }}
</h5>
</div>
</div>
@endforeach
</div>
</div>
<!-- Button trigger modal -->
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Bild bearbeiten</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<img src="" id="imagePreview" style="width: 100%;">
<input style="display: none;" name="name" id="edit-name" placeholder="Name" class="form-control">
<input style="display: none;" name="edit-id" id="edit-id" placeholder="ID" class="form-control">
<b>Name</b>
<input name="name" id="name" class="form-control">
<b>Beschreibung</b>
<textarea name="description" class="form-control" id="description"></textarea>
<b>Rating</b>
<input name="rating" class="form-control" id="rating">
</div>
<div class="modal-footer">
<button type="button" id="deleteImage" class="btn btn-danger">Delete</button>
<button type="button" id="makeGalleryDefault" class="btn btn-warning">Make Galery Preview</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<!--<button type="button" class="btn btn-primary">Save changes</button>!-->
</div>
</div>
</div>
</div>
@endsection
@section('js')
<script>
$(".editImage").click(function () {
$("#imagePreview").attr("src", $(this).attr("x-image-url"));
$("#edit-name").val($(this).attr("x-name"));
$("#edit-id").val($(this).attr("x-id"));
$('#exampleModal').modal('show');
$("#name").val($(this).attr("data-name"));
$("#rating").val($(this).attr("data-rating"));
$("#description").val($(this).attr("data-description"));
});
$("#makeGalleryDefault").click(function () {
$.ajax("/g/{{ $gallery->url }}/setDefault?id="+$("#edit-id").val()).done(function () {
alert("Set as Main Image");
});
});
$("#deleteImage").click(function () {
$.ajax("/g/{{ $gallery->url }}/delete?id="+$("#edit-id").val()).done(function () {
alert("Image deleted");
});
});
</script>
@endsection