@extends('layouts.backend.app')

@section('title','Website Information Edit')

@push('css')

@endpush

@section('content')
<div class="col-lg-10 col-md-12 col-lg-offset-1">
  <div class="card mb-4 mt-4">
      <div class="card-header">
        <i class="fas fa-chart-area mr-1"></i>Website Information Edit
      </div>
      <div class="card-body">
        <form action="{{ route('admin.website.update',$website->id) }}" method="POST" enctype="multipart/form-data" >
          @csrf
          @method('PUT')
          <div class="form-group row">
              <label for="title" class="col-xs-3 col-form-label">Application Title <i class="text-danger">*</i></label>
              <div class="col-xs-9">
                  <input name="title" type="text" class="form-control" id="title" placeholder="Application Title" value="{{$website->title}}">
              </div>
          </div> 

          <div class="form-group row">
              <label for="description" class="col-xs-3 col-form-label">Description</label>
              <div class="col-xs-9">
                  <textarea name="description" class="form-control"  placeholder="Description" rows="2">{{$website->description}} </textarea>
              </div>
          </div> 

          <div class="form-group row">
              <label for="meta_keyword" class="col-xs-3 col-form-label">Meta Keyword</label>
              <div class="col-xs-9">
                  <textarea name="meta_keyword" class="form-control"  placeholder="Meta Keyword" rows="2">{{$website->meta_keyword}}</textarea>
              </div>
          </div> 

          <div class="form-group row">
              <label for="meta_tag" class="col-xs-3 col-form-label">Meta Description</label>
              <div class="col-xs-9">
                  <textarea name="meta_tag" class="form-control"  placeholder="Meta Description" rows="2">{{$website->meta_tag}}</textarea>
              </div>
          </div>                             

          <div class="form-group row">
              <label for="email" class="col-xs-3 col-form-label">Email Address <i class="text-danger">*</i></label>
              <div class="col-xs-9">
                  <input name="email" type="text" class="form-control" id="email" placeholder="Email Address"  value="{{$website->email}}">
              </div>
          </div>

          <div class="form-group row">
              <label for="address" class="col-xs-3 col-form-label">Address <i class="text-danger">*</i></label>
              <div class="col-xs-9">
                  <textarea name="address" class="form-control"  placeholder="Address" rows="2">{{$website->address}}</textarea>
              </div>
          </div>

          <div class="form-group row">
              <label for="phone" class="col-xs-3 col-form-label">Phone No <i class="text-danger">*</i></label>
              <div class="col-xs-9">
                  <input name="phone" type="text" class="form-control" id="phone" placeholder="Phone No"  value="{{$website->phone}}" >
              </div>
          </div>


          <!-- if setting favicon is already uploaded -->
          <div class="form-group row">
              <label for="faviconPreview" class="col-xs-3 col-form-label"></label>
              <div class="col-xs-9">
                  <img src="{{ Storage::disk('public')->url('logo/favicon/'.$website->favicon) }}" alt="Favicon" class="img-thumbnail" />
              </div>
          </div>
          
          <div class="form-group row">
              <label for="favicon" class="col-xs-3 col-form-label">Favicon </label>
              <div class="col-xs-9">
                  <input type="file" name="favicon" placeholder="Logo" id="favicon" value="">
              </div>
          </div>

          

          <!-- if setting logo is already uploaded -->
          <div class="form-group row">
              <label for="logoPreview" class="col-xs-3 col-form-label"></label>
              <div class="col-xs-9">
                  <img src="{{ Storage::disk('public')->url('logo/'.$website->logo) }}" alt="Logo" class="img-thumbnail" />
              </div>
          </div>
          
          <div class="form-group row">
              <label for="logo" class="col-xs-3 col-form-label">Logo </label>
              <div class="col-xs-9">
                  <input type="file" name="logo"  id="logo" value="">
              </div>
          </div>  

          <div class="form-group row">
              <label for="logoPreview" class="col-xs-3 col-form-label"></label>
              <div class="col-xs-9">
                  <img src="{{ Storage::disk('public')->url($website->buy_now) }}" alt="Logo" class="img-thumbnail" />
              </div>
          </div>
          
          <div class="form-group row">
              <label for="logo" class="col-xs-3 col-form-label">Buy Now (Max height:100px )</label>
              <div class="col-xs-9">
                  <input type="file" name="buy_now"  id="buy_now" value="">
              </div>
          </div>

          <div class="form-group row">
              <label for="logoPreview" class="col-xs-3 col-form-label"></label>
              <div class="col-xs-9">
                  <img src="{{ Storage::disk('public')->url($website->popup_mobile) }}" alt="Logo" class="img-thumbnail" />
              </div>
          </div>
          
          <div class="form-group row">
              <label for="logo" class="col-xs-3 col-form-label">Popup notification image ( Mobile )</label>
              <div class="col-xs-9">
                  <input type="file" name="popup_mobile"  id="popup_mobile" value="">
              </div>
          </div>  

          <div class="form-group row">
              <label for="logoPreview" class="col-xs-3 col-form-label"></label>
              <div class="col-xs-9">
                  <img src="{{ Storage::disk('public')->url($website->popup_image) }}" alt="Logo" class="img-thumbnail" />
              </div>
          </div>
          
          <div class="form-group row">
              <label for="logo" class="col-xs-3 col-form-label">Popup notification image (Max width:800px )</label>
              <div class="col-xs-9">
                  <input type="file" name="popup_image"  id="popup_image" value="">
                  
              </div>
          </div>

          <div class="form-group row">
              <label for="title" class="col-xs-3 col-form-label">Popup notification link <i class="text-danger">*</i></label>
              <div class="col-xs-9">
                  <input name="popup_link" type="text" class="form-control" id="popup_link" placeholder="Max 150 word." value="{{$website->popup_link}}">

                  <br>
                  <input @if ($website->popup_switch==1) checked @endif type="checkbox" name="popup_switch" value="1">
                  <label> Popup notification on</label>
              </div>
          </div>


          <div class="form-group row">
              <label for="twitter_api" class="col-xs-3 col-form-label">Notice</label>
              <div class="col-xs-9">
                  <textarea name="twitter_api" class="form-control"  placeholder="Notice" rows="2">{{$website->twitter_api}}</textarea>
              </div>
          </div>  

          <div class="form-group row">
              <label for="google_map" class="col-xs-3 col-form-label">Google Map</label>
              <div class="col-xs-9">
                  <textarea name="google_map" class="form-control"  placeholder="Google Map" rows="2">{{$website->google_map}}</textarea>
              </div>
          </div>  

          <!-- Additional fild -->
          <table class="table table-striped"> 
              <thead>
                  <tr class="bg-warning">
                      <th>Social icon ( https://fontawesome.com/v4.7.0/icons/ )</th>
                      <th>Link</th>
                      <th width="160" class="text-center">Add / Remove</th>  
                  </tr>
              </thead>
              <tbody id="diagnosis">
                @php
                    $icon = explode("|",$website->icon);
                    $link = explode("|",$website->link);
                @endphp
                @foreach($icon as $key=>$icon)
                  <tr>
                      <td>
                          <input type="text" name="icon[]" autocomplete="off" class="form-control" required placeholder="https://fontawesome.com/v4.7.0/icons/" value="{{$icon}}" >
                      </td>

                      <td>
                          <input type="text" name="link[]" required class="form-control" placeholder="https://" value="@if(isset($link[$key])){{$link[$key]}}@endif" >
                      </td> 
                      <td class="text-center">
                        <div class="btn btn-group">
                          <button type="button" class="btn btn-sm btn-primary DiaAddBtn">+</button>
                          <button type="button" class="btn btn-sm btn-danger DiaRemoveBtn">-</button>
                          </div>
                      </td>   
                  </tr>
                @endforeach  
              </tbody> 
          </table>  

          <!-- /.box-body -->

          <div class="form-group row">
              <div class="col-sm-6">
                  <div class="ui buttons">
                      <button type="submit" class="btn btn-success m-t-15 waves-effect">UPDATE</button>

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

@endsection

@push('js')
  <script>
    $(document).ready(function() {
      //#------------------------------------
      //   STARTS OF DIAGNOSIS 
      //#------------------------------------    
      //add row
      $('body').on('click','.DiaAddBtn' ,function() {
          var itemData = $(this).parent().parent().parent(); 
          $('#diagnosis').append("<tr>"+itemData.html()+"</tr>"); 
          $('#diagnosis tr:last-child').find(':input').val('');
      });
      //remove row
      $('body').on('click','.DiaRemoveBtn' ,function() {
          $(this).parent().parent().parent().remove();
      });

    });
  </script>
@endpush