@extends('admin.layouts.app')
@section('title', 'Settings Page')
@push('styles')

<link  rel="stylesheet" href="{{ asset('backend') }}/assets/css/animate_page.css">
<!-- Bootstrap Select Css -->
<link rel="stylesheet" href="{{ asset('backend') }}/assets/plugins/bootstrap-select/css/bootstrap-select.css" />


<style>
    .bootstrap-select.btn-group.show-tick > .btn {
	border: 1px solid #444 !important;
	padding-left: 10px;
}
.bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:active {
	color: #444;
}

.table .thead-light th {
	color: #000;
	font-size: 16px;
}

.form-group .form-line.custom_img {
	border: 1px solid #8a8a8a !important;
}

.form-group .form-line.custom_img {
	border: 1px solid #8a8a8a !important;
	padding: 7px;
}

.img_prev {
	width: 100%;
}
.form-line.custom-sanno {
	border: 1px solid #666;
	padding-left: 10px;
}

</style>

@endpush


@section('admin_content')

<div class="container-fluid">
    <div class="row clearfix">
        <div class="col-lg-12 col-md-12 col-sm-12 mt-4">
            <div class="card">
                <div class="card-header">
                    <h4> Settings </h4>
                </div>
                <div class="card-body">
                    <!-- Nav tabs -->
                    <ul class="nav nav-tabs" role="tablist">
                        <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#banne_icons"> <i class="material-icons">settings</i> Logo / Icons </a></li>
                        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#theme_tools"><i class="material-icons">settings</i> Theme Tools </a></li>
                    </ul>

                    <!-- Tab panes -->
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane in active" id="banne_icons">

                            <div class="row clearfix">

                                <div class="col-lg-12 col-md-12 col-sm-12">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4>Website Logo </small> </h2>
                                        </div>
                                        <div class="card-body">
                                            <form action="{{ route('logo.update',$setting->id) }}" method="POST" enctype="multipart/form-data">
                                                @csrf

                                                <div class="row clearfix" style="margin: auto">
                                                    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                        <label for="email_address_2"><b>Upload logo*</b></label>
                                                    </div>
                                                    <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                        <div class="form-group">
                                                            <div class="form-line custom_img mb-2">
                                                                <input class="file_cus" name="logo"
                                                                type="file" accept="image/*" onchange="loadFile(event)"
                                                                />
                                                            </div>
                                                            <img style="border: 1px solid #ccc" src="{{ asset('uploads/website_logo/'.$setting->logo) }}" width="350" alt="">
                                                        </div>
                                                        <button type="submit" class="btn btn-raised btn-warning text-white m-t-15 waves-effect right mb-3" style="font-weight: 500">UPDATE</button>

                                                        <img class="img_prev" id="output"/>

                                                    </div>

                                                </div>

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

                                <div class="col-lg-12 col-md-12 col-sm-12">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4> Change Fav Icon </small> </h2>
                                        </div>
                                        <div class="card-body">
                                            <form action="{{ route('favicon_icon_update.update',$setting->id) }}" method="POST" enctype="multipart/form-data">
                                                @csrf

                                                <div class="row clearfix" style="margin: auto">
                                                    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                        <label for="email_address_2" style="margin-top:35px"><b>Upload Fav Icon*</b></label>
                                                    </div>
                                                    <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6 mt-4">
                                                        <div class="form-group">
                                                            <div class="form-line custom_img mb-2">
                                                                <input class="file_cus" type="file" name="favicon" accept="image/*" onchange="loadFav(event)">
                                                            </div>
                                                            <img style="border: 1px solid #ccc" src="{{ asset('uploads/website_logo/'.$setting->favicon) }}" width="200" alt="">
                                                        </div>
                                                        <img class="img_prev" id="image_preview"/>

                                                        <button type="submit" class="btn btn-raised btn-warning text-white m-t-15 waves-effect right mb-3" style="font-weight: 500">UPDATE</button>


                                                    </div>
                                                </div>

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

                            </div>

                        </div>

                        <div role="tabpanel" class="tab-pane" id="theme_tools">
                            <div class="col-lg-12 col-md-12 col-sm-12">
                                <div class="card mb-0">
                                    <div class="card-header">
                                        <h4> Header Setting </h2>
                                    </div>
                                    <div class="card-body">

                                        <form action="{{ route('site_title.update',$setting->id) }}" method="POST">
                                            @csrf

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Site Name</b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="site_title" class="form-control" value="{{ $setting->site_title }}" placeholder="Enter Site title">
                                                        </div>
                                                    </div>
                                                    <button type="submit" class="btn btn-raised btn-warning text-white m-t-15 waves-effect right mb-3" style="font-weight: 500">UPDATE</button>
                                                </div>

                                            </div>

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

                                <!-- Footer Settings -->

                                <div class="card mb-0">
                                    <div class="card-header">
                                        <h4> Footer Settings </h2>
                                    </div>
                                    <div class="card-body">

                                        <form action="{{ route('footer_setting.update',$setting->id) }}" method="POST" enctype="multipart/form-data">
                                            @csrf

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Footer text </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="footer_text" class="form-control" value="{{ $setting->footer_text }}" placeholder="Enter Footer Text">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>


                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Footer Logo</b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom_img mb-2">
                                                            <input class="file_cus" name="footer_logo" type="file">
                                                        </div>
                                                        <img style="border: 1px solid #ccc" src="{{ asset('uploads/website_logo/'.$setting->footer_logo) }}" width="300" alt="">
                                                    </div>
                                                </div>
                                                <img class="img_prev" id="output"/>
                                            </div>

                                            <span class="text-dark p-2 mb-4" style="display:block; background:#f6f6f6;font-weight: 600;text-transform:uppercase; font-family: 'Muli',sans-serif;">Footer Address</span>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Mobile </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="phone_number" class="form-control" value="{{ $setting->phone_number }}" placeholder="Enter Phone number">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Email </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="email" name="email" class="form-control" value="{{ $setting->email }}" placeholder="Enter Email">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Address </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="address" class="form-control" value="{{ $setting->address }}" placeholder="Enter Address">
                                                        </div>
                                                    </div>

                                                    <button type="submit" class="btn btn-raised btn-warning text-white m-t-15 waves-effect right mb-3" style="font-weight: 500">UPDATE</button>


                                                </div>
                                            </div>


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

                                <!-- Social Links -->

                                <div class="card mb-0">
                                    <div class="card-header">
                                        <h4> Social Icon </h2>
                                    </div>
                                    <div class="card-body">

                                        <form action="{{ route('social_icon.update',$socialIcon->id) }}" method="POST">
                                            @csrf

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Facebook </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="facebook" class="form-control" placeholder="http://www.facebook.com/">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Twitter </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="twitter" class="form-control" placeholder="http://www.twitter.com/">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Instagram </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="instagram" class="form-control" placeholder="http://www.instagram.com/">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Linkedin </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="linkedin" class="form-control" placeholder="http://www.linkedin.com/">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>



                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Pinterest </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="pinterest" class="form-control" placeholder="http://www.pinterest.com/">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Youtube </b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="youtube" class="form-control"  placeholder="http://www.youtube.com/">

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

                                            <div class="row clearfix" style="margin: auto">
                                                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 form-control-label">
                                                    <label for="email_address_2"><b>Google Plus</b></label>
                                                </div>
                                                <div class="col-lg-5 col-md-5 col-sm-7 col-xs-6">
                                                    <div class="form-group">
                                                        <div class="form-line custom-sanno">
                                                            <input type="text" name="googleplus" class="form-control"  placeholder="http://www.googleplus.com/">

                                                        </div>
                                                    </div>
                                                    <button type="submit" class="btn btn-raised btn-warning text-white m-t-15 waves-effect right mb-3" style="font-weight: 500">UPDATE</button>
                                                </div>
                                            </div>

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

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


@endsection

@push('scripts')
<script>

  var loadFile = function(event) {
    var reader = new FileReader();
    reader.onload = function(){
      var output = document.getElementById('output');
      output.src = reader.result;
    };
    reader.readAsDataURL(event.target.files[0]);
  };


  var loadFav = function(event) {
    var reader = new FileReader();
    reader.onload = function(){
      var output = document.getElementById('image_preview');
      output.src = reader.result;
    };
    reader.readAsDataURL(event.target.files[0]);
  };

</script>
@endpush