https://www.kummlermatter.ch/public/js/base/base_minimal.js

1window.dtc = window.dtc || {};
2
3dtc.startAjaxLoader = function (element) {
4   let $ajaxLoader = jQuery('<div class="ajax-light-loader"></div>'),
5      ajaxInfo = element.data('ajaxinfo');
6   if (ajaxInfo) {
7      $ajaxLoader.append($('<div class="ajax-light-loader-info"><span>' + ajaxInfo + '</span></div>'))
8   }
9   if (!element.children('.ajax-light-loader').length) {
10      element.prepend($ajaxLoader).hide().fadeIn('fast')
11   }
12};
13
14dtc.stopAjaxLoader = function (element) {
15   element.children('.ajax-light-loader').fadeOut('fast', function () {
16      $(this).remove()
17   })
18};
19
20dtc.ajaxForm = function () {
21   jQuery(document).on('submit', 'form.ajax-form:not(.exceptionForm)', function (event) {
22      console.log('base_minimal');
23      event.preventDefault();
24      //update ckeditor instances, is needed else <script> tags did not get sent to server after serializing.
25
26      if (typeof(CKEDITOR) != 'undefined') {
27         for (let instanceName in CKEDITOR.instances) {
28            CKEDITOR.instances[instanceName].updateElement()
29         }
30      }
31
32      let $this = jQuery(this);
33      let dataCallback = $this.attr('data-callback');
34      let dataArguments = $this.attr('data-arguments');
35      let dataHideForm = $this.attr('data-hideform');
36      let dataButtonName = $this.attr('data-button');
37      let dataButtonData = dataButtonName ? 'button=' + dataButtonName : 'button=';
38      jQuery(event.delegateTarget).hide();
39
40      if ($this.attr('data-ajaxloader') == 1) {
41         dtc.startAjaxLoader($this);
42         $('.ajax-light-loader').css('position', 'fixed')
43      }
44      $('.dont-submit').prop('disabled', true);
45      jQuery.ajax({
46         type: 'post',
47         url: $this.attr('action'),
48         data: $this.serialize() + '&' + dataButtonData + '&ajax-request=' + $this.attr('id'),
49         success: function (data) {
50            let $submitBtn = $('#' + dataButtonName);
51            if ($submitBtn.length == 0) {
52               $submitBtn = $this.find('[type="submit"]');
53               if ($submitBtn.length == 0) {
54                  $submitBtn = $('.mainArea [type="submit"]')
55               }
56            }
57
58            //dtc.stopAjaxLoader($this);
59            if (data == 'denied') {
60               //Session ist abgelaufen, muss sich neu anmelden
61               window.location.reload()
62            } else {
63               let obj = jQuery.parseJSON(data);
64
65               //just for registration form todo: separate to own js
66               if (obj.agbForm === 1) {
67
68                  fgs.checkout.processAgb();
69                  //$submitBtn.button('reset')
70                  //dtc.stopAjaxLoader($this)
71
72               } else if (obj.registrationForm === 1) {
73
74                  fgs.checkout.processRegistration();
75
76                  //$submitBtn.button('reset');
77                  dtc.stopAjaxLoader($this)
78
79               } else { //default ajax form behaviour
80                  $this.find('div.alert').html('').hide();
81                  $('.errorSummary').fadeOut(400, function () {
82                     $(this).remove()
83                  });
84                  if (!jQuery.isEmptyObject(obj) && !obj.redirect && !obj.reload && !obj.notify && !obj.empty && !obj.callback && !obj.flash) {
85
86                     let displayErrors = {};
87                     if (obj.error) {
88                        displayErrors = obj.error
89                     } else {
90                        displayErrors = obj
91                     }
92
93                     let fieldName = null;
94                     let $label = null;
95                     let attrid = null;
96                     let labelText = null;
97                     let $yiiField = null;
98                     let $errorSummary = $('<div class="errorSummary" style="position:fixed;top:75px;right:15px;"><span style="color: #fff" class="fa fa-times closeErrorSummary"></span></div>');
99
100                     let hasError = false;
101
102                     jQuery.each(displayErrors, function (index, value) {
103
104                        let selector = '#' + index + '_em_';
105                        if ($submitBtn.attr('data-uniqid')) {
106                           selector = '#' + index + '-' + $submitBtn.data('uniqid') + '_em_'
107                        }
108                        $yiiField = jQuery(selector);
109
110                        if ($yiiField.length > 0) {
111                           $yiiField.html(value).show()
112                        } else {
113                           // this happens in backend
114
115                           fieldName = index.replace('_', '[') + ']';
116                           $yiiField = jQuery('.form-group [name="' + fieldName + '"]');
117
118                           attrid = $yiiField.attr('id');
119

120                           attrid = attrid.replace('MStructurePagedynamic_', '');
121                           jQuery('#' + attrid + '_em_').html(value).show()
122
123                        }
124                        $errorSummary.append('<a href="#' + index + '"><i class="fa fa-fw fa-link"></i> ' + value + '</a>');
125                        hasError = true
126                     });
127
128                     if (hasError) {
129                        //$('body').append($errorSummary);
130                        $errorSummary.find('.closeErrorSummary').one('click', function () {
131                           $errorSummary.fadeOut(400, function () {
132                              $(this).remove()
133                           })
134                        })
135                     }
136                     if (obj.cards) {
137                        // console.log(obj.cards);
138                        $(document).trigger('dynamicpage:errorsummary', [obj.cards])
139                     }
140                     //$submitBtn.button('reset')
141                     dtc.stopAjaxLoader($this)
142                  } else {
143                     if (dataCallback) {
144                        dtc.callFunctionByName(dataCallback, window, dataArguments);
145                        //$submitBtn.button('reset')
146                        dtc.stopAjaxLoader($this)
147                     } else {
148                        //removed caused login error
149                        /*if (obj.dataLayerEvent) {
150                            dataLayer.push(obj.dataLayerEvent);
151                        }*/
152                        if (obj.redirect) {
153                           window.location.href = obj.redirect
154                        } else if (obj.reload) {
155                           window.location.reload()
156                        } else if (obj.notify) {
157                           dtc.notify(obj.notify, obj.type, $this.parent(), obj.fadeIn, obj.fadeOut);
158                           //$submitBtn.button('reset')
159                           dtc.stopAjaxLoader($this);
160                           dataHideForm ? $this.hide() : null
161                        } else if (obj.flash) {
162                           //console.log('flash', obj.flash)
163                           obj.type = obj.type ? obj.type : 'info';
164                           let $flashElement = jQuery('<div id="form-flash-' + $this.attr('id') + '" class="form-flash alert alert-' + obj.type + '" />');
165                           //console.log('flash element: ', $flashElement)
166                           $flashElement.html(obj.flash);
167                           obj.replace = obj.replace ? obj.replace : false;
168                           let flashContainer = obj.el ? $(obj.el) : $this.parent();
169
170                           if (obj.replace) {
171                              flashContainer.replaceWith($flashElement)
172                           } else {
173                              flashContainer.prepend($flashElement)
174                           }
175                           obj.scrolltop = obj.scrolltop ? obj.scrolltop : false;
176                           if (obj.scrolltop) {
177                              $('html, body').animate({scrollTop: 0}, 'slow')
178                           }
179                           //$submitBtn.button('reset')
180                           dtc.stopAjaxLoader($this);
181                           dataHideForm ? $this.hide() : null
182                        } else if (obj.empty) {
183                           //$submitBtn.button('reset')
184                           dtc.stopAjaxLoader($this);
185                           dataHideForm ? $this.hide() : null
186                        } else if (obj.dataCallback) {
187                           dtc.callFunctionByName(obj.callback, window, obj.dataArguments);
188                           //$submitBtn.button('reset')
189                           dtc.stopAjaxLoader($this);
190                           dataHideForm ? $this.hide() : null
191                        } else if (obj.nothing) {
192                           //$submitBtn.button('reset')
193                        } else {
194                           window.location.href = window.location.href
195                        }
196
197                     }
198                  }
199               }
200            }
201         }
202      });
203      $('.dont-submit').prop('disabled', false);
204
205      return false
206   })
207};
208
209function initFullTextSearchAutoComplete(inputId, lang, containerel)
210{
211   var srsites_ =  new Array();
212   var srproducts_ = new Array();
213
214   var elInput = $('#' + inputId);
215
216   $(containerel).append('\
217	<div v-if="sites.length > 0 || products.length > 0" class="searchResults">\n\
218	<div class="mainsearchClose"></div>\n\
219		<div class="searchResultsInner">\n\
220			<div v-if="sites.length > 0" :class="[products.length == 0 ? \'searchResultsSites col-md-12\' : \'searchResultsSites col-md-6 col-sm-12\']"> \n\
221				<div v-for="site in sites" class="sitesContainer">\n\
222					<div class="searchResultTitle">{{site[0].label}}</div>\n\
223					<a v-for="itm in site" :href="itm.path" class="searchResultItm">{{ itm.title }}</a>\n\
224				</div>\n\
225			</div>\n\
226			<div v-if="products.length > 0" :class="[sites.length == 0 ? \'searchResultsProducsts col-md-12\' : \'searchResultsProducsts col-md-6 col-sm-12\']">\n\
227				<div class="searchResultTitle">{{products[0].label}}</div>\n\
228				<a v-for="product in products" :href="product.path" class="searchResultItm">'
229      + '<div class="searchImg" v-bind:style="{backgroundImage: \'url(\' + product.picUrl + \')\'}" ></div>'
230      + '<div class="searchItmRight"><div class="searchProductTitle">{{product.title}}</div>'
231      + '<div class="searchProductPrice hidden">{{product.price}}</div></div></a><div></div></a>\n\
232			</div>\n\
233		</div>\n\
234	</div>');
235
236   var searchresultscontainer = new Vue({
237      el: '.searchResults',
238      data: {  sites: srsites_, products : srproducts_  },
239      mounted: function()
240      {
241
242      },
243      methods: {
244
245      }
246   });
247   var sites = new Array();
248   var products = new Array();
249   var counter = 0;
250   var lastSync = 0;
251   $('#' +inputId).on("input",function() {
252      setTimeout(function(){
253         var myCounter;
254         counter++;
255         myCounter = counter;
256         searchresultscontainer.sites = [];
257         searchresultscontainer.products = [];
258
259         if (elInput.val().length > 1) {
260            if(typeof xhr !== "undefined"){
261               xhr.abort();
262            }
263            var xhr = $.ajax({

264               url: '/' + lang + '/cms/search/search',
265               dataType: 'json',
266               data: { q: $('#' +inputId).val(), type: $('#' +inputId).data('type'), f: 'json' },
267               success: function(data) {
268                  var items;
269                  sites = new Array();
270                  products = new Array();
271                  $(data).each(function( index, value ) {
272                     if(value.sku!=null){
273                        products.push(value);
274
275                     } else {
276                        if(sites[value.label] == undefined ){
277                           sites[value.label] = new Array();
278                        }
279                        sites[value.label].push(value);
280                     }
281                  });
282
283                  var temparr = new Array();
284                  Object.keys( sites ).forEach(function ( name, index ) {
285                     temparr.push(sites[name]);
286                  });
287
288                  if ( myCounter == counter )
289                  {
290                     lastSync = counter;
291                     searchresultscontainer.sites = temparr;
292                     searchresultscontainer.products = products;
293                     window.setTimeout(function() {
294                        var list;
295
296                        // reduce number of running requests
297                        function loadPrices(list)
298                        {
299                           var i, requests, request, limit;
300                           requests = [];
301                           limit = 3;
302                           if ( list.length < limit )
303                           {
304                              limit = list.length;
305                           }
306                           for (i = 0; i < limit; i++)
307                           {
308                              request = loadPrice(list[i]);
309                              if ( request !== null )
310                              {
311                                 requests.push(request);
312                              }
313                           }
314                           if ( requests.length > 0 )
315                           {
316                              list.splice(0, limit);
317                              $.when.apply(undefined, requests)
318                                 .then(function() {
319                                    window.setTimeout(function() {
320                                       loadPrices(list);
321                                    }, 400);
322                                 });
323                           }
324                        }
325
326                        function loadPrice(item)
327                        {
328                           var text, match, item;
329                           text = item.text();
330                           match = text.match(/\[p__(\d+)__\]/);
331                           if ( match !== null )
332                           {
333                              $.ajax({

334                                 url: '/' + lang + '/cms/search/getProductPrice',
335                                 dataType: 'json',
336                                 data: { id: match[1] },
337                                 cache: false
338                              }).done(function(data) {
339                                 if ( typeof data.price !== 'undefined' )
340                                 {
341                                    item.text(data.price).removeClass('hidden');
342                                 }
343                              });
344                           }
345                        }
346
347                        items = $(containerel).find('.searchProductPrice');
348                        list = [];
349                        items.each(function() {
350                           list.push($(this));
351                        });
352                        loadPrices(list);
353                     }, 0);
354                  } else
355                  {
356                     if ( lastSync != counter )
357                     {
358                        searchresultscontainer.sites = temparr;
359                        searchresultscontainer.products = products;
360                     }
361                  }
362               }
363            });
364         }
365      }, 100);
366   });
367
368   $(document).on("click", containerel+" .mainsearchClose", function () {
369      $(containerel+" .searchResults").hide();
370   });
371}
372
373dtc.ajaxForm();
374
375function log(msg, msg2) {
376   if(msg2){
377      msg += msg2;
378   }
379
380   console.log(msg);
381}