https://www.businesslocationcenter.de/_assets/019e0a42d66a4f556759…/JavaScript/default.js?1757327883

1////////////////////////////////////////////////////////////////////
2//-------------------------------VARS-----------------------------//
3////////////////////////////////////////////////////////////////////
4var mobileWidth = 667;
5
6// wrappers
7var $filterResultsWrapper = $('#filter-results');
8var $staticFrontpageWrapper = $('#static-frontpage');
9var $selectricWrapper = $('.selectric-wrapper');
10
11var $filterComponent = $('.c-filter');
12
13// buttons tab
14var $btnTab = $('.js-c-filter__btn');
15var $btnIconReset = $('.js-c-filter__btn--reset');
16
17// tabs content wrapper
18var $quickfinderTabContent = $('#quickfinder');
19var $navigatorTabContent = $('#navigator');
20
21$(document).on('click', function (e) {
22    // close Filter on click on main container
23    let container = $('.c-filter__title, .c-filter__tab, .selectric-scroll, .js-selectric');
24    // if the target of the click isn't the container nor a descendant of the container
25    if (!container.is(e.target) && container.has(e.target).length === 0 && $quickfinderTabContent.is('.active')) {
26        $quickfinderTabContent.removeClass('select-open');
27        $selectricWrapper.removeClass('selectric-open');
28        $btnTab.removeClass('active');
29
30        // on mobile
31        if ($(window).width() < mobileWidth) {
32            $filterComponent.removeClass('active');
33            $quickfinderTabContent.removeClass('active').find('.c-filter__tab').slideUp();
34        }
35    } else if (!container.is(e.target) && container.has(e.target).length === 0 && $navigatorTabContent.is('.active')) {
36        $btnTab.removeClass('active');
37        $filterComponent.removeClass('active');
38        $navigatorTabContent.removeClass('active').find('.c-filter__tab').slideUp();
39    }
40});
41
42
43$(document).ready(function () {
44    ////////////////////////////////////////////////////////////////////
45    //-------------------------------VARS-----------------------------//
46    ////////////////////////////////////////////////////////////////////
47
48    const imagePath = document.TYPO3_SITE_PACKAGE_IMAGE_PATH ? document.TYPO3_SITE_PACKAGE_IMAGE_PATH : '/typo3conf/ext/mcq_blc/Resources/Public/Images';
49
50    const numFirstRowElements = 3;
51    const numShowMoreElements = 8;
52
53    var allPages = jQuery.parseJSON(jsonPages);
54    var filtersType = jQuery.parseJSON(jsonFiltersType);
55    var filtersService = jQuery.parseJSON(jsonFiltersService);
56    var filtersSector = jQuery.parseJSON(jsonFiltersSector);
57
58    var currentFilters = new Array();
59    currentFilters['services'] = [];
60    currentFilters['types'] = [];
61    currentFilters['sectors'] = [];
62    var pages = allPages;
63    var pagesFilteredTypeService = allPages;
64    var pagesFilteredServiceSector = allPages;
65    var pagesFilteredSectorType = allPages;
66
67    ////////////////////////////////////////////////////////////////////
68    ////////////////////////////////////////////////////////////////////
69
70
71    // open relative tab on btn-tab
72    $btnTab.on('click', function (e) {
73        //e.stopPropagation();
74
75        let bodyHeight = $('body').height();
76        let $this = $(this);
77        let dataBody = $this.data('body');
78        let $tab = $('#' + dataBody);
79        let $overlay = $('.c-filter__overlay');
80        let $main = $('.c-main');
81
82        $overlay.height(bodyHeight);
83        $main.addClass('u-overflow-hidden');
84        $this.toggleClass('active').siblings().removeClass('active');
85        $('.js-selectric').parent().removeClass('selectric-open')
86
87        if ($this.is('.active') && !$filterComponent.is('.active')) {
88            $filterComponent.addClass('active');
89            $tab.addClass('active').find('.c-filter__tab').slideDown();
90            if ($(window).width() >= mobileWidth) {
91                $('html, body').animate({
92                    scrollTop: $filterComponent.offset().top - 75
93                }, 1000);
94            }
95        } else if (!$this.is('.active') && $filterComponent.is('.active')) {
96            $filterComponent.removeClass('active');
97            $tab.removeClass('select-open active').find('.c-filter__tab').slideUp();
98        } else {
99            $tab.addClass('active').find('.c-filter__tab').show();
100            $tab.siblings().removeClass('select-open active').find('.c-filter__tab').hide();
101        }
102    });
103

104    ////////////////////////////////////////////////////////////////////
105    //-----------------------------home tab---------------------------//
106    ////////////////////////////////////////////////////////////////////
107
108    // reset filter when main filter menu is changed
109    $('#button-home').click(function () {
110        resetCurrentFilters();
111        $filterComponent.removeClass('active');
112        $btnTab.removeClass('active');
113        $quickfinderTabContent.removeClass('select-open active').find('.c-filter__tab').slideUp();
114        $navigatorTabContent.removeClass('active').find('.c-filter__tab').slideUp();
115        hideResultArea();
116    });
117
118    ////////////////////////////////////////////////////////////////////
119    //-----------------------Branches Navigator-----------------------//
120    ////////////////////////////////////////////////////////////////////
121
122    // Branches btn tab
123    $('#button-navigator').click(function () {
124        $('#navigator .c-filter__tab').css('display', 'block');
125    });
126
127    // Branches Filter options
128    $('.js-c-filter__item').click(function () {
129        resetCurrentFilters();
130        var sector = parseInt($(this).data('category'));
131        currentFilters['sectors'].push(sector);
132        pages = findResultsForBranchenNavigatorByFilters();
133        showResultArea();
134        createHtml(1, false);
135
136        if ($(window).width() < mobileWidth) {
137            console.log('mobile');
138            $('html, body').animate({
139                scrollTop: 0
140            }, 1000);
141        }
142
143        $filterComponent.removeClass('active');
144        $('.c-filter__body').removeClass('select-open active').find('.c-filter__tab').slideUp();
145
146        $(this).addClass('active').siblings().removeClass('active');
147        $filterResultsWrapper.show();
148        $staticFrontpageWrapper.hide();
149    });
150
151    // close filter on overlay

152    // $('.js-c-filter__overlay--navigator').click(function(){
153    //     $filterComponent.removeClass('active');
154    //     $navigatorTabContent.removeClass('active').find('.c-filter__tab').slideUp();
155    // });
156
157    ////////////////////////////////////////////////////////////////////
158    //----------------------------Quickfinder-------------------------//
159    ////////////////////////////////////////////////////////////////////
160
161    // Quickfinder btn tab
162    $('#button-quickfinder').click(function () {
163        $('#navigator').removeClass('active');
164        $('#navigator .c-filter__tab').css('display', 'none');
165        resetCurrentFilters();
166        pages = findResultsByFilters();
167        initAllFilters();
168        hideResultArea();
169
170        // uncomment this for showing unfiltered pages (ie. all categorized pages)
171        //showResultArea();
172        //createHtml(1, false);
173    });
174
175    // first action on click on quickfinder tab
176    $('#button-quickfinder').one("click", function () {
177        if ($(window).width() >= mobileWidth) {
178            $('.js-quickfinder-service').addClass('selectric-open');
179            $quickfinderTabContent.addClass('select-open');
180        }
181    });
182
183    // Quickfinder Filter options
184    $('.js-selectric').click(function () {
185        let $this = $(this);
186        $this.parent().toggleClass('selectric-open').siblings().removeClass('selectric-open');
187        $quickfinderTabContent.addClass('select-open');
188        // var hasClass = $(this).parent().hasClass('selectric-open');
189        // $('.js-selectric').parent().removeClass('selectric-open');
190        // if (!hasClass) {
191        //     $(this).parent().addClass('selectric-open');
192        //     $quickfinderTabContent.addClass('select-open');
193        // } else {
194        //     $quickfinderTabContent.removeClass('select-open');
195        // }
196    });
197
198    $('.selectric-scroll li').click(function () {
199        let $this = $(this);
200        $('.js-c-filter__item').removeClass('active');
201        if ($(window).width() < mobileWidth) {
202            $('.js-reset-filter-global').show();
203        } else {
204            $this.parents('.selectric-items').find('.js-reset-filter').show();
205        }
206        if (!$(this).hasClass('disabled')) {
207            var type = getTypeByJqueryFilter($(this)) + 's';
208            var id = getIdByFilterSelector($(this).attr('id'));
209            if (!$(this).hasClass('selected')) {
210                addFilter(type, id);
211                showResultArea();
212                if (type === 'sectors') {
213                    applyFilter();
214                }
215            } else {
216                removeFilter(type, id);
217            }
218            pages = findResultsByFilters();
219            $(this).toggleClass('selected');
220            initAllFilters();
221            createHtml(1, false);
222
223            if ($(window).width() < mobileWidth) {
224                console.log('mobile');
225                $('html, body').animate({
226                    scrollTop: 0
227                }, 1000);
228            }
229        }
230    });
231
232    // close filter on overlay
233    // $('.js-c-filter__overlay--quickfinder').click(function(){
234    //     $quickfinderTabContent.removeClass('select-open');
235    //     $selectricWrapper.removeClass('selectric-open');
236
237    //     // on mobile
238    //     if ($(window).width() < mobileWidth) {
239    //         $filterComponent.removeClass('active');
240    //         $quickfinderTabContent.removeClass('active').find('.c-filter__tab').slideUp();
241    //     }
242    // });
243
244    // reset quickfinder filter
245    $('.js-reset-filter').click(function () {
246        $(this).hide();
247        resetFilter($(this).data('type'));
248    })
249    // on mobile
250    $('.js-reset-filter-global').click(function () {
251        $(this).hide();
252        resetCurrentFilters();
253        pages = findResultsByFilters();
254        initAllFilters();
255        createHtml(1, false);
256    })
257    //----------------------------------------------------------------//
258
259    // apply quickfinder filter
260    $('.js-apply-filter').click(function () {
261        applyFilter();
262    })
263    // on mobile
264    $('.js-apply-filter-global').click(function () {
265        applyFilter();
266        $filterComponent.removeClass('active');
267        $quickfinderTabContent.removeClass('select-open active').find('.c-filter__tab').slideUp();
268        $navigatorTabContent.removeClass('active').find('.c-filter__tab').slideUp();
269    })
270    //----------------------------------------------------------------//
271

272    ////////////////////////////////////////////////////////////////////
273    ////////////////////////////////////////////////////////////////////
274
275    // read more
276    $('#js-more-button').click(function () {
277        var site = parseInt($(this).data('index'));
278        createHtml(site, true);
279    });
280
281    ////////////////////////////////////////////////////////////////////
282    //----------------------functions---------------------------------//
283    ////////////////////////////////////////////////////////////////////
284
285    function resetCurrentFilters() {
286        currentFilters = new Array();
287        currentFilters['services'] = [];
288        currentFilters['types'] = [];
289        currentFilters['sectors'] = [];
290        $('.js-c-filter__item').removeClass('active');
291        $('.js-quickfinder-service li').removeClass('selected');
292        $('.js-quickfinder-type li').removeClass('selected');
293        $('.js-quickfinder-sector li').removeClass('selected');
294        $('.c-filter__reset').hide();
295    }
296
297    function showResultArea() {
298        $staticFrontpageWrapper.hide();
299        $filterResultsWrapper.show();
300    }
301
302    function hideResultArea() {
303        $staticFrontpageWrapper.show();
304        $filterResultsWrapper.hide();
305    }
306
307    function initAllFilters() {
308        initFilter('type', filtersType);
309        initFilter('service', filtersService);
310        initFilter('sector', filtersSector);
311    }
312
313    function addFilter(type, id) {
314        currentFilters[type].push(id);
315    }
316
317    function removeFilter(type, id) {
318        removeItemFromArray(currentFilters[type], id);
319    }
320
321    function removeItemFromArray(arr, item) {
322        for (var i = arr.length; i--;) {
323            if (arr[i] === item) {
324                arr.splice(i, 1);
325            }
326        }
327    }
328
329    function getIdByFilterSelector(filterSelector) {
330        filterSelector = filterSelector.replace('filter-type-', '');
331        filterSelector = filterSelector.replace('filter-service-', '');
332        filterSelector = filterSelector.replace('filter-sector-', '');
333        return filterSelector;
334    }
335
336    function getTypeByJqueryFilter(jqueryFilter) {
337        var type = '';
338        if (jqueryFilter.hasClass('js-filter-type')) {
339            type = 'type';
340        } else if (jqueryFilter.hasClass('js-filter-service')) {
341            type = 'service';
342        } else if (jqueryFilter.hasClass('js-filter-sector')) {
343            type = 'sector';
344        }
345        return type;
346    }
347
348    function initFilter(type, filters) {
349        var filterTitles = [];
350        var partialFiltered = allPages
351        if (type === 'type') {
352            partialFiltered = pagesFilteredServiceSector
353        }
354        if (type === 'service') {
355            partialFiltered = pagesFilteredSectorType
356        }
357        if (type === 'sector') {
358            partialFiltered = pagesFilteredTypeService
359        }
360
361        $.each(filters, function (index, filter) {
362            var numberOfResults = getNumberOfResults(partialFiltered, filter.uid, type, currentFilters);
363
364            var selector = '#filter-' + type + '-' + filter.uid;
365            if (numberOfResults !== 0) {
366                $(selector).removeClass('disabled');
367            } else {
368                $(selector).addClass('disabled');
369            }
370            $(selector + ' .counter').html(numberOfResults);
371            if ($(selector).hasClass('selected')) {
372                filterTitles.push(filter.title);
373            }
374        })
375        var label = filterTitles.join(',');
376        $('#label-' + type).html(label == '' ? $('#label-' + type + '-default').html() : label);
377    }
378
379    function applyFilter() {
380        $quickfinderTabContent.removeClass('select-open');
381        $selectricWrapper.removeClass('selectric-open');
382        showResultArea();
383    }
384
385    function resetFilter(type) {
386        $('.js-quickfinder-' + type + ' li').removeClass('selected');
387        //applyFilter();
388        currentFilters[type + 's'] = [];
389        pages = findResultsByFilters();
390        initAllFilters();
391        if (currentFilters.sectors.length === 0 &&
392            currentFilters.services.length === 0 &&
393            currentFilters.types.length === 0
394        ) {
395            hideResultArea();
396        } else {
397            createHtml(1, false);
398        }
399    }
400
401    function orderPagesByPublishAndCreationDate(pagesToSort) {
402        return pagesToSort.sort(function (a, b) {
403            let dateA = (a.starttime === 0) ? a.crdate : a.starttime;
404            let dateB = (b.starttime === 0) ? b.crdate : b.starttime;
405            return dateB - dateA;
406        });
407    }
408
409    function findResultsByFilters() {
410        var results = new Array();
411        pagesFilteredTypeService = []
412        pagesFilteredSectorType = []
413        pagesFilteredServiceSector = []
414
415        $.each(allPages, function (index, page) {
416            let hasFiltersA = true;
417            let hasFiltersB = true;
418            let hasFiltersC = true;
419
420            if (currentFilters.services.length !== 0) {
421                //standortfaktoren, service
422                hasFiltersA = isAtLeastOneFilterInPageCategory(currentFilters.services, page.services);
423            }
424            if (currentFilters.types.length !== 0) {
425                //typ, type
426                hasFiltersB = isAtLeastOneFilterInPageCategory(currentFilters.types, page.types);
427            }
428            if (currentFilters.sectors.length !== 0) {
429                //branchen, sector
430                hasFiltersC = isAtLeastOneFilterInPageCategory(currentFilters.sectors, page.sectors);
431            }
432            if (hasFiltersA && hasFiltersB && hasFiltersC) {
433                results.push(page);
434            }
435
436            if (hasFiltersA && hasFiltersB) {
437                pagesFilteredTypeService.push(page);
438            }
439            if (hasFiltersB && hasFiltersC) {
440                pagesFilteredSectorType.push(page);
441            }
442            if (hasFiltersC && hasFiltersA) {
443                pagesFilteredServiceSector.push(page);
444            }
445
446        });
447        //console.log(results)
448        //return orderPagesByPublishAndCreationDate(results);
449        return orderPagesAsInPageTree(results);
450    }
451
452    function findResultsForBranchenNavigatorByFilters() {
453        var results = new Array();
454        $.each(allPages, function (index, page) {
455            var hasFilters = true;
456
457            if (currentFilters.sectors.length !== 0) {
458                hasFilters = areAllFiltersInPageCategories(currentFilters.sectors, page.sectors);
459                if (hasFilters) {
460                    if (page.showInBranchenNavigatorResults) {
461                        results.push(page);
462                    }
463                }
464            }
465        });
466
467        //return orderPagesAsInMenu(results);
468        return orderPagesAsInPageTree(results);
469    }
470
471    function _toConsumableArray(arr) {
472        if (Array.isArray(arr)) {
473            let arr2 = Array(arr.length);
474            for (let i = 0; i < arr.length; i++) {
475                arr2[i] = arr[i];
476            }
477            return arr2;
478        } else {
479            return Array.from(arr);
480        }
481    }
482
483    // Provide tree-like data structure in order to implement tree-based sorting of pages
484    // Acknowledgements: https://blog.benoitvallon.com/data-structures-in-javascript/the-tree-data-structure/
485
486    // Hint: id needs to be unique in order to add node
487
488    function _node(id, data) {
489        this.id = id;       // our node id
490        this.data = data;   // our payload
491        this.children = [];
492    }
493

494    function _tree() {
495        this.root = null;
496    }
497
498    _tree.prototype.add = function (id, data, targetNodeId) {
499        let parent = targetNodeId ? this.find(targetNodeId) : null;
500        let node = new _node(id, data);
501
502        if (!this.contains(id)) {
503            // parent available?
504            if (parent) {
505                parent.children.push(node);
506            } else {
507                // try to assign root
508                if (!this.root) {
509                    return this.root = node;
510                } else {
511
512                    return null;
513                }
514            }
515        }
516    };
517
518    _tree.prototype.remove = function (id) {
519        if (this.root.id === id) {
520            this.root = null;
521        }
522
523        let queue = [this.root];
524        while (queue.length) {
525            let node = queue.shift();
526            for (let i = 0; i < node.children.length; i++) {
527                if (node.children[i].id === id) {
528                    node.children.splice(i, 1);
529                } else {
530                    queue.push(node.children[i]);
531                }
532            }
533        }
534    };
535
536    _tree.prototype.contains = function (id) {
537        return this.find(id) ? true : false;
538    };
539
540    _tree.prototype.find = function (id) {
541        let queue = this.root !== null ? [this.root] : [];
542        while (queue.length) {
543            let node = queue.shift();
544            if (node.id === id) {
545                return node;
546            }
547            for (let i = 0; i < node.children.length; i++) {
548                queue.push(node.children[i]);
549            }
550        }
551        return null;
552    };
553
554    _tree.prototype._preOrder = function (node, fn) {
555        if (node) {
556            if (fn) {
557                fn(node);
558            }
559            for (let i = 0; i < node.children.length; i++) {
560                this._preOrder(node.children[i], fn);
561            }
562        }
563    };
564
565    _tree.prototype.traverse = function (fn) {
566        let current = this.root;
567        this._preOrder(current, fn);
568    };
569
570    function orderPagesAsInPageTree(pages) {
571        let pageTree = new _tree();
572
573        // build page tree
574        for (let i = 0; i < pages.length; i++) {
575            let page = pages[i];
576            // add all ancestor nodes
577            for (let n = 0; n < page['uidTree'].length; n++) {
578                let parentId = (n !== 0 ? page['uidTree'][n - 1]['uid'] : null);
579                pageTree.add(page['uidTree'][n]['uid'], {sorting: page['uidTree'][n]['sorting'], page: null}, parentId);
580            }
581            // add ourselves to tree
582            if (!pageTree.contains(page['uid'])) {
583                pageTree.add(page['uid'], {sorting: page['sorting'], page: page}, page['pid']);
584            } else {
585                let pageNode = pageTree.find(page['uid']);
586                pageNode.data = {sorting: page['sorting'], page: page};
587            }
588        }
589
590        // order tree by using sorting value property
591        pageTree.traverse(function (node) {
592            if (node.children.length > 1) {
593                node.children.sort(function (a, b) {
594                    return a.data['sorting'] - b.data['sorting'];
595                })
596            }
597        });
598
599        // 'flatten' tree to simple array/list
600        let orderedPages = [];
601        pageTree.traverse(function (node) {
602            // leave out "empty" nodes
603            if (node.data['page']) {
604                orderedPages.push(node.data['page']);
605            }
606        });
607
608        return orderedPages;
609    }
610
611    function orderPagesAsInMenu(pages) {
612        let orderedArray = [];
613        let groupNodesToPages = {};
614        let tmpArray = [];
615
616        // populate group node list (same tree paths are grouped together)
617        for (let i = 0; i < pages.length; i++) {
618            let page = pages[i];
619            let groupKey = 'group_' + page['uidTree'].join('-');
620            if (groupNodesToPages[groupKey]) {
621                // add page to existing key (group node)
622                groupNodesToPages[groupKey]['pages'].push({uid: page['uid'], sorting: page['sorting']});
623            } else {
624                // create new entry
625                groupNodesToPages[groupKey] = {
626                    pid: page['pid'],
627                    level: page['uidTree'].length,
628                    pages: [{uid: page['uid'], sorting: page['sorting']}]
629                };
630            }
631        }
632
633        // sort pages for group nodes
634        let listKeys = Object.keys(groupNodesToPages);
635        for (let i = 0; i < listKeys.length; i++) {
636            let groupKey = listKeys[i];
637            // sort containing pages using "sorting" property
638            groupNodesToPages[groupKey]['pages'] = groupNodesToPages[groupKey]['pages'].sort(function (a, b) {
639                return a.sorting - b.sorting;
640            });
641            tmpArray.push(groupNodesToPages[groupKey]);
642        }
643        // sort group nodes by their level within the tree
644        tmpArray = tmpArray.sort(function (a, b) {
645            return a.level - b.level;
646        });
647
648        //create list of uid in the right order
649        let indexAfterParent = 0;
650        for (let i = 0; i < tmpArray.length; i++) {
651            if (orderedArray.length === 0) {
652                orderedArray.push.apply(orderedArray, _toConsumableArray(tmpArray[0]['pages'].map(function (item) {
653                    return item.uid;
654                })));
655            } else {
656                indexAfterParent = orderedArray.indexOf(tmpArray[i]['pid']) + 1;
657                orderedArray.splice.apply(orderedArray, [indexAfterParent, 0].concat(_toConsumableArray(tmpArray[i]['pages'].map(function (item) {
658                    return item.uid;
659                }))));
660            }
661        }
662
663        //add prop 'menuTopDownWeigth' to pages with respective weight
664        for (let i = 0; i < pages.length; i++) {

665            pages[i]['menuTopDownWeigth'] = orderedArray.indexOf(pages[i].uid);
666        }
667
668        //order and return pages
669        return pages.sort(function (a, b) {
670            return a.menuTopDownWeigth - b.menuTopDownWeigth;
671        });
672    }
673
674
675    function areAllFiltersInPageCategories(filters, pageCategories) {
676        var hasFilters = false;
677        $.each(filters, function (index, filter) {
678            hasFilters = false;
679            $.each(pageCategories, function (index, pageCategory) {
680                if (parseInt(filter) === pageCategory) {
681                    hasFilters = true;
682                }
683            });
684            if (!hasFilters) {
685                return false;
686            }
687        });
688        return hasFilters;
689    }
690
691    function isAtLeastOneFilterInPageCategory(filters, pageCategories) {
692        var isCategoryFound = false
693        $.each(filters, function (index, filter) {
694            $.each(pageCategories, function (index, pageCategory) {
695                if (parseInt(filter) === pageCategory) {
696                    isCategoryFound = true
697                    return
698                }
699            })
700            if (isCategoryFound === true) {
701                return
702            }
703        })
704        return isCategoryFound
705    }
706
707    function getNumberOfResults(pages, id, type) {
708        var numberOfResults = 0;
709        $.each(pages, function (index, page) {
710            var pageCategories = getPageCategoriesByType(page, type);
711            $.each(pageCategories, function (index, pageCategory) {
712                if (pageCategory === id) {
713                    numberOfResults++;
714                }
715            });
716        });
717        return numberOfResults;
718    }
719
720    function getPageCategoriesByType(page, type) {
721        var filterElements = [];
722        if (type === 'type') {
723            filterElements = page.types;
724        } else if (type === 'service') {
725            filterElements = page.services;
726        } else if (type === 'sector') {
727            filterElements = page.sectors;
728        }
729        return filterElements;
730    }
731
732    function createHtml(site, showMoreContent) {
733        // reset
734        if (site == 1) {
735            $('#filter-results > div').eq(0).html('');
736        }
737
738        // services
739        var services = '';
740        services += '<div class="o-layout__item o-layout__item--teaser-grid teaser-services">';
741        services += '<div class="c-services">';
742        services += $('.c-services').first().html();
743        services += '</div>';
744        services += '</div>';
745
746        var start = (site - 1) * numShowMoreElements;
747        start = site === 1 ? start : start + numFirstRowElements;
748
749        var end = start + numShowMoreElements;
750        end = site === 1 ? end + numFirstRowElements : end;
751        end = end > pages.length ? pages.length : end;
752
753        var page = new Array();
754        var html = '';
755        var noImage = true;
756
757        for (i = start; i < end; i++) {
758            page = pages[i];
759            var theme_class = page.theme != 0 ? " u-theme u-theme-color-" + page.theme : "";
760            var img_align_class = page.teaserimgalign != 0 ? " pos-" + page.teaserimgalign : "";
761            html += '<div class="o-layout__item o-layout__item--teaser-grid">';
762            html += '<a href=" ' + page.url + '" target="blc-content-tab" class="c-teaser-main' + theme_class + '">';
763            noImage = true;
764            if (page.image != '' && typeof (page.image) != "undefined") {
765                noImage = false;
766                html += '<div class="c-teaser-main__img' + img_align_class + '" style="background-image: url(' + page.image + ')">';
767                html += '<img src="' + page.image + '" alt="">';
768                html += '<div class="c-block-icon c-block-icon--white bottom-right">';
769                html += '<svg class="c-icon"><use xlink:href="' + imagePath +  '/icons-sprite.svg#link_arrow"></use></svg>';
770                html += '</div>';
771                html += '</div>';
772            }
773            if (page.image != '' && typeof (page.image) == "undefined") {

774                html += '<div class="c-teaser-main__body u-padding-top-big">';
775            } else {
776                html += '<div class="c-teaser-main__body">';
777            }
778            html += getPageIcon(page, noImage);
779            if (typeof (page.parentTitle) != "undefined" && page.parentTitle.trim() !== '') {
780                html += '<span class="c-label u-margin-bottom-tiny">' + page.parentTitle.trim() + '</span>';
781            }
782            html += '<h3 class="u-margin-bottom-small">' + page.title.trim() + '</h3>';
783            html += '<p class="u-margin-none">' + page.abstract.trim() + '</p>';
784            html += '</div>';
785            if (page.image != '' && typeof (page.image) == "undefined") {
786                html += '<div class="c-block-icon c-block-icon--white top-right">';
787                html += '<svg class="c-icon"><use xlink:href="' + imagePath +  '/icons-sprite.svg#link_arrow"></use></svg>';
788                html += '</div>';
789            }
790            html += '</a>';
791            html += '</div>';
792
793            if (i === 1 || pages.length === 1) {
794                html += pages.length === 1 ? '<div class="o-layout__item o-layout__item--teaser-grid"></div>' : '';
795                html += services;
796            }
797        }
798
799        // handle show more button
800        if (end != pages.length) {
801            $('#js-more-button').data('index', site + 1);
802            $('#js-more-button').show();
803        } else {
804            $('#js-more-button').hide();
805        }
806
807        // append content
808        $('#filter-results > div').eq(0).eq(0).append(html);
809
810        if (!showMoreContent) {
811            $filterResultsWrapper.hide();
812            $filterResultsWrapper.fadeIn('slow');
813        }
814    }
815
816    function getPageIcon(page, noImage) {
817        var html = noImage ? '<div class="c-teaser-main__icon c-teaser-main__icon—noimage c-block-icon c-block-icon--white">' : '<div class="c-teaser-main__icon">';
818        var icon = parseInt(page.icon);
819
820        switch (icon) {
821            case 1:
822                html += '<svg class="c-icon c-icon--contact">';
823                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#contact"></use>';
824                html += '</svg>';
825                break;
826            case 2:
827                html += '<svg class="c-icon">';
828                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#article"></use>';
829                html += '</svg>';
830                break;
831            case 3:
832                html += '<svg class="c-icon">';
833                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#graph"></use>';
834                html += '</svg>';
835                break;
836            case 4:
837                html += '<svg class="c-icon">';
838                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#info"></use>';
839                html += '</svg>';
840                break;
841            case 5:
842                html += '<svg class="c-icon">';
843                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#type-download"></use>';
844                html += '</svg>';
845                break;
846            case 6:
847                html += '<svg class="c-icon-service">';
848                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#pin"></use>';
849                html += '</svg>';
850                break;
851            case 7:
852                html += '<svg class="c-icon-service">';
853                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#box"></use>';
854                html += '</svg>';
855                break;
856            case 8:
857                html += '<svg class="c-icon-service">';
858                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#map"></use>';
859                html += '</svg>';
860                break;
861            case 9:
862                html += '<svg class="c-icon-service">';
863                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#contact_service"></use>';
864                html += '</svg>';
865                break;
866            case 10:
867                html += '<svg class="c-icon">';
868                html += '<use xlink:href="' + imagePath +  '/icons-sprite.svg#type-press"></use>';
869                html += '</svg>';
870                break;
871        }
872        return html + '</div>';
873    }
874});