@extends('app')
@section('content')
    <script class="jsbin" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <!-- Content Header (Page header) -->



    <section class="content-header">

        <h1>
            Configuration des rapports PDF
        </h1>

        <!--
        <ol class="breadcrumb">
          <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
          <li><a href="#">Examples</a></li>
          <li class="active">Blank page</li>
        </ol>
        -->
    </section>






    <!-- Main content -->
    <section class="content">
        <!-- Messages -->

        @if(Session::has('msgAdd'))
            <div class="box box-success box-solid">
                <div class="box-header with-border">
                    <div class="box-title">
                        <span> <i class="fa fa-check"></i></span>
                        <em>{!! session('msgAdd') !!}</em>
                    </div>
                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="remove">
                            <i class="fa fa-times"></i>
                        </button>
                    </div>
                </div>
            </div>
        @endif

        @if(Session::has('msgLib'))
            <div class="box box-warning box-solid">
                <div class="box-header with-border">
                    <div class="box-title">
                        <span> <i class="fa fa-check"></i></span>
                        <em>{!! session('msgLib') !!}</em>
                    </div>
                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="remove">
                            <i class="fa fa-times"></i>
                        </button>
                    </div>
                </div>
            </div>
        @endif

        @if(Session::has('msgSupprimer'))
            <div class="box box-danger box-solid">
                <div class="box-header with-border">
                    <div class="box-title">
                        <span> <i class="fa fa-check"></i></span>
                        <em>{!! session('msgSupprimer') !!}</em>
                    </div>
                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="remove">
                            <i class="fa fa-times"></i>
                        </button>
                    </div>
                </div>
            </div>
    @endif
    {!! Form::open(['url'=>'configurationPDF/index','files' => true,'enctype'=>'multipart/form-data']) !!}


    <!-- fin messages -->

        <!-- Default box -->
        <div class="box">

            <div class="panel-body">
                <input class="btn btn-flat btn-primary pull-right" type="submit" value="Valider">

                <div class="col-sm-12">
                    <br>
                    <div class="box box-default box-solid">
                        <div class="box-header with-border">
                            <h3 class="box-title">Générale</h3>

                            <div class="box-tools pull-right">

                            </div>
                            <!-- /.box-tools -->
                        </div>
                        <!-- /.box-header -->
                        <div class="box-body" style="">

                            <div class="col-sm-4">
                                <div class="form-group">
                                    <label  class="control-label">Ajouter un logo</label>

                                    <div class="">
                                        <input type="file" id="image" name="image"  class="form-control"  accept=".jpg,.png" onchange="readURL(this);">
                                    </div>

                                    <br><br>
                                    <p id="tips" style="display:none;"><big><i>Veuillez patienter pendant le chargement des données...</i></big></p>
                                </div>
                                @if($configuration != null)
                                    @if($configuration->image != null)
                                        <div class="file-upload-content" id="logo">
                                            <img class="file-upload-image" id="logo_src"  @if($configuration != null) src="{{ asset('/dist/img/'.$configuration->image) }}" @else src="#" @endif width="50%" height="50%"  />
                                            <input class="hidden" name="imageExist" id="imageExist" @if($configuration->image !='' && $configuration->image !=null) value="1" @else value="0" @endif>
                                        </div>
                                        <button type="button" id="vider_logo"  class="btn btn-flat btn-primary pull-right" onclick="viderLogo()">Enlever le logo</button>

                                    @endif
                                @endif
                            </div>

                            <div class="col-sm-4">
                                <div class="form-group">
                                    <label  class="control-label">Ajouter un deuxième logo</label>

                                    <div class="">
                                        <input type="file" id="image2" name="image2"  class="form-control"  accept=".jpg,.png" onchange="readURL2(this);">
                                    </div>

                                    <br><br>
                                    <p id="tips" style="display:none;"><big><i>Veuillez patienter pendant le chargement des données...</i></big></p>
                                </div>
                                @if($configuration != null)
                                    @if($configuration->image2 != null)
                                        <div class="file-upload-content2" id="logo2">
                                            <img class="file-upload-image2" id="logo_src2"  @if($configuration != null) src="{{ asset('/dist/img/'.$configuration->image2) }}" @else src="#" @endif width="50%" height="50%"  />
                                            <input class="hidden" name="imageExist2" id="imageExist2" @if($configuration->image2 !='' && $configuration->image2 !=null) value="1" @else value="0" @endif>
                                        </div>
                                        <button type="button" id="vider_logo2"  class="btn btn-flat btn-primary pull-right" onclick="viderLogo2()">Enlever le logo</button>

                                    @endif
                                @endif
                            </div>
                            <div class="col-sm-4">

                                <label>L'en-tête de page :</label>
                                <textarea max="700" rows="6" class="form-control" name="header" placeholder="L'en-tête de page">{{$configuration->header}}</textarea>


                       <br>
                                <label>Pieds de page :</label>
                                <textarea max="700" rows="6" class="form-control" name="footer" placeholder="Le pied de page">{{$configuration->footer}}</textarea>



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

                    <div class="row">


                    </div>
                </div>


            </div>

        </div>
    {!! Form::close() !!}

    <!-- /.box -->
    </section><!-- /.content -->
    <script>
        function viderLogo(){
            var src=document.getElementById("logo");
            var src_logo=document.getElementById("logo_src");
            var image=document.getElementById("image");
            var imageExist=document.getElementById("imageExist");
            imageExist.value=0;
            var vider_logo=document.getElementById("vider_logo");
            src.className="hidden";
            image.value=null;
            src_logo.src="#";
            vider_logo.className="hidden";
        }
        function viderLogo2(){
            var src=document.getElementById("logo2");
            var src_logo=document.getElementById("logo_src2");
            var image=document.getElementById("image2");
            var imageExist=document.getElementById("imageExist2");
            imageExist.value=0;
            var vider_logo=document.getElementById("vider_logo2");
            src.className="hidden";
            image.value=null;
            src_logo.src="#";
            vider_logo.className="hidden";
        }
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                var img = document.getElementById('image');
                var logo = document.getElementById('logo');
                var image = new Image();
                image = img ;
                image.src=img.src ;
                image.width = 120;
                image.height = 120;
                reader.onload = function(e) {
                    logo.className="file-upload-content";
                    $('.image-upload-wrap').hide();
                    $('.file-upload-image').attr('src', e.target.result);
                    $('.file-upload-content').show();
                    $('.image-title').html(input.files[0].name);
                };
                reader.readAsDataURL(input.files[0]);
            } else {
                removeUpload();
            }
        }
        function readURL2(input) {
            if (input.files && input.files[0]) {
                var reader2 = new FileReader();
                var img = document.getElementById('image2');
                var logo2 = document.getElementById('logo2');
                var image = new Image();
                image = img ;
                image.src=img.src ;
                image.width = 120;
                image.height = 120;
                reader2.onload = function(e) {
                    logo2.className="file-upload-content2";
                    $('.image-upload-wrap').hide();
                    $('.file-upload-image2').attr('src', e.target.result);
                    $('.file-upload-content').show();
                    $('.image-title').html(input.files[0].name);
                };
                reader2.readAsDataURL(input.files[0]);
            } else {
                removeUpload();
            }
        }
        function removeUpload() {
            $('.file-upload-input').replaceWith($('.file-upload-input').clone());
            $('.file-upload-content').hide();
            $('.image-upload-wrap').show();
        }
        $('.image-upload-wrap').bind('dragover', function () {
            $('.image-upload-wrap').addClass('image-dropping');
        });
        $('.image-upload-wrap').bind('dragleave', function () {
            $('.image-upload-wrap').removeClass('image-dropping');
        });
    </script>


@endsection