@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"> Edit Audio </li>
                            </ol>
                        </nav>
            
                    </div>


                    <div class="ms-auto">
                        <div class="btn-group">
                       <a href="{{ route('all.audio') }}" 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"> AUDIO DETAILS</h5>
                        
                        
                        <hr/>
                       
                        <form id="myForm" method="POST" action="{{ route('update.audio', $audio->id) }} " enctype="multipart/form-data" >
                    
                            @csrf

                            
                            <input type="hidden" name="old_audio" value="{{ $audio->product_audio }}">	


                            <div class="form-body mt-4">                     
                                <div class="row">

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

                                        
                                            <div class="form-group mb-3">

                                                <label for="inputProduct" class="form-label">Select Product *</label>
                                                <select name="product_id" class="form-select" id="inputProduct" >
                                                    <option selected=" " value=" "></option>
        
                                                    
                                                    @foreach($products as $product)		
                                                    <option value="{{ $product->id }}" {{ $product->id == $audio->product_id ? 'selected' : '' }}> {{ $product->product_name }} </option>
                                                    @endforeach
 
          
                                                </select>

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



                                            <div class="form-group mb-3">

                                                <label for="inputSection" class="form-label"> Select Section * </label>
                                                <select name="section" class="form-select" id="inputSection" >
                                                    
                                                   
                                                    <option value="1"  {{ $audio->section == '1'  ? 'selected' : '' }}> Audio Book </option>
                                                    <option value="2"  {{ $audio->section == '2'  ? 'selected' : '' }} > Opening Credit </option>	
                                                    <option value="3"  {{ $audio->section == '3'  ? 'selected' : '' }} > Introduction </option>
                                                    <option value="4"  {{ $audio->section == '4'  ? 'selected' : '' }}> Chapter One </option>
                                                    <option value="5"  {{ $audio->section == '5'  ? 'selected' : '' }}> Chapter Two </option>
                                                    <option value="6"  {{ $audio->section == '6'  ? 'selected' : '' }}> Chapter Three </option>
                                                    <option value="7"  {{ $audio->section == '7'  ? 'selected' : '' }}> Chapter Four </option>
                                                    <option value="8"  {{ $audio->section == '8'  ? 'selected' : '' }}> Chapter Five </option>
                                                    <option value="9"  {{ $audio->section == '9'  ? 'selected' : '' }}> Chapter Six </option>
                                                    <option value="10"  {{ $audio->section == '10'  ? 'selected' : '' }}> Chapter Seven </option>
                                                    <option value="11" {{ $audio->section == '11'  ? 'selected' : '' }}> Chapter Eight </option>
                                                    <option value="12" {{ $audio->section == '12'  ? 'selected' : '' }}> Chapter Nine </option>
                                                    <option value="13" {{ $audio->section == '13'  ? 'selected' : '' }}> Chapter Ten </option>
                                                    <option value="14" {{ $audio->section == '14'  ? 'selected' : '' }}> Chapter Eleven </option>
                                                    <option value="15" {{ $audio->section == '15'  ? 'selected' : '' }}> Chapter Twelve </option>
                                                    <option value="16" {{ $audio->section == '16'  ? 'selected' : '' }}> Chapter Thirteen </option>
                                                    <option value="17" {{ $audio->section == '17'  ? 'selected' : '' }}> Chapter Fourteen </option>
                                                    <option value="18" {{ $audio->section == '18'  ? 'selected' : '' }}> Chapter Fifteen </option>
                                                    <option value="19" {{ $audio->section == '19'  ? 'selected' : '' }}> Chapter Sixeen </option>
                                                    <option value="20" {{ $audio->section == '20'  ? 'selected' : '' }}> Conclusion </option>
                                                    <option value="20" {{ $audio->section == '21'  ? 'selected' : '' }}> Closing Credit </option>

                                                </select>

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



                                            <div class="form-group mb-3">
                                                <label for="inputChapterTitle" class="form-label"> Chapter Title *</label>
                                                <input type="text" name="chapter_title" class="form-control" id="inputChapterTitle" placeholder="Enter Chapter title" value="{{ $audio->chapter_title }}">

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

                                            </div>



                                              <div class="form-group mb-3">
                                                <label for="inputProductAudio" class="form-label">Product Audio *  </label>
                                                <input name="product_audio" class="form-control" type="file"  id=""  >

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




                                                <div class="my-3">
                                                   <audio id="audio-player" controls controlslist="nodownload" oncontextmenu="return false;">
                                                       Your browser does not support the audio element.
                                                    </audio>
                                                </div>
                                            
                                        
                                        
              
                                              </div>  <br>




                                              <div class="form-group mb-3">
                                                
                                                <div class="d-grid">                                         
                                                    <input type="submit" class="btn btn-primary px-4" value="Save Changes" />                                     
                                                </div> 
              
                                              </div>  <br>


                                        </div>  
                                    </div>

                            
                        

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

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

    </div>





    <script>
        document.addEventListener("DOMContentLoaded", function() {
            // Define the route to fetch the audio blob
            var audioUrl = "{{ route('view.audio.file', ['filename' => basename($audio->product_audio)]) }}";
        
            // Fetch the audio file as a blob
            fetch(audioUrl)
                .then(response => response.blob())
                .then(blob => {
                    // Create a blob URL
                    var blobUrl = URL.createObjectURL(blob);
        
                    // Set the blob URL as the source of the audio player
                    var audioPlayer = document.getElementById('audio-player');
                    var source = document.createElement('source');
                    source.src = blobUrl;
                    source.type = blob.type;
        
                    // Append the source element to the audio player
                    audioPlayer.appendChild(source);
        
                    // Load the audio player with the new blob URL
                    audioPlayer.load();
                })
                .catch(error => console.error('Error fetching audio file:', error));
        });
        </script>

   

  

   





  















    









    


@endsection