@extends('layouts.admin.app')

@section('content')

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.5/jquery.validate.min.js"></script>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>

<script src="https://cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.18/css/bootstrap-select.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.18/js/bootstrap-select.min.js"></script>

<main id="main" class="main">
    @if( Session::get('permissions.user_type') == 'A' )
        <div class="page-breadcrumb">
            <div class="row">
                <div class="col-12 d-flex no-block align-items-center justify-content-between px-4 mb-2">
                    <h4 class="page-title">CATEGORY</h4>
                    <div class="ml-auto text-right">
                        <a href="{{ route('admin.category.list') }}" class="btn btn-outline-info">Back</a>
                    </div>
                </div>
            </div>
        </div>

        <div class="container-fluid">
            <!-- ============================================================== -->
            <!-- Start Page Content -->
            <!-- ============================================================== -->
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        @foreach (['danger', 'warning', 'success', 'info'] as $msg)
                            @if(Session::has('alert-' . $msg))
                                <h4 class="font-weight-light alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}</h4>
                            @endif
                        @endforeach
                        <form action="{{url('admin/category/edit/')}}/{{encrypt($dataDetails->id)}}" method="POST" class="form-horizontal" id="formadd" enctype="multipart/form-data">
                            @csrf
                            <div class="card-body">
                                <h4 class="card-title">Category Edit</h4>
                                
                                <input type="hidden" name="formid" value="">
                                
                                <div class="form-group m-t-20">
                                    <label>Category Title<span>*</span></label>
                                    <input type="text" class="form-control" id="ctitle" name="ctitle" value="{{$dataDetails->name}}" placeholder="Enter Category Title" required>
                                </div>
                                <div class="form-group m-t-20">
                                    <label>Category Slug<span>*</span></label>
                                    <input type="text" class="form-control" id="cslug" name="cslug" value="{{$dataDetails->slug}}" placeholder="Enter Category Slug" required>
                                </div>

                                <div class="form-group m-t-20">
                                    <label>Category Page Head<span>*</span></label>
                                    <input type="text" class="form-control" id="chead" name="chead" value="{{$dataDetails->page_head}}" placeholder="Enter Category Page Heading" >
                                </div>
                                
                                <div class="form-group m-t-20">
                                    <label>Banner Heading</label>
                                    <input type="text" class="form-control" id="cbannerhead" name="cbannerhead" value="{{$dataDetails->banner_heading}}" placeholder="Enter Banner Heading" required>
                                </div>

                                {{--<div class="form-group m-t-20">
                                    
                                    
                                        <label for="image">Image</label>
                                        <input type="file" class="form-control" id="image" name="image" placeholder="Select Image">
                                        
                                        <img id="list" style="display: none;" />
                                        
                                        
                                </div>--}}
                                
                                <div class="form-group m-t-20">
                                    <label>Menu Head Only<span>*</span></label>
                                    <p><input type="radio" class="form-control2" id="cmenuhead" name="cmenuhead" {{$dataDetails->menu_head_only == 'N' ? 'checked' : ''}} value="N" >No &nbsp;&nbsp;
                                    <input type="radio" class="form-control2" id="cmenuhead" name="cmenuhead" {{$dataDetails->menu_head_only == 'Y' ? 'checked' : ''}} value="Y" >Yes</p>
                                </div>
                               
                                <input type="hidden" name="cattype" id="cattype" value="{{$dataDetails->cat_section}}">
                               
                                <div class="form-group m-t-20">
                                    <label>Category Type<span>*</span></label>
                                    <p>
                                    	<input type="radio" class="form-control2 ctype"  name="ctype" {{$dataDetails->cat_section == 'N' ? 'checked' : ''}} value="N" checked required>Category/Occasion Related &nbsp;&nbsp;
                                    	<input type="radio" class="form-control2 ctype" name="ctype" {{$dataDetails->cat_section == 'P' ? 'checked' : ''}}  value="P" required>Price Related &nbsp;&nbsp;
                                    	<input type="radio" class="form-control2 ctype" name="ctype" {{$dataDetails->cat_section == 'CP' ? 'checked' : ''}}  value="CP" required>Categorywise Price Range
                                	</p>
                                </div>
                                
                                <div class="form-group m-t-20 price-range" style="display:none">
                                    <label>Price Details(Please put value USD currency)</label>
	                                    <p><input type="text" id="from_price" name="from_price" placeholder="From Price" value="@if($pricedtl != '' && $pricedtl->parent_category_id==0){{$pricedtl->from_price}}@endif">&nbsp;&nbsp; 
	                                    <input type="text" id="to_price" name="to_price" placeholder="To Price" value="@if($pricedtl != '' && $pricedtl->parent_category_id==0){{$pricedtl->to_price}}@endif">&nbsp;&nbsp;
                                        <select id="equation" name="equation">
                                               <option value="">Select Option</option>
                                               <option value="between" @if (($pricedtl != '') and ($pricedtl->equation=="between")) selected @endif>Between</option>
                                               <option value="greater" @if (($pricedtl != '') and ($pricedtl->equation=="greater")) selected @endif>Greater</option>
                                               <option value="less"    @if (($pricedtl != '') and ($pricedtl->equation=="less")) selected @endif>Less</option>
                                        </select>
                                    </p>
                                 </div>

                                 <div class="form-group m-t-20 cat-price-range" style="display:none">
                                    <label>Price Details(Please put value USD currency)</label>
                                    <p>
	                                    <select name="category_id" id="category_id" >
	                                        @foreach($catDetails as $cat)
	                                            <option value="{{$cat->id}}">{{$cat->name}}</option>
	                                        @endforeach 
	                                    </select>
                                    	<input type="text" id="cat_from_price" name="cat_from_price" placeholder="From Price" value="@if($pricedtl != '' && $pricedtl->parent_category_id>0){{$pricedtl->from_price}}@endif">&nbsp;&nbsp; 
                                    	<input type="text" id="cat_to_price" name="cat_to_price" placeholder="To Price" value="@if($pricedtl != '' && $pricedtl->parent_category_id>0){{$pricedtl->to_price}}@endif">&nbsp;&nbsp;
                                        <select id="cat_equation" name="cat_equation">
                                               <option value="">Select Option</option>
                                               <option value="between" @if (($pricedtl != '') and ($pricedtl->equation=="between")) selected @endif>Between</option>
                                               <option value="greater" @if (($pricedtl != '') and ($pricedtl->equation=="greater")) selected @endif>Greater</option>
                                               <option value="less"    @if (($pricedtl != '') and ($pricedtl->equation=="less")) selected @endif>Less</option>
                                        </select>
                                    </p>
                                 </div>


                                <div class="form-group m-t-20">
                                    <label>Content Top</label>
                                    <textarea class="form-control" rows="5" id="ccontenttop" name="ccontenttop" placeholder="Enter Content Top" >{{$dataDetails->content_top}}</textarea>
                                </div>
                                <div class="form-group m-t-20">
                                    <label>Content Bottom</label>
                                    <textarea class="form-control" rows="5" id="ccontentbottom" name="ccontentbottom" placeholder="Enter Content Bottom" >{{$dataDetails->content_bottom}}</textarea>
                                </div>
                                <div class="form-group m-t-20">
                                    <label>Meta Title</label>
                                    <input type="text" class="form-control" id="cmeta_title" name="cmeta_title" value="{{$dataDetails->meta_title}}" placeholder="Enter Meta Title" required>
                                </div>
                                <div class="form-group m-t-20">
                                    <label>Meta Description</label>
                                    <textarea class="form-control" rows="5" id="cmeta_description" name="cmeta_description" placeholder="Enter Meta Description" required>{{$dataDetails->meta_description}}</textarea>
                                </div>
                                <div class="form-group m-t-20">
                                    <label>Tagline</label>
                                    <input type="text" class="form-control" id="ctagline" name="ctagline" value="{{$dataDetails->tag_line}}" placeholder="Enter Tagline" >
                                </div>
                                <div class="form-group m-t-20">
                                    <label>Top Head</label>
                                    <input type="text" class="form-control" id="ctophead" name="ctophead" value="{{$dataDetails->tophead}}" placeholder="Enter Tophead" >
                                </div>
                            </div>
                            <div class="border-top">
                                <div class="card-body">
                                    <input class="btn btn-primary" type="submit" value="UPDATE">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    @endif
</main>    

<script type="text/javascript">

    $.validator.setDefaults({
            submitHandler: function(form) {
                form.submit();
            }
    });
    $(function() {
        // validate the comment form when it is submitted
        $("#formadd").validate({
            ignore: [],
            errorPlacement: function(label, element) {
                label.addClass('mt-2 text-danger');
                label.insertAfter(element);
            },
            highlight: function(element, errorClass) {
                $(element).parents('.form-group').addClass('has-danger')
                $(element).addClass('form-control-danger')
            }
          });
    });


    CKEDITOR.replace("ccontenttop");
    CKEDITOR.replace("ccontentbottom");


    $('#title').on('blur', function(){
        var title = $.trim($(this).val());
        if(title != ''){
            //if($.trim($('#slug').val()) == ''){
                $('#slug').val(title.replace(/ /g,"-").toLowerCase());
                $('#slug-error').hide();
            //}
        }
    });

    

    $('.ctype').click(function(){
        if(this.value == 'P'){
            $('.price-range').show();
            $('#from_price').attr('required', true);
            $('#to_price').attr('required', true);
            $('#equation').attr('required', true);

            $('.cat-price-range').hide();
            $('#category_id').attr('required', false);
            $('#cat_from_price').attr('required', false);
            $('#cat_to_price').attr('required', false);
            $('#cat_equation').attr('required', false);
        }else if(this.value == 'CP'){
        	$('.price-range').hide();
            $('#from_price').attr('required', false);
            $('#to_price').attr('required', false);
            $('#equation').attr('required', false);

            $('.cat-price-range').show();
            $('#category_id').attr('required', true);
            $('#cat_from_price').attr('required', true);
            $('#cat_to_price').attr('required', true);
            $('#cat_equation').attr('required', true);
        }
        else{
            $('.price-range').hide();
            $('#from_price').attr('required', false);
            $('#to_price').attr('required', false);
            $('#equation').attr('required', false);

            $('.cat-price-range').hide();
            $('#category_id').attr('required', false);
            $('#cat_from_price').attr('required', false);
            $('#cat_to_price').attr('required', false);
            $('#cat_equation').attr('required', false);
        }
       
    })

    if($('#cattype').val() == 'P'){
        $('.price-range').show();
        $('#from_price').attr('required', true);
        $('#to_price').attr('required', true);
        $('#equation').attr('required', true);

        $('.cat-price-range').hide();
        $('#category_id').attr('required', false);
        $('#cat_from_price').attr('required', false);
        $('#cat_to_price').attr('required', false);
        $('#cat_equation').attr('required', false);

    }else if($('#cattype').val() == 'CP'){
    	$('.price-range').hide();
        $('#from_price').attr('required', false);
        $('#to_price').attr('required', false);
        $('#equation').attr('required', false);

        $('.cat-price-range').show();
        $('#category_id').attr('required', true);
        $('#cat_from_price').attr('required', true);
        $('#cat_to_price').attr('required', true);
        $('#cat_equation').attr('required', true);
    }
    else{
    	$('.price-range').hide();
        $('#from_price').attr('required', false);
        $('#to_price').attr('required', false);
        $('#equation').attr('required', false);

        $('.cat-price-range').hide();
        $('#category_id').attr('required', false);
        $('#cat_from_price').attr('required', false);
        $('#cat_to_price').attr('required', false);
        $('#cat_equation').attr('required', false);
    }


    var _URL = window.URL || window.webkitURL;
    $("#image").change(function (e) {
        var file, img;

        var fuData = document.getElementById('image');
        var FileUploadPath1 = fuData.value;
        if (FileUploadPath1 == ''){
            alert("Please upload an image");
        }
        else{
            var Extension = FileUploadPath1.substring(FileUploadPath1.lastIndexOf('.') + 1).toLowerCase();
            if (Extension == "gif" || Extension == "png" || Extension == "bmp" || Extension == "jpeg" || Extension == "jpg" || Extension == "webp"){
                if ((file = this.files[0])) {
                    img = new Image();
                    img.onload = function () {
                        // if(this.width < 1920 || this.height < 308) {
                        //     //alert('Minimum upload image size 1920px X 379px');
                        //     alert('Minimum upload image size 1920px X 308px');
                        //     document.getElementById('image').value="";
                        //     document.getElementById('list').src="";
                        //     $('#list').hide();
                        //     return false;
                        // }
                        // else{
                            $('#list').show();
                            var output = document.getElementById('list');
                            output.src = URL.createObjectURL(e.target.files[0]);
                            document.getElementById('list').style.width="300px";
                            return true;
                        //}
                    };
                    img.src = _URL.createObjectURL(file);
                }
            }
        }
    });


</script>     

@endsection