https://matras73.ru/js/nestandart_form.js

1
2function showDefaultNestandartForm()
3{
4    return createNestandartForm(null, false, 0, 0, "Íà âûáîð");
5}
6
7function showNestandartFormBase(idgood, idsize, h1, data_name)
8{
9    data_name = data_name || h1;
10    
11    function callback(modal) 
12    {
13        var form = $('form', modal);
14    
15        $('.nestandart-price-row', modal).show();
16    
17        var size_x = $('input[name=size_x]', form);
18        var size_y = $('input[name=size_y]', form);
19        
20        var cached_size = getStorageItem(StorageType.Local, 'nestandart:size', true);
21        
22        if(cached_size)
23        {
24            size_x.val(cached_size.x);
25            size_y.val(cached_size.y);
26        }
27
28        var idgood = $('input[name=idgood]', form).val();
29        
30        var no_size_desc = $('.nestandart-price-row-price', modal).html();
31        
32        function getSizeValue(field, min, max)
33        {
34            var val = field.val();
35            
36            var parent = $(field).closest('.nestandart-form-field');
37            
38            if(val.length === 0)
39                return null;
40
41            val = val ? parseInt(val.trim()) : null;
42
43            if(val >= min && val <= max)
44            {
45                $(parent).removeClass('error');
46                
47                $('.nestandart-form-field-error', parent)
48                    .html("Ðàçìåð äîëæåí áûòü îò " + min + " ñì äî " + max + " ñì");
49            
50                return val;
51            }
52                
53            $(parent).addClass('error');
54            return null;
55        }
56        
57        function setEmptyFormSize(x, y)
58        {
59            $('input[name=nestandart_price]', modal).val(-1);
60            
61            $('.nestandart-price-row > div', modal).removeClass('has-price')
62                .html('Öåíó ðàññ÷èòàåò ìåíåäæåð');
63        
64            $('.opinion-send', modal)
65                .text('Çàêàçàòü ðàñ÷åò');
66            
67            $('.modal-footer', modal)
68                .removeClass('has-vp-ns-buy');
69 
70            $('input[name=phone]', modal).prop('required', true);
71            
72            $('.nestandart-form-user-inputs').show();
73            
74            $('input[name=can_buy]', modal).val(0);
75
76        }
77
78        function calcFunc()
79        {
80            var x = getSizeValue(size_x, 30, 500);
81            var y = getSizeValue(size_y, 30, 500);
82            
83            setStorageItem(StorageType.Local, 'nestandart:size', {x:x, y:y}, true);
84
85            if(x && y)
86            {
87                $.get('/shop/calc_nestandart_ajax.php', {size_x: x, size_y: y, idgood: idgood}, function(res) 
88                { 
89                    $('input[name=can_buy]', modal).val(res.can_buy);
90                    
91                    if(res.can_buy)
92                    {
93                        $('.opinion-send', modal)
94                            .text('Äîáàâèòü â êîðçèíó');
95                        
96                        $('.modal-footer', modal)
97                            .addClass('has-vp-ns-buy');
98                        
99                        $('input[name=phone]', modal)
100                            .prop('required', false);
101                        
102                        $('.nestandart-form-user-inputs').hide();
103                    }
104                    else
105                    {
106                        $('.opinion-send', modal)
107                            .text('Çàêàçàòü ðàñ÷åò')
108                                .removeClass('is-vp-ns-buy');
109                        
110                        $('.modal-footer', modal)
111                            .removeClass('has-vp-ns-buy');
112                        
113                        $('input[name=phone]', modal).prop('required', true);
114                    }
115                        
116                    if(res.price > 0)
117                    {
118                        $('.nestandart-price-row > div', modal).addClass('has-price')
119                             .html('<span>Öåíà çà ðàçìåð ' + x + 'x' + y + ' ñì &mdash;&nbsp;</span><span class=nestandart-price>' + 
120                                price_format(res.price) + '<i class=rub></i><sup>*</sup></span>');
121                     
122                        $('.nestandart-price-info-row', modal).show();
123                        
124                        $('input[name=nestandart_price]', modal).val(res.price);
125                        
126                        $('.opinion-send', modal).prop('disabled', false);
127                    }
128                    else
129                        setEmptyFormSize();
130                })
131            }
132            else
133            {
134                setEmptyFormSize();
135            }
136        }
137
138        $(size_x).keyup(calcFunc);
139        $(size_y).keyup(calcFunc);
140        
141        if(cached_size)
142            calcFunc();
143    }
144    
145    return createNestandartForm(callback, true, idgood, idsize, h1, data_name);
146}
147
148function initializeNsPage(x, y)
149{
150    setStorageItem(StorageType.Local, 'nestandart:size', {x:x, y:y}, true);
151
152    function create_nestandart_links()
153    {
154        $('.catalog .good-item:not(.ns-link-created)').each(function() 
155        {
156            var item = $(this);
157
158            item.addClass('ns-link-created');
159
160            var calc_link = $('<a class=good-item-ns-calc-link href="#">Ðàññ÷èòàòü öåíó ' + x + 'x' + y + '</a>');
161
162            if(item.hasClass('good-tile'))
163                $('.good-mid', item).append(calc_link);
164            else
165                calc_link.insertAfter($('.good-buy-btn', item));
166
167            calc_link.click(function() 
168            {
169                var item = $(this).closest('.good-item');
170

171                var good_name = $('.good-name', item).text();
172
173                showNestandartFormBase(item.attr('data-id'), $('input[name=size]', item).val(), good_name, good_name);
174
175                return false;
176            });
177        });
178    }
179    
180    $('body').on('catalog_ajax_updated', create_nestandart_links);
181    
182    create_nestandart_links();
183}
184
185function showNestandartFormV2()
186{
187
188    var form = $('.vp-main-form, #addtocart-form');
189    
190    var id = $('input[name="id"]', form).val();
191    var idsize = $('select[name="size"]', form).val();
192    
193    var name = $('h1').attr('data-vendor_model') || $('.main-good-name').text();
194    
195    showNestandartFormBase(id, idsize, 
196        $('.vpage h1').text().replace(/(\d+)õ(\d+)/, '').trim(), 
197            name);
198}
199
200function showNestandartFormForGoodId(idgood, idsize, name)
201{
202    function callback(modal) 
203    {
204        var form = $('form', modal);
205    
206        $('.nestandart-price-row', modal).show();
207    
208        var size_x = $('input[name=size_x]', form);
209        var size_y = $('input[name=size_y]', form);
210        
211        var cached_size = getStorageItem(StorageType.Local, 'nestandart:size', true);
212        
213        if(cached_size)
214        {
215            size_x.val(cached_size.x);
216            size_y.val(cached_size.y);
217        }
218
219        var idgood = $('input[name=idgood]', form).val();
220        
221        var no_size_desc = $('.nestandart-price-row-price', modal).html();
222        
223        function getSizeValue(field, min, max)
224        {
225            var val = field.val();
226            
227            var parent = $(field).closest('.nestandart-form-field');
228            
229            if(val.length === 0)
230                return null;
231
232            val = val ? parseInt(val.trim()) : null;
233
234            if(val >= min && val <= max)
235            {
236                $(parent).removeClass('error');
237                
238                $('.nestandart-form-field-error', parent)
239                    .html("Ðàçìåð äîëæåí áûòü îò " + min + " ñì äî " + max + " ñì");
240            
241                return val;
242            }
243                
244            $(parent).addClass('error');
245            return null;
246        }
247        
248        function setEmptyFormSize(x, y)
249        {
250            $('.nestandart-price-row > div', modal).removeClass('has-price')
251                .html('Öåíó ðàññ÷èòàåò ìåíåäæåð');
252        }
253
254        function calcFunc()
255        {
256            var x = getSizeValue(size_x, 30, 500);
257            var y = getSizeValue(size_y, 30, 500);
258            
259            setStorageItem(StorageType.Local, 'nestandart:size', {x:x, y:y}, true);
260
261            if(x && y)
262            {
263                $.get('/shop/calc_nestandart_ajax.php', {size_x: x, size_y: y, idgood: idgood}, function(res) 
264                { 
265                    if(res.price > 0 && res.is_nestandart == 1)
266                    {
267                        $('.nestandart-price-row > div', modal).addClass('has-price')
268                             .html('<span>Öåíà çà ðàçìåð ' + x + 'x' + y + ' ñì &mdash;&nbsp;</span><span class=nestandart-price>' + 
269                                price_format(res.price) + '<i class=rub></i><sup>*</sup></span>');
270                     
271                        $('.nestandart-price-info-row', modal).show();
272                        
273                        $('input[name=nestandart_price]', modal).val(res.price);
274                    }
275                    else
276                        setEmptyFormSize();
277                })
278            }
279            else
280            {
281                setEmptyFormSize();
282            }
283        }
284
285        $(size_x).keyup(calcFunc);
286        $(size_y).keyup(calcFunc);
287        
288        if(cached_size)
289            calcFunc();
290    }
291    
292    createNestandartForm(callback, true, idgood, idsize, name, $('div.vp').attr('data-name'));
293}
294
295function createNestandartForm(callback, show_calc, idgood, idsize, good_name, base_name)
296{
297    var prev_ns_modal = $('#good-nestandart-ask-modal');
298    
299    if(prev_ns_modal.length)
300        prev_ns_modal.remove();
301    
302    var site = window.location.hostname;
303    
304    var src = '<div class="modal fade vp-modal" id=good-nestandart-ask-modal tabindex="-1" role="dialog">' +
305        '<div class="modal-dialog">' +
306            '<div class="modal-content">' +
307                '<div class="modal-header">' +
308                    '<div class="modal-title">Ðàñ÷åò íåñòàíäàðòíîãî ðàçìåðà</div>' +
309                    '<button type="button" class="close-btn" data-dismiss="modal" aria-label="Close"></button>' +
310                '</div>' +
311                '<div class="modal-body">' +
312                    '<form>' +
313                        '<input type="hidden" name="can_buy" value="

3130">' +
314                        '<input type="hidden" name="idsize" value="' + idsize + '">' +
315                        '<input type="hidden" name="idgood" value="' + idgood + '">' +
316                        '<input type="hidden" name="form_type" value="nestandart">' +
317                        '<input type="hidden" name="good_name" value="' + good_name + '">' +
318                        '<input type="hidden" name="nestandart_price" value="-1">' +
319                        (base_name ?
320                        ('<div class="row vp-modal-good-name">' +
321                            '<div class="col-xs-12">' +
322                                base_name +
323                            '</div>' +
324                        '</div>') : '') +
325                        '<div class=row>' +
326                            '<div class="col-xs-6 nestandart-form-field">' +
327                                '<div class=opinion-label>Øèðèíà*</div>' +
328                                '<input type=text name=size_x placeholder="155" required/>' +
329                                '<div class="nestandart-form-field-error"></div>' +
330                            '</div>' +
331                            '<div class="col-xs-6 nestandart-form-field">' +
332                                '<div class=opinion-label>Äëèíà*</div>' +
333                                '<input type=text name=size_y placeholder="200" required/>' +
334                                '<div class="nestandart-form-field-error"></div>' +
335                            '</div>' +
336                        '</div>' +
337                        (show_calc ?
338                        ('<div class="row nestandart-price-row" style="display:none">' +
339                            '<div class="col-xs-12">' +
340                                'Ââåäèòå ðàçìåð, ÷òîáû óâèäåòü öåíó' +
341                            '</div>' +
342                        '</div>' +
343                            '<div class=clear></div>') : '<div class="clear"></div>') +
344                        '<div class=nestandart-form-user-inputs>' +
345                            '<div class=row>' +
346                                '<div class=col-xs-12>' +
347                                    '<div class=opinion-label>Âàø òåëåôîí <font color="#F00">*</font></div>' +
348                                    '<input type=text name=phone placeholder="8-123-456-78-90" required/>' +
349                                '</div>' +
350                            '</div>' +
351                            '<div class=clear></div>' +
352                            '<div class=row>' +
353                                '<div class=col-xs-12>' +
354                                    '<div class=opinion-label>Âàø email</div>' +
355                                    '<input type=text name=email placeholder="[email protected]"/>' +
356                                '</div>' +
357                            '</div>' +
358                            '<div class=clear></div>' +
359                            '<div class=row>' +
360                                '<div class=col-xs-12>' +
361                                    '<div class=opinion-label>Äîïîëíèòåëüíàÿ èíôîðìàöèÿ</div>' +
362                                    '<textarea class=opinion-desc name=msg></textarea>' + getConfidentialAgreementV2(site) +
363                                '</div>' +
364                            '</div>' +
365                            '<div class=clear></div>' +
366                        '</div>' +
367                        '<div class="row nestandart-price-info-row" style="display:none">' +
368                            '<div class=col-xs-12 style="float:none">' +
369                                '* Ýòîò ðàçìåð ìîæíî çàêàçàòü îíëàéí. Íàæìèòå íà êíîïêó "Äîáàâèòü â êîðçèíó"' +
370                            '</div>' +
371                        '</div>' +
372                    '</form>' +
373                '</div>' +
374                '<div class="modal-footer">' +
375                    '<button type="button" class="btn opinion-send" disabled>Çàêàçàòü ðàñ÷åò</button>' + 
376                '</div>' +
377            '</div>' +
378        '</div>' +
379    '</div>';
380    
381    $('body').append(src);
382    
383    loPdForm($('.opinion-send'),$('#good-nestandart-ask-modal'));
384    
385    function override_post_form(form)
386    {
387        var can_buy = parseInt($('#good-nestandart-ask-modal input[name=can_buy]').val());
388        
389        if(can_buy)
390        {
391            location = '/shop/listorder.php?action=additem&size=-15&qnt=1&id=' + idgood  + 
392                '&size_x=' + $('input[name=size_x]', form).val() + '&size_y=' + $('input[name=size_y]', form).val() +
393                    '&phone=' + $('input[name=phone]', form).val() + '&email=' + $('input[name=email]', form).val();
394                    
395            return false;

396        }
397
398        return true;
399    }
400    
401    return createGoodAskForm('#good-nestandart-ask-modal', callback, override_post_form);
402}
403
404function createGoodAskForm(form_name, callback, override_click)
405{
406    var modal = $(form_name);
407    
408    function questionSubmit()
409    {        
410        var form = $('form', modal);
411        
412        var validator = form.validate();
413
414        $.validator.messages.required = 'Çàïîëíèòå ïîëå';
415
416        var validationRes = validator.form();
417
418        if(validationRes)
419        {
420            var need_post_question = true;
421            
422            if(typeof(override_click) === 'function')
423                need_post_question = override_click(form);
424
425            if(need_post_question)
426            {
427                var data = form.serializeArray();
428                
429                //prevent double submit
430                $('.btn.opinion-send').prop('disabled', true);
431                $("#good-nestandart-ask-modal").find("input[type=text], textarea").val("");
432                
433                $.post('/shop/good_question.php', data, function(res) 
434                {
435                    modal.modal('hide');
436                    
437                    callbackFormStatus(res.success, res.message);
438                });
439
440            }
441        }
442    }
443    
444    $('.opinion-send').click(questionSubmit);
445    
446    modal.modal_bring_to_front();
447    
448    var recapcha = modal.find('.recapcha');
449    
450    if(recapcha.length)
451        createRecapcha(recapcha);
452    
453    if(typeof(callback) === 'function')
454        callback(modal);
455    
456    return false;
457}
458
459function showNsCommonForm()
460{
461    $('#common-ns-modal').remove();
462    
463    var site = window.location.hostname;
464    
465    var html = '<div class="modal fade subs-modal" id=common-ns-modal tabindex="-1" role="dialog"> \
466        <div class="modal-dialog"> \
467            <button type="button" class="close-btn" data-dismiss="modal" aria-label="Close"></button> \
468            <div class="modal-content"> \
469                <div class="modal-body"> \
470                    <form class="mm-ns-form"> \
471                        <div class="mm-ns-form-header">Çàêàæèòå áåñïëàòíûé ðàñ÷åò íåñòàíäàðòíîãî ìàòðàñà:</div> \
472                        <div class="mm-ns-form-size-block mm-ns-form-row"> \
473                            <div class="mm-ns-form-size"><span>Øèðèíà<i>*</i></span><input required="" autocomplete="off" type="text" name="size_x"></div> \
474                            <div class="mm-ns-form-size"><span>Äëèíà<i>*</i></span><input required="" autocomplete="off" type="text" name="size_y"></div> \
475                            <div class="mm-file-uploader"> \
476                                <span>Ñëîæíàÿ ôîðìà? Ïðèêðåïèòå ðèñóíîê</span> \
477                                <div class="mm-file-item"> \
478                                    <img src="/i/clip_icon.svg"><span class="file-desc"><span>Ïðèêðåïèòü ôàéë</span> <b></b></span> \
479                                    <input type="file" class="op_file" name="file[]" onchange="return mm_add_file(this)"> \
480                                </div> \
481                            </div> \
482                        </div> \
483                        <div class="mm-ns-form-phone mm-ns-form-row"> \
484                            <div> \
485                                <span>Âàø òåëåôîí<i>*</i></span> \
486                                <input autocomplete="off" type="text" required="" name="phone"> \
487                            </div> \
488                        </div> \
489                        <div class="mm-ns-form-additional mm-ns-form-row"> \
490                            <div> \
491                                <span>Äîïîëíèòåëüíàÿ èíôîðìàöèÿ</span> \
492                                <textarea autocomplete="off" name="additional"></textarea> \
493                                <div class="mm-ns-form-info"> \
494                                    Ïðèñûëàéòå ëþáûå ðàçìåðû, ôîðìû è íàïîëíåíèÿ ñëî¸â. Äåëàåì ìàòðàñû äëÿ ïîäèóìîâ.<br> \
495                                    Ìîæåì èçãîòîâèòü òðåóãîëüíèêè, òðàïåöèè, êðóãëûå è îâàëüíûå ôîðìû. \
496                                </div> \
497                                <button class="mm-ns-form-btn btn" type="submit" disabled>Çàêàçàòü ðàñ÷åò</button>'+ getConfidentialAgreementV2(site) +
498                            '</div> \
499                        </div> \
500                    </form> \
501                </div> \
502            </div> \
503        </div> \
504    </div>';
505
506    $('body').append(html);
507    
508    $('#common-ns-modal .mm-ns-form').submit(function()
509    {
510        mm_ns_form(this, function(res)
511        {
512            if(res)
513                $('#common-ns-modal').modal('hide');
514        });
515        
516        return false;

517    });
518    
519    loPdForm($('.mm-ns-form-btn'), $('.mm-ns-form'));
520    
521    $('#common-ns-modal').modal_bring_to_front();
522}
523
524
525var availible_updload_types = ["image/gif", "image/png", "image/jpg", "image/jpeg", "image/tiff", 
526    "image/jpeg", "image/pjpeg", "application/pdf", "application/msword", "application/vnd.oasis.opendocument.text",
527    "application/vnd.openxmlformats-officedocument.wordprocessingml.document"];
528
529function mm_add_file(sender)
530{
531    var files =  $(sender).prop('files');
532    var item =  $(sender).closest('.mm-file-item');
533    var isOverrideValue = item.hasClass('file-loaded');
534
535    var file = files[0];
536
537    if(availible_updload_types.indexOf(file.type) < 0)
538    {
539           $(sender).val(''); 
540           return false;
541    }
542
543    item.addClass('file-loaded');
544
545    if (file) 
546    {
547       var reader = new FileReader();
548
549       reader.onload = function (event) {
550           $('.file-img img', item).attr('src', event.target.result);
551       };
552
553       reader.readAsDataURL(file);
554    }
555
556    item.find('.file-desc b').html('(' + file.name + ')');
557
558    if(isOverrideValue == false)
559       $(sender).closest('.mm-file-uploader').append(window.uploader_item_html);
560
561    return true;
562}    
563
564function mm_ns_form(sender, res_callback)
565{
566    function ns_form_callback(res)
567    {
568        module_loader.load('bootstrap', function()
569        {
570            callbackFormStatus(res.success, res.title, res.message);
571            
572            if(res_callback)
573                res_callback(res.success);
574        });
575    }
576
577    var form = $(sender).closest('.mm-ns-form');
578
579    var fd = new FormData(form[0]);
580
581    var data = $(form).serialize();
582
583    $(".op_file", form).each(function(index)
584    {
585        fd.append('img-'+index, $(this).prop('files')[0]);
586    }); 
587
588    $.ajax({
589        url: '/shop/mm_ns_calc.php',
590        data: fd,
591        processData: false,
592        contentType: false,
593        type: 'POST',
594        success: function (res) 
595        {
596            ns_form_callback(res);
597        }
598    });
599
600
601    return false;   
602}