@extends('admin.admin_dashboard')
@section('admin')

 
<div class="page-content">
 
				<!--breadcrumb-->
				<div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3"> 
                    <div class="ps-3">
            
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb mb-0 p-0">
                                <li class="breadcrumb-item">
                                    <a href="{{ route('admin.dashboard') }}">  <i class="bx bx-home-alt"> </i> </a>
                                </li>
                                
                                <li class="breadcrumb-item active" aria-current="page"> View Product </li>
                            </ol>
                        </nav>
            
                    </div>


                    <div class="ms-auto">
                        <div class="btn-group">
                       <a href="{{ route('all.product') }}" class="btn btn-light px-5"> Back </a>  
                        </div>
                    </div>
            
                </div>
				<!--end breadcrumb-->


                <div class="card">
                    <div class="card-body p-4">

                        <h5 class="card-title"> View Product</h5>
                       
                        
                        <hr/>
                       
                        <form id="myForm" method="POST" action="" enctype="multipart/form-data" >
                    
                            @csrf
                
                            <div class="form-body mt-4">                     
                              <div class="row">

                                    <!-- right side   -->
                                    <div class="col-lg-8">
                                        <div class="border border-3 p-4 rounded">
  
                                            <div class="form-group mb-3">
                                                <label for="inputProductName" class="form-label">Product Name *</label>
                                                <input type="text" name="product_name" class="form-control" id="inputProductName" placeholder="Enter product title" value="{{ $product->product_name }}" disabled>
                                            </div>


                                            <div class="form-group mb-3">
                                                <label for="inputProductSubtitle" class="form-label">Product Subtitle</label>
                                                <input type="text" name="product_subtitle" class="form-control" id="inputProductSubtitle" placeholder="Enter product subtitle" value="{{ $product->product_subtitle }}" disabled>
                                            </div>


                                            <div class="form-group mb-3">
                                                <label for="InputcloudCode" class="form-label"> Cloud Code </label>
                                                <input type="text" name="cloud_code" class="form-control" id="inputCloudCode" placeholder="Enter cloud code" value="{{ $product->cloud_code }}" disabled>
                                            </div>


                                            <div class="form-group mb-3">
                                                <label for="InputFlipCode" class="form-label"> Flip Code </label>
                                                <input type="text" name="flip_code" class="form-control" id="inputFlipCode" placeholder="Enter flip code" value="{{ $product->flip_code }}" disabled>
                                            </div>



                                            <div class="form-group mb-3">
                                                <label for="InputcloudCode" class="form-label"> Product Code </label>
                                                <input type="text" name="product_code" class="form-control" id="inputProductCode" placeholder="Enter product code" value="{{ $product->product_code }}" disabled>
                                            </div>
                                

                                            <div class="mb-3">
                                                <label for="inputProductTags" class="form-label">Product Tags</label>
                                                <input type="text" name="product_tags" class="form-control visually-hidden" data-role="tagsinput" value="{{ $product->product_tags }}" disabled>       
                                            </div>


                                            
                                
                                            
                            
                                              <div class="form-group mb-3">
                                                <label for="inputProductDescription" class="form-label">Short Description *</label>
                                                <textarea name="short_description" class="form-control" id="inputProductDescription" rows="3" disabled>   {{ $product->short_description }} </textarea>
                                              </div>
                                
                                              

                                              <div class="form-group mb-3">
                                                <label for=" " class="form-label"> Long Description * </label>
                                                <textarea id="elm1" name="long_description" disabled>   {!! $product->long_description !!}  </textarea>

                                              </div>  <br>


                                              <div class="form-group mb-3">
                                                <label for=" " class="form-label"> Overview </label>
                                                <textarea class="elm" name="overview" disabled>{!! $product->overview !!}</textarea>

                                              </div>  <br>


                                              <div class="form-group mb-3">
                                                <label for=" " class="form-label"> Announcements (Enhanced Study) </label>
                                                <textarea class="elm" name="announcements" disabled>{!! $product->announcements !!}</textarea>

                                              </div>  <br>
                                
                                
                                             
                                              <div class="form-group my-3">
                                                <label for="inputProductTitle" class="form-label">Product Thumbnail * </label> <br>
                                                <img src="{{ asset($product->product_thumbnail) }}" style="width:250px; height:300px">
                                              </div> <br>




                                              <div class="form-group my-3">
                                                <label for="inputVideoPreview" class="form-label"> Product Video Preview  </label> <br>
                                               
                                                <video width="300px" height="300px" controls controlsList="nodownload">
                                                    <source src="{{ asset($product->product_video_preview) }}" type="video/mp4">
                                                     Your browser does not support the video tag.
                                                </video>

                                
                                              </div> <br>



                                             {{--
                                            

                                            <div class="form-group mb-3">
                                                <label for="inputProductTitle" class="form-label">Product E-Book *</label> <br>
                                            
                                                <!-- Display PDF using iframe -->
                                                <iframe 
                                                    id="pdf-iframe" 
                                                    width="100%" 
                                                    height="500" 
                                                    style="border:none;">
                                                </iframe>
                                            
                                                <!-- Embed PDF with no toolbar -->
                                                <embed 
                                                    id="pdf-embed" 
                                                    width="100%" 
                                                    height="500" 
                                                    style="border:none;" 
                                                    type="application/pdf">
                                            </div>

                                             --}}
                                            
                                            
                                            
                                            

                            

                                        </div>  
                        
                                     </div>   <!-- right side ends  -->

                            
                                       <!-- left side -->
                                      <div class="col-lg-4">
                                        <div class="border border-3 p-4 rounded">
                                            <div class="row g-3">

                                                   <div class="form-group col-md-6"> 
                                                      <label for="inputPrice" class="form-label">Product Price - Espees * </label>
                                                      <input type="number" name="selling_price_esp" class="form-control" id="inputPrice" placeholder="00.00" value="{{ $product->selling_price_esp }}"  step="0.01" min="0" disabled>
                                                    </div>
                
                                                    <div class="col-md-6">
                                                        <label for="inputCompareatprice" class="form-label">Discount Price - Espees </label>
                                                        <input type="number" name="discount_price_esp" class="form-control" id="inputCompareatprice" placeholder="00.00" value="{{ $product->discount_price_esp }}" step="0.01" min="0" disabled>
                                                    </div>




                                                    <div class="form-group col-md-6"> 
                                                        <label for="inputPrice" class="form-label">Product Price - NGN * </label>
                                                        <input type="number" name="selling_price_ngn" class="form-control" id="inputPrice" placeholder="00.00" value="{{ $product->selling_price_ngn }}" step="0.01" min="0" disabled>
                                                      </div>
                  
                                                      <div class="col-md-6">
                                                          <label for="inputCompareatprice" class="form-label">Discount Price - NGN  </label>
                                                          <input type="number" name="discount_price_ngn" class="form-control" id="inputCompareatprice" placeholder="00.00" value="{{ $product->discount_price_ngn }}" step="0.01" min="0" disabled>
                                                      </div>


                                                      <div class="form-group col-md-6"> 
                                                        <label for="inputPrice" class="form-label">Product Price - USD * </label>
                                                        <input type="number" name="selling_price_usd" class="form-control" id="inputPrice" placeholder="00.00" value="{{ $product->selling_price_usd }}" step="0.01" min="0" disabled>
                                                      </div>
                  
                                                      <div class="col-md-6">
                                                          <label for="inputCompareatprice" class="form-label">Discount Price - USD </label>
                                                          <input type="number" name="discount_price_usd" class="form-control" id="inputCompareatprice" placeholder="00.00" value="{{ $product->discount_price_usd }}" step="0.01" min="0" disabled>
                                                      </div>



                                                      <div class="form-group col-12">
                                                        <label for="inputAuthor" class="form-label"> Select Author * </label>
                                                        <select name="author_id" class="form-select" id="inputAuthor" >
                                                            
                                                            <option></option>
                                                         
                                                            @foreach($authors as $author)
                                                            <option value="{{ $author->id }}" {{ $author->id == $product->author_id ? 'selected' : '' }}> {{ $author->author_name }} </option>
                                                            @endforeach

                                                        </select>
                                                    </div>



                                                    <div class="col-12">
                                                        <label for="inputVendor" class="form-label">Select Vendor *</label>
                                                        <select name="vendor_id" class="form-select" id="inputVendor" >
                                                            <option> </option>
                
                                                            @foreach($activeVendor as $vendor)		
                                                            <option value="{{ $vendor->id }}" {{ $vendor->id == $product->vendor_id ? 'selected' : '' }}> {{ $vendor->firstname }} {{ $vendor->surname }} </option>
                                                            @endforeach
                                                          
                                                        </select>
                                                    </div>
                

                                                    <div class="form-group col-12">
                                                        <label for="inputCategory" class="form-label"> Select Product Category * </label>
                                                       
                                                        {{--
                                                        <select name="category_id" class="form-select" id="inputCategory" >
                                                           
                                                          <option></option>

                                                          @foreach($categories as $category)
                                                          <option value="{{ $category->id }}" {{ $category->id == $product->category_id ? 'selected' : '' }}> {{ $category->category_name }} </option>
                                                          @endforeach

                                                        </select>
                                                        --}}


                                                        <select name="category_ids[]" class="form-control" id="categories" multiple>
                                                            @foreach($categories as $category)

                                                                <option value="{{ $category->id }}"  {{ $product->categories->pluck('id')->contains($category->id) ? 'selected' : '' }}>
                                                                    {{ $category->category_name }}
                                                                </option>

                                                            @endforeach
                                                        </select>


                                                    </div>




                                                    <div class="col-12">
                                                        <label for="inputLevel" class="form-label">Select Product Level *</label>
                                                        <select name="level_ids[]" class="form-select" id="inputLevel" multiple >
                                                            
                                                            @foreach($levels as $level)

                                                            <option value="{{ $level->id }}"  {{ $product->levels->pluck('id')->contains($level->id) ? 'selected' : '' }}>
                                                                {{ $level->level_name }}
                                                            </option>

                                                            @endforeach
                                                            
                  
                                                        </select>

                                                    </div>




                                                    <div class="col-12">
                                                        <label for="inputLanguage" class="form-label">Select Language *</label>
                                                        <select name="language_id" class="form-select" id="inputLanguage" >
                                                            <option></option>
                
                                                            @foreach($languages as $language)		
                                                            <option value="{{ $language->id }}" {{ $language->id == $product->language_id ? 'selected' : '' }}> {{ $language->language_name }} </option>
                                                            @endforeach
                                                            
                                                        </select>

                                                       
                                                    </div>

                                    
                                                      <div class="col-12"> 
                                                          
                                                        <div class="row g-3">
                                    
                                                            <div class="col-md-6">	
                                                                <div class="form-check">
                                                                    <input class="form-check-input" name="special_offer" type="checkbox" value="1" id="flexCheckDefault" {{ $product->special_offer == 1 ? 'checked' : '' }} disabled>
                                                                    <label class="form-check-label" for="flexCheckDefault"> Special Offer </label>
                                                               </div>

                                                               @error('special_offer')
                                                               <span class="text-danger">{{ $message }}</span>
                                                               @enderror
                                                           </div>
                                                       

                                                           <div class="col-md-6">	
                                                             <div class="form-check">
                                                                   <input class="form-check-input" name="featured" type="checkbox" value="1" id="flexCheckDefault" {{ $product->featured == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault">Featured</label>
                                                               </div>

                                                             
                                                           </div>
                                                       
                                                       
                                                       
                                                           <div class="col-md-6">	
                                                            <div class="form-check">
                                                                   <input class="form-check-input" name="available_in_print" type="checkbox" value="1" id="flexCheckDefault" {{ $product->available_in_print == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault"> Print Purchase </label>
                                                               </div>
                                                           </div>


                                                           <div class="col-md-6">	
                                                            <div class="form-check">
                                                                   <input class="form-check-input" name="available_in_digital" type="checkbox" value="1" id="flexCheckDefault" {{ $product->available_in_digital == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault"> Digital Purchase </label>
                                                               </div>
                                                           </div>
                                                       
                                                       
                                                           <div class="col-md-6">	
                                                            <div class="form-check">
                                                                   <input class="form-check-input" name="new_release" type="checkbox" value="1" id="flexCheckDefault" {{ $product->new_release == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault"> New Release </label>
                                                               </div>

                                                              
                                                           </div>


                                                            <div class="col-md-6">	
                                                            <div class="form-check">
                                                                   <input class="form-check-input" name="enhanced_study" type="checkbox" value="1" id="flexCheckDefault" {{ $product->enhanced_study == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault"> Enhanced Study </label>
                                                               </div>

                                                              
                                                           </div>


                                                            <div class="col-md-6">	
                                                            <div class="form-check">
                                                                   <input class="form-check-input" name="read_ebook" type="checkbox" value="1" id="flexCheckDefault" {{ $product->read_ebook == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault"> Read E-Book </label>
                                                               </div>

                                                              
                                                           </div>


                                                            <div class="col-md-6">	
                                                            <div class="form-check">
                                                                   <input class="form-check-input" name="listen_audiobook" type="checkbox" value="1" id="flexCheckDefault" {{ $product->listen_audiobook == 1 ? 'checked' : '' }} disabled>
                                                                   <label class="form-check-label" for="flexCheckDefault"> Listen Audiobook </label>
                                                               </div>

                                                              
                                                           </div>
                                   
                                      
                                        
                                                        </div> <!-- // end row  -->

                
                            
                                   
                                       
                                                    </div>
                                       
                                                    <hr>

                                                   


                                   
                                                </div> 
                                            </div> 
                                        </div>



                                           <!--CLOUDCODE DISPLAY-->
                                           <div class="col-lg-12">
                                               <div class="border border-3 p-4 rounded">

                                                <div class="form-group mb-3">
                                                     <label for="inputProductTitle" class="form-label">Product E-Book - CLOUD PDF </label> <br>

                                                     <div id="viewer"  class="w-auto" style="height: 500px; margin: 80px auto;"></div>
    
                                                </div>

                                               </div>


                                           </div>

                                         

                        
                                    </div><!--end row-->   
                    
                                </div>  <!-- form body div-->

                        </form> <!--end  form -->
           
              
                    </div> 
            
          
                </div>  <!-- end card -->

    </div>


    @include('includes.cloud');






    <!--FLIPHTML5 DISPLAY-->
<div class="page-content">
    <div class="col-lg-12">
      <div class="border border-3 p-4 rounded">

           <div class="form-group mb-5 ">
             <label for="inputProductTitle" class="form-label">Product E-Book - FlipHTML5 </label> <br>
            
             @if($product->flip_code)
                @include('includes.flip');
            @else

            @endif

           </div>

    </div>
  </div>
</div>






{{--

    <script>
        document.addEventListener("DOMContentLoaded", function() {
            // Define the route to fetch the PDF blob
            var pdfUrl = "{{ route('view.pdf', ['filename' => basename($product->product_ebook)]) }}";
            
            // Fetch the PDF file as a blob
            fetch(pdfUrl)
                .then(response => response.blob())
                .then(blob => {
                    // Create a blob URL
                    var blobUrl = URL.createObjectURL(blob);
    
                    // Set the blob URL as the source for the iframe
                    var pdfIframe = document.getElementById('pdf-iframe');
                    pdfIframe.src = blobUrl + '#toolbar=1';  // Disable the toolbar by appending #toolbar=0;
    
                    // Set the blob URL as the source for the embed element (optional)
                    var pdfEmbed = document.getElementById('pdf-embed');
                    pdfEmbed.src = blobUrl + '#toolbar=0';
                })
                .catch(error => console.error('Error fetching PDF file:', error));
        });
    </script>

    --}}
    









    


@endsection