@extends('home')
@section('styles')
  {!! Html::style(Theme::current()->assetPath.'/jquery.filer/css/jquery.filer.css') !!}
  {!! Html::style(Theme::current()->assetPath.'/jquery.filer/css/themes/jquery.filer-dragdropbox-theme.css') !!}
@endsection
@section('content')
  <!-- Main Container -->
  {!! Form::open(array('route' => ['admin.product.update',$product->id],'method' => 'put' ,'files' => true ,'class' => 'form-horizontal form-bordered ','id' => 'form-horizontal')) !!}
  <!-- END eCommerce Product Edit Header -->
  <!-- Product Edit Content -->
  <div class="row">
    <div class="col-lg-7">
      <!-- General Data Block -->
      <div class="block">
        <!-- Forum Tabs Title -->
        <div class="block-title">
          <ul class="nav nav-tabs" data-toggle="tabs">
            @foreach (config('translatable.locales') as $lang => $language)
              <li @if ($loop->first) class="active" @endif>
                <a href="#tab_1_{{$lang}}" data-toggle="tab">
                  <img src="{{ asset('images/'.$language.'.png')}}" />
                  {{$language}}
                </a>
              </li>
            @endforeach
          </ul>
        </div>
        <!-- END Forum Tabs -->
        <!-- Tab Content -->
        <div class="tab-content">
          @foreach (config('translatable.locales') as $lang => $language)
            <div class="tab-pane @if ($loop->first) active @endif" id="tab_1_{{$lang}}" >
              <div class="block-section">
                <div class="form-group">
                  <div class="col-md-4">
                    <input type="text" id="lang_title" name="lang_title[{{$language}}]" class="form-control" value="Title" placeholder="Item title..">
                  </div>
                  <div class="col-md-8">
                    <div class="input-icon right">
                      <input type="text" value="{{ @$product->translate($language)->title }}" class="form-control" name="title[{{$language}}]" required />
                    </div>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-md-4 control-label" for="short">
                    {{ __('Short Description') }}
                  </label>
                  <div class="col-md-8">
                    <textarea id="short" name="short[{{$language}}]" class="form-control" rows="3"></textarea>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-md-12">
                    <input type="text" id="lang_content" name="lang_content[{{$language}}]" class="form-control" value="Description" placeholder="{{ __('Enter Description') }}..">
                  </div>
                  <div class="col-md-12">
                    <div class="input-icon right">
                      <textarea name="content[{{$language}}]" rows="10" class="form-control" id="my-editor-{{$language}}">{{ @$product->translate($language)->content }}</textarea>
                    </div>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-md-12">
                    <input type="text" id="lang_technical" name="lang_technical[{{$language}}]" class="form-control" value="{{ __('Technical Description') }}" placeholder="{{ __('Technical Description') }}..">
                  </div>
                  <div class="col-md-12">
                    <div class="input-icon right">
                      <textarea name="technical[{{$language}}]" rows="10" class="form-control" id="my-technical-{{$language}}">{{ @$product->translate($language)->technical }}</textarea>
                    </div>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-md-12">
                    <input type="text" id="lang_other" name="lang_other[{{$language}}]" class="form-control" value="{{ __('Other Description') }}" placeholder="{{ __('Other Description') }}..">
                  </div>
                  <div class="col-md-12">
                    <div class="input-icon right">
                      <textarea name="other[{{$language}}]" rows="10" class="form-control" id="my-other-{{$language}}">{{ @$product->translate($language)->other }}</textarea>
                    </div>
                  </div>
                </div>

              </div>
            </div>
          @endforeach
        </div>
      </div>
      <div class="block">
        <div class="block-title">
          <h2><i class="fa fa-picture-o"></i> <strong>Upload</strong> Images</h2>
        </div>
        <div class="block-section">
          <input type="file" name="files[]" id="filer_input2" multiple="multiple">
        </div>
      </div>
    </div>
    <div class="col-lg-5">
      <div class="block">
        <!-- Billing Address Title -->
        <div class="block-title">
          <h2>{{ __('Price') }}</h2>
          <div class="block-options pull-right">
            <div class="btn-toolbar ">
              <div class="btn-group">

                <button name="submit" value="save" type="submit" class="btn btn-primary" data-toggle="tooltip" title="save & close"><i class="fa fa fa-floppy-o"></i></button>
                <button name="submit" value="copy" type="submit" class="btn btn-primary" data-toggle="tooltip" title="copy & New"><i class="fa fa-clipboard"></i></button>
                <a href="#" class="btn btn-primary" data-toggle="tooltip" title="save"><i class="fa fa-check"></i></a>
                <a href="#" data-toggle="tooltip" title="Cancel" class="btn btn-primary" data-original-title="Delete"><i class="fa fa-times"></i></a>
                <a href="#" data-toggle="tooltip" title="Delete" class="btn btn-danger " data-original-title="Delete"><i class="fa fa-trash-o"></i></a>
                <a href="#" target="_blank" class="btn btn-primary">{{ __('Preview') }} <i class="fa fa-location-arrow"></i></a>
              </div>
            </div>
          </div>
        </div>
        <table class="table table-bordered table-striped table-vcenter">
          <tbody>
            <tr>
              <td align="center">

                @if ($product->image)
                  <img id="holder" style="max-width: 100%" src="{{ path_img($product->image) }}" />
                @else
                  <img id="holder" style="max-width: 100%" src="{{ asset('images/no-image.png') }}" />
                @endif
              </td>
            </tr>
            <tr>
              <td class="text-center">
                <div class="input-group">
                  <span class="input-group-btn">
                    <a id="lfm" data-input="thumbnail" data-preview="holder" class="btn btn-primary">
                      <i class="fa fa-picture-o"></i> {{__('Choose Image')}}
                    </a>
                  </span>
                  <input readonly id="thumbnail" class="form-control" type="text" name="image" value="{{ $product->image }}" >
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="block">
        <!-- Billing Address Title -->
        <div class="block-title">
          <h2>{{ __('Price') }}</h2>
          <div class="block-options pull-right">
          </div>
        </div>
        <div class="form-group no-padding">
          <label class="col-md-4 control-label" for="product-price">{{ __('Balance') }}</label>
          <label class="col-md-4 control-label" for="product-price">{{ __('Discount') }}</label>
          <label class="col-md-4 control-label" for="product-price">{{ __('Percent') }}</label>
          <div class="col-md-4">
            <div class="input-group">
              <div class="input-group-addon">EGP</div>
              <input value="{{ $product->price }}" type="number" id="product-price" name="price" class="form-control" placeholder="0,00">
            </div>
          </div>
          <div class="col-md-4">
            <div class="input-group">
              <div class="input-group-addon">EGP</div>
              <input value="{{ $product->discount }}" type="number" id="product-offer" name="offer" class="form-control" placeholder="0,00">
            </div>
          </div>
          <div class="col-md-4">
            <div class="input-group">
              <div class="input-group-addon">%</div>
              <input type="number" id="product-percent" name="percent" class="form-control" placeholder="0">
            </div>
          </div>
        </div>
      </div>
      <div class="block">
        <!-- Billing Address Title -->
        <div class="block-title">
          <h2>{{ __('Colors') }}</h2>
          <div class="block-options pull-right">
          </div>
        </div>
        <div class="form-group">
          <div class="repeater">
            <div data-repeater-list="color-list">
              @foreach ($product->color as $key => $color)
                <div data-repeater-item>
                  <div class="form-group">
                    <label class="col-md-3 control-label">{{ __('color') }}</label>
                    <div class="col-md-6 ">
                      <div class="input-group input-colorpicker">
                        <input type="text"  name="color" class="form-control color-picker" value="{{ $color->color }}">
                        <span class="input-group-addon"><i></i></span>
                      </div>
                    </div>
                    <div class="col-md-3 ">
                      <span data-repeater-delete class="btn btn-danger btn-sm">
                        <span class="glyphicon glyphicon-remove"></span> Delete
                      </span>
                    </div>
                  </div>
                </div>
              @endforeach

            </div>
            <div class="form-group">
              <div class="col-sm-offset-1 col-sm-11">
                <span data-repeater-create class="btn btn-info btn-md">
                  <span class="glyphicon glyphicon-plus"></span> Add
                </span>
              </div>
            </div>
            <hr/>
          </div>
        </div>
      </div>
      <div class="block">
        <!-- Billing Address Title -->
        <div class="block-title">
          <h2>{{ __('Status') }}</h2>
          <div class="block-options pull-right">
          </div>
        </div>
        <table class="table table-borderless table-striped table-vcenter">
          <tbody>
            <tr>
              <td class="text-right"><strong>{{ __('Date') }}</strong></td>
              <td>{{ \Carbon\Carbon::createFromTimeStamp(strtotime($product->created_at))->diffForHumans() }}</td>
            </tr>
            <tr>
              <td class="text-right"><strong>{{ __('Created At') }}</strong></td>
              <td>{{ $product->created_at->format('d M Y - H:i:s') }}</td>
            </tr>
            <tr>
              <td class="text-right"><strong>{{ __('Last Update') }}</strong></td>
              <td>{{ $product->updated_at->format('d M Y - H:i:s') }}</td>
            </tr>
            <tr>
              <td class="text-right"><strong>{{ __('Hits') }}</strong></td>
              <td>{{ $product->hits }}</td>
            </tr>
            <tr>
              <td class="text-right"><strong>{{ __('Published') }}</strong></td>
              <td><label class="switch switch-primary">
                <input type="checkbox" value="1" id="product-status" name="product-status" @if ($product->publish)
                  checked
                @endif ><span></span>
              </label></td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="block full">
        <!-- Navigation Tabs Title -->
        <div class="block-title">
          <ul class="nav nav-tabs" data-toggle="tabs">
            <li class="active"><a href="#general-data"><i class="fa fa-pencil"></i> <strong>General</strong> Data</a></li>
            <li><a href="#meta-data">{{ __('Meta Data') }}</a></li>
          </ul>
        </div>
        <!-- END Navigation Tabs Title -->
        <!-- Navigation Tabs Content -->
        <div class="tab-content">
          <div class="tab-pane active" id="general-data">
            <div class="form-group">
              <label class="col-md-3 control-label" for="product-category">{{ __('Category') }}</label>
              <div class="col-md-9">
                <select class="select-chosen" data-placeholder="{{ __('Select') }}" name="category_id" id="category_id" style="width: 100%;" >
                  @foreach ($parents as $item)
                    <option value='{{ $item->id }}' @if ($item->id == $product->category_id)
                      selected="selected"
                    @endif >
                    @if ($item->depth > 1)
                      {!! str_repeat('-',$item->depth) !!}<i class="fa fa-angle-right" aria-hidden="true"></i>
                    @endif
                    {{ $item->title }}
                  </option>
                @endforeach
              </select>
            </div>
          </div>
          <div class="form-group">
            <label class="col-md-12 control-label" for="product-search-keywords">{{ __('Search Keywords') }} - {{ __('Tags') }}</label>
            <div class="col-md-12">
              <input type="text" id="product-search-keywords" name="product-search-keywords" class="input-tags" placeholder="keyword1, keyword2, keyword3">
            </div>
          </div>
          <div class="form-group">
            <label class="col-md-3 control-label" for="product-id">PID</label>
            <div class="col-md-9">
              <input type="text" id="product-id" name="product-id" class="form-control" value="6825">
            </div>
          </div>
          <div class="form-group">
            <label class="col-md-3 control-label" for="product-link"> link  </label>
            <div class="col-md-9">
              <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-link"></i></div>
                <input type="text" id="product-link" name="product-link" class="form-control" placeholder="product External link..">
              </div>
            </div>
          </div>
        </div>
        <div class="tab-pane" id="meta-data">
          <div class="form-group">
            <label class="col-md-12 control-label" for="product-meta-keywords">{{ __('Meta Keywords') }}</label>
            <div class="col-md-12">
              <input type="text" id="product-meta-keywords" name="product-meta-keywords" class="form-control" placeholder="keyword1, keyword2, keyword3">
            </div>
          </div>
          <div class="form-group">
            <label class="col-md-12 control-label" for="product-meta-description">{{ __('Meta Description') }}</label>
            <div class="col-md-12">
              <textarea id="product-meta-description" name="product-meta-description" class="form-control" rows="6" placeholder="Enter meta description.."></textarea>
              <div class="help-block">115 {{ __('Characters Max') }}</div>
            </div>
          </div>
        </div>
      </div>
      <!-- END Navigation Tabs Content -->
    </div>
  </div>
</div>
<!-- END Product Edit Content -->
{{ Form::close() }}
@endsection
@section('scripts')
  {!! Html::script(Theme::current()->assetPath.'/js/jquery.repeater.js') !!}
  <script>
    $(document).ready(function () {
      'use strict';
      var price = $('#product-price').val();
      var offer = $('#product-offer').val();
      var out = (offer*100/price); //its convert 10 into 0.10
      if (offer != '' && price != '') {
        $('#product-percent').val(100-parseInt(out));
      }else{
        $('#product-percent').val(100-parseInt(out));
      }
      $('.repeater').repeater({
        defaultValues: {
        },
        show: function () {
          $(this).find('.input-colorpicker').colorpicker({format: 'hex',color:'#3a95ac'});
          $(this).slideDown();
        },
        hide: function (deleteElement) {
          // if(confirm('Are you sure you want to delete this element?')) {
          //     $(this).slideUp(deleteElement);
          // }
          $(this).slideUp(deleteElement);
        },
        ready: function (setIndexes) {
        }
      });
      $(document).on("change keyup blur", "#product-percent", function() {
        var price = $('#product-price').val();
        var percent = $('#product-percent').val();
        var out = (percent*price/100); //its convert 10 into 0.10
        if (percent != '' && price != '') {
          $('#product-offer').val((parseInt(price)) - (parseInt(out)));
        }else{
          $('#product-offer').val(parseInt(out));
        }
      });
      $(document).on("change keyup blur", "#product-offer", function() {
        var price = $('#product-price').val();
        var offer = $('#product-offer').val();
        var out = (offer*100/price); //its convert 10 into 0.10
        if (offer != '' && price != '') {
          $('#product-percent').val(100-parseInt(out));
        }else{
          $('#product-percent').val(100-parseInt(out));
        }
      });
    });
  </script>
  {!! Html::script(Theme::current()->assetPath.'/jquery.filer/js/jquery.filer.js') !!}
  {!! Html::script(Theme::current()->assetPath.'/jquery.filer/js/custom.js') !!}
  {!! Html::script( asset('vendor/unisharp/laravel-ckeditor/ckeditor.js') ) !!}
  <script type="text/javascript" charset="utf-8">
    var route_prefix = "{{ url(config('lfm.url_prefix')) }}";
    var options = {
      filebrowserImageBrowseUrl: route_prefix + '?type=Images',
      filebrowserImageUploadUrl: route_prefix + '/upload?type=Images&_token={{csrf_token()}}',
      filebrowserBrowseUrl: route_prefix + '?type=Files',
      filebrowserUploadUrl: route_prefix + '/upload?type=Files&_token={{csrf_token()}}'
    };
    @foreach (config('translatable.locales') as $lang => $language)
      CKEDITOR.replace('my-editor-{{$language}}', options);
    @endforeach
  </script>
  <script>
    {!! \File::get(base_path('vendor/unisharp/laravel-filemanager/public/js/lfm.js')) !!}
    $('#lfm').filemanager('image', {prefix: route_prefix});
    $('#pdf-file').filemanager('files', {prefix: route_prefix});
    $('#pdf-view').filemanager('files', {prefix: route_prefix});
    $('#research-file').filemanager('files', {prefix: route_prefix});
    $('#research-view').filemanager('files', {prefix: route_prefix});
  </script>
@endsection