@extends('admin.master')
@section('breadcome-title','Memes')
@section('css')
    <link rel="stylesheet" href="{{asset('assets/css/chosen.css')}}">
@endsection
@section('content')
    <div class="single-pro-review-area mt-t-30 mg-b-15">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="product-payment-inner-st">
                        <ul id="myTabedu1" class="tab-review-design">
                            <li class="active"><a href="#description">Add Meme</a></li>
                        </ul>
                        <div id="myTabContent" class="tab-content custom-product-edit">
                            <div class="product-tab-list tab-pane fade active in" id="description">
                                <div class="row">
                                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                        <div class="review-content-section">
                                            <div id="dropzone1" class="pro-ad addcoursepro">
                                                <form method="post" action="{{route('create-memes')}}" enctype="multipart/form-data">
                                                    @csrf
                                                    <div class="form-group col-md-2">
                                                        <label for="avatar">Avatar</label>
                                                        <input type="file" name="img">
                                                        <img id="myImg" src="" alt="" width="130px"/>
                                                        <span class="text-danger">{{ $errors->first('img') }}</span>
                                                    </div>
                                                    <div class="form-group col-md-4" id="image-url">
                                                        <label for="avatar">Or</label>
                                                        <input type="text" name="imgUrl" class="form-control" placeholder="Paste your Image URL">
                                                    </div>
                                                    <div class="form-group col-md-2">
                                                        <label for="formGroupExampleInput">Title</label>
                                                        <input type="text" name="title" class="form-control"
                                                               id="formGroupExampleInput"
                                                               placeholder="Please enter name" value="" required>
                                                    </div>
                                                    <div class="form-group col-md-2">
                                                        <label for="formGroupExampleInput">Tags</label>
                                                        <input id="tags" class="form-control" data-role="tagsinput" type="text" name="tags" placeholder="tags 1 , tags 2 , tags 3" required>
                                                    </div>

                                                    <div class="form-group col-md-2">
                                                        <label for="multiple" class="control-label">Select Category</label>
                                                        <select name="category" data-placeholder="Choose a Category..." class="col-md-6 form-control">
                                                            <option value=""></option>
                                                            @foreach($categories as $cat)
                                                                <option value="{{$cat->id}}">{{$cat->name}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                    <div class="form-group col-md-12">
                                                        <button type="submit" id="send_form" class="btn btn-success">
                                                            Submit
                                                        </button>
                                                    </div>
                                                    @if(Session::has('message'))
                                                        <div class="form-group col-md-4">
                                                            <div class="alert alert-success alert-dismissible fade in"
                                                                 id="msg">
                                                                <a href="#" class="close" data-dismiss="alert"
                                                                   aria-label="close">&times;</a>
                                                                <strong>Success!</strong> {!! session('message') !!}
                                                            </div>
                                                        </div>
                                                    @endif
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="data-table-area mg-b-15">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="sparkline13-list">
                        <div class="sparkline13-hd">
                            <div class="main-sparkline13-hd">
                                <h1>All <span class="table-project-n">Memes</span></h1>
                            </div>
                        </div>
                        <div class="sparkline13-graph">
                            <div class="datatable-dashv1-list custom-datatable-overright">
                                <table id="table" data-toggle="table" data-pagination="true" data-search="true"
                                       data-show-columns="true" data-show-pagination-switch="true"
                                       data-show-refresh="true" data-key-events="true" data-show-toggle="true"
                                       data-resizable="true" data-cookie="true"
                                       data-cookie-id-table="saveId" data-show-export="true" data-click-to-select="true"
                                       data-toolbar="#toolbar">
                                    <thead>
                                    <tr>
                                        <th data-field="id">#</th>
                                        <th data-field="title">Title</th>
                                        <th data-field="slug">Slug</th>
                                        <th data-field="category">Tags</th>
                                        <th data-field="file">File Source</th>
                                        <th data-field="image">Image</th>
                                        <th data-field="created">Created By</th>
                                        <th data-field="view">Views</th>
                                        <th data-field="action">Actions</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($memes as $m)
                                        <tr>
                                            <td>{{$loop->iteration}}</td>
                                            <td>{{$m->title}}</td>
                                            <td>{{$m->slug}}</td>
                                            <td>{{$m->tags}}</td>
                                            <td>{{$m->file_description}}</td>
                                            <td>
                                                @if($m->file_description == 'upload from pc')
                                                    <img src="{{asset('storage/uploads/thumbnails/'.$m->file) }}" width="80px" align="N/A">
                                                @else
                                                    <img src="{{url ($m->file) }}" width="80px" align="N/A">
                                                @endif
                                            </td>
                                            <td>{{$m->user->name }}</td>
                                            <td>{{$m->view_count }}</td>
                                            <td>
                                                <a type="button" class="btn btn-danger" href="{{route
                                                ('delete_memes',$m->id)}}"
                                                   onclick="return confirm('Are you sure?')" style="color: white">Delete
                                                </a>
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('javascript')
    <script src="{{asset('assets/js/jquery-3.2.1.min.js')}}"
            type="text/javascript"></script>
    <script src="{{asset('assets/js/chosen.jquery.js')}}"
            type="text/javascript"></script>
    <script src="{{asset('assets/js/init.js')}}" type="text/javascript"
            charset="utf-8"></script>
@endsection