@extends('admin.layout.layout')

@section('page-level-css')
@endsection

@section('content')
{{-- csrf token --}}
<meta name="csrf-token" content="{{ csrf_token() }}">
{{-- csrf token --}}
<!-- START PAGE-CONTAINER -->
<div class="page-container ">
  <!-- START HEADER -->
  @include('admin.partials.header')
  <!-- END HEADER -->
  <!-- START PAGE CONTENT WRAPPER -->
  <div class="page-content-wrapper ">
    <!-- START PAGE CONTENT -->
    <div class="content sm-gutter">
      <!-- START JUMBOTRON -->
      <div data-pages="parallax">
        <div class="container-fluid p-l-25 p-r-25 sm-p-l-0 sm-p-r-0">
          <div class="inner">
            <!-- START BREADCRUMB -->
            <ol class="breadcrumb sm-p-b-5">
              <li class="breadcrumb-item"><a href="#">Home</a></li>
              <li class="breadcrumb-item active">Create About Us Page</li>
            </ol>
          </div>
        </div>
      </div>
      <!-- END JUMBOTRON -->
      <!-- START CONTAINER FLUID -->
      <div class="container-fluid container-fixed-lg">
        <!-- START ROW -->
        <div class="col-md-12">
          @if ($errors->any())
          <div class="alert alert-danger">
            <button class="close" data-dismiss="alert"></button>
            <ul>
              @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
              @endforeach
            </ul>
          </div>
          @endif
          @if(Session::has('success'))
          <div class="alert alert-success">
            <button class="close" data-dismiss="alert"></button>
            {{Session::get('success')}}
          </div>
          @endif
        </div>

        <div class="card card-default">
          <div class="card-header ">
            <div class="card-title">
              Create About Us Page Information
            </div>
            <div class="tools">
              <a href="javascript:;" class="collapse"></a>
              <a href="#grid-config" data-toggle="modal" class="config"></a>
              <a href="javascript:;" class="reload"></a>
              <a href="javascript:;" class="remove"></a>
            </div>
          </div>
          <div class="card-body">
            @if(!empty($data))
            <form data-parsley-validate method="post"
              action="{{route('about.page.content.update',['id' => $data->id])}}" enctype="multipart/form-data">
              @csrf
              @else
              <form data-parsley-validate method="post" action="{{route('about.page.content.store')}}"
                enctype="multipart/form-data">
                @csrf
                @endif
                {{-- ////////////////////////////////////////////////////////////////////////////////////////////////// --}}
                <div class="card-title">
                  <h4><strong>Create About Us Page Information</strong></h4>
                </div>
                <hr>
                <div class="row">
                  {{-- banner starts --}}
                  <div class="col-md-6">
                    <p>Banner Title</p>
                    <div class="form-group form-group-default required txtOnly">
                      <input class="typeahead form-control sample-typehead" type="text" placeholder="Name" @if( $data &&
                        ($data->banner_title) )
                      value="{{ $data->banner_title }}"
                      @else
                      value="{{ old('banner_title') }}"
                      @endif

                      name="banner_title" required="required">
                    </div>
                  </div>
                  <div class="col-md-6">
                    @if( $data && ($data->banner_image) )
                    <p>Current Banner Image</p>
                    @php
                    $currentBannerImage = json_decode($data->banner_image);
                    @endphp
                    <img src="{{$currentBannerImage->url}}" width="200px;">
                    @endif
                    <p>Banner Image</p>
                    <div class="form-group form-group-default required txtOnly">
                      <input class="typeahead form-control sample-typehead" type="file" placeholder="Name" @if( $data &&
                        ($data->banner_image) )
                      value="{{ $data->banner_image }}"
                      @else
                      required="required"
                      value="{{ old('banner_image') }}"
                      @endif

                      name="banner_image" >
                    </div>
                  </div>
                  {{-- banner ends --}}

                  {{-- Content starts --}}
                  <div class="col-md-6">
                    <p>Content Title</p>
                    <div class="form-group form-group-default required txtOnly">
                      <input class="typeahead form-control sample-typehead" type="text" placeholder="Name" @if( $data &&
                        ($data->content_title) )
                      value="{{ $data->content_title }}"
                      @else
                      value="{{ old('content_title') }}"
                      required="required"
                      @endif

                      name="content_title" >
                    </div>
                  </div>
                  <div class="col-md-6">
                    @if( $data && ($data->content_image) )
                    <p>Current Content Image</p>
                    @php
                    $currentContentImage = json_decode($data->content_image);
                    @endphp
                    <img src="{{$currentContentImage->url}}" width="200px;">
                    @endif
                    <p>Content Image</p>
                    <div class="form-group form-group-default required txtOnly">
                      <input class="typeahead form-control sample-typehead" type="file" placeholder="Name" @if( $data &&
                        ($data->content_image) )
                      value="{{ $data->content_image }}"
                      @else
                      value="{{ old('content_image') }}"
                      required="required"
                      @endif

                      name="content_image" >
                    </div>
                  </div>
                  <div class="col-6">
                    <p>Banner Image Alt Tag</p>
                    <div class="form-group form-group-default">
                      <input class="typeahead form-control sample-typehead" type="text" name="banner_image_alt_tag"
                        placeholder="Banner Image Alt Tag" value=" @if($data && ($data->banner_image_alt_tag) ) {{ $data->banner_image_alt_tag }}  @else  {{ old('banner_image_alt_tag') }}    @endif" />
                    </div>
                  </div>
                  <div class="col-6">
                    <p>Content Image Alt Tag</p>
                    <div class="form-group form-group-default">
                      <input class="typeahead form-control sample-typehead" type="text" name="content_image_alt_tag"
                        placeholder="Content Image Alt Tag" value=" @if($data && ($data->content_image_alt_tag) ) {{ $data->content_image_alt_tag }}  @else  {{ old('content_image_alt_tag') }}  @endif" />
                    </div>
                  </div>
                  <div class="col-12">
                    <p>Content</p>
                    <div class="form-group form-group-default required txtOnly">
                      <textarea class="typeahead form-control sample-typehead" type="text" name="content"
                        placeholder="Content">@if( $data && ($data->description) ){{ $data->description }} @else {{ old('description') }} @endif</textarea>
                    </div>
                  </div>
                  {{-- Content ends --}}

                </div>
                {{-- ////////////////////////////////////////////////////////////////////////////////////////////////// --}}

                {{-- <div class="card-title">
                  <h4><strong>Create Team Information</strong></h4>
                </div> --}}
                <hr>
                <div class="row">
                  {{-- team details --}}
                  <div class="col-md-12">

                    {{-- <button class="btn btn-primary add_field_button">Add Team Members</button> --}}
                    {{-- @php
                    if (!empty($data)) {
                    $teamImages = json_decode($data->team);
                    }else{
                    $teamImages = null;
                    }
                    @endphp
                    @if(!empty($data->team) && count($teamImages) != 0)

                    @foreach( $teamImages as $key => $teamImage )
                    @php
                    // print_r( $teamImage);
                    // die;
                    // $images_array = json_decode($bannerImage['banner_images']);
                    $images = ($teamImage->image_url);

                    @endphp --}}
                    {{-- <div class="input_fields_wrap">
                      <p>Current Team</p>
                      <img src="{{$images->url}}" width="200px;">
                    <p>Team Member Name</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberName[]"
                      value="{{$teamImage->team_member}}">
                    <p>Team Member Designation</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberDesignation[]"
                      value="{{$teamImage->designation}}">
                    <p>Facebook</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberFacebook[]"
                      value="{{$teamImage->facebook}}">
                    <p>Twitter</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberTwitter[]"
                      value="{{$teamImage->twitter}}">
                    <p>LinkedIn</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberLinkedIn[]"
                      value="{{$teamImage->linkedin}}">
                    <p>Instagram</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberInstagram[]"
                      value="{{$teamImage->instagram}}">
                    <p>Google Plus</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberGplus[]"
                      value="{{$teamImage->gplus}}">
                    <p>Team Image</p>
                    <input type="file" class="typeahead form-control sample-typehead" name="teamImages[]">
                    <p>Team Image Name</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamImageName[]"
                      value="{{$teamImage->team_image_name}}">
                    <p>Team Image Alt Tag</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamImageAlttag[]"
                      value="{{$teamImage->team_image_alt_tag}}">
                    <a href="#" class="btn btn-danger remove_field" data-image-key="{{$key}}"
                      data-content-id="{{$data->id}}">Remove</a>
                  </div> --}}
                  {{-- @endforeach --}}
                  {{-- @else --}}
                  {{-- <div class="input_fields_wrap">
                    <p>Team Member Name</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberName[]" value="">
                    <p>Team Member Designation</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberDesignation[]"
                      value="">
                    <p>Facebook</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberFacebook[]"
                      value="">
                    <p>Twitter</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberTwitter[]"
                      value="">
                    <p>LinkedIn</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberLinkedIn[]"
                      value="">
                    <p>Instagram</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberInstagram[]"
                      value="">
                    <p>Google Plus</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamMemberGplus[]" value="">
                    <p>Team Image</p>
                    <input type="file" class="typeahead form-control sample-typehead" name="teamImages[]">
                    <p>Team Image Name</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamImageName[]" value="">
                    <p>Team Image Alt Tag</p>
                    <input type="text" class="typeahead form-control sample-typehead" name="teamImageAlttag[]" value="">
                    
                  </div> --}}
                  {{-- @endif --}}

                </div>
                {{-- <div class="col-12">
                  <p>Team Content</p>
                  <div class="form-group form-group-default required txtOnly">
                    <textarea class="typeahead form-control sample-typehead" type="text" name="team_content"
                      placeholder="Team Content">@if( $data && ($data->description) ){{ $data->description }} @else
                {{ old('description') }} @endif</textarea>
          </div>
        </div> --}}
        {{-- team details --}}

      </div>

    </div>

    <div class="card-title">
      <h4><strong>Seo Details</strong></h4>
    </div>
    <hr>
    <div class="row">
      <div class="col-md-6">
        <p>Title</p>
        <div class="form-group form-group-default required txtOnly">
          <input class="typeahead form-control sample-typehead" type="text" placeholder="Name" @if( $data &&
            ($data->page_title) )
          value="{{ $data->page_title }}"
          @else
          value="{{ old('page_title') }}"
          @endif

          name="page_title" required="required">
        </div>
      </div>
      <div class="col-md-6">
        <p>Author</p>
        <div class="form-group form-group-default required txtOnly">
          <input class="typeahead form-control sample-typehead" type="text" placeholder="Author" @if( $data &&
            ($data->author) )
          value="{{ $data->author }}"
          @else
          value="{{ old('name') }}"
          @endif
          name="author" required="required">
        </div>
      </div>
      <div class="col-md-12">
        <p>Canonical URLS</p>
        <div class="form-group form-group-default required txtOnly">
          <textarea class="typeahead form-control sample-typehead" type="text" name="canonical_url"
            placeholder="Canonical URLS">@if( $data && ($data->canonical_url) ){{ $data->canonical_url }} @else {{ old('canonical_url') }} @endif </textarea>
        </div>
      </div>
      <div class="col-md-12">
        <p>Description</p>
        <div class="form-group form-group-default required txtOnly">
          <textarea class="typeahead form-control sample-typehead" type="text" name="description"
            placeholder="Description">@if( $data && ($data->description) ){{ $data->description }} @else {{ old('description') }} @endif</textarea>
        </div>
      </div>
      <div class="col-md-12">
        <p>Keywords</p>
        <div class="form-group form-group-default required txtOnly">
          <textarea class="typeahead form-control sample-typehead" type="text" name="keywords"
            placeholder="Keywords">@if( $data && ($data->keywords) ){{ $data->keywords }} @else {{ old('keywords') }} @endif</textarea>
        </div>
      </div>

    </div>

    <div class="card-title">
      <h4><strong>Status</strong></h4>
    </div>
    <hr>
    <div class="row">
      <div class="col-md-4">
        <div class="form-group">
          <select class="full-width" data-init-plugin="select2" name="status">
            <option value="1" @if(old('status')==1) selected="selected" @endif>Active</option>
            <option value="2" @if(old('status')==2) selected="selected" @endif>Inactive</option>
          </select>
        </div>
      </div>
      <div class="col-md-8">
        <button class="btn btn-success pull-right" type="submit">Create a Create About Us Pages</button>
      </div>
    </div>
    </form>
  </div>
</div>
<!-- END ROW -->
</div>
<!-- END CONTAINER FLUID -->
</div>
<!-- END PAGE CONTENT -->
@include('admin.partials.footer')
<!-- END COPYRIGHT -->
</div>
<!-- END PAGE CONTENT WRAPPER -->
</div>
<!-- END PAGE CONTAINER -->
@endsection

@section('page-level-js')
<script>
  $(document).ready(function() {
    $("#add").click(function() {
            var lastField = $("#buildyourform div:last");
        var intId = (lastField && lastField.length && lastField.data("idx") + 1) || 1;
        var fieldWrapper = $("<div class=\"fieldwrapper\" id=\"field" + intId + "\"/>");
        fieldWrapper.data("idx", intId);
        var fName = $("<input type=\"file\" class=\"fieldname\" />");
        var imageName = $("<input type=\"text\" class=\"fieldname\" />");
        var imageAltTag = $("<input type=\"text\" class=\"fieldname\" />");
        var removeButton = $("<input type=\"button\" class=\"remove\" value=\"-\" />");
        removeButton.click(function() {
            $(this).parent().remove();
        });
        fieldWrapper.append(fName);
        fieldWrapper.append(imageName);
        fieldWrapper.append(imageAltTag);
        fieldWrapper.append(removeButton);
        $("#buildyourform").append(fieldWrapper);
    });
    $("#preview").click(function() {
        $("#yourform").remove();
        var fieldSet = $("<fieldset id=\"yourform\"><legend>Your Form</legend></fieldset>");
        $("#buildyourform div").each(function() {
            var id = "input" + $(this).attr("id").replace("field","");
            var label = $("<label for=\"" + id + "\">" + $(this).find("input.fieldname").first().val() + "</label>");
            var input;
            switch ($(this).find("select.fieldtype").first().val()) {
                case "checkbox":
                    input = $("<input type=\"checkbox\" id=\"" + id + "\" name=\"" + id + "\" />");
                    break;
                case "textbox":
                    input = $("<input type=\"text\" id=\"" + id + "\" name=\"" + id + "\" />");
                    break;
                case "textarea":
                    input = $("<textarea id=\"" + id + "\" name=\"" + id + "\" ></textarea>");
                    break;    
            }
            fieldSet.append(label);
            fieldSet.append(input);
        });
        $("body").append(fieldSet);
    });
});
$(document).ready(function() {
	var max_fields      = 10; //maximum input boxes allowed
	var wrapper   		= $(".input_fields_wrap"); //Fields wrapper
	var add_button      = $(".add_field_button"); //Add button ID
	
	var x = 1; //initlal text box count
	$(add_button).click(function(e){ //on add input button click
		e.preventDefault();
		if(x < max_fields){ //max input box allowed
			x++; //text box increment
			$(wrapper).append('<div><hr><p>Team Member Name</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberName[]" value=""><p>Team Member Designation</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberDesignation[]" value=""><p>Facebook</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberFacebook[]" value=""><p>Twitter</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberTwitter[]" value=""><p>LinkedIn</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberLinkedIn[]" value=""><p>Instagram</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberInstagram[]" value=""><p>Google Plus</p><input type="text" class="typeahead form-control sample-typehead" name="teamMemberGplus[]" value=""><p>Team Image</p><input type="file" class="typeahead form-control sample-typehead" name="teamImages[]"><p>Team Image Name</p><input type="text" class="typeahead form-control sample-typehead" name="teamImageName[]" value=""><p>Team Image Alt Tag</p><input type="text" class="typeahead form-control sample-typehead" name="teamImageAlttag[]" value=""><a href="#" class="btn btn-danger remove_deal_field">Remove</a></div>'); //add input box
		}
	});


});


$(wrapper).on("click",".remove_deal_field", function(e){ //user click on remove text
		var dataId = $(this).attr('data-content-id');
    var dataKey = $(this).attr('data-image-key');
    
    console.log(dataId);
  //   $.ajax({
  //               url: "{{route('home.page.remove.image')}}",
  //               type: "get",
  //               data: {'dataId' : dataId,'dataKey' : dataKey},
  //               success: function(response) {
  //                   console.log(response);
  //                   var output = JSON.parse(response);
  //                   // if no output than disable the city field
  //                   if (output.length == 0) {
  //                     $('#userCity').attr('disabled','disabled');
  //                   }else{
  //                     $('#userCity').removeAttr('disabled');
  //                   }
  //                   $('#userCity').html(output);
  //               }
  //           })
            e.preventDefault(); $(this).parent('div').remove(); x--;
	// })
});
</script>
@endsection