One Hat Cyber Team

View File Name : edit.blade.php

@extends('adminlte::page')
@section('plugins.Sweetalert2', true)


@section('content_header')
    <h1>Add News</h1>
@stop

@section('content')

    <div class="card card-primary">
        <div class="card-header">
            <h3 class="card-title">News Information</h3>
        </div>
        <!-- /.card-header -->
        <!-- form start -->

            <div class="card-body">
                <form role="form" id="page-form"  method="POST"  accept-charset="UTF-8" enctype="multipart/form-data"   >
                    @csrf
                    <?php  $filehandler = 'fh'.time();?>
                    {!! Html::hidden('id',$row->id ) !!}
                    {{  Html::hidden('file_handler',$filehandler) }}
                <div class="row mt-2">
                    <div class="col-2">
                        <label for="name">Title</label>
                    </div>
                    <div class="col-10">
                        {!! Html::text('title',$row->title ?? null)->class('form-control m-input')  !!}
                    </div>
                </div>
                <div class="row mt-2">
                    <div class="col-2">
                        <label for="name">Description</label>
                    </div>
                    <div class="col-10">
                        {!! Html::textarea('description',$row->description ?? null)
                                    ->class('form-control  required editor')
                                    ->rows(10)
                                    !!}
                    </div>
                </div>
                <div class="row mt-2">
                    <div class="col-2">
                        <label for="name">Content</label>
                    </div>
                    <div class="col-10">
                        {!! Html::textarea('content',$row->content ?? null)
                                    ->class('form-control  required editor')
                                    ->rows(10)
                                    !!}
                    </div>
                </div>

                    <div class="row mt-2">
                        <div class="col-2">
                            <label for="name">Current Page Image</label>
                        </div>
                        <div class="col-10">
                            <img  style="width: 80px;" src="/{{ $row->image }}">
                        </div>
                    </div>

                    <div class="row mt-2">
                        <div class="col-2">
                            <label for="name">News Image</label>
                        </div>
                        <div class="col-10">
                            {!! html()->file('image')   !!}
                        </div>
                    </div>


                @if($row->gallery)
                    <div  id="handle"  class="row mt-2">
                        <div class="col-2">
                            <label for="name">Current Gallery Images</label>
                        </div>
                        <div class="col-10">
                            <ul id="sortable"  class="list-group col-4 ">
                                @foreach($row->gallery as $gallery)
                                    <li class="list-group-item" image="{{ $gallery->image}}" id="{{$gallery->id}}">
                                        <div class="row">
                                            <div class="col-6">
                                                <i class="fas fa-arrows-alt handle"></i> <img src="{{ asset('/uploads/gallery/'.$gallery->image) }}" alt="" width="100">
                                            </div>
                                            <div class="col-3">
                                                <button class="delete btn btn-outline-danger">Delete</button>
                                            </div>
                                        </div>
                                    </li>
                                @endforeach
                            </ul>
                        </div>
                    </div>
                    @endif

        </form>

                <div class="row mt-2">
                    <div class="col-2">
                        <label for="name">Photo Gallery Images</label>
                    </div>
                    <div class="col-10">
                        <form method="post" action="{{ route('dropzone-store') }}" enctype="multipart/form-data"
                              class="dropzone" id="dropzonewidget">

                            @csrf
                        </form>
                    </div>
                </div>
            </div>
            <!-- /.card-body -->

            <div class="card-footer">
                <button id="submit-form"  type="submit" class="btn btn-primary ">Submit</button>
            </div>

    </div>

@stop

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/summernote-cleaner@1.0.0/summernote-cleaner.min.js"></script>
    <script src="/vendor/jquery-validate/jquery.validate.min.js"></script>
    <script src="/vendor/jquery-validate/additional-methods.min.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script src="/vendor/dropzone/dropzone.js"></script>
    <script type="text/javascript">
        Dropzone.autoDiscover = false;
    //Dropzone.prototype.defaultOptions.dictRemoveFile = "Delete image";
    //Dropzone.prototype.defaultOptions.dictDefaultMessage = Drop files here to upload";
    //Dropzone.prototype.defaultOptions.dictCancelUpload = "Cancel upload";
    </script>

    <script>


        $(function () {

            Dropzone.autoDiscover = false;

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $("#dropzonewidget").dropzone (
                {
                    renameFile: function (file) {
                        var dt = new Date();
                        var time = dt.getTime();
                        return time + file.name;
                    },
                    //    uploadMultiple: true,
                    acceptedFiles: 'image/*',
                    addRemoveLinks: true,
                    timeout: 60000,
                    success: function (file, response) {
                        $(file.previewTemplate).append('<span class="server_file" style="display: none;">'+response+'</span>');
                        console.log(response);
                    },
                    sending: function(file, xhr, formData){
                        formData.append('filehandler', '{{ $filehandler }}');
                        formData.append('content_type', 'news');
                    },
                    error: function (file, response) {
                        return false;
                    },
                    removedfile: function(file) {
                        var name = $(file.previewTemplate).children('.server_file').text();
                        //   alert(name);

                        $.ajax({
                            type: 'POST',
                            url: '{{ route('dropzone-remove') }}',
                            data: {name: name,request: 2},
                            sucess: function(data){
                                console.log('success: ' + data);
                            }
                        });

                          var _ref;
                          return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0;
                    }
                }
            );


            $("#submit-form").click(function () {
                $("#page-form").submit();
            });
            $('.editor').summernote({
                height: 300,

                toolbar: [
                ['style', ['style']],
                ['font', ['bold', 'underline', 'clear']],
                ['color', ['color']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['table', ['table']],
                ['insert', ['link', 'picture', 'video']],
                ['view', ['fullscreen', 'codeview',  ]]
            ],
                callbacks: {
                    onChange: function (contents, $editable) {
                        $(this).val(contents);
                    }
                }
            });

            $("#page-form").validate({

                rules: {
                    name: {
                        required: !0,
                    },

                    page_content: {
                        required: !0,
                        minlength: 10
                    }
                },
                submitHandler: function (form) {
                    form.submit();
                }
            });

            $( "#sortable" ).sortable({
                axis: 'y',
                update: function (event, ui) {
                    var data =  $( "#sortable" ).sortable('toArray').toString();
                    $.ajax({
                        data: {'order':data,
                            'content_type': 'news',
                            'content_id': {!! $row->id !!}
                        },
                        type: 'POST',
                        url: '{{ route('image-sort') }}'
                    });
                }
            });
            $( "#sortable" ).disableSelection();
            $("#sortable .delete").click(function() {
                var answer = confirm('Bu resim silinecek. Emin misiniz?');
                if (answer) {
                    var row = $(this).parent().parent().parent();
                    var removedId = row.attr('image');
                    row.remove();
                    $( "#sortable" ).sortable('refresh');
                    $.ajax({
                        data: {'name':removedId,'filehandler':''},
                        type: 'POST',
                        url: '{{ route('image-delete') }}'
                    });

                }
            });

        });
    </script>

@stop
@section('css')
    <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.css" rel="stylesheet">
    <link href="/vendor/dropzone/dropzone.min.css" rel="stylesheet">
@stop