<!doctype html>
<html class="no-js" lang="en" dir="ltr">
<head>
    {% include "theme::partials/metadata" %}
    {{ asset_add("theme.css", "theme::css/scroll.css") }}

    <link rel="stylesheet" media="screen and (min-device-width: 320px) and (max-device-width: 860px)" href="{{ asset_url("theme::css/hamburgers.css") }}">
</head>
<body>

{% include "theme::partials/navigation" %}

<section class="grid-container first-section-fixer full columns">
    <section class="grid-x">

        <section class="cell fujiInspiring findLens no-padding columns">
            {% include "templates::find-lens/camera" %}
        </section>


    </section>

    <section class="grid-x">
            <section class="aksesoris-section findLens cell heightImg">
                <div class="sizeCenterElm grid-x" id="lensResult">

                </div>
            </section>

        </section>
</section>

{% include "theme::partials/footer" %}
{% include "theme::partials/scripts" %}

<script src="{{ asset_url("theme::js/slider.js") }}"></script>
<script src="{{ asset_url("theme::js/owlc.js") }}"></script>

<script type="text/javascript">
    global();
    $(document).ready(function () {
        
    });

    $('#ajax-content').html('<div class="loader loadernya"> <img src="{{ image('theme::img/loader_seq.gif').url() }}" width="200" height="200" id="loader-img" align="center"></div>');
        $.ajax({
            url: '{{ url("find-lens/camera") }}',
            type: 'get',
            success: function (data) {
                $('#ajax-content').html(data);
                $('#ajax-content').removeClass('loader');
                var lensOption = $(".findLensNext form .lensCategory").length;

                if (lensOption == 5 ) {
                    $(".findLensNext form .lensCategory").css('width','25%');
                }
            },
            error: function () {
                alert("Please try again");
            },
            complete: function () {
                $('.loadingAnim').fadeIn();
            }
        });

    $(document).ready(function () {

        $('.specialBanner').on('click', '.find-next', function(){
            var siurl = $('#cameraType option:selected').attr('value');
            var fullUrl = '{{ url("find-lens") }}/genre';
            var urlgfx = '{{ url("find-lens") }}/genre/'+ siurl +'/';

            $('#ajax-content').html('<div class="loader loadernya"> <img src="{{ image('theme::img/loader_seq.gif').url() }}" width="200" height="200" id="loader-img" align="center"></div>');
            $.ajax({
                url: (siurl == "1") ? urlgfx : fullUrl,
                // url : '{{ url("find-lens") }}/genre/'+ siurl +'/',
                
                type: 'get',
                success: function (data) {
                    $('#ajax-content').html(data);
                    $('#ajax-content').removeClass('loader');
                    var lensOption = $(".findLensNext form .lensCategory").length;

                    if (lensOption == 5 ) {
                        $(".findLensNext form .lensCategory").css('width','25%');
                    }
                },
                error: function () {
                    alert("Please try again");
                },
                complete: function () {
                    $('.loadingAnim').fadeIn();
                }
            });
            
        });

        $('.specialBanner').on('click', '.findGenreNya input', function(){
            var siurl = $('input[type="radio"]:checked').attr('value');
            $('#ajax-content').html('<div class="loader loadernya"> <img src="{{ image('theme::img/loader_seq.gif').url() }}" width="200" height="200" id="loader-img" align="center"></div>');
            $.ajax({
                url: '{{ url("find-lens") }}/sub-genre/' + siurl + '/',
                type: 'get',
                success: function (data) {
                    $('#ajax-content').html(data);
                    $('#ajax-content').removeClass('loader');
                    var lensOption = $(".findLensNext form .lensCategory").length;

                    if (lensOption == 5 ) {
                        $(".findLensNext form .lensCategory").css('width','25%');
                    }
                },
                error: function () {
                    alert("Please try again");
                },
                complete: function () {
                    $('.loadingAnim').fadeIn();
                }
            });
            
        });

        $('.specialBanner').on('click', '.findGenreListNya input', function(){
            var siurl = $('input[type="radio"]:checked').attr('value');
            $('#ajax-content').html('<div class="loader loadernya"> <img src="{{ image('theme::img/loader_seq.gif').url() }}" width="200" height="200" id="loader-img" align="center"></div>');
            $.ajax({
                url: '{{ url("find-lens") }}/genre/'+ siurl +'/',
                type: 'get',
                success: function (data) {
                    $('#ajax-content').html(data);
                    $('#ajax-content').removeClass('loader');
                    var lensOption = $(".findLensNext form .lensCategory").length;

                    if (lensOption == 5 ) {
                        $(".findLensNext form .lensCategory").css('width','25%');
                    }
                },
                error: function () {
                    alert("Please try again");
                },
                complete: function () {
                    $('.loadingAnim').fadeIn();
                }
            });
            
        });

        $('.specialBanner').on('click', '.findLensResultNya input', function(){
            var siurl = $('input[type="radio"]:checked').attr('value');
            $('#lensResult').html('<div class="loader loadernya"> <img src="{{ image('theme::img/loader_seq.gif').url() }}" width="200" height="200" id="loader-img" align="center"></div>');
            $.ajax({
                url: '{{ url("find-lens") }}/result/' + siurl + '/',
                type: 'get',
                success: function (data) {
                    $('#lensResult').html(data);
                    $('#lensResult').removeClass('loader');
                    $('html,body').animate({
                        scrollTop: $('#lensResult').offset().top - 100
                    }, 'fast');
                    var lensOption = $(".findLensNext form .lensCategory").length;

                    if (lensOption == 5 ) {
                        $(".findLensNext form .lensCategory").css('width','25%');
                    }
                },
                error: function () {
                    alert("Please try again");
                },
                complete: function () {
                    $('.loadingAnim').fadeIn();
                }
            });
            
        });
    });

    
</script>
</body>
</html>
