var LocGallery = {init: function(storelink){var sl = storelink; document.write('<div class="booking gallery-pp" id="gallery-pp"><div class="container"><h3>Our Shops</h3><form action=""><div class="row"><div class="col-sm-6"><div id="quote_type"><div class="radio active"><label for="quote_locationtype_0"><input type="radio" id="quote_locationtype_0" name="quote[type]" value="Airport" data-desc="an Airport" checked="checked">Airport</label></div><div class="radio" id="rail_select"><label for="quote_locationtype_1"><input type="radio" id="quote_locationtype_1" name="quote[type]" value="Station" data-desc="a Station">Station</label></div></div></div></div><div class="row"><div class="col-sm-4" style="display: none" id="loc-select"><div class="form-group"><label class="control-label">Location</label><div class="btn-group bootstrap-select form-control"><select class="form-control" name="location"><option selected="selected">Select a Shop</option></select></div></div></div><div class="col-sm-4" style="display: none" id="term-select"><div class="form-group"><label class="control-label">Terminal</label><div class="btn-group bootstrap-select form-control"><select class="form-control"><option selected="selected">Select a Terminal</option></select></div></div></div><div class="col-sm-4" style="display: none" id="store-select"><div class="form-group"><label class="control-label">Store</label><div class="btn-group bootstrap-select form-control"><select class="form-control"><option selected="selected">Select a Store</option></select></div></div></div></div><div class="row"><div class="col-sm-12" id="gallery-frame"></div></div></form></div></div>');
    var data = {"airports":{"642":{"locationName":"Toronto Pearson International Airport","id":642}},"terminals":[{"locationName":"Terminal 1 (Arrivals)","id":642},{"locationName":"Terminal 3 (Departures)","id":643}],"stores":[],"hasStations":"0"};

    $('.gallery-pp #quote_type input[type=\'radio\']').on('change', function() {

        $('.gallery-pp #quote_type .radio').removeClass('active');
        $(this).parents('.radio').addClass('active');
        $(this).parents('form').removeClass('rail air');
        var locationType = $(this).val();

        if (locationType == 'Station') {
            $(this).parents('form').addClass('rail');
        } else {
            $(this).parents('form').addClass('air');
        }
    });

    var term = $('#term-select').show();
    var loc = $('#loc-select').show();
    var store = $('#store-select').show();

    var $locSelect = loc.find('select');
    var $termSelect = term.find('select');
    var $storeSelect = store.find('select');

    if (data.hasStations == false) {
        $('#rail_select').hide();
    }

    $.each(data.airports, function(k, v){
        $locSelect.append($('<option>').val(v.id).text(v.locationName));
    });

    $.each(data.terminals, function(k, v){
        $termSelect.append($('<option>').val(v.id).text(v.locationName));
    });

    $.each(data.stores, function(k, v){
        $storeSelect.append($('<option>').val(v.id).text(v.locationName));
    });

    $locSelect.find('option').first().next().attr('selected', 'selected');
    $termSelect.find('option').first().next().attr('selected', 'selected');
    $storeSelect.find('option').first().next().attr('selected', 'selected');

    $(document).ready(function(){
        $locSelect.selectpicker('refresh');
        $termSelect.selectpicker('refresh');
        $storeSelect.selectpicker('refresh');

        if (data.stores.length > 1) {
            fetch('store');
        }else{
            fetch();
        }
    });

    var group = 11;
    var loading = true;


    $('#gallery-pp input[name="quote[type]"]').change(function(){

        ready(false);
        $('#term-select').hide();
        var $locSelect = $('#loc-select select');
        $locSelect.empty();

        var s = $(this);

        $.get('https://www.luggage-storage.com/gallery', {type: s.val(), group: group}, function(data){

            $locSelect.append($('<option>').text('Please select ' + s.data('desc')));

            $.each(data, function(k, v){

                $locSelect.append($('<option>').val(v.id).text(v.locationName));

            });

            $locSelect.selectpicker('refresh');

        }, 'jsonp').error(function(err, terr, serr){console.log(err, terr, serr);});

        $('#loc-select').show();

    });

    $('#loc-select select').change(function(){

        if ($('#gallery-pp input[name="quote[type]"]:checked').val() == 'Airport') {

            $('#term-select').show();
            ready(false);

            $.get('https://www.luggage-storage.com/gallery/get-terminals', {airport: $(this).val(), group: group}, function(data){

                $termSelect.empty();
                $termSelect.append($('<option>').text('Select a Terminal'));

                $.each(data, function(k, v){
                    $termSelect.append($('<option>').val(v.id).text(v.locationName));
                });

                $termSelect.selectpicker('refresh');

            }, 'jsonp');

        }else{
            $('#term-select').hide();
            ready(true);
        }
    });

    $('#term-select select').change(function(){
        ready(true);
    });

    $('#store-select select').change(function(){
        fetch('store');
    });
    var fetch = function(type){
        var specific = false;

        if (type == 'store') {
            var $val = $('#store-select select').val();
            specific = true;
        }else if ($('#gallery-pp input[name="quote[type]"]:checked').val() == 'Airport') {
            var $val = $('#term-select select').val();
            $('#store-select').hide();
        }else{
            var $val = $('#loc-select select').val();
            $('#store-select').hide();
        }
        var $sl = sl;
        $.get('https://www.luggage-storage.com/gallery/get-stores', {location: $val, specific: specific, group: group}, function(data){

            if (data.stores) {

                var grp = $('#store-select').show();

                var select = grp.find('select').empty();
                select.append($('<option>').text('Select a Store'));

                $.each(data.stores, function(k, v){

                    select.append($('<option>').val(v.id).text(v.locationName));
                });

                select.selectpicker('refresh');

                return;

            }

            if ($sl) {
                var sl = $sl.replace('LOCATION_ID', $val);
            }else{
                var sl = null
            }

            var $frame = $('#gallery-frame').empty();
            if (sl){
                $frame.append($('<h4>').html(data.description + '<a href="'+ sl + '"><span>Click store locator map for further info..</span></a>'));
            }else{
                $frame.append($('<h4>').html(data.description));
            }
            var $galleryNav = $('<div class="gall-nav">');
            var $gallery = $('<div class="gall">');
            $.each(data.images, function(k, v){
                $galleryNav.append($('<div><img src="' + v.thumb + '" data-full="' + v.full + '" class="img-responsive"/></div>'));
                $gallery.append($('<div><img src="' + v.full + '" class="img-responsive"/></div>'));
            });

            $frame.append($gallery);
            $frame.append($galleryNav);

            $gallery.slick({
                slidesToShow: 1,
                slidesToScroll: 1,
                arrows: false,
                fade: true,
                asNavFor: '.gall-nav'
            });
            $galleryNav.slick({
                infinite: true,
                slidesToShow: 5,
                slidesToScroll: 1,
                arrows: false,
                asNavFor: '.gall',
                focusOnSelect: true,
                responsive: [
                    {
                        breakpoint: 768,
                        settings: {
                            slidesToShow: 3
                        }
                    }
                ]
            });

        }, 'jsonp');

        return false;
    };

    var ready = function(type) {
        if (type) {

            $('#sub').show();
            fetch();

        }else{
            $('#sub').hide();
            $('#store-select').hide()
        }
    };}};