@extends('admin.layouts.base')

@section('contents')
<div class="loading_disp loading_hide"></div>
<div class="mt5">
    @include('admin.objects.components.facility-tab', ['title' => '施設管理'])
    @include('admin.objects.components.regist-band', ['title' => '施設登録'])
    <form method="POST" action="{{ route('facility-regist') }}" enctype="multipart/form-data" id="enter-off">
    {{ csrf_field() }}
        @include('admin.objects.components.hidden', ['name' => 'not_save_img_id'])
        @include('admin.objects.projects.facility-upload')
        <div class="regist__div mb10">
            @include('admin.objects.components.regist-btn', ['class' => '', 'title' => '登録・保存'])
            <span class="regist__div--facility">画像がない場合、登録・保存ボタンクリックで、新規登録画面が表示されます。</span>
        </div>
    </form>
</div>
@include('admin.objects.projects.modal-map', ['no' => 2])
<script>
    var API_KEY = "AIzaSyAvLqHslDD75YM0_3ZZYv_C9lYVKNLR_i0";
    $(document).on('click', '#image_list .addressToZip', function(){
        var address = "";
        if($('#image_list .address1 option:selected').val() != "") {
            address += $('#image_list .address1 option:selected').text();
        }
        if($('#image_list .address2 option:selected').val() != "") {
            address += $('#image_list .address2 option:selected').text();
        }
        if($('#image_list .address3 option:selected').val() != "") {
            address += $('#image_list .address3 option:selected').text();
        }
        if($('#image_list .address4 option:selected').val() != "") {
            address += $('#image_list .address4 option:selected').text();
        }
        if(address != "") {
            $.ajax({
                url: 'https://maps.googleapis.com/maps/api/geocode/json',
                type: 'GET',
                dataType: 'json',
                data: {
                    key: API_KEY,
                    address: address,
                    language: 'ja'
                }
            }).done(function(data) {
                if (data.status == "OK") {
                    $.each(data["results"][0]["address_components"], function(k, v) {
                        if ($(this)[0]["types"][0] == "postal_code") {
                            $('#image_list .zip').val($(this)[0]["long_name"]);
                        }
                    });
                    $('[name=lat_0]').val(data["results"][0]["geometry"]["location"]["lat"]);
                    $('[name=lng_0]').val(data["results"][0]["geometry"]["location"]["lng"]);
                    $('[name=lat_text]').text(data["results"][0]["geometry"]["location"]["lat"]);
                    $('[name=lng_text]').text(data["results"][0]["geometry"]["location"]["lng"]);
                }
            });
        }
    });

    $(document).on('click', '.zipToAddress', function () {
        var address_name1;
        var address_name2;
        var address_name3;

        var zip = $('[name=zip]').val();
        if(zip == ""){
            zip = $('[name=zip_0]').val();
        }

        if (zip != "") {
            $.ajax({
                url: 'https://maps.googleapis.com/maps/api/geocode/json',
                type: 'GET',
                dataType: 'json',
                data: {
                    key: API_KEY,
                    address: zip,
                    language: 'ja'
                }
            }).done(function (data) {
                if (data.status == "OK") {
                    if (data["results"][0]["address_components"].length == 4) {
                        address_name1 = data["results"][0]["address_components"][2]["long_name"];
                        address_name2 = data["results"][0]["address_components"][1]["long_name"];
                        address_name3 = data["results"][0]["address_components"][3]["long_name"];
                    } else if (data["results"][0]["address_components"].length == 5) {
                        address_name1 = data["results"][0]["address_components"][3]["long_name"];
                        address_name2 = data["results"][0]["address_components"][2]["long_name"];
                        address_name3 = data["results"][0]["address_components"][1]["long_name"];
                    } else if (data["results"][0]["address_components"].length == 7) {
                        address_name1 = data["results"][0]["address_components"][5]["long_name"];
                        address_name2 = data["results"][0]["address_components"][4]["long_name"] + data["results"][0]["address_components"][3]["long_name"];
                        address_name3 = data["results"][0]["address_components"][2]["long_name"];
                    } else {
                        address_name1 = data["results"][0]["address_components"][4]["long_name"];
                        address_name2 = data["results"][0]["address_components"][3]["long_name"] + data["results"][0]["address_components"][2]["long_name"];
                        address_name3 = data["results"][0]["address_components"][1]["long_name"];
                    }

                    $('[name=lat_text]').text(data["results"][0]["geometry"]["location"]["lat"]);
                    $('[name=lng_text]').text(data["results"][0]["geometry"]["location"]["lng"]);
                    $('[name=lat_0]').val(data["results"][0]["geometry"]["location"]["lat"]);
                    $('[name=lng_0]').val(data["results"][0]["geometry"]["location"]["lng"]);
                    console.log(address_name1 + ' : ' + address_name2 + ' : ' + address_name3);
                    $.ajax({
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        type: 'POST',
                        datatype: 'json',
                        url: '/admin/city_name',
                        data: {
                            prefName: address_name1,
                            cityName: address_name2,
                            townName: address_name3
                        }
                    })
                        .done(function (data) { //ajaxの通信に成功した場合
                            var obj = $('[name^=address2_0]');
                            obj.closest(".p-search-common__tbl").find(".filter-list-address3").val("");
                            $(obj).val(data[2]);
                            console.log(obj.find('option:selected').text());
                            if (obj.closest(".p-search-common__tbl").find(".data-list-address2").length > 0) {
                                obj.closest(".p-search-common__tbl").find(".filter-list-address2").val(obj.find('option:selected').text());
                                $('.data-list-address2 li').removeAttr('selected');
                                $('.scroll-address').val("");
                                $('.data-list-address2 li').each(function () {
                                    if ($(this).attr('code') == obj.val()) {
                                        $(this).attr('selected', 'selected')
                                    }
                                });
                            }

                            $('[name^=address1_0] option').removeAttr('selected');
                            $('[name^=address1_0] option').each(function () {
                                if ($(this).val() == data[3]) {
                                    $(this).remove();
                                    $('[name^=address1_0]').prepend('<option selected value="' + data[3] + '">' + address_name1 + '</option>');
                                    $(this).attr('selected', 'selected');
                                }
                            });

                            $(obj).closest(".p-search-common__tbl").find('[name^=address3]').children('option').remove();
                            $(obj).closest(".p-search-common__tbl").find('[name^=address3]').append($('<option>').text('町村を選択').attr('value', ''));
                            if (obj.closest(".p-search-common__tbl").find(".data-list-address3").length > 0) {
                                $(obj).closest(".p-search-common__tbl").find('.data-list-address3').children('li').remove();
                            }

                            $('[name=primary_school_city] option').remove();
                            $('[name=primary_school_city]').append($('<option>').text('町村を選択').attr('value', ''));
                            $('[name=primary_school2_city] option').remove();
                            $('[name=primary_school2_city]').append($('<option>').text('町村を選択').attr('value', ''));
                            $('[name=primary_school3_city] option').remove();
                            $('[name=primary_school3_city]').append($('<option>').text('町村を選択').attr('value', ''));

                            $('[name=secondary_school_city] option').remove();
                            $('[name=secondary_school_city]').append($('<option>').text('町村を選択').attr('value', ''));
                            $('[name=secondary_school2_city] option').remove();
                            $('[name=secondary_school2_city]').append($('<option>').text('町村を選択').attr('value', ''));
                            $('[name=secondary_school3_city] option').remove();
                            $('[name=secondary_school3_city]').append($('<option>').text('町村を選択').attr('value', ''));

                            $('[name^=address3_0] option').remove();
                            $('[name^=address3_0]').append($('<option>').text('町村を選択').attr('value', ''));
                            $(".data-list-address3").append($('<li>').text('町村を選択').attr('code', ''));

                            $.each(data[0], function (row, value) {
                                if (address_name3 == value['name'] ||
                                    (value['name'].indexOf(address_name3) !== -1 &&
                                        (address_name3.length + 3) == value['name'].length &&
                                        value['name'].indexOf('丁目') !== -1)) {
                                    if (address_name3 == value['name']) {
                                        $(obj).closest(".p-search-common__tbl").find('[name^=address3_0]').append($('<option selected>').text(value['name']).attr('value', value['code']));
                                        if (obj.closest(".p-search-common__tbl").find(".data-list-address3").length > 0) {
                                            obj.closest(".p-search-common__tbl").find(".data-list-address3").append($('<li selected="selected">').text(value['name']).attr('code', value['code']));
                                            obj.closest(".p-search-common__tbl").find(".filter-list-address3").val(value['name']);
                                        }
                                    } else {
                                        $(obj).closest(".p-search-common__tbl").find('[name^=address3_0]').append($('<option>').text(value['name']).attr('value', value['code']));
                                        if (obj.closest(".p-search-common__tbl").find(".data-list-address3").length > 0) {
                                            obj.closest(".p-search-common__tbl").find(".data-list-address3").append($('<li>').text(value['name']).attr('code', value['code']));
                                        }
                                    }
                                }
                            });

                            var cityName = $('[name^=address2_0]').children("option:selected").text();
                            var optionCity = '<option value="' + cityName + '">' + cityName + '</option>';

                            $('[name=primary_school_city]').append(optionCity);
                            $('[name=primary_school2_city]').append(optionCity);
                            $('[name=primary_school3_city]').append(optionCity);
                            $('[name=secondary_school_city]').append(optionCity);
                            $('[name=secondary_school2_city]').append(optionCity);
                            $('[name=secondary_school3_city]').append(optionCity);
                        })
                        .fail(function (data) { //ajaxの通信に失敗した場合
                            alert("error!");
                        });
                } else {
                    var obj = $('[name^=address2_0]');
                    $(obj).val("");
                    $('.data-list-address2 li').removeAttr('selected');
                    $('.scroll-address').val("");
                    obj.closest(".p-search-common__tbl").find(".filter-list-address3").val("");
                    $(obj).closest(".p-search-common__tbl").find('[name^=address3_0]').children('option').remove();
                    $(obj).closest(".p-search-common__tbl").find('[name^=address3_0]').append($('<option>').text('町村を選択').attr('value', ''));
                    if (obj.closest(".p-search-common__tbl").find(".data-list-address3").length > 0) {
                        $(obj).closest(".p-search-common__tbl").find('.data-list-address3').children('li').remove();
                    }
                }
            });
        }
    });
</script>
@if (session('message'))
    @include('admin.objects.projects.modal-message')
    <script type="text/javascript">
        window.onload = function(){
            var message = '登録・保存しました。';
            $('#saved_message').text(message);
            openMessageModal();
        };

    </script>
@endif
@endsection