@extends('akun.layout')

@push('stylesheet')
@endpush

@section('content_header')
    <div class="B1tEqd">
        <a x_data-toggle="modal" x_data-href="#ProfileModal" href="{{ route('akun.info') }}">
            <img alt="image" class="img-fluid rounded-circle preview-avatar" 
            src="{{ 
            (   file_exists( 'avatar/'.strtolower( trim(Auth::user()->userid) ).'.jpg') ) ? 
                asset('avatar/'.strtolower( trim(Auth::user()->userid) ).'.jpg') :
                asset('avatar/user-pdam.png')
            }}" style="width:128px; height:128px;"/>
        </a>
    </div>
    <h1 class="x7WrMb">Welcome, {{ Auth::user()->name }}</h1>
    <div class="cmSWBc">Kelola info, profile, dan perusahaan Anda untuk membuat database {{ config('custom.aplikasi') }} menjadi lebih valid</div>
@endsection

@section('content_body')
<section class="dQBdyc">
    <div class="wJpH8c">
        <article class="GIxHAe gd0DBb">
            <div class="  XLK0Od">
                <div class="ahh38c">
                    <div class="ugt2L iDdZmf">
                        <div>
                            <div class="N5YmOc kJXJmd">
                                <header class="mSUZQd">
                                    <div class="jbRlDc">
                                        <h2 class="fnfC4c">Personal Info</h2>
                                        <div class="ISnqu">
                                            <div>Data Informasi User, berisi nama, username beserta perubahan Password</div>
                                        </div>
                                    </div>
                                    <div class="CljqTd">                                        
                                        <div class="fxHFgc">
                                            <figure class="HJOYV HJOYVi12" style="width:96px;height:96px;">
                                                <img class="YPzqGd" src="https://www.gstatic.com/identity/boq/accountsettingsmobile/dataandpersonalization_icon_96x96_cdb6dff2e31ed6745ece4662231bfd48.png">
                                            </figure>
                                        </div>
                                    </div>
                                </header>
                            </div>
                        </div>
                    </div>
                    <div class="ugt2L ul8zCc aK2X8b t97Ap">
                        <div class="cv2gi" role="presentation">
                            <div class="Q5jTGb"></div>
                        </div>
                        <div class="VfPpkd-ksKsZd-XxIAqe">
                            <a href="{{ url('akun/_profile_info') }}" class="VZLjze Wvetm I6g62c N5YmOc kJXJmd">
                                <div class="mtfBU">Kelola data personal anda</div>
                            </a></div>
                    </div>
                </div>
            </div>
        </article>
    </div>
    <div class="wJpH8c">
        <article class="GIxHAe gd0DBb">
            <div class="  XLK0Od">
                <div class="ahh38c">
                    <div class="ugt2L iDdZmf">
                        <div>
                            <div class="N5YmOc kJXJmd">
                                <header class="mSUZQd">
                                    <div class="jbRlDc">
                                        <h2 class="fnfC4c">Data Perusahaan</h2>
                                        <div class="ISnqu">
                                            <div>Berisi Data profile perusahaan Anda</div>
                                        </div>
                                    </div>
                                    <div class="CljqTd">
                                        <div class="fxHFgc">
                                            <figure class="HJOYV HJOYVi14" style="width:96px;height:96px;">
                                                <img class="YPzqGd" src="https://www.gstatic.com/identity/boq/accountsettingsmobile/securitycheckup_yellow_96x96_fb9ce6ca0adfa7738b70107c34b8c6de.png">
                                            </figure>
                                        </div>
                                    </div>
                                </header>
                            </div>
                        </div>
                    </div>
                    <div class="ugt2L ul8zCc aK2X8b t97Ap">
                        <div class="cv2gi" role="presentation">
                            <div class="Q5jTGb"></div>
                        </div>
                        <div class="VfPpkd-ksKsZd-XxIAqe" >
                            <a href="{{ url('akun/_profile_perusahaan') }}" class="VZLjze Wvetm I6g62c N5YmOc kJXJmd">
                                <div class="mtfBU">Kelola data perusahaan Anda</div>
                            </a></div>
                    </div>
                </div>
            </div>
        </article>
    </div>
    <div class="wJpH8c zpCp3">
        <article class="GIxHAe">
            <div class="  XLK0Od XAdKte">
                <div class="ahh38c">
                    <div class="ugt2L">
                        <div>
                            <div class="N5YmOc kJXJmd">
                                <header class="mSUZQd">
                                    <div class="jbRlDc">
                                        <h2 class="ISnqu">
                                            <div>Hanya Anda yang dapat melihat setting user Anda. Anda mungkin juga ingin meninjau pengaturan Anda untuk Aplikasi yang paling sering Anda gunakan. Kami menjaga data Anda pribadi dengan aman.</div>
                                        </h2>
                                    </div>
                                    <div class="CljqTd">
                                        <style nonce="">
                                            .HJOYVi20 {
                                                width: 48px;
                                                height: 48px;
                                            }
                                        </style>
                                        <figure class="HJOYV HJOYVi20" aria-hidden="true"><img class="YPzqGd" src="https://www.gstatic.com/identity/boq/accountsettingsmobile/privacypolicy_icon_48x48_0a9fd77820564aed2e74f410ec577314.png" srcset="https://www.gstatic.com/identity/boq/accountsettingsmobile/privacypolicy_icon_96x96_351d6ca1c27e84c7d2bceaa39e3dcf6d.png 2x, https://www.gstatic.com/identity/boq/accountsettingsmobile/privacypolicy_icon_144x144_a3537a9f47783e5cba6633fe4a174076.png 3x, https://www.gstatic.com/identity/boq/accountsettingsmobile/privacypolicy_icon_192x192_9449079cd232d4eb8e10e7cc9f7f2cb0.png 4x" data-atf="false" data-iml="973.0149999995774"></figure>
                                    </div>
                                </header>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </article>
    </div>
</section>
@endsection

@push('scripts')
    <script src="{{ asset('global_assets/js/plugins/mousewheel/jquery.mousewheel-3.0.6.pack.js') }}"></script>
    <script src="{{ asset('global_assets/js/plugins/media/fancybox.min.js') }}"></script>
    <script src="{{ asset('global_assets/js/plugins/forms/selects/select2.min.js') }}"></script>
    <script src="{{ asset('global_assets/js/plugins/forms/styling/uniform.min.js') }}"></script>
    <script src="{{ asset('global_assets/js/app.js') }}"></script>
    <script type="text/javascript">

        function readURL(input) {

            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    //$('#preview-avatar').attr('src', e.target.result);
                    $('.preview-avatar').attr('src', e.target.result);
                }

                reader.readAsDataURL(input.files[0]);
            }
        }

        function fancy (url) {
            $.fancybox.open({
                autoSize    : false,
                width       : "100%",
                height      : "100%",
                href        : url,
                type        : 'iframe',
                padding     : 5
            });
        }

        var cbpAnimatedHeader = (function() {
            var docElem = document.documentElement,
                    header = document.querySelector( '.navbar-default' ),
                    didScroll = false,
                    changeHeaderOn = 200;
            function init() {
                window.addEventListener( 'scroll', function( e ) {
                    if( !didScroll ) {
                        didScroll = true;
                        setTimeout( scrollPage, 250 );
                    }
                }, false );
            }
            function scrollPage() {
                var sy = scrollY();
                if ( sy >= changeHeaderOn ) {
                    $(header).addClass('navbar-scroll')
                }
                else {
                    $(header).removeClass('navbar-scroll')
                }
                didScroll = false;
            }
            function scrollY() {
                return window.pageYOffset || docElem.scrollTop;
            }
            init();
        })();

        $(document).ready(function() { 
            $('[data-popup="lightbox"]').fancybox({
                autoSize    : false,
                width       : "100%",
                height      : "100%",
                padding     : 5
            });
            $('[data-popup="framebox"]').click(function() {
                var url = $(this).attr('data-href');
                fancy(url);
            });       
            $('.chosen-select-width').select2({
                //minimumResultsForSearch: Infinity
            });

            $('#profile-form').submit(function(e) {
                // console.log('ok');
                var data = new FormData(this);
                $.ajax({
                    url: "{{ url('user/updateProfile') }}",
                    type: 'POST',
                    data: data,
                    contentType: false,
                    cache: false,
                    processData:false,
                })
                .done(function(response) {
                    $('#ProfileModal').modal('hide');
                    window.location.reload(true);
                    //location.reload();
                    console.log(response);
                })
                .fail(function(response) {
                    $('#ProfileModal').modal('hide');
                    console.log(response);
                });
                return false;
            });

            $('#avatar_trigger').click(function(e) {
                $('#avatar').click();
                return false;
            });

            $("#avatar").change(function(e){
                readURL(this);
            });

        });
    </script>    
    <script type="text/javascript">
        $(document).ready(function() {   
            $('div.alert a.link-tab').on('click',function() {
                $('.nav a[href="' +  $(this).attr("href") + '"]').tab('show');
            });   
            $('.form-input-styled').uniform({
                fileButtonClass: 'action btn btn-xs btn-sm bg-primary-400'
            });  
            $('button.btn-update').click(function(e) {
                e.preventDefault();
                var status  = $(this).attr('data-status');
                var desc    = $(this).attr('data-desc');
                $.confirm({
                    title: desc,
                    content: '' +
                    '<form action="" id="updateStatus">' +
                    '<div class="form-group">' +
                    '<label>Keterangan</label>' +
                    '<input type="text" name="keterangan" placeholder="Deskripsi" class="name form-control"/>' +
                    '<input type="hidden" name="status" value="'+status+'" />' +
                    '<div class="form-check-inline pt-3"><label class="form-check-label">'+
                    '<span><input type="checkbox" name="actEmail" value="actEmail" class="form-input-styled" checked=""></span>'+
                    'Send Email</label></div>' +
                    '</div>' +
                    '</form>',
                    buttons: {
                        formSubmit: {
                            text: 'Simpan',
                            btnClass: 'btn-blue btn-sm btn-xs',
                            action: function () {
                                $('form#updateStatus').submit();
                            }
                        },
                        cancel: function () {
                            //close
                        },
                    },
                    onContentReady: function () {
                        // bind to events
                        $('.form-input-styled').uniform({
                            fileButtonClass: 'action btn btn-xs btn-sm bg-primary-400'
                        });

                        this.$content.find('form').on('submit', function (e) {                          
                            e.preventDefault();
                            var $target = $('form#updateStatus'),
                                data        = $target.serializeArray(),
                                block       = $target.closest('body');
                                //console.log(userid);
                                blockui(block);
                                var url = "{{ url('/updateStatus') }}";
                                $.post(url, data)
                                .done( function(response) { 
                                    console.log(response);
                                    $(block).unblock();
                                    if (response.status == true) {
                                        $.alert('Data Berhasil disimpan!');
                                        window.location.reload();
                                        return false;
                                    }
                                    else {
                                        $.alert('Data gagal disimpan!');
                                    }
                                })
                                .fail( function(xhr, textStatus, errorThrown) {
                                    $(block).unblock();
                                    $.alert(xhr.responseText);
                                });
                            e.stopPropagation();
                            return false;                   
                        });
                    }
                });             
                e.stopPropagation();
                return false;
            });
        });
    </script>    
@endpush