@extends('admin.masterv2')
@section('styleSheet')
    <!-- BEGIN PAGE LEVEL STYLES -->

    <!-- END PAGE LEVEL STYLES -->
@endsection
@section('content')
    <div class="page-content-wrapper">
        <div class="page-content">
            <div class="page-bar">
                <ul class="page-breadcrumb">
                    <li>
                        <i class="fa fa-home"></i>
                        <a href="{{route('home')}}">Dashboard</a>
                        <i class="fa fa-angle-right"></i>
                    </li>
                    <li>
                        <a href="{{route('mastersPage')}}">Master's Page</a>
                        <i class="fa fa-angle-right"></i>
                    </li>
                    <li>
                        <a href="#">Update Program</a>
                    </li>
                </ul>
            </div>
            <!-- END PAGE HEADER-->
            <!-- BEGIN PAGE CONTENT-->
            <div class="row">
                <div class="col-md-12">
                    
                        <div class="portlet">
                            <div class="portlet-title">
                                <div class="caption">
                                    <i class="fa fa-shopping-cart"></i>Update Master's Program
                                </div>
                            </div>
                            <div class="portlet-body">
                                <form name="mastersProgram" id ="mastersProgram" class="custom form needs-validation" method="POST" action="{{ route('updateMastersProgram') }}" enctype="multipart/form-data" novalidate>
                                    @csrf
                                    <div class="row">
                                        <div class="col-md-8">
                                            <div class="row">
                                                <div class="col-md-8 form-group">
                                                    <input type="hidden" name="masters_program_id" value="{{$mastersProgram->masters_program_id}}"/>
                                                    <label class="form-label">Title: <span class="required">*</span></label>
                                                    <input type="text" class="form-control" name="title" value="{{$mastersProgram->title}}" placeholder="Page Title" autocomplete="off" required>
                                                </div>
                                                <div class="col-md-4 form-group">
                                                    <label class="form-label">Page Name: <span class="required">*</span></label>
                                                    <select class="form-control form-select" data-placeholder="Page..." name="page_id" required>
                                                        <option value=""></option>
                                                        @foreach($pages as $page)
                                                            <option value="{{$page->page_id}}" {{$mastersProgram->page_id == $page->page_id ? 'selected' : ''}}>{{$page->menu_title}}</option>
                                                        @endforeach
                                                    </select>
                                                </div>   
                                            </div>
                                            <div class="row">
                                                <div class="col-md-4 form-group">
                                                    <label class="form-label">Amount: <span class="required"> *</span></label>
                                                    <input type="text" class="form-control" name="amount"  value="{{$mastersProgram->amount}}" placeholder="Amount" autocomplete="off" required>
                                                </div>
                                                <div class="col-md-4 form-group">
                                                    <label class="form-label">Custom Payment: <span class="required">*</span></label>
                                                    <select class="form-control form-select"
                                                                data-placeholder="Custom Payment..." name="custom_payment" required>
                                                            <option value=""></option>
                                                            <option value="Y" {{$mastersProgram->custom_payment == 'Y' ? 'selected' : ''}}>Yes</option>
                                                            <option value="N" {{$mastersProgram->custom_payment == 'N' ? 'selected' : ''}}>No</option>
                                                    </select>
                                                </div>
                                                <div class="col-md-4 form-group">
                                                    <label class="form-label">Status: <span class="required">*</span></label>
                                                    <select class="form-control form-select"
                                                                data-placeholder="Status..." name="status" required>
                                                            <option value=""></option>
                                                            <option value="Y" {{$mastersProgram->status == 'Y' ? 'selected' : ''}}>Show</option>
                                                            <option value="N" {{$mastersProgram->status == 'N' ? 'selected' : ''}}>Inactive</option>
                                                        </select>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-6 form-group">
                                                    <label class="form-label">Schedule: <span class="required">*</span></label>
                                                    <input type="text" class="form-control" name="schedule"  value="{{$mastersProgram->schedule}}" placeholder="DD-MM-YYYY # DD-MM-YYYY" autocomplete="off" required>
                                                </div>
                                                <div class="col-md-6 form-group">
                                                    <label class="form-label">Duration: <span class="required">*</span></label>
                                                    <input type="text" class="form-control" name="duration"  value="{{$mastersProgram->duration}}" placeholder="Duration Time" autocomplete="off" required>
                                                </div>   
                                            </div>
                                            
                                            
                                        </div>
                                        <div class="col-md-4">
                                            <label class="form-label">Current Image</label>
                                            <img src="{{asset('uploads/courses/'.$mastersProgram->masters_program_id.'/'.$mastersProgram->image)}}" style= "max-width:100%">
                                            
                                            <div class="mb-1 form-group">
                                                <label for="formFile" class="form-label">Upload Image</label>
                                                <input class="form-control" type="file" id="formFile" name="image" placeholder="" accept="image/*">
                                              </div>
                                              <div class="alert alert-primary m-0 py-1" role="alert">Dimension 1200px X 480px maximum filesize 2MB</div>
                                        </div>
                                            
                                    </div>    
                                     
                                    
                                    
                                        
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-check form-check-inline">
                                                <input type="checkbox" class="form-check-input" name="aboutShow" value="Y" {{$mastersProgram->aboutShow == 'Y' ? 'checked' : ''}}>
                                                <label class="form-check-label">About</label>
                                            </div>
                                            <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="about" rows="4">{{$mastersProgram->about}}</textarea>
                                            </div>
                                        </div>
                                    </div>
                                        
                                    <div class="row">
                                        <div class="col-md-12">
                                            <label class="form-check-label">Pedagogy</label>
                                            <input type="checkbox" class="icheck"  name="pedagogyShow" value="Y" {{$mastersProgram->pedagogyShow == 'Y' ? 'checked' : ''}}> 
                                        </div>
                                        <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="pedagogy" rows="4">{{$mastersProgram->pedagogy}}</textarea>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12">
                                            <label class="form-check-label">Course Structure</label>
                                            <input type="checkbox" class="icheck"  name="courseStructureShow" value="Y" {{$mastersProgram->courseStructureShow == 'Y' ? 'checked' : ''}}> 
                                        </div>
                                        <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="courseStructure" rows="4">{{$mastersProgram->courseStructure}}</textarea>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <label class="form-check-label">Teaching Methods</label>
                                            <input type="checkbox" class="icheck"  name="teachingMethodsShow" value="Y" {{$mastersProgram->teachingMethodsShow == 'Y' ? 'checked' : ''}}> 
                                        </div>
                                        <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="teachingMethods" rows="4">{{$mastersProgram->teachingMethods}}</textarea>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <label class="form-check-label">Grading Policy</label>
                                            <input type="checkbox" class="icheck"  name="gradingPolicyShow" value="Y" {{$mastersProgram->gradingPolicyShow == 'Y' ? 'checked' : ''}}> 
                                        </div>
                                        <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="gradingPolicy" rows="4">{{$mastersProgram->gradingPolicy}}</textarea>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <label class="form-check-label">Fees and Charges</label>
                                            <input type="checkbox" class="icheck"  name="feesChargesShow" value="Y" {{$mastersProgram->feesChargesShow == 'Y' ? 'checked' : ''}}> 
                                        </div>
                                        <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="feesCharges" rows="4">{{$mastersProgram->feesCharges}}</textarea>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <label class="form-check-label">Download</label>
                                            <input type="checkbox" class="icheck"  name="downloadShow" value="Y" {{$mastersProgram->downloadShow == 'Y' ? 'checked' : ''}}> 
                                        </div>
                                        <div class="col-md-12">
                                                <textarea class="ckeditor form-control" name="download" rows="4">{{$mastersProgram->download}}</textarea>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12">
                                            <button type="submit" class="btn btn-success" style="float: right">Save</button>
                                        </div>
                                    </div>
                                </form>
                            </div><!-- END portlet-->
                        </div>
                </div>
            </div>
            <!-- END PAGE CONTENT-->
        </div>
    </div>
@endsection

@section('customJs')
<script type="text/javascript" src="{{ asset('') }}assets/global/plugins/ckeditor/ckeditor.js"></script>
<script>
$(document).ready(function () {
$.validator.addMethod("scheduleFormat", function(value, element) {
    // Regular expression to match the format 'DD-MM-YYYY # DD-MM-YYYY'
    return this.optional(element) || /^[0-3][0-9]-[0-1][0-9]-\d{4}##[0-3][0-9]-[0-1][0-9]-\d{4}$/.test(value);
}, "Please enter a valid schedule in the format DD-MM-YYYY##DD-MM-YYYY.");

$.validator.addMethod("fileSize", function (value, element, param) {
    // Check if the element has a file
    if (element.files.length > 0) {
        // Convert the size from bytes to MB and check if it exceeds the limit
        return element.files[0].size <= param;
    }
    return true; // Ignore validation if no file is selected
}, "File must be less than 2MB.");

    $("#mastersProgram").validate({
        rules: {
            amount: {
                required: true,
                digits: true
            },
            schedule: {
                required: true,
                scheduleFormat: true
            },
            image: {             // Required field
                fileSize: 2 * 1024 * 1024,    // Max file size 2MB (in bytes)
                //imageDimensions: [1200, 480]  // Image dimensions 1200 x 480
            }
        },
        messages: {
            amount: {
                required: "Amount is required only accepts digit",
                digits: "Only accepts digits"
            },
            schedule: {
                required: "Schedule is required",
                scheduleFormat: "Please enter a valid schedule in the format DD-MM-YYYY##DD-MM-YYYY"
            },
            image: {
                fileSize: "File size must be less than 2MB.",
                //imageDimensions: "Image dimensions must be 1200 x 480 pixels."
            }
        },
        errorElement: "div",
        errorPlacement: function (error, element) {
            var feedbackElement = element.siblings('.invalid-feedback');
            if (feedbackElement.length) {
                feedbackElement.html(error.html());
            } else {
                error.addClass("invalid-feedback");
                element.closest(".form-group").append(error);
            }
        },
        // errorPlacement: function (error, element) {
        //     error.addClass("invalid-feedback"); // Bootstrap's error class
        //     element.closest(".form-group").append(error);
        // },
        highlight: function (element) {
            $(element).addClass("is-invalid").removeClass("is-valid");
        },
        unhighlight: function (element) {
            $(element).addClass("is-valid").removeClass("is-invalid");
        },
        submitHandler: function (form) {
            // Add 'was-validated' class to trigger Bootstrap validation
            form.classList.add('was-validated');
            form.submit(); // Perform the default form submission
        }
    });
});
</script>    
@endsection

@section('documentJquery')
@endsection