https://www.sakaseru.jp/landingpage/business/js/ready-made-items.js?1790241623

1var isAjaxLoading = false; // ajax通信中フラグ
2var itemLimit = 40; // 商品取得数 limit
3var itemOffSet = 0; // 商品取得数 offset
4var verticalOffSetToHideMobileSearchButton = null; // モバイル版検索ボタン非表示TOP位置
5const mobileSearchButtonFadeTime = 300; // モバイル版検索ボタンフェード時間
6const READY_MADE_ITEM_LOCATION_TO_B = 1;
7
8$(function(){
9    // 商品最大数表示
10    getItemTotalCount().then(
11        function(data){
12            $('#total_count').text(data.data.total_count);
13        },
14        function(){}
15    );
16    
17    // 検索表示件数変更
18    $('.color-select,#min_price,#max_price,#scene,#flower_type,#shop_user').change(function(){
19        setSearchedCount();
20    })
21    
22    // もっとみるボタン
23    const url = $.url();
24    $('#button-more').click(function(){
25        var initAjax = getItems(
26            url.param('tag'),
27            url.param('price'),
28            url.param('shop-user-id'),
29            url.param('flower-type'),
30            url.param('min-price'),
31            url.param('max-price'),
32            url.param('delivery-date'),
33            url.param('color'),
34            url.param('scene'),
35            READY_MADE_ITEM_LOCATION_TO_B,
36            url.param('order'),
37            true
38        );
39        initAjax.then(
40            function(data){
41                isAjaxLoading = false;
42                $('.loader').hide();
43                $('#items_wrapper').append(getItemHtml(data.data.items));
44                var totalCount = data.data.total_count;
45                
46                if (totalCount <= 0){
47                    $('#search-error-message').show();
48                }
49                
50                // 表示カウント修正
51                $('#searched_count').text(totalCount);
52                
53                // モバイル用検索ボタン表示切り替え垂直位置取得
54                var buttonMoreOffset = $('#ordermade-flower-section').offset();
55                verticalOffSetToHideMobileSearchButton = buttonMoreOffset.top;
56                
57                // 利便性を考慮し、モバイル用検索ボタン非表示の際は再表示
58                if ($('#search_button_mobile').length && !$('#search_button_mobile').is(':visible')){
59                    $('#search_button_mobile').fadeIn(mobileSearchButtonFadeTime);
60                }
61                
62                itemOffSet += data.data.items.length;
63                if (itemOffSet < totalCount){ // 最後まで読み込んだ判定
64                    $('#button-more').show();
65                }else{
66                    // パラメータが付与され、最後まで読み込まれた際の挙動
67                    if ($.url().attr('query').length > 0){
68                        $('#load-done-button').show();
69                    }
70                }
71            },
72            function(data){}
73        );
74    });
75    
76    // 初期ロード
77    $('#button-more').click();
78    
79    //検索項目表示
80    $('#filter-btn').click(function () {
81        $('.filter-inner').fadeIn();
82        $("#filter-btn,#reset-btn").hide();
83    });
84    
85    // 検索カレンダー設定
86    var today = new Date();
87    var tomorrow = new Date();
88    var datepickerDate = new Date();
89    var diffDays = 1;
90    if ((today.getHours() >= 13)){
91        diffDays = 2;
92    }else{
93        diffDays = 1;
94    }
95    tomorrow.setDate(tomorrow.getDate()+1);
96    datepickerDate.setDate(datepickerDate.getDate()+diffDays);
97    datepickerOrderDefaultDay = null;
98    var paramDeliveryDate = $.url().param('delivery-date');
99    if (paramDeliveryDate){
100        var paramDate = new Date(paramDeliveryDate);
101        datepickerOrderDefaultDay = getFormatedDate(paramDate, '/');
102        $('#calendar-date').val(getFormatedDate(paramDate, '-'));
103    }
104    $("#datepicker").datepicker({
105        onSelect: function (date, obj) {
106            var selectedDate = new Date(date);
107            $('#calendar-date').val(getFormatedDate(selectedDate, '-'));
108            // 件数変更
109            setSearchedCount();
110        },
111        defaultDate: datepickerOrderDefaultDay,
112        beforeShowDay: function(date){
113            var enabled = true;
114            var cssClass = "";
115            var day = date.getDate();

116            var month = date.getMonth(); //0 - 11
117            var year = date.getFullYear();
118            var dayOfWeek = date.getDay();
119            // 今日より前は定休日
120            compareDate = new Date(year, month, day);
121            if (compareDate < today){
122                enabled = false;
123                cssClass = "past";
124            }
125            
126            // 13:00過ぎは明日選択不可能
127            if(today.getHours() >= 13){
128                if(
129                    tomorrow.getFullYear() == compareDate.getFullYear() &&
130                    tomorrow.getMonth() == compareDate.getMonth() &&
131                    tomorrow.getDate() == compareDate.getDate()){
132                    cssClass = "past";
133                    enabled = false;
134                }
135            }
136            return [enabled, cssClass];
137        }
138    });
139    
140    // 検索実行
141    $('#submit_search').click(function(){
142        location.href = getSearchUrl();
143    });
144    
145    // ソート
146    $('#search_sort').change(function(){
147        location.href = getSearchUrl();
148    });
149    
150    // モバイル検索ボタンスクロール表示対応
151    if ($('#search_button_mobile').length){
152        const mobileSearchButtonTop = $('#search_button_mobile').position().top;
153        $(window).scroll(function() {
154            if (
155                verticalOffSetToHideMobileSearchButton != null &&
156                ($(this).scrollTop() + mobileSearchButtonTop) >= verticalOffSetToHideMobileSearchButton
157            ){
158                $('#search_button_mobile').fadeOut(mobileSearchButtonFadeTime);
159            }else{
160                $('#search_button_mobile').fadeIn(mobileSearchButtonFadeTime);
161            }
162        });
163    }
164})
165
166function getItems(tag, price, shopUserId, flowerType, minPrice, maxPrice, deliveryDate, color, scene, locationId, order, isShowLoader)
167{
168    if (!isShowLoader){
169        isShowLoader = false;

170    }
171    if (!order){
172        order = 1;
173    }
174    return $.ajax({
175        url: '/api/ready-made-item/list',
176        type: 'POST',
177        beforeSend: function(){
178            isAjaxLoading = true;
179            if (isShowLoader){
180                $('.loader').show();
181            }
182            $('#button-more').hide();
183        },
184        cache: false,
185        data:{
186            'order' : order,
187            'limit' : itemLimit,
188            'offset' : itemOffSet,
189            'tag' : tag,
190            'price' : price,
191            'shop-user-id' : shopUserId,
192            'flower-type' : flowerType,
193            'min-price' : minPrice,
194            'max-price' : maxPrice,
195            'delivery-date' : deliveryDate,
196            'color' : color,
197            'scene' : scene,
198            'location' : locationId
199        },
200        success: function(){
201        },
202        dataType: 'json'
203    });
204}
205
206function getItemTotalCount()
207{
208    return $.ajax({
209        url: '/api/ready-made-item/list',
210        type: 'POST',
211        beforeSend: function(){
212            isAjaxLoading = true;
213            $('.loader').show();
214            $('#button-more').hide();
215        },
216        cache: false,
217        data:{
218            'location' : READY_MADE_ITEM_LOCATION_TO_B
219        },
220        success: function(){
221        },
222        dataType: 'json'
223    });
224}
225
226function getItemHtml(datas) {
227    var datas = {datas:datas}
228    var compiled = _.template($("#underscore-template-item-list").text());
229    return compiled(datas);
230}
231
232function getSearchUrl(){
233    // urlパラメータ生成
234    var params = {};
235    
236    // ハッシュタグ
237    const url = $.url();
238    var tag = url.param('tag');
239    if (tag){
240        params['tag'] = tag;
241    }
242    
243    params['color'] = [];
244    $('[name="color[]"]:checked').each(function(checkbox) {
245        params['color'].push($(this).val());
246    });
247    params['delivery-date'] = $('#calendar-date').val();
248    params['scene'] = $('#scene').val();
249    params['min-price'] = $('#min_price').val();
250    params['max-price'] = $('#max_price').val();
251    params['shop-user-id'] = $('#shop_user').val();
252    params['flower-type'] = $('#flower_type').val();
253    params['scene'] = $('#scene').val();
254    params['order'] = $('#search_sort').val();
255    
256    // ページ
257    return '/lp/business/ready-made-items?' + decodeURIComponent($.param(params));
258}
259
260function getFormatedDate(date, separater){
261    return date.getFullYear() + separater + (date.getMonth() + 1) + separater + date.getDate();
262}
263
264// 検索結果数値表示切り替え
265function setSearchedCount()
266{
267    var colors = [];
268    $('[name="color[]"]:checked').each(function() {colors.push($(this).val());});
269    getItems(
270        null,
271        null,
272        $('#shop_user').val(),
273        $('#flower_type').val(),
274        $('#min_price').val(),
275        $('#max_price').val(),
276        $('#calendar-date').val(),
277        colors,
278        $('#scene').val(),
279        READY_MADE_ITEM_LOCATION_TO_B,
280        $('#search_sort').val()
281    ).then(
282        function(data){
283            var fromCount = parseInt($('#searched_count').text(), 10);
284            if (isNaN(fromCount)){
285                fromCount = 0;
286            }
287            $('#searched_count').countTo({
288                from: fromCount,
289                to: data.data.total_count,
290                speed:500,
291                formatter: function (value, options) {
292                    var v = value.toFixed(options.decimals);
293                    if (v == '-0') {
294                        v = '0';
295                    }
296                    return v;
297                }
298            });
299        },
300        function(data){}
301    );
302}