@extends('store.layouts.container')

@section('content')



<div class="border-item">  
  @if($store)
    <form class="form-row" enctype="multipart/form-data"  method="post" action="{{ url(getCurrentLocale().'/storeDashboard/updateStore/'.$store->id) }}">
       
            @method('PUT')
        
        @csrf
        <div class="form-group col-lg-6">
             <label>{{ meta('password', getCurrentLocale()) ?? __('stores.password')}}</label>
            <input type="password"  class="form-control  {{ $errors->has('password') ? 'is-invalid' : '' }}" id="password"  name="password" placeholder="{{ meta('password', getCurrentLocale()) ?? __('stores.password') }} " value='{{ old("password", $store->password ?? "") }}'/>
        </div>
          <div class="form-group col-lg-6">
             <label>{{ meta('facebook', getCurrentLocale()) ?? __('stores.facebook')}}</label>
            <input type="text"  class="form-control  {{ $errors->has('facebook') ? 'is-invalid' : '' }}" id="facebook"  name="facebook" placeholder="{{ meta('facebook', getCurrentLocale()) ?? __('stores.facebook') }} " value='{{ old("facebook", $store->facebook ?? "") }}'/>
        </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('youtube', getCurrentLocale()) ?? __('stores.youtube')}}</label>
            <input type="text"  class="form-control  {{ $errors->has('youtube') ? 'is-invalid' : '' }}" id="youtube"  name="youtube" placeholder="{{ meta('youtube', getCurrentLocale()) ?? __('stores.youtube') }} " value='{{ old("youtube", $store->youtube ?? "") }}'/>
        </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('twitter', getCurrentLocale()) ?? __('stores.twitter')}}</label>
            <input type="text"  class="form-control  {{ $errors->has('twitter') ? 'is-invalid' : '' }}" id="twitter"  name="twitter" placeholder="{{ meta('twitter', getCurrentLocale()) ?? __('stores.twitter') }} " value='{{ old("twitter", $store->twitter ?? "") }}'/>
        </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('instagram', getCurrentLocale()) ?? __('stores.instagram')}}</label>
            <input type="text"  class="form-control  {{ $errors->has('instagram') ? 'is-invalid' : '' }}" id="instagram"  name="instagram" placeholder="{{ meta('instagram', getCurrentLocale()) ?? __('stores.instagram') }} " value='{{ old("instagram", $store->instagram ?? "") }}'/>
        </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('email', getCurrentLocale()) ?? __('stores.email')}}</label>
            <input type="text"  class="form-control  {{ $errors->has('email') ? 'is-invalid' : '' }}" id="email"  name="email" placeholder="{{ meta('email', getCurrentLocale()) ?? __('stores.email') }} " value='{{ old("email", $store->email ?? "") }}'/>
        </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('phone', getCurrentLocale()) ?? __('stores.phone')}}</label>
            <input type="number"  class="form-control  {{ $errors->has('phone') ? 'is-invalid' : '' }}" id="phone"  name="phone" placeholder="{{ meta('phone', getCurrentLocale()) ?? __('stores.phone') }} " value='{{ old("phone", $store->phone ?? "") }}'/>
        </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('category_id', getCurrentLocale()) ?? __('stores.category_id')}}</label>
           
                        <select  class="form-control {{ $errors->has('category_id') ? 'is-invalid' : '' }}" onchange="categoryselect(this)" name="category_id">
                         <option selected disabled >{{__('stores.select')}}</option>
                         
                         @foreach($categories as $row)
                           <option @if($store ?? ''  && $store->id) @if($store->category_id == $row->id) selected @endif @endif  value="{{$row->id}}">{{categoryname($row->id)}}</option>
                         @endforeach
                        
                         
                         
                         </select>
            </div>
       <div class="form-group col-lg-6">
             <label>{{ meta('model_id', getCurrentLocale()) ?? __('stores.model_id')}}</label>
         
                        <select id="models" class="form-control {{ $errors->has('model_id') ? 'is-invalid' : '' }}" name="model_id">
                         <option selected disabled >{{__('stores.select')}}</option>
                          @if($store ?? ''  && $store->id)
                         @foreach($models as $row)
                           <option  @if($store->model_id == $row->id) selected @endif   value="{{$row->id}}">{{categoryname($row->id)}}</option>
                         @endforeach
                        @endif
                         
                         
                         </select>
          </div>
      <div class="form-group col-sm-6">
           <label>{{ meta('type', getCurrentLocale()) ?? __('stores.type')}}</label>
                    
                        <select  class="form-control {{ $errors->has('type') ? 'is-invalid' : '' }}" name="type">
                         <option @if($store ?? ''  && $store->id) @if($store->type == 'active') selected @endif @endif  value="active">{{__('stores.active')}}</option>
                         <option @if($store ?? ''  && $store->id) @if($store->type == 'inactive') selected @endif @endif  value="inactive">{{__('stores.inactive')}}</option>
                         </select>
                        
                </div>
                <div class="form-group col-sm-6"></div>
        @foreach($languages as $language)
        <div class="form-group col-lg-6">
            <label>{{ meta('name', $language->local) ?? __('stores.name') }} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
            <input type="text" class="form-control {{ $errors->has('name_'.$language->local) ? 'is-invalid' : '' }}" name="name_{{ $language->local }}" placeholder="{{ meta('name', $language->local) ?? __('stores.name') }}" value='{{ old("name_{$language->local}", $store[$language->local]->name ?? "") }}'/>
        </div>
 <div class="form-group col-lg-6">
            <label>{{ meta('title', $language->local) ?? __('stores.title') }} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
            <input type="text" class="form-control {{ $errors->has('title_'.$language->local) ? 'is-invalid' : '' }}" name="title_{{ $language->local }}" placeholder="{{ meta('title', $language->local) ?? __('stores.title') }}" value='{{ old("title_{$language->local}", $store[$language->local]->title ?? "") }}'/>
        </div>
         <div class="form-group col-lg-6">
            <label>{{ meta('address', $language->local) ?? __('stores.address') }} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
            <input type="text" class="form-control {{ $errors->has('address_'.$language->local) ? 'is-invalid' : '' }}" name="address_{{ $language->local }}" placeholder="{{ meta('address', $language->local) ?? __('stores.address') }}" value='{{ old("address_{$language->local}", $store[$language->local]->address ?? "") }}'/>
        </div>
        <div class="form-group col-lg-12">
            <label>{{ meta('description', $language->local) ?? __('stores.description')}} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
            <textarea name="description_{{ $language->local }}" class="form-control {{ $errors->has('description_'.$language->local) ? 'is-invalid' : '' }}" placeholder="{{ meta('description', $language->local) ?? __('stores.description')}}">{{ old("description_{$language->local}", $store[$language->local]->description ?? "") }}</textarea>
        </div>

       
        @endforeach
        
        
        
 <div class="form-group col-lg-12 image_container">
            <label>{{ meta('image', getCurrentLocale()) ?? __('stores.image') }} </label>
            <input id="image_thumbnail" class="image_thumbnail" type="hidden" name="image" value="{{old("image", $store->image ?? "")}}"/>

            <div class="photos main_photo {{ old('image', $store->image ?? '') ? ' wow fadeInUp' : 'hide' }}">
                <div class="col-md-4">
                    <div class="items">
                        <div class="img">
                            <a href="#" id="lfm" data-input=".image_thumbnail" data-preview=".image_holder" class="lfm" data-hide=".pick_button">
                                <img src="{{asset(old('image', $store->image ?? ''))}} "  id="image_holder" class="image_holder"/>
                            </a>
                        </div>
                        <a href="#" class="showHide resetImage close" data-empty=".image_thumbnail" data-hide=".main_photo" data-show=".pick_button"><i class="fas fa-times"></i></a>
                    </div>
                </div>
            </div>

            <div class="clearfix"></div>
            <span class="input-group-btn pick_button {{ old('image', $store->image ?? '') ? 'hide' : '' }} ">
                <a id="lfm"  data-input=".image_thumbnail" data-preview=".image_holder" data-show=".main_photo" data-hide=".pick_button" class="lfm btn btn-primary text-light">
                    <i class="fas fa-camera-retro"></i> Choose
                </a>
             </span>
        </div> 
        
        
 <div class="form-group col-lg-12 image_container">
            <label>{{ meta('banner', getCurrentLocale()) ?? __('stores.banner') }} </label>
            <input id="banner_thumbnail" class="banner_thumbnail" type="hidden" name="banner" value="{{old("banner", $store->banner ?? "")}}"/>

            <div class="photos banner_photo {{ old('banner', $store->banner ?? '') ? ' wow fadeInUp' : 'hide' }}">
                <div class="col-md-4">
                    <div class="items">
                        <div class="img">
                            <a href="#" id="lfm" data-input=".banner_thumbnail" data-preview=".banner_holder" class="lfm" data-hide=".banner_button">
                                <img src="{{asset(old('banner', $store->banner ?? ''))}} "  id="banner_holder" class="banner_holder"/>
                            </a>
                        </div>
                        <a href="#" class="showHide resetImage close" data-empty=".banner_thumbnail" data-hide=".banner_photo" data-show=".banner_button"><i class="fas fa-times"></i></a>
                    </div>
                </div>
            </div>

            <div class="clearfix"></div>
            <span class="input-group-btn banner_button {{ old('banner', $store->banner ?? '') ? 'hide' : '' }} ">
                <a id="lfm"  data-input=".banner_thumbnail" data-preview=".banner_holder" data-show=".banner_photo" data-hide=".banner_button" class="lfm btn btn-primary text-light">
                    <i class="fas fa-camera-retro"></i> Choose
                </a>
             </span>
        </div>
          <div class="col-md-12"><input type="hidden" name="latlng" id="latlng" value="@if($store ?? ''  && $store->id){{$store->latlng}}@endif">
						 <div id="address-canvas">
						     <div id="map" style=" height: 400px;border: 1px solid #000;"></div>
						     </div>
                             
						</div>
     <div class="text-center mt-5 col-12">
            <button class="butn"><span>{{ __('dashboard.save') }}</span></button>
        </div>
    </form>
@else
<h1>لم يتم انشاء متجر بعد</h1>
@endif
</div>

@endsection

@section('inner_js')
{{--<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>--}}
<script src="{{asset('assets/admin/js/lib/Chart.min.js')}}"></script>

<script type="text/javascript">

window.onload = function() {
    var latlng = new google.maps.LatLng({!! $store ?? ''  && $store->id ? $store->latlng : '21.4989, 39.2509' !!});
    var map = new google.maps.Map(document.getElementById('map'), {
        center: latlng,
        zoom: 11,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: 'Set lat/lon values for this property',
        draggable: true
    });
    google.maps.event.addListener(marker, 'dragend', function(a) {
        console.log(a);
        var div = document.createElement('div');
        div.innerHTML = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4);
        document.getElementsByTagName('body')[0].appendChild(div);
         $("#latlng").val(function() {
    return  div.innerHTML;

    
});

    });
    
};

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else { 
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}

function showPosition(position) {
    
   
    var latlng = new google.maps.LatLng(position.coords.latitude , position.coords.longitude);
      $("#mylatlng").val(function() {
    return  latlng;

    
});
    var map = new google.maps.Map(document.getElementById('map'), {
        center: latlng,
        zoom: 11,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: 'Set lat/lon values for this property',
        draggable: true
    });
    google.maps.event.addListener(marker, 'dragend', function(a) {
        console.log(a);
        var div = document.createElement('div');alert(div);
        div.innerHTML = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4);
       
        

    });
}

</script>
<script>
    function categoryselect(elem){
        var num = $(elem).val();
        
        
        $.ajax({
          url : {!! json_encode(url(getCurrentLocale().'/admin/categorymodel/')) !!}+'/'+num,
          type : 'GET',
          data : 'nothing',
          success:function(data)
          {
            $('#models').html(data);
          }
        }) 
    }
</script>


{{--<script>--}}
{{--    new Chart(document.getElementById("chartjs-4"), {--}}
{{--        "type": "doughnut",--}}
{{--        "data": {--}}
{{--            "labels": ["completed Profiles", "uncompleted Profiles", "waiting Approval"],--}}
{{--            "datasets": [{--}}
{{--                "label": "My First Dataset",--}}
{{--                "data": [180, 90, 120],--}}
{{--                "backgroundColor": ["rgb(33, 255, 13)", "rgb(220, 53, 69)", "rgb(21, 97, 203)"]--}}
{{--            }]--}}
{{--        }--}}
{{--    });--}}
{{--</script>--}}

@endsection