1 2 3 4 5'use strict'; 6 7DB['event-bus'] = function () { 8 9 var eventObject = $({}); 10 11 // ---------------------------------------------------------------- 12 // register markup events 13 $('body').on('click', '[data-trigger]', onGlobalEventClicked); 14 15 function onGlobalEventClicked(e) { 16 eventObject.trigger($(e.currentTarget).data('trigger'), e); 17 } 18 19 return eventObject; 20}(); 21'use strict'; 22 23DB['dom-util'] = function () { 24 25 var eventBus = DB['event-bus']; 26 27 var to; 28 29 // ---------------------------------------------------------------- 30 // resize 31 32 $(window).on('resize', function () { 33 clearTimeout(to); 34 to = setTimeout(trigger, 100); 35 }); 36 37 function trigger() { 38 eventBus.trigger('RESIZE', api.viewport()); 39 } 40 41 // ---------------------------------------------------------------- 42 // api 43 44 var api = { 45 viewport: function viewport() { 46 var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0); 47 var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0); 48 return { width: w, height: h }; 49 } 50 }; 51 52 return api; 53}(); 54'use strict'; 55 56DB.moduleFactory = function () { 57 58 var eventBus = DB['event-bus']; 59 60 var moduleDict = {}; 61 62 // ---------------------------------------------------------------- 63 // create modules based on markup 64 65 function createModules() { 66 67 $('[data-module]').each(function (index, element) { 68 try { 69 createModule(element); 70 } catch (e) { 71 console.log('Error creating module', $(element).data('module'), e); 72 } 73 }); 74 75 eventBus.trigger('MODULES_READY'); 76 } 77 78 /** 79 Looks for @data-module on a given element, and uses the value to lookup in DB, initializing the module found there 80 If @data-module-hook is specified, it stores the instance in the module dictionary 81 */ 82 function createModule(element) { 83 var $el = $(element); 84 var moduleDefinition = DB[$el.data('module')]; 85 var mod = new moduleDefinition(element); 86 87 //Store the instance on the element so it can be retrieved through the dom 88 $el.data("module-instance", mod); 89 90 //If @data-module-hook is set store the instance in the global dictionary for easy retrieval. 91 //NB: If more than one module per page has the same module-hook, it will simply be overridden. Use $el.data("module-instance") instead 92 if ($el.attr("data-module-hook")) { 93 moduleDict[$el.attr('data-module-hook')] = mod; 94 } 95 96 return mod; 97 } 98 99 /** 100 Returns a module from the module dictionary, named by @data-module-hook 101 */ 102 DB.getModule = function (id) { 103 return moduleDict[id]; 104 }; 105 106 // ---------------------------------------------------------------- 107 // return api 108 109 return { 110 createModules: createModules, 111 createModule: createModule 112 }; 113}(); 114 115 116'use strict'; 117 118DB['category'] = function (el) { 119 var domUtil = DB['dom-util']; 120 var utils = DB['utils']; 121 var eventBus = DB['event-bus']; 122 var createModule = DB.moduleFactory.createModule; 123 var $el = $(el); 124 var $categoryToggleContainer = $el.find('.category-toggle'); 125 var $categoryToggleLabel = $el.find('.category-toggle-label'); 126 var $categoryToggleButton = $el.find('.category-toggle-container'); 127 var $filterContainers = $el.find('.filter-container'); 128 var $filters = $el.find('[data-module="responsive-dropdown"]'); 129 var $cards = $el.find('.category-card'); 130 var $breaker = $el.find('.category-breaker'); 131 var $otherProducts = $el.find('.category-other-products'); 132 var allCardsInView = false; 133 var cardDuration = 0.5; 134 var filterDuration = 0.25; 135 var filterArray = []; 136 var searchfilterQuery = ''; 137 var searchfilterButtonModule; 138 var searchfieldButton = $el.find('.searchfield-button'); 139 var searchfilterInput = $el.find('input[id=searchfilter]'); 140 var view = 'list'; //default list eller cards 141 var viewSwitch = $el.find('.view-switch input'); 142 var productViewCards = $el.find('.product-view-cards'); 143 var productViewTable = $el.find('.product-view-table'); 144 var $listRows = $el.find('table tbody tr'); 145 var favouriteModule = null; 146 var favouriteView = false;
147 var noFavoritesView = $el.find('.no-favourites-view'); 148 var $filterWrapper = $el.find('.category-filters'); 149 var $alertBox = $el.find('.callout'); 150 var $alertHeadline = $alertBox.find('.alert-headline'); 151 var appendToHeadline = $alertHeadline.text(); 152 var $toggleAllFilters = $el.find('.toggle-all-filters'); 153 var revealMoreModule; 154 155 // STELU 156 // reset session storage when entering page. Only if value is set somewhere on page 157 // <script>var resetStorageOnLoad = "Y";</script> 158 var resetStorageOnLoad = window.resetStorageOnLoad; 159 if (resetStorageOnLoad==undefined) var resetStorageOnLoad='N'; 160 if (resetStorageOnLoad=='Y') { 161 toggleAllFilters(false); 162 } 163 164 // Hide the ad and other products before filtering 165 toggleBreaker('hide'); 166 toggleOtherProducts('hide'); 167 168 TweenMax.to($filters[0], filterDuration, { 169 opacity: '1', 170 ease: Circ.easeOut 171 }); 172 173 // Store "Show more/less" labels 174 var showMore = $categoryToggleLabel.attr('data-show-more'); 175 var showLess = $categoryToggleLabel.attr('data-show-less'); 176 $categoryToggleLabel.text(showMore); 177 178 function init() { 179 // Calc visibility for cards 180 var MQCurr = Foundation.MediaQuery.current; 181 $cards.each(function (index, card) { 182 var $card = $(card); 183 184 if (MQCurr === 'small') { 185 if (index > 2 && index <= 1000) { 186 $card.addClass('intro'); 187 } 188 if (index > 1000) { 189 toggleCard($card, false); 190// $('#morelink').removeClass('hide'); 191// $('#morelinknr').text(index); 192 } 193 } else if (MQCurr === 'medium') { 194 if (index > 1 && index <= 1000) { 195 $card.addClass('intro'); 196 } 197 if (index > 1000) { 198 toggleCard($card, false); 199// $('#morelink').removeClass('hide'); 200// $('#morelinknr').text(index); 201 } 202// } else if (Foundation.MediaQuery.atLeast('large')) { 203 } else { 204 if ($cards.length > 9) { 205 if (index > 2 && index <= 9) { 206 $card.addClass('intro'); 207 } 208 if (index > 9) { 209 toggleCard($card, false); 210 211// $('#morelink').removeClass('hide'); 212// $('#morelinknr').text(index); 213 } 214 } 215 } 216 }); 217 218 // Add end-class to last card-card 219 var $filteredCards = $cards.not('.is-hidden-by-filter'); 220 $filteredCards.last().parent().addClass('end'); 221 222 // Calc length of cards and visibility for "Show more/less" 223 toggleContainer(); 224 225 //Listen for input from filter searchfield 226 eventBus.on('SEARCHFIELD_QUERY', onSearchfilterInput); 227 eventBus.on('MODULES_READY', onModulesReady); 228 initViewSwitcher(); 229 230 } 231 232 function onModulesReady() { 233 //console.log("1"); 234 initFavourites(); 235 //console.log("2"); 236 initFilter(); 237 //console.log("3"); 238 revealMoreModule = DB.getModule('reveal-more-list'); 239 //console.log("4"); 240 responsiveViewHandler(); 241 //console.log("5"); 242 } 243 244 init(); 245 246 247 function initFilter() { 248 searchfilterButtonModule = DB.getModule('searchfilter'); 249 if ($toggleAllFilters) setupAllFilterToggle(); 250 251 var savedFilter = sessionStorage.getItem('DI-filter'); 252 if (savedFilter) { 253 applySavedFilter(); 254 } else { 255 addFilterDropdownListener(); 256 setTimeout(function () { 257 Foundation.reInit('equalizer'); 258 }); 259 } 260 } 261 262 function initViewSwitcher() { 263 productViewTable.toggle(); 264 viewSwitch.on('click', function (event) { 265 var newView = $(event.currentTarget).attr('id'); 266 switchView(newView); 267 }); 268 } 269 270 function getCookie(name) { // added stelu 2018-05-14 pga fejl hvis cookies ikke tillades 271 var value = "; " + document.cookie; 272 var parts = value.split("; " + name + "="); 273 if (parts.length == 2) return parts.pop().split(";").shift(); 274 } 275 276 function initFavourites() { 277 if (!favouriteModule) favouriteModule = DB.getModule('favourite-product-DI'); 278 279 if ($el.attr('has-favourites') === 'true') { 280 eventBus.on('FAVOURITES_ON', toggleFavouritesView); 281 eventBus.on('FAVOURITES_OFF', toggleFavouritesView); 282 $el.find('.category-card-favourite button').on('click', toggleFavourite); 283 } 284 noFavoritesView.hide(); 285 $alertBox.hide(); 286 if ((getCookie("cookiesOn")=="yes")||(getCookie("allowCookieFunctional")=="Y")) { 287 updateFavouriteFromStorage(); 288 } 289 290 } 291 292 function updateFavouriteFromStorage() { 293 //if (!favouriteModule) favouriteModule = DB.getModule('favourite-product-DI'); // added stelu 2018-05-18 294 if (!favouriteModule) console.log("no favo"); // added stelu 2018-05-18 295 if (!favouriteModule) return; 296 if (favouriteModule) { // added STELU 2024-06-24 297 var favourites = favouriteModule.getFavourites(); 298 299 if (!favourites) return; 300 301 productViewCards.find('.product-element').attr('favourite', 'false'); 302 productViewTable.find('.product-element').attr('favourite', 'false'); 303 304 $(favourites).each(function (index, id) { 305 var tableRow = productViewTable.find('.product-element[id="' + id + '"]'); 306 tableRow.attr('favourite', true); 307 var card = productViewCards.find('.product-element[id="' + id + '"]'); 308 card.attr('favourite', true); 309 310 }); 311 } 312 } 313 314 function showEmptyFavourites() { 315 noFavoritesView.show(); 316 productViewCards.hide(); 317 productViewTable.hide(); 318 favouriteView = true; 319 } 320 321 function toggleFavouritesView() { 322 favouriteView = !favouriteView; 323 var favourites = favouriteModule.getFavourites(); 324 325 if (favouriteView && (!favourites || !favourites.length)) { 326 showEmptyFavourites(); 327 return; 328 } 329 330 resetFilters(); 331 332 if (favouriteView) { 333 updateFavoriteElementVisibility(); 334 // toggleAllFilters(false); 335 resetFilters(); 336 saveCurrentFilter(); 337 toggleAdvancedFilterButton(false); 338 339 $filterWrapper.css('opacity', '0.4'); 340 $filters.find('a[data-toggle]').get(0).disabled = true; 341 searchfilterButtonModule.enabled(false); 342 $toggleAllFilters.css('opacity', 0); 343 } else { 344 showAllCardsAndRows(); 345 $toggleAllFilters.css('opacity', 1); 346 $filterWrapper.css('opacity', '1'); 347 $filters.find('a[data-toggle]').get(0).disabled = false;
348 searchfilterButtonModule.enabled(true); 349 noFavoritesView.hide(); 350 351 if (view === 'cards') { 352 productViewCards.show(); 353 Foundation.reInit('equalizer'); 354 } else { 355 productViewTable.show(); 356 Foundation.reInit('equalizer'); 357 } 358 } 359 360 //Remove read-more 361 if (revealMoreModule && !revealMoreModule.isRevealed) { 362 revealMoreModule.enabled(false); 363 } 364 } 365 366 function updateFavoriteElementVisibility() { 367 $cards.each(function (index, element) { 368 var showElement = false; 369 if ($(element).attr('favourite') === 'true') showElement = true; 370 toggleElement(element, showElement); 371 }); 372 373 $listRows.each(function (index, element) { 374 var showElement = false; 375 if ($(element).attr('favourite') === 'true') showElement = true; 376 toggleElement(element, showElement); 377 }); 378 } 379 380 function toggleFavourite(event) { 381 event.preventDefault(); 382 event.stopPropagation(); 383 384 var element = $(event.currentTarget).closest('.product-element'); 385 var isFavourite = element.attr('favourite') === 'true'; 386 element.attr('favourite', !isFavourite); 387 388 var id = element.attr('id'); 389 favouriteModule.toggleFavourite(id); 390 updateFavouriteFromStorage(); 391 392 //If we're removing a favourite 393 if (favouriteView && isFavourite) { 394 updateFavoriteElementVisibility(); 395 396 //Maybe it's the last favourite 397 var favourites = favouriteModule.getFavourites(); 398 if (!favourites.length) showEmptyFavourites(); 399 } 400 401 var elementHeadline = element.find('.headline-text').text(); 402 if (!isFavourite) showFavouriteAlert(elementHeadline); 403 } 404 405 function showFavouriteAlert(text) { 406 $alertHeadline.html(text); 407 var columnPos = $alertBox[0].parentNode.getBoundingClientRect().top; 408 409 if (columnPos < 0) { 410 $alertBox[0].style.top = -columnPos + 'px'; 411 } else { 412 $alertBox[0].style.top = '0px'; 413 } 414 TweenMax.set($alertBox, { opacity: 1 }); 415 $alertBox.show(); 416 TweenMax.to($alertBox, 0.2, { 417 opacity: 0, 418 delay: 5, 419 onComplete: function onComplete() { 420 $alertBox.hide(); 421 } }); 422 } 423 424 function showAllCardsAndRows() { 425 $cards.each(function (index, element) { 426 toggleElement(element, true); 427 }); 428 429 $listRows.each(function (index, element) { 430 toggleElement(element, true); 431 }); 432 } 433 434 function responsiveViewHandler() { 435 436 TweenMax.to($filters, cardDuration, { 437 css: { marginLeft: "0" }, 438 ease: Circ.easeOut 439 }); 440 441 // Calc visibility for cards 442 if (!allCardsInView) { 443 $cards.each(function (index, card) { 444 var $card = $(card); 445 $card.removeClass('intro'); 446 toggleCard($card, true); 447 if (Foundation.MediaQuery.current === 'small') { 448 if (index > 2 && index <= 6) { 449 $card.addClass('intro'); 450 } 451 if (index > 6) { 452 toggleCard($card, false); 453 } 454 } else if (Foundation.MediaQuery.current === 'medium') { 455 if (index > 1 && index <= 8) { 456 $card.addClass('intro'); 457 } 458 if (index > 8) { 459 toggleCard($card, false); 460 } 461 } else { 462 //if (Foundation.MediaQuery.atLeast('large')) { 463 if (index > 2 && index <= 9) { 464 $card.addClass('intro'); 465 } 466 if (index > 9) { 467 toggleCard($card, false); 468 } 469 } 470 }); 471 toggleContainer(); 472 } 473 474 if (productViewTable && !favouriteView) showTableOnMobile(); 475 } 476 477 function scrollToTop() { 478 var distanceAboveTarget = $($categoryToggleButton).offset().top - $(window).height() / 2; 479 TweenMax.to($(window), 0.5, { scrollTo: { y: distanceAboveTarget }, ease: Circ.easeOut }); 480 } 481 482 function toggleContainer() { 483 // Calc length of cards and visibility for "Show more/less"
484 var validCards = $cards.not('.is-hidden-by-filter'); 485 if (Foundation.MediaQuery.current === 'small') { 486 if (validCards.length < 4) { 487 $categoryToggleContainer.hide(); 488 } else { 489 $categoryToggleContainer.show(); 490 } 491 } else if (Foundation.MediaQuery.current === 'medium') { 492 if (validCards.length < 4) { 493 $categoryToggleContainer.hide(); 494 } else { 495 $categoryToggleContainer.show(); 496 } 497 } else if (Foundation.MediaQuery.atLeast('large')) { 498 if (validCards.length >= 6) { 499 $categoryToggleContainer.show(); 500 } else { 501 $categoryToggleContainer.hide(); 502 } 503 } 504 } 505 506 function toggleButton(event, filtering) { 507 var $filteredCards; 508 509 switch (filtering) { 510 // When clicking on the "Show more/less" button 511 case 'button': 512 if (!allCardsInView) { 513 // Show all cards 514 toggleBreaker('show'); 515 $cards.removeClass('intro'); 516 toggleCard($cards, true); 517 $categoryToggleContainer.removeClass('intro'); 518 $cards.parent().removeClass('end'); 519 $filteredCards = $cards.not('.is-hidden-by-filter'); 520 $filteredCards.last().parent().addClass('end'); 521 $categoryToggleLabel.text(showLess); 522 allCardsInView = true; 523 } else { 524 // Calc visibility for cards 525 $cards.each(function (index, card) { 526 var $card = $(card); 527 toggleCard($card, true); 528 $card.removeClass('intro'); 529 if (Foundation.MediaQuery.current === 'small') { 530 if (index > 2 && index <= 6) { 531 $card.addClass('intro'); 532 } 533 if (index > 6) { 534 toggleCard($card, false); 535 } 536 } else if (Foundation.MediaQuery.current === 'medium') { 537 if (index > 1 && index <= 6) { 538 $card.addClass('intro'); 539 } 540 if (index > 6) { 541 toggleCard($card, false); 542 } 543 } else { 544 //if (Foundation.MediaQuery.atLeast('large')) { 545 if (index > 2 && index <= 9) { 546 $card.addClass('intro'); 547 } 548 if (index > 9) { 549 toggleCard($card, false); 550 } 551 } 552 }); 553 // Reset the category view 554 toggleBreaker('hide'); 555 $categoryToggleContainer.addClass('intro'); 556 $categoryToggleLabel.text(showMore); 557 resetFilters(); 558 allCardsInView = false; 559 scrollToTop(); 560 } 561 break; 562 563 // When filtering 564 case 'filtering': 565 toggleBreaker('hide'); 566 $cards.removeClass('intro'); 567 allCardsInView = true; 568 $categoryToggleContainer.removeClass('intro'); 569 $cards.parent().removeClass('end'); 570 $filteredCards = $cards.not('.is-hidden-by-filter'); 571 $filteredCards.last().parent().addClass('end'); 572 $categoryToggleLabel.text(showLess); 573 break; 574 575 } 576 Foundation.reInit('equalizer'); 577 } 578 579 $categoryToggleButton.on("click", function (e) { 580 toggleButton(e, 'button'); 581 }); 582 583 // Toggle visibility for cards 584 function toggleCard(element, visibility) { 585 if (visibility) { 586 $(element).removeClass('is-hidden-by-filter'); 587 588 TweenMax.to(element, cardDuration, { 589 opacity: 1, 590 css: { transform: "translateY(0px)" }, 591 ease: Circ.easeOut 592 }); 593 } else { 594 $(element).addClass('is-hidden-by-filter'); 595 // console.log('toggleCard', element, visibility); 596 597 TweenMax.to(element, cardDuration, { 598 opacity: 0, 599 css: { transform: "translateY(" + $(element).height() / 2 + "px)" }, 600 ease: Circ.easeIn 601 }); 602 } 603 } 604 605 function toggleElement(element, visibility) { 606 if (visibility) { 607 $(element).removeClass('is-hidden-by-filter'); 608 $(element).show(); 609 } else { 610 $(element).addClass('is-hidden-by-filter'); 611 $(element).hide(); 612 } 613 614 var $filteredCards = $cards.not('.is-hidden-by-filter'); 615 $filteredCards.last().parent().addClass('end'); 616 } 617 618 // Toggle visibility for breaker (Ad element) 619 function toggleBreaker(visibility) { 620 var cardDuration = 0.5; 621 switch (visibility) { 622 case 'show': 623 $breaker.addClass('is-hidden-by-filter'); 624 TweenMax.to($breaker, 0, { 625 opacity: '0', 626 css: { transform: "translateY(" + $breaker.height() / 2 + "px)" }, 627 ease: Circ.easeIn, 628 onComplete: function onComplete() { 629 $breaker.removeClass('is-hidden-by-filter'); 630 TweenMax.to($breaker, cardDuration, { 631 opacity: '1', 632 css: { transform: "translateY(0px)" }, 633 ease: Circ.easeOut 634 }); 635 } 636 }); 637 break; 638 case 'hide': 639 $breaker.addClass('is-hidden-by-filter'); 640 TweenMax.to($breaker, cardDuration, { 641 opacity: '0', 642 css: { transform: "translateY(100px)" }, 643 ease: Circ.easeIn 644 }); 645 break; 646 } 647 } 648 649 function toggleOtherProducts(visibility) { 650 var cardDuration = 0.5; 651 switch (visibility) { 652 case 'show':
653 var validOtherProducts = $otherProducts.find('.category-card').not('.is-hidden-by-filter'); 654 if (validOtherProducts.length > 1) { 655 $otherProducts.show(); 656 $otherProducts.addClass('intro'); 657 658 659 TweenMax.to($otherProducts, 0, { 660 opacity: '0', 661 css: { transform: "translateY(" + $otherProducts.height() / 2 + "px)" }, 662 ease: Circ.easeIn, 663 onComplete: function onComplete() { 664 $otherProducts.removeClass('intro'); 665 TweenMax.to($otherProducts, cardDuration, { 666 opacity: '1', 667 css: { transform: "translateY(0px)" }, 668 ease: Circ.easeOut 669 }); 670 } 671 }); 672 673 } else { 674 $otherProducts.hide(); 675 } 676 break; 677 case 'hide': 678 $otherProducts.hide(); 679 $otherProducts.addClass('intro'); 680 681 TweenMax.to($otherProducts, cardDuration, { 682 opacity: '0', 683 css: { transform: "translateY(100px)" }, 684 ease: Circ.easeIn 685 }); 686 break; 687 } 688 } 689 690 function resetFilters() { 691 filterArray = []; 692 693 $filters.each(function (index, filter) { 694 createModule($(filter)); 695 if (index > 0&&$($filterContainers[index]).hasClass('filterAdvanced')) $($filterContainers[index]).removeClass('active'); 696 }); 697 } 698 699 function resetNextFilters(event) { 700 $filters.each(function (index, filter) { 701 var sValue = $(filter).attr('data-selected-value'); 702 703 filterArray[index] = Boolean(sValue) ? parseInt(sValue) : null; 704 705 var $filter = $(filter); 706/* deaktiveret STELU da den ikke skal nulstille efterfølgende filtre 707 if (event && $(event.currentTarget).is($filter)) { 708 for (var i = index + 1; i < $filters.length; i++) { 709 createModule($($filters[i])); 710 } 711 }*/ 712 }); 713 } 714 715 function showNextFilter() { 716 // reset active states: 717 var i; 718 var l = filterArray.length; 719 for (i = 0; i < l; i++) { 720 if (i > 0) $filterContainers[i].classList.remove('active'); 721 } 722 723 // show next active: 724 for (i = 0; i < l; i++) { 725 var filter = $filters[i]; 726 if (filterArray[i]) { 727 var currentFilter = $filterContainers[i]; 728 currentFilter.classList.add('active'); 729 730 // find next filter to activate (might NOT be the next in line): 731 var option = $(filter).find('[data-activate-filter]')[filterArray[i] - 1]; 732 var activateFilterNumber = $(option).attr('data-activate-filter'); 733 734 if (activateFilterNumber) { 735 var nextFilter = $($filterContainers[activateFilterNumber - 1]); 736 nextFilter.addClass('active'); 737 } 738 } 739 } 740 } 741 742 function showAllFilters() { 743 TweenMax.staggerFrom($filterContainers.slice(1), 0.15, { opacity: 0, ease: Linear.easeNone }, 0.075); 744 $filterContainers.each(function (index, element) { 745 $(element).addClass('active'); 746 }); 747 } 748 749 function setupAllFilterToggle() { 750 $toggleAllFilters.find('.show-all-filters').on('click', function (event) { 751 event.preventDefault(); 752 toggleAllFilters(true); 753 }); 754 755 $toggleAllFilters.find('.hide-all-filters').hide().on('click', function () { 756 event.preventDefault(); 757 toggleAllFilters(false); 758 }); 759 } 760 761 function toggleAllFilters(value) { 762 var showAll = $toggleAllFilters.find('.show-all-filters'); 763 var hideAll = $toggleAllFilters.find('.hide-all-filters'); 764 765 if (value) { 766 showAllFilters(); 767 toggleAdvancedFilterButton(true); 768 } else { 769 resetFilters(); 770 // filterArray = null; 771 if (view === 'cards') { 772 applyFilter($cards); 773 //Foundation.reInit('equalizer'); 774 } else { 775 applyFilter($listRows); 776 //Foundation.reInit('equalizer'); 777 } 778 saveCurrentFilter(); 779 780 toggleAdvancedFilterButton(false); 781 } 782 } 783 function toggleAdvancedFilterButton(filterOn) { 784 var showAll = $toggleAllFilters.find('.show-all-filters'); 785 var hideAll = $toggleAllFilters.find('.hide-all-filters'); 786 if (filterOn) { 787 hideAll.show(); 788 showAll.hide(); 789 } else { 790 showAll.show(); 791 hideAll.hide(); 792 } 793 } 794 795 function filterCards(event, fromSessionStorage) { 796 if (!fromSessionStorage) { 797 filterArray = []; 798 resetNextFilters(event); 799 saveCurrentFilter(); 800 } 801 802 // showNextFilter(); 803//console.log(view); 804 if (view === 'cards') { 805 applyFilter($cards); 806 } else { 807 applyFilter($listRows); 808 } 809 810 toggleButton(event, 'filtering'); 811 toggleContainer(); 812 toggleBreaker('show'); 813 toggleOtherProducts('show'); 814 815 // Add end-class to last card-card 816 $cards.parent().removeClass('end'); 817 var $filteredCards = $cards.not('.is-hidden-by-filter'); 818 $filteredCards.last().parent().addClass('end'); 819 } 820 821 function applyFilter(elements) { 822 //console.log('applyFilter'); 823 elements.each(function (index, element) { 824 var showElement = true; 825 var elementFiltersArray = $(element).attr('data-visibility-rules').split('|'); 826 827 var i; 828 var x; 829 var y; 830 var li = filterArray.length; 831 var lx; 832 var ly; 833 var filterValue; 834 var elementFilterValues; 835 var elementValues; 836 var elementValue; 837 var elementValueExistsInFilterValue; 838 839 for (i = 0; i < li; i++) { 840 //console.log('Index',i); 841 if (filterArray[i]) { 842 //console.log('dropdown', i, ' | value selected', filterArray[i]); 843 filterValue = parseInt(filterArray[i]); 844 //filterValue = filterArray[i]; 845 elementFilterValues = elementFiltersArray[i]; 846 if (elementFilterValues) { 847 lx = elementFiltersArray[i].length; 848 for (x = 0; x < lx; x++) { 849 elementValues = elementFiltersArray[i].split(','); 850 // console.log('elementValues', elementValues); 851 elementValueExistsInFilterValue = false;
852 ly = elementValues.length; 853 for (y = 0; y < ly; y++) { 854 //console.log('value ',elementValues[y]); 855 elementValue = parseInt(elementValues[y]); 856 //elementValue = elementValues[y]; 857 //console.log('val=',elementValue); 858 859 if (elementValue === filterValue) { 860 // console.log('match', elementValue); 861 elementValueExistsInFilterValue = true; 862 } 863 } 864 if (!elementValueExistsInFilterValue) showElement = false; 865 } 866 } 867 } 868 } 869 870 if (searchfilterQuery != '') { 871 if (getListItemText(element).indexOf(searchfilterQuery.toLowerCase()) === -1) { 872 showElement = false; 873 } 874 } 875 876 //console.log('showElement', showElement); 877 toggleElement(element, showElement); 878 }); 879 } 880 881 function saveCurrentFilter() { 882 //console.log('save filter ',filterArray); 883 if ((getCookie("cookiesOn")=="yes")||(getCookie("allowCookieFunctional")=="Y")) { 884 sessionStorage.setItem('DI-filter', JSON.stringify({ 885 filterArray: filterArray, 886 searchfilterQuery: searchfilterQuery, 887 view: view 888 })); 889 } 890 } 891 892 function applySavedFilter() { 893 var storage = JSON.parse(sessionStorage.getItem('DI-filter')); 894//console.log(storage); 895 if (storage.filterArray) { 896 $(storage.filterArray).each(function (index, sValue) { 897 //filterArray.push(Boolean(sValue) ? sValue : null); 898 filterArray.push(Boolean(sValue) ? parseInt(sValue) : null); 899 }); 900 901 $(filterArray).each(function (index, value) { 902 var filterDropdownModule = DB.getModule('filter' + (index + 1)); 903 if (value != null&&filterDropdownModule) { 904 //console.log('set val',value.toString(),index+1); 905 filterDropdownModule.setValue(value.toString()); 906 } 907 }); 908 909 if ($toggleAllFilters && storage.filterArray.length > 1 && storage.filterArray[1] != null) toggleAllFilters(true); 910 } 911 912 if (storage.searchfilterQuery) { 913 searchfilterQuery = storage.searchfilterQuery; 914 searchfilterInput.val(searchfilterQuery); 915 searchfilterButtonModule.expand(); 916 } 917 918 if (storage.view) { 919 switchView(storage.view); 920 if (storage.view === 'list') viewSwitch.click(); 921 } 922 923 setTimeout(function () { 924 filterCards(null, true); 925 addFilterDropdownListener(); 926 }, 100); 927 } 928 929 function onSearchfilterInput(event, searchQuery) { 930 searchfilterQuery = searchQuery; 931 filterCards(); 932 } 933 934 function getListItemText(item) { 935 return $(item).find('[data-searchfilter-text]').text().toLowerCase(); 936 } 937 938 function switchView(newView) { 939 if (newView === view) return; 940 view = newView; 941 saveCurrentFilter(); 942 943 if (view === 'cards') { 944 productViewCards.show(); 945 productViewTable.hide(); 946 if (!favouriteView) { 947 applyFilter($cards); 948 setTimeout(function () { 949 //Foundation.reInit('equalizer'); 950 }); 951 } 952 } else { 953 productViewCards.hide(); 954 productViewTable.show(); 955// DB.getModule('listview').checkWidth(); 956 if (!favouriteView) { 957 applyFilter($listRows); 958 setTimeout(function () { 959 //Foundation.reInit('equalizer'); 960 }); 961 } 962 } 963 } 964 965 // Filter has been changed 966 function addFilterDropdownListener() { 967 $filters.on('change', function (e) { 968 filterCards(e); 969 }); 970 } 971 972 function showTableOnMobile() { 973 if (domUtil.viewport().width <= 768) { 974 productViewCards.hide(); 975 productViewTable.show(); 976 view = 'list'; 977 DB.getModule('listview').checkWidth(); 978 } else if (view === 'cards') { 979 productViewCards.show(); 980 productViewTable.hide(); 981 } else if (view === 'list') { 982 productViewCards.hide(); 983 productViewTable.show(); 984 } 985 } 986 987 988 // Resize handler 989 $(window).on('resize', function (event) { 990 //console.log('resize'); 991 //Foundation.reInit('equalizer'); 992 responsiveViewHandler(); 993 }); 994}; 995 996 997 998 999'use strict'; 1000 1001DB['reveal-more'] = function (el) { 1002 var utils = DB.utils; 1003 var $el = $(el); 1004 var $window = $(window); 1005 var templateHeight = 65; 1006 var introHeight = parseInt($el.attr('intro-height'), 10) + templateHeight; 1007 var realHeight = el.scrollHeight + templateHeight; 1008 var moreLabel = $el.attr('more-label'); 1009 var lessLabel = $el.attr('less-label'); 1010 var revealed = false;
1011 var duration = (realHeight - introHeight) / 1000; 1012 var color = $el.attr('fade-color') || $el.closest('.card').find('.card-back').css('background-color') || 'rgb(255,255,255)'; 1013 1014 var gradientID = 'linearGradient' + Math.random(); 1015 1016 $el.addClass('reveal-more'); 1017 el.style.height = introHeight + 'px'; 1018 1019 var template = '<div class="columns small-12 reveal-toggle">\n <div class="wrapper" style="background-color:' + color + ';">\n <a href="javascript:void(0)" class="toggle-button">\n <p class="reveal-label">' + moreLabel + '</p>\n <span class="button blue toggle-icon">\n <i class="icon-image xsmall">\n <img src="/image/arrow-down-bold.svg">\n </i>\n </span>\n </a>\n <span class="fade">\n <svg width="100%" height="100px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">\n <defs>\n <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="' + gradientID + '">\n <stop stop-color="' + color + '" stop-opacity="0" offset="0%"></stop>\n <stop stop-color="' + color + '" offset="100%"></stop>\n </linearGradient>\n </defs>\n <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\n <rect id="Rectangle" fill="url(#' + gradientID + ')" x="0" y="0" width="100%" height="100"></rect>\n </g>\n </svg>\n </span>\n </div>\n </div>'; 1020 1021 $el.append($(template).clone()); 1022 1023 var $toggle = $el.find('.reveal-toggle'); 1024 var $toggleIcon = $toggle.find('.toggle-icon i'); 1025 var $svg = $toggle.find('.fade'); 1026 var $label = $toggle.find('.reveal-label'); 1027 var $wrapperFade = $toggle.find('.wrapper'); 1028 1029 $toggle.find('.toggle-button').on('click', toggle); 1030 1031 function toggle() { 1032 var nHeight = revealed ? introHeight : el.scrollHeight + templateHeight; 1033 TweenLite.to($el, duration, { height: nHeight, ease: Cubic.easeOut }); 1034 $toggleIcon.toggleClass('revealed'); 1035 TweenLite.to($svg, duration / 2, { delay: revealed ? -duration / 2 : duration / 2, autoAlpha: revealed ? 1 : 0, ease: Cubic.easeOut }); 1036 $label[0].innerHTML = revealed ? moreLabel : lessLabel; 1037 1038 revealed = !revealed; 1039 } 1040 1041 $window.on('resize', function () { 1042 if (revealed) { 1043 el.style.height = 'auto'; 1044 el.style.height = el.scrollHeight + templateHeight + 'px'; 1045 } 1046 }); 1047 1048 function enabled(value) { 1049 if (value) { 1050 el.style.height = el.scrollHeight + templateHeight + 'px'; 1051 $wrapperFade.show(); 1052 } else { 1053 el.style.height = 'auto'; 1054 $wrapperFade.hide(); 1055 } 1056 } 1057 1058 return { 1059 isRevealed: revealed, 1060 toggle: toggle, 1061 enabled: enabled 1062 }; 1063}; 1064 1065 1066 1067'use strict'; 1068 1069DB['graph-compare'] = function (el) { 1070 var $el = $(el); 1071 var close = $el.find('.close-compare button'); 1072 1073 close.on('click', function (event) { 1074 event.preventDefault(); 1075 $el.hide(); 1076 return false; 1077 }); 1078}; 1079'use strict'; 1080 1081 1082DB['risc-indicator'] = function (el) { 1083 var $el = $(el); 1084 var risc = parseInt($el.attr('risc'), 10) - 1; 1085 1086 $el.find('.indication ul li').eq(risc).addClass('active'); 1087}; 1088 1089DB['fund-calculator'] = function (el) { 1090 var $el = $(el); 1091 var eventBus = DB['event-bus']; 1092 var $results = $el.find('.results'); 1093 var $result = $el.find('.result'); 1094 var $yield = $el.find('.yield'); 1095 var $costs = $el.find('.costs'); 1096 var $slider = $el.find('.db-slider'); 1097 var $inputTool = $el.find('.input-tool-text'); 1098 var sliderAmount = 0; 1099 var values = data; //data set in inline script 1100 1101 var currentYear = $("#sliderInput100").val(); 1102 var inputValue = 0; 1103 var currentDataIndex = currentYear-1; 1104 1105 var _result = 0; 1106 var _yield = 0; 1107 var _cost = 0; 1108
1109 function init() { 1110 eventBus.on('MODULES_READY', onModulesReady); 1111 } 1112 init(); 1113 1114 function onModulesReady() { 1115 $slider.on('change mouseup touchend slide mousemove', function () { 1116 var year = $("#sliderInput100").val(); 1117 if (year != currentYear) { 1118 currentYear = year; 1119 currentDataIndex = year - 1; 1120 onChange(); 1121 } 1122 }); 1123 1124 $inputTool.on('change', function (event, amount) { 1125 inputValue = parseInt(amount, 10); 1126 1127 if (!validateInput()) return; 1128 onChange(); 1129 }); 1130 1131 inputValue = parseInt($inputTool.find('input').val(), 10); 1132 if (!validateInput()) return; 1133 1134 doCalculations(); 1135 updateView(); 1136 } 1137 1138 function validateInput() { 1139 var value = true; 1140 if (isNaN(inputValue) || inputValue <= 0) { 1141 onNullInputValue(); 1142 value = false; 1143 } 1144 return value; 1145 } 1146 1147 function onNullInputValue() { 1148 $results.css('opacity', 0); 1149 } 1150 1151 function onChange() { 1152 $results.css('opacity', 1); 1153 doCalculations(); 1154 updateView(); 1155 } 1156 1157 function doCalculations() { 1158 if (currentDataIndex==-1) { 1159 _result = inputValue; 1160 _yield = 0; 1161 _cost = 0; 1162 } else { 1163 _result = inputValue / 100 * values[currentDataIndex].result; 1164 _yield = inputValue / 100 * values[currentDataIndex].yield; 1165 _cost = inputValue / 100 * values[currentDataIndex].cost; 1166 } 1167 } 1168 1169 function updateView() { 1170 $result.html(formatNumber(_result)); 1171 $yield.html(' ' + formatNumber(_yield)); 1172 $costs.html(' ' + formatNumber(_cost)); 1173 } 1174 1175 function formatNumber(no) { 1176 if (no>1000) { 1177 return $.number(no, 0, ',', '.'); 1178 } else { 1179 return $.number(no, 0, ',', '.'); 1180 } 1181 1182 } 1183}; 1184 1185'use strict'; 1186 1187DB['dropdown'] = function (el) { 1188 var isOpen = false; 1189 var eventBus = DB['event-bus']; 1190 1191 var $el = $(el), 1192 $toggle = $el.find('> .button'); 1193 1194 // ---------------------------------------------------------------- 1195 // init 1196 1197 $toggle.on('click', onToggleClicked); 1198 $el.on('click', onClick); 1199 1200 // ---------------------------------------------------------------- 1201 // onToggleClicked 1202 1203 function onToggleClicked(e) { 1204 e.preventDefault(); 1205 doToggle(); 1206 } 1207 1208 function doToggle() { 1209 if (isOpen) { 1210 close(); 1211 } else { 1212 open(); 1213 } 1214 } 1215 1216 // ---------------------------------------------------------------- 1217 // open / close 1218 1219 function open() { 1220 isOpen = true; 1221 $el.addClass('is-open'); 1222 $el.find('[role="menu"]').attr('aria-hidden', false); 1223 $(window).on('click', onGlobalClicked); 1224 } 1225 1226 function close() { 1227 isOpen = false; 1228 $el.find('[role="menu"]').attr('aria-hidden', true); 1229 $el.removeClass('is-open'); 1230 $(window).off('click', onGlobalClicked); 1231 document.activeElement.blur(); 1232 } 1233 1234 function closeFromRootScope() { 1235 setTimeout(function () { 1236 window.loginOpen = false; 1237 close(); 1238 }, 500); 1239 } 1240 1241 function onGlobalClicked(e) { 1242 if (!$.contains(el, e.target)) { 1243 close(); 1244 } 1245 } 1246 1247 function onClick(event) { 1248 if (event.target.attributes.role && event.target.attributes.role.nodeValue === 'menuitem') { 1249 close(); 1250 } 1251 } 1252 1253 eventBus.on('MENU_OPEN', closeFromRootScope); 1254}; 1255 1256 1257'use strict'; 1258 1259 1260DB['responsive-dropdown'] = function (el) { 1261 1262 /* 1263 1. Store elements 1264 2. Store options 1265 3. Render options 1266 4. Render template for mobile 1267 5. Render template for desktop 1268 6. Switch component 1269 7. Resize handler 1270 */ 1271 1272 // Store elements 1273 var $el = $(el); 1274 var id = $el.attr('id'); 1275 var iconSize = $el.attr('data-iconsize'); 1276 iconSize = iconSize ? iconSize : 'xsmall'; 1277 var dropId = id ? 'drop' + id : 'drop' + Math.random().toString().split('.')[1]; 1278 var createModule = DB.moduleFactory.createModule; 1279 var domUtil = DB['dom-util']; 1280 var placeholder = $el.find('.placeholder').text(); 1281 var mobileTemplate = null; 1282 var optionsMobileTemplate = null; 1283 var desktopTemplate = null; 1284 var optionsDesktopTemplate = null; 1285 var mobileView = null; 1286 var desktopView = null; 1287 var option = $el.find('.data > .option'); 1288 var options = []; 1289 1290 var alignLeft = $el.attr('align') === 'left'; 1291 1292 var filteredOptions = []; 1293 var searchAsYouType = $el.attr('search') === 'true'; 1294 var searchSecret = dropId + '-secret'; 1295 var searchQuery = ''; 1296 1297 var multiselect = false;
1298 var multiselectCallback; 1299 1300 var iconDropdown = $el.attr('icon') === 'true'; 1301 1302 1303 if ($el.find('.mobile-view').length > 0) { 1304 mobileView = $el.find('.mobile-view'); 1305 } else { 1306 mobileView = $('<div></div>').addClass("mobile-view"); 1307 $el.append(mobileView); 1308 } 1309 1310 if ($el.find('.desktop-view').length > 0) { 1311 desktopView = $el.find('.desktop-view'); 1312 } else { 1313 desktopView = $('<div></div>').addClass("desktop-view"); 1314 $el.append(desktopView); 1315 } 1316 1317 //STELU sætter filter til default value første gang. 1318 var $defVal = $el.data('default-value'); 1319 //console.log('Save filter def',id+' '+$defVal); 1320 1321 if ($defVal) { 1322 //console.log('save'); 1323 //console.log(JSON.parse(sessionStorage.getItem('DI-filter'))); 1324 sessionStorage.setItem('DI-filter', JSON.stringify({ 1325 filterArray: $defVal, 1326 searchfilterQuery: '', 1327 view: 'list' 1328 })); 1329 $el.attr('data-default-value', ''); 1330 } 1331 1332 1333 1334 // Store options 1335 $(option).each(function (index) { 1336 if (index <= option.length) { 1337 var data; 1338 if ($(this).data('value')) { 1339 //console.log($(this).data('value')); 1340 data = { 1341 label: $(this).text(), 1342 value: $(this).data('value') 1343 }; 1344 1345 1346 1347 if ($(this).find('.sublabel') && $(this).find('.sublabel').length) { 1348 data.label = $(this).find('.mainlabel').text(); 1349 data.sublabel = $(this).find('.sublabel').text(); 1350 } 1351 } else if ($(this).data('click')) { 1352 console.log($(this).data('click')) ; 1353 data = { 1354 label: $(this).text(), 1355 click: $(this).data('click') 1356 }; 1357 } else if ($(this).data('checkbox')) { 1358 data = { 1359 label: $(this).text(), 1360 checkbox: $(this).data('checkbox'), 1361 checked: $(this).data('checked') 1362 }; 1363 } else if ($(this).data('href')) { 1364 data = { 1365 label: $(this).text(), 1366 href: $(this).data('href') 1367 }; 1368 } else if ($(this).data('extra')) { 1369 data = { 1370 extra: $(this) 1371 }; 1372 } 1373 1374 if ($(this).data('icon')) { 1375 data = { 1376 value: $(this).data('value'), 1377 label: $(this).text(), 1378 icon: $(this).data('icon'), 1379 iconPlaceholder: $(this).data('icon-placeholder') 1380 }; 1381 } 1382 //console.log(data); 1383 options.push(data); 1384 } 1385 }); 1386 1387 filteredOptions = options.slice(); 1388 1389 /* 1390 Search as you type 1391 */ 1392 var setupSearchAsYouType = function setupSearchAsYouType() { 1393 var searchInput = $el.find('input[id=' + dropId + '-search]'); 1394 var $dropdownPane = $el.find('.dropdown-pane[id=' + dropId + ']'); 1395 $dropdownPane.addClass('search-as-you-type'); 1396 1397 searchInput.on('input keyup', function (event) { 1398 //keyup is necessary for IE9. input is necessary for mouse paste. Input would suffice if we didn't need ie9 support 1399 searchQuery = searchInput.val().toLowerCase(); 1400 1401 //left, up, right, down, shift, ctrl, alt, cmd/win 1402 switch (event.keyCode) { 1403 case undefined: 1404 case 16: 1405 case 17: 1406 case 18: 1407 case 37: 1408 case 38: 1409 case 39: 1410 case 40: 1411 case 91: 1412 return; 1413 } 1414 1415 $dropdownPane.find('ul a').each(function (index) { 1416 var option = $(this); 1417 if (searchQuery === '') { 1418 option.show(); 1419 } else { 1420 option.hide(); 1421 if (option.text().toLowerCase().indexOf(searchQuery) >= 0) option.show(); 1422 } 1423 }); 1424 }); 1425 }; 1426 1427 function dropdownOpenListener() { 1428 var $dropdownPane = $el.find('.dropdown-pane[id=' + dropId + ']'); 1429 var searchInput = $el.find('input[id=' + dropId + '-search]'); 1430 $dropdownPane.on('show.zf.dropdown', function () { 1431 $el.closest('.section').css('z-index', '1'); 1432 1433 if (searchAsYouType) { 1434 $dropdownPane.addClass('search-as-you-type'); 1435 searchInput.focus(); 1436 searchInput.get(0).setSelectionRange(searchQuery.length, searchQuery.length); 1437 } 1438 }); 1439 1440 $dropdownPane.on('closeme.zf.dropdown', function (event) { 1441 if ($dropdownPane.attr('id') === $(event.target).attr('id')) { 1442 $el.closest('.section').next().css('z-index', '0'); 1443 } 1444 }); 1445 } 1446 1447 // Render options 1448 1449 if (mobileView) { 1450 optionsMobileTemplate = []; 1451 } 1452 1453 if (desktopView) { 1454 optionsDesktopTemplate = []; 1455 } 1456 1457 $(filteredOptions).each(function (index) { 1458 if (index <= option.length) { 1459 var value = this.value; 1460// var click = this.click; 1461 var checkbox = this.checkbox; 1462 if (checkbox) multiselect = true; 1463 var checked = this.checked; 1464 var checkedString = checked ? 'checked' : ''; 1465 var href = this.href; 1466 var label = this.label; 1467 var extra = this.extra; 1468 var icon = this.icon; 1469 var iconPlaceholder = this.iconPlaceholder; 1470 var sublabel = this.sublabel; 1471 1472 if (mobileView) { 1473 1474 if (value) { 1475 optionsMobileTemplate.push('<option value="' + value + '">' + label + '</option>'); 1476 } else if (checkbox) { 1477 optionsMobileTemplate.push(['<li value="' + value + '">', '<div class="input-set">', '<input id="' + checkbox + '" tabindex="0" role="checkbox" type="checkbox"/>', '<label for="' + checkbox + '">' + label + '</label>', '</div>', '</li>'].join('')); 1478 } else if (href) { 1479 optionsMobileTemplate.push('<option href="' + href + '">' + label + '</option>'); 1480 } 1481 } 1482 if (desktopView) { 1483 if (value && !icon) { 1484 var desktopLabel = label; 1485 if (sublabel) { 1486 desktopLabel = '<span class="mainlabel">' + label + '</span><span class="sublabel">' + sublabel + '</span>'; 1487 } 1488 var optionClasses = sublabel ? 'option has-sublabel' : 'option'; 1489 optionsDesktopTemplate.push('<li><a href="javascript:void(0)" value="' + value + '" class="' + optionClasses + '">' + desktopLabel + '</a></li>'); 1490 } else if (checkbox) { 1491 optionsDesktopTemplate.push(['<li>', '<a href="javascript:void(0)" class="option input-set">', '<input id="' + checkbox + '" ' + checkedString + ' tabindex="0" role="checkbox" type="checkbox"/>', '<label for="' + checkbox + '">' + label + '</label>', '</a>', '</li>'].join('')); 1492 } else if (href) { 1493 optionsDesktopTemplate.push('<li><a href="' + href + '" class="option">' + label + '</a></li>'); 1494// } else if (click) { 1495// optionsDesktopTemplate.push('<li><a onclick="' + click + '" class="option">' + label + '</a></li>'); 1496 } else if (extra) { 1497 optionsDesktopTemplate.push('<li class="extra-content"> ' + extra.html() + '</li>'); 1498 } else if (icon) { 1499 optionsDesktopTemplate.push('<li><a href="javascript:void(0)" value="' + value + '" class="option" icon-placeholder="' + iconPlaceholder + '"><i class="icon-image"><img src=" ' + icon + '"></i><span class="icon-label">' + label + '</span></a></li>'); 1500 } 1501 } 1502 } 1503 }); 1504 1505 // Render template for mobile 1506 if (mobileView) { 1507 mobileTemplate = ['<div data-module="responsive-dropdown-mobile" ' + multiselectStr
1507ing + ' class="responsive-dropdown-mobile is-placeholder">', '<select title="' + placeholder + '" data-selected-value="' + placeholder + '">', '<option data-placeholder="" selected="selected" disabled="" style="display: none;">' + placeholder + '</option>' + optionsMobileTemplate.join('') + '</select>', '<a class="button">', '<div class="prompt">', '<span class="title">', '<span>' + placeholder + '</span>', '</span>', '<i class="icon-image xsmall">', '<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-481 971 16 16" style="enable-background:new -481 971 16 16;" xml:space="preserve"><path class="st0" d="M-473,982.8l7.5-7.5 M-473,982.8l-7.5-7.5"/></svg>', '</i>', '</div>', '</a>', '</div>'].join(''); 1508 $(mobileView).html(mobileTemplate); 1509 createModule($el.find('.responsive-dropdown-mobile')); 1510 } 1511 1512 //Render template for desktop 1513 if (desktopView) { 1514 var multiselectString = multiselect ? ' multiselect ' : ''; 1515 var searchTemplate = '\n <div class="dropdown-search columns medium-12">\n <i class="icon-image"><img src="/image/search.svg"></i>\n <input id="' + dropId + '-search" type="search" placeholder="Søg">\n </div>'; 1516 var searchString = searchAsYouType ? searchTemplate : ''; 1517 1518 var placeholderString = placeholder; 1519 if (iconDropdown) { 1520 var placeholderIcon = $el.find('.placeholder').data('icon-placeholder'); 1521 placeholderString = '<i class="icon-image placeholder-icon"><img src="' + placeholderIcon + '"></i>'; 1522 } 1523 1524 var desktopClasses = ''; 1525 desktopClasses += iconDropdown ? 'responsive-dropdown-desktop icon-dropdown ' : 'responsive-dropdown-desktop '; 1526 desktopClasses += alignLeft ? 'left-aligned medium-pull-left ' : ''; 1527 1528 desktopTemplate = ['<div data-module="responsive-dropdown-desktop" ' + multiselectString + 'class="' + desktopClasses + '">', '<a data-toggle="' + dropId + '" class="button" href="javascript:void(0)" aria-controls="' + dropId + '" aria-expanded="false" title="' + placeholder + '">', '<span class="prompt">', '<span class="title">', '<span>' + placeholderString + '</span>', '</span>', '<i class="icon-image ' + iconSize + '">', '<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-481 971 16 16" style="enable-background:new -481 971 16 16;" xml:space="preserve"><path class="st0" d="M-473,982.8l7.5-7.5 M-473,982.8l-7.5-7.5"/></svg>', '</i>', '</span>', '</a>', '<div class="dropdown-pane" id="' + dropId + '" data-dropdown data-close-on-click="true" aria-hidden="true" aria-autoclose="true" tabindex="-1">', searchString, '<ul>' + optionsDesktopTemplate.join('') + '</ul>', '</div>', '</div>'].join(''); 1529 $(desktopView).html(desktopTemplate); 1530 1531 var multiselectModule = createModule($el.find('.responsive-dropdown-desktop')); 1532 multiselectModule.onMultiselectChange(multiselectCallback); 1533 1534 dropdownOpenListener(); 1535 1536 if (searchAsYouType) { 1537 setupSearchAsYouType(); 1538 } 1539 } 1540 1541 function multiselectCallback() { 1542 //console.log(multiselectModule.getSelected()); 1543 if (multiselectCallback) multiselectCallback.call(undefined, multiselectModule.getSelected()); 1544 } 1545 1546 function onChange(callback) { 1547 multiselectCallback = callback; 1548 } 1549 1550 var setValue = function setValue(val) { 1551 var $desktopOptions = $el.find('.desktop-view .option'); 1552 $.each($desktopOptions, function (index, option) { 1553 if ($(option).attr('value') === val) $(option).click(); 1554 }); 1555 }; 1556 if (!placeholder || placeholder === '') { 1557 setValue($el.attr('data-selected-value')); 1558 } 1559 1560 $el.on('change', function (event) { 1561 if (iconDropdown) { 1562 // updateIconOnIconDropdown(); 1563 } 1564 1565 var $jumper = $el.find('.jumper'); 1566 if ($jumper.length) { 1567 var instance = $jumper.data("module-instance"); 1568 if (instance) instance.destroy(); 1569 } 1570 }); 1571 1572 function updateIconOnIconDropdown() { 1573 var val = $el.data('selected-value'); 1574 var $desktopOptions = $el.find('.desktop-view .option'); 1575 var iconSrc = ''; 1576 // console.log(val); 1577 $.each($desktopOptions, function (index, option) { 1578 if ($(option).attr('value') === val) { 1579 iconSrc = $(option).attr('icon-placeholder'); 1580 // console.log(iconSrc); 1581 } 1582 }); 1583 1584 var toggleButton = $el.find('a.button[data-toggle]'); 1585 var placeholderString = '<i class="icon-image placeholder-icon"><img src="' + iconSrc + '"></i>'; 1586 1587 toggleButton.find('.prompt .title').html(placeholderString); 1588 } 1589 1590 $el.on('select', function (event, val) { 1591 event.preventDefault(); 1592 event.stopPropagation(); 1593 setValue(val); 1594 1595 }); 1596 1597 // Switch component 1598 function switchComponent() { 1599 1600 if (mobileView && desktopView) { 1601 if (domUtil.viewport().width < 768) { 1602 $(mobileView).show(); 1603 $(desktopView).hide(); 1604 } else { 1605 $(desktopView).show(); 1606 $(mobileView).hide(); 1607 } 1608 } else if (mobileView && !desktopView) { 1609 $(mobileView).show(); 1610 } else if (desktopView && !mobileView) { 1611 $(desktopView).show(); 1612 } 1613 } 1614 switchComponent(); 1615 1616 // Resize handler 1617 $(window).on('resize', function (event) { 1618 switchComponent(); 1619 }); 1620 1621 return { 1622 onChange: onChange, 1623 setValue: setValue 1624 }; 1625}; 1626 1627'use strict'; 1628DB['responsive-dropdown-mobile'] = function (el) { 1629 var $el = $(el); 1630 var $select = $el.find('select'); 1631 var $prompt = $el.find('.prompt .title span'); 1632 var $responsiveDropdown = $el.closest('.responsive-dropdown'); 1633 1634 $select.on('change', update); 1635
1636 function update() { 1637 var $desktopView = $el.parent().siblings('.desktop-view'); 1638 var $desktopPrompt = $desktopView.find('.prompt .title span'); 1639 var $desktopDropdown = $desktopView.find('[data-dropdown-content]'); 1640 1641 var $option = $select.find(':selected'); 1642 if ($option.attr('href')) { 1643 location.href = $option.attr('href'); 1644 } 1645 1646 $responsiveDropdown.attr('data-selected-value', $option.val()); 1647 $prompt.text($option.text()); 1648 $select.attr("data-selected-value", $option.val()); 1649 1650 if ($option.data('placeholder') !== undefined) { 1651 $el.addClass('is-placeholder'); 1652 } else { 1653 $el.removeClass('is-placeholder'); 1654 } 1655 1656 if ($desktopView.length > 0) { 1657 $desktopDropdown.find('.option.is-selected').removeClass('is-selected'); 1658 1659 var $newOption = $desktopDropdown.find('.option[value="' + $option.val() + '"]'); 1660 $newOption.addClass('is-selected'); 1661 1662 $desktopView.find('[data-dropdown]').attr('data-selected-value', $option.val()); 1663 $desktopPrompt.text($option.text()); 1664 } 1665 1666 // stelu tilføjet 1667 var selectedValue = $option.val(); 1668 var dropTarget = $responsiveDropdown.data('target'); 1669 if (dropTarget) $("#"+dropTarget).val(selectedValue); 1670 var dropPost = $responsiveDropdown.data('post'); 1671 if (dropPost) eval(dropPost); 1672 1673 1674 } 1675}; 1676 1677'use strict'; 1678 1679DB['responsive-dropdown-desktop'] = function (el) { 1680 var $el = $(el); 1681 var $dropdown = $(el).find('a[data-toggle]'); 1682 var $prompt = $dropdown.find('.prompt .title span'); 1683 var $dropdownPane = $(el).find('[data-dropdown]'); 1684 var $dropdownContent = $(el).find('[data-dropdown] > ul'); 1685 var $options = $dropdownContent.find('.option'); 1686 var $responsiveDropdown = $el.closest('.responsive-dropdown'); 1687 1688 var multiselect = $el.attr('multiselect') != undefined && $el.attr('multiselect') != "false"; 1689 var multiSelected = []; 1690 var multiSelectCallback; 1691 1692 $el.foundation(); 1693 1694 function onMultiselectChange(callback) { 1695 multiSelectCallback = callback; 1696 } 1697 1698 function getSelected() { 1699 return multiSelected; 1700 } 1701 1702 if (multiselect) parseMultiselectedOptions(); 1703 function parseMultiselectedOptions() { 1704 var l = $options.length; 1705 for (var i = 0; i < l; i++) { 1706 var option = $($options[i]); 1707 if (option.find('input')[0].checked) multiSelected.push(i); 1708 } 1709 multiSelected.sort(); 1710 } 1711 1712 // $(document).foundation('dropdown', 'reflow'); 1713 1714 setListeners(); 1715 1716 var currentIndex = -1; 1717 1718 function setListeners() { 1719 var i; 1720 var l = $options.length; 1721 for (i = 0; i < l; i++) { 1722 var option = $($options[i]); 1723 option.on('click', onOptionClick); 1724 } 1725 return 0; 1726 } 1727 1728 function getIndex(target) { 1729 var i; 1730 var l = $options.length; 1731 for (i = 0; i < l; i++) { 1732 if (target === $options[i]) return i; 1733 } 1734 return 0; 1735 } 1736 1737 function onOptionClick(e) { 1738 var target = e.currentTarget; 1739 var index = getIndex(target); 1740 if (multiselect) { 1741 event.preventDefault(); 1742 event.stopPropagation(); 1743 1744 onMultiSelection(target, index); 1745 return; 1746 } 1747 1748 setSelection(index); 1749 } 1750 1751 function onMultiSelection(target, index) { 1752 var option = $(target); 1753 option.toggleClass('is-selected'); 1754 1755 var input = option.find('input')[0]; 1756 input.checked = !input.checked; 1757 1758 if (!input.checked) multiSelected.splice(multiSelected.indexOf(index), 1);else multiSelected.push(index); 1759 multiSelected.sort(); 1760 1761 if (multiSelectCallback) multiSelectCallback.call(); 1762 } 1763 1764 function setSelection(index) { 1765 currentIndex = index; 1766 setInput($options[index]); 1767 } 1768 1769 function setInput(optionEl) { 1770 1771 var selectedLabel = $(optionEl).text(); 1772 if ($(optionEl).hasClass('has-sublabel')) { 1773 selectedLabel = $(optionEl).find('.mainlabel').text(); 1774 } 1775 var selectedValue = $(optionEl).attr('value'); 1776 $responsiveDropdown.attr('data-selected-value', selectedValue); 1777 1778 1779 // stelu tilføjet 1780 var dropTarget = $responsiveDropdown.data('target'); 1781 if (dropTarget) $("#"+dropTarget).val(selectedValue); 1782 var dropPost = $responsiveDropdown.data('post'); 1783 if (dropPost) eval(dropPost); 1784 1785 1786 // Clear old 1787 $options.removeClass('is-selected'); 1788 1789 // Set new 1790 $(optionEl).addClass('is-selected'); 1791 $dropdown.attr('data-selected-value', selectedValue); 1792 1793 var placeholderIcon = $(optionEl).attr('icon-placeholder'); 1794 if (placeholderIcon) { 1795 var toggleButton = $el.find('a.button[data-toggle]'); 1796 var placeholderString = '<i class="icon-image placeholder-icon"><img src="' + placeholderIcon + '"></i>'; 1797 1798 $prompt.html(placeholderString); 1799 } else { 1800 $prompt.text(selectedLabel); 1801 } 1802 1803 // added stelu 1804 if ($responsiveDropdown.data('autofit')==true) { 1805 fitIt($responsiveDropdown.parent(),80); 1806 } 1807 1808 // Trigger change 1809 $dropdown.trigger('change', selectedValue); 1810 1811 $dropdownPane.foundation('close'); 1812 1813 var mobileView = $el.parent().siblings('.mobile-view'); 1814 if (mobileView.length > 0) { 1815 mobileView.find('.input-tool-dropdown-mobile').removeClass('is-placeholder'); 1816 mobileView.find('select').attr('data-selected-value', selectedValue); 1817 mobileView.find('.prompt .title span').text(selectedLabel); 1818 } 1819 } 1820 1821 /* 1822 Date range selection in the dropdown pane 1823 */ 1824 var dateRange = $el.find('.dropdown-pane div[date-range]'); 1825 if (dateRange) { 1826 var inputs = dateRange.find('input'); 1827 var apply = dateRange.find('.date-range-apply a'); 1828 inputs.placeholder(); 1829 var fromInput = dateRange.find('div[from] input'); 1830 var toInput = dateRange.find('div[to] input'); 1831 var format = /^((0[1-9])|(1[0-2]))\.(\d{4})$/; 1832 1833 inputs.on('keydown', function (event) { 1834 if (event.keyCode === 13) { 1835 checkInput(); 1836 event.preventDefault(); 1837 } 1838 }); 1839 1840 apply.on('click', function (event) { 1841 checkInput(); 1842 event.preventDefault(); 1843 }); 1844 } 1845 1846 var checkInput = function checkInput() { 1847 if (format.test(fromInput.val()) && format.test(toInput.val())) { 1848 var fromMonth = fromInput.val().split('.')[0]; 1849 var fromYear = fromInput.val().split('.')[1]; 1850 var toMonth = toInput.val().split('.')[0]; 1851 var toYear = toInput.val().split('.')[1]; 1852 fromInput.attr('value', '01-' + fromMonth + '-' + fromYear); 1853 toInput.attr('value', '01-' + toMonth + '-' + toYear); 1854 1855 $prompt.text(fromInput.val() + ' - ' + toInput.val()); 1856 1857 1858 // added stelu 1859 var dropTarget = $responsiveDropdown.data('target'); 1860 if (dropTarget) $("#"+dropTarget).val(fromInput.val() + ' - ' + toInput.val()); 1861 var dropPost = $responsiveDropdown.data('post'); 1862 if (dropPost) eval(dropPost); 1863 if ($responsiveDropdown.data('autofit')==true) fitIt($responsiveDropdown.parent(),80); 1864 1865 1866
1867 // updateOnDateChange(fromDate, toDate); 1868 } 1869 }; 1870 1871 var updateOnDateChange = function updateOnDateChange(fromDate, toDate) {}; 1872 1873 return { 1874 onMultiselectChange: onMultiselectChange, 1875 getSelected: getSelected 1876 }; 1877}; 1878 1879'use strict'; 1880DB['table-sortable'] = function (el) { 1881 var $el = $(el); 1882 var $tableHeader = $el.find('thead'); 1883 1884 if ($el.get(0).tagName.toLowerCase() != 'table') { 1885 throw new Error('The data-module attribute should be placed on the <table> element'); 1886 } 1887 1888 $tableHeader.find('th[sortable=true]').each(function () { 1889 1890 var th = $(this), 1891 thIndex = th.index(), 1892 inverse = false, 1893 currentSort = null; 1894 1895 th.click(function () { 1896 //Clear the currently sorted row's icon if not the same as the clicked one 1897 currentSort = $tableHeader.find('.sorted, .sorted-inverted'); 1898 if (currentSort.index() != th.index()) currentSort.removeClass('sorted sorted-inverted'); 1899 1900 //Toggle icon up or down 1901 if (!th.hasClass('sorted') && !th.hasClass('sorted-inverted')) { 1902 th.toggleClass('sorted'); 1903 inverse = false; //always sort ascending when it's a "new" row. 1904 } else { 1905 th.toggleClass('sorted-inverted'); 1906 th.toggleClass('sorted'); 1907 } 1908 1909 $el.find('td').filter(function () { 1910 return $(this).index() === thIndex; 1911 }).sortElements(function (a, b) { 1912 return $.text([a]) > $.text([b]) ? inverse ? -1 : 1 : inverse ? 1 : -1; 1913 }, function () { 1914 // parentNode is the element we want to move 1915 return this.parentNode; 1916 }); 1917 inverse = !inverse; 1918 }); 1919 }); 1920 1921}; 1922'use strict'; 1923 1924DB['responsive-table-prioritized'] = function (el) { 1925//console.log("checkwidth init"); 1926 var domUtil = DB['dom-util']; 1927 var createModule = DB.moduleFactory.createModule; 1928 1929 var $el = $(el); 1930 var $table = $el.find('table'); 1931 var $tableHeader = $el.find('thead'); 1932 var $tableBody = $el.find('tbody'); 1933 var $columns = $el.find('.table-header-column'); 1934 var $headersWithPriority = $tableHeader.find('th[priority]'); 1935 var currentlySelected = []; 1936 1937 var currentPriority = 0; 1938 var highestPriority = 0; 1939 1940 if ($headersWithPriority.length > 0) { 1941 $headersWithPriority.each(function () { 1942 var priority = parseInt($(this).attr('priority'), 10); 1943 currentPriority = highestPriority = Math.max(highestPriority, priority); 1944 }); 1945 } 1946 1947 var lastBreakpoint = $table.outerWidth(); 1948 var breakpoints = [lastBreakpoint]; 1949 1950 function checkWidth() { 1951 1952 var elWidth = $el.outerWidth(); 1953 if (elWidth === 0) return; 1954 var tableWidth = $table.outerWidth(); 1955 var lastBreakpoint = breakpoints[breakpoints.length - 1]; 1956 1957 if (tableWidth > elWidth) { 1958 1959 $headersWithPriority.each(function () { 1960 var header = $(this); 1961 var headerWidth = header.outerWidth(); 1962 var priority = parseInt(header.attr('priority'), 10); 1963 if (priority >= currentPriority && !header.hasClass('hide')) { 1964 1965 header.addClass('hide'); 1966 $tableBody.find('tr').each(function () { 1967 $(this).find('td').eq(header.index()).addClass('hide'); 1968 }); 1969 breakpoints.push(tableWidth); 1970 } 1971 }); 1972 if (currentPriority > 0) { 1973 currentPriority--; 1974 checkWidth(); //Recheck in case it's on page load - unless we're already at lowest priority. 1975 } 1976 } else if (tableWidth > lastBreakpoint && currentPriority < highestPriority) { 1977 var hiddenHeaders = $tableHeader.find('.hide'); 1978 1979 hiddenHeaders.each(function () { 1980 var header = $(this); 1981 var headerWidth = header.outerWidth(); 1982 var priority = parseInt(header.attr('priority'), 10); 1983 1984 if (priority - 1 === currentPriority) { 1985 1986 header.removeClass('hide'); 1987 $tableBody.find('tr').each(function () { 1988 $(this).find('td').eq(header.index()).removeClass('hide'); 1989 }); 1990 breakpoints.pop(); 1991 } 1992 }); 1993 1994 if (hiddenHeaders.length > 0) currentPriority++; 1995 } 1996 1997 } 1998 1999 2000 //Wait till element is ready for better calculations - we're hiding it until then. 2001 setTimeout(function () { 2002 2003 if (highestPriority > 0) { 2004// console.log("checkwidth prio 1"); 2005 checkWidth(); 2006// console.log("checkwidth prio 2"); 2007 } 2008 $table.addClass('ready'); 2009 2010 }, 0); 2011 2012 2013 $(window).on('resize', function (event) { 2014 if (highestPriority > 0) { 2015 checkWidth(); 2016 } 2017 }); 2018 2019 2020 function Dropdown() { 2021 var that = this; 2022 var dropdownID = 'dropdown' + Math.random().toString().split('.')[1]; 2023 var dropdownModule; 2024 2025 this.init = function () { 2026 if ($columns.length > 2) { 2027 that.add(); 2028 } 2029 return this; 2030 }; 2031 2032 this.add = function () { 2033 var insertOptions = function insertOptions() { 2034 var options = []; 2035 $columns.each(function (index, column) { 2036 var optionID = 'option' + Math.random().toString().split('.')[1]; 2037 var option = ['<div data-checkbox="' + optionID + '" class="option" data-checked="true">' + $(column).text() + '</div>'].join(''); 2038 options.push(option); 2039 currentlySelected.push(index); 2040 }); 2041 return options; 2042 }; 2043 var template = ['<div data-module="responsive-dropdown" data-dropdown-id="' + dropdownID + '" class="responsive-dropdown">', '<div class="data">', '<div class="placeholder">Select</div>' + insertOptions() + '</div>', '<div class="mobile-view"></div>', '<div class="desktop-view"></div>', '</div>'].join(''); 2044 that.render(template); 2045 return this; 2046 }; 2047 2048 this.render = function (template) { 2049 $el.prepend(template); 2050 dropdownModule = createModule($el.find('[data-dropdown-id="' + dropdownID + '"]')); 2051 dropdownModule.onChange(onDropdownChange); 2052 }; 2053 } 2054 2055 function onDropdownChange(selected) { 2056 toggleColumns(selected); 2057 } 2058 2059 function symmetricDifference(a1, a2) { 2060 var result = []; 2061 for (var i = 0; i < a1.length; i++) { 2062 if (a2.indexOf(a1[i]) === -1) { 2063 result.push(a1[i]); 2064 } 2065 } 2066 2067 for (i = 0; i < a2.length; i++) { 2068 if (a1.indexOf(a2[i]) === -1) { 2069 result.push(a2[i]); 2070 } 2071 } 2072 return result; 2073 } 2074 2075 function toggleColumns(selected) { 2076 var diff = symmetricDifference(currentlySelected, selected); 2077 2078 currentlySelected = selected.slice(); 2079 2080 for (var i = 0; i < diff.length; i++) { 2081 var columnIndex = diff[i]; 2082 var header = $tableHeader.find('.table-header-column').eq(columnIndex); 2083 header.toggleClass('hide'); 2084 2085 $tableBody.find('tr').each(function () { 2086 $(this).find('.table-data-value').eq(columnIndex).toggleClass('hide'); 2087 }); 2088 } 2089 } 2090 2091 if ($el.attr('column-selector') != undefined && $el.attr('column-selector') != 'false') new Dropdown().init(); 2092 return { 2093 checkWidth: checkWidth 2094 }; 2095}; 2096 2097'use strict'; 2098 2099DB['favourite-product'] = function (el) { 2100 var $el = $(el); 2101 var favourites = null; 2102 var eventBus = DB['event-bus']; 2103 var isShowing = false;
2104 var button = $el.find('button'); 2105 2106 function init() { 2107 button.on('click', toggleFavouritesView); 2108 getFavourites(); 2109 } 2110 init(); 2111 2112 function toggleFavouritesView(event) { 2113 event.preventDefault(); 2114 isShowing = !isShowing; 2115 $el.toggleClass('active'); 2116 isShowing ? eventBus.trigger('FAVOURITES_ON', '') : eventBus.trigger('FAVOURITES_OFF', ''); 2117 } 2118 2119 function getFavourites() { 2120 return favourites = JSON.parse(localStorage.getItem('DI-favourites')) || []; 2121 } 2122 2123 function toggleFavourite(id) { 2124 var index = !favourites.length ? -1 : favourites.indexOf(id); 2125 if (index < 0) { 2126 favourites.push(id); 2127 } else { 2128 favourites.splice(index, 1); 2129 } 2130 updateStorage(); 2131 } 2132 2133 function updateStorage() { 2134 localStorage.setItem('DI-favourites', JSON.stringify(favourites)); 2135 } 2136 2137 return { 2138 toggleFavourite: toggleFavourite, 2139 getFavourites: getFavourites 2140 }; 2141}; 2142 2143'use strict'; 2144DB['searchfield-button'] = function (el) { 2145 var $el = $(el); 2146 var searchfield = $el.find('.searchfield-input'); 2147 var input = $el.find('input'); 2148 var background = $el.find('.searchfield-background'); 2149 var button = $el.find('button.button'); 2150 var expanded = false; 2151 var clearButton = $el.find('.searchfield-clear'); 2152 var eventBus = DB['event-bus']; 2153 var query = ''; 2154 2155 button.on('click', function (event) { 2156 event.preventDefault(); 2157 if (expanded) { 2158 collapse(); 2159 } else { 2160 expand(); 2161 input.focus(); 2162 } 2163 }); 2164 2165 clearButton.on('click', function () { 2166 input.val(''); 2167 eventBus.trigger('SEARCHFIELD_QUERY', ''); 2168 input.focus(); 2169 event.preventDefault(); 2170 }); 2171 2172 input.on('keydown', function (event) { 2173 if (event.keyCode === 13) event.preventDefault(); 2174 }); 2175 2176 input.on('keyup', function (event) { 2177 event.preventDefault(); 2178 if (input.val() != query) { 2179 query = input.val(); 2180 eventBus.trigger('SEARCHFIELD_QUERY', query); 2181 } 2182 }); 2183 2184 var expand = function expand() { 2185 // button.css('width', '400px'); 2186 button.addClass('expanded'); 2187 searchfield.show(); 2188 clearButton.show(); 2189 }; 2190 2191 var collapse = function collapse() { 2192 // button.css('width', '48px'); 2193 button.removeClass('expanded'); 2194 searchfield.hide(); 2195 clearButton.hide(); 2196 }; 2197 2198 input.on('blur', function () { 2199 if (input.val() === '') { 2200 collapse(); 2201 } 2202 }); 2203 2204 function enabled(value) { 2205 button[0].disabled = !value; 2206 } 2207 2208 return { 2209 expand: expand, 2210 enabled: enabled 2211 }; 2212}; 2213 2214'use strict'; 2215DB['rating'] = function (el) { 2216 var $el = $(el); 2217 var rating = $el.attr('rating'); 2218 var stars = $el.find('.icon-image'); 2219 2220 var len = parseInt(rating, 10); 2221 for (var i = 0; i < len; i++) { 2222 stars.eq(i).addClass('filled'); 2223 } 2224}; 2225 2226 2227// fitter indhold i responive dropdowns....STELU 2228function fitIt($el, $extra) { 2229// console.log("autoFit"); 2230 //console.log($el.html()); 2231 var nSize = 0; 2232 var $text = $el.find(".prompt"); 2233 var canvas = document.createElement('canvas'); 2234 if (canvas && canvas.getContext) { 2235 var context = canvas.getContext('2d'); 2236 context.font = $text.css('font-size') + ' ' + $text.css('font-family'); 2237 var textMetrics = context.measureText($text.last().text()); 2238 nSize = Math.ceil(textMetrics.width); 2239 } 2240 var nMin = $el.parent().width(); 2241 if (nMin > 0 && nSize > 0) { 2242 2243 var nSum = (+nSize)+(+$extra); 2244 2245 if (nSum > nMin) { 2246 $text.find(".title").find("span").width(nSum+"px"); 2247 $el.animate({width:(nSum)+"px"},"fast"); 2248 //console.log("fit1"); 2249 } else { 2250 $text.find(".title").find("span").width(nSum+"px"); 2251 $el.animate({width:nMin+"px"},"fast"); 2252 //console.log("fit2"); 2253 } 2254 } 2255 2256// console.log("old="+nMin); 2257// console.log("new="+nSize); 2258} 2259 2260// slider-variant af STELU 2261DB['slider'] = function (el) { 2262 var utils = DB.utils; 2263 var $el = $(el); 2264 var $rangeSlider = $el.find('[data-slider]'); 2265 var $rangeSliderHandle = $rangeSlider.find('.slider-handle'); 2266 var $rangeSliderValueDrag = $rangeSlider.find('.value-drag'); 2267 var $rangeSliderValueDragText = $rangeSliderValueDrag.find('.value'); 2268 var $labelsContainer = $el.find('.slider-labels'); 2269 var $labelsListItems = $el.find('.slider-labels > ul > li'); 2270 var $buttonDelete = $el.find('.slider-delete > a'); 2271 var $buttonToggleDesc = $el.find('[data-toggle-desc]'); 2272 var $rowDesc = $el.find('.row-desc'); 2273 var $desc = $el.find('.slider-desc'); 2274 var $descHeight = 0; 2275 var $descOpen = false;
2276 2277 init(); 2278 2279 function init() { 2280// console.log('start'); 2281 $($rangeSlider).on('moved.zf.slider', onChange); 2282 2283 2284 if ($rangeSliderValueDrag) { 2285 $($rangeSliderHandle).on('mousedown touchstart', showDragValue); 2286 $(window).on('mouseup touchend', hideDragValue); 2287 } 2288 2289 $(window).on('resize', function (event) { 2290 if ($labelsContainer[0]) renderIntervalLabels(); 2291 if ($buttonToggleDesc && $desc.length) getDescHeight(); 2292 }); 2293 2294 if ($buttonToggleDesc && $desc.length) { 2295 $buttonToggleDesc.on('click', toggleDesc); 2296 } 2297 2298 if ($labelsContainer[0]) { 2299 renderIntervalLabels(); 2300 } 2301 2302 if ($buttonDelete) { 2303 $buttonDelete.on('click', onDelete); 2304 } 2305 2306 //STELU 2307 $($rangeSlider).on('mouseup touchend keyup', onDone); 2308 var $value = $el.find('.slider-value input'); 2309 var $slider = $el.find('.slider'); 2310 var $sliderTarget = $slider.data('target'); 2311// console.log('debug:'+$sliderTarget); 2312 if ($sliderTarget) $("#"+$sliderTarget).val($value.val()); 2313 2314 } 2315 2316 function showDragValue() { 2317 $rangeSliderValueDrag[0].style.visibility = 'visible'; 2318 } 2319 2320 function hideDragValue() { 2321 $rangeSliderValueDrag[0].style.visibility = 'hidden'; 2322 } 2323 2324 function onDelete(event) { 2325 event.preventDefault(); 2326 $el.trigger('DELETE'); 2327 } 2328 2329 function getDescHeight() { 2330 $descHeight = $desc[0].offsetHeight + 30; 2331 } 2332 2333 function toggleDesc(event) { 2334 event.preventDefault(); 2335 $descOpen = !$descOpen; 2336 $buttonToggleDesc.toggleClass('is-open'); 2337 getDescHeight(); 2338 TweenMax.to($rowDesc, .2, { height: $descOpen ? $descHeight : 0, ease: Circ.easeOut }); 2339 } 2340 2341 function onChange(event) { 2342 var val = $rangeSliderHandle.attr('aria-valuenow'); 2343 var amount = utils.formatAmount(Math.round(val)); 2344 if ($rangeSliderValueDrag) { 2345 $rangeSliderValueDragText.text(amount); 2346 $rangeSliderValueDrag[0].style.left = $rangeSliderHandle[0].style.left; 2347 } 2348 } 2349 2350 function onDone(event) { 2351 //STELU 2352 var $value = $el.find('.slider-value input'); 2353 var $slider = $el.find('.slider'); 2354 2355 var $sliderTarget = $slider.data('target'); 2356 var $sliderPost = $slider.data('post'); 2357 2358 if ($sliderTarget) $("#"+$sliderTarget).val($value.val()); 2359 if ($sliderPost) eval($sliderPost); 2360 2361 } 2362 2363 2364 function renderIntervalLabels() { 2365 var numLabels = $labelsListItems.length; 2366 2367 if (numLabels > 1) { 2368 $($labelsContainer).css('marginLeft', -50 / (numLabels - 1) + '%'); 2369 $($labelsContainer).css('marginRight', -50 / (numLabels - 1) + '%'); 2370 } 2371 } 2372}; 2373'use strict'; 2374 2375DB['social-buttons'] = function (el) { 2376 var $el = $(el); 2377 var utils = DB["utils"]; 2378 2379 $el.on("click", "[data-action*=share-on]", handleSocialButtonClick); 2380 2381 function handleSocialButtonClick(e) { 2382 var $button = $(e.currentTarget); 2383 2384 switch ($button.attr("data-action")) { 2385 case "share-on-facebook": 2386 shareOnFacebook(); 2387 break; 2388 case "share-on-twitter": 2389 shareOnTwitter(); 2390 break; 2391 case "share-on-linkedin": 2392 shareOnLinkedIn(); 2393 break; 2394 case "share-on-mail": 2395 shareViaEmail(); 2396 break; 2397 case "share-on-print": 2398 printDialog(); 2399 break; 2400 default: 2401 throw new Error("@data-action didn't match any cases"); 2402 } 2403 2404 return false; 2405 } 2406 2407 function printDialog() { 2408 window.print(); 2409 } 2410 2411 function shareViaEmail() { 2412 var $emailShareButton = $el.find("[data-action=share-on-mail]"); 2413 var receiver = $emailShareButton.attr("data-receiver") || ""; 2414 var subject = $emailShareButton.attr("data-mail-subject") || $('meta[property="og:title"]').attr("content") || ""; 2415 var message = $emailShareButton.attr("data-mail-message") || $('meta[property="og:description"]').attr("content") || ""; 2416 var link = encodeURIComponent(window.location.href); 2417 2418 var str = "mailto:" + receiver + "?subject=" + subject + "&body=" + message + "%0D%0A%0D%0A" + link; 2419 document.location=str; 2420 } 2421 2422 /* 2423 Docs at https://developer.linkedin.com/docs/share-on-linkedin (Under customized url) 2424 */ 2425 function shareOnLinkedIn() {
2426 var $linkedInShareButton = $el.find("[data-action=share-on-linkedin]"); 2427 2428 //Specify a title for the shared link by setting @data-linkedin-share-title on the button. Falls back to nothing (which will cause linkedin to scrape the link and use og:title) 2429 var title = $linkedInShareButton.attr("data-linkedin-share-title") || ""; 2430 2431 //Specify a summary for the shared link by setting @data-linkedin-share-summary on the button. Falls back to nothing (which will cause linkedin to scrape the link and use og:description) 2432 var summary = $linkedInShareButton.attr("data-linkedin-share-summary") || ""; 2433 2434 utils.openWindow(utils.constructQueryString("https://www.linkedin.com/shareArticle", { 2435 url: window.location.href, 2436 mini: true, //Required by linkedin and must always be true 2437 title: title, 2438 summary: summary, 2439 source: "danskebank" 2440 }), "Share news on LinkedIn", //Window title 2441 520, //Recommended window width by linkedin 2442 570 //Recommended window height by linkedin 2443 ); 2444 } 2445 2446 /* 2447 Docs at https://dev.twitter.com/web/tweet-button/web-intent 2448 */ 2449 function shareOnTwitter() { 2450 var $tweetShareButton = $el.find("[data-action=share-on-twitter]"); 2451 2452 //Specify prepopulated text for the tweet by setting @data-tweet-text on the button. Falls back to nothing 2453 var text = $tweetShareButton.attr("data-tweet-text") || ""; 2454 2455 //Specify hashtags after the url by setting @data-tweet-hashtags on the button. Falls back to nothing 2456 var hashtags = $tweetShareButton.attr("data-tweet-hashtags") || ""; 2457 2458 utils.openWindow(utils.constructQueryString("https://twitter.com/intent/tweet", { 2459 url: window.location.href, 2460 text: text, 2461 hashtags: hashtags, 2462 via: "DanskeBank_DK" 2463 }), "Post a tweet on Twitter", //Window title 2464 550, //Recommended window width by twitter 2465 420 //Recommended window height by twitter 2466 ); 2467 } 2468 2469 /* 2470 Docs at https://developers.facebook.com/docs/javascript/reference/FB.ui 2471 */ 2472 function shareOnFacebook() { 2473 FB.ui({ 2474 method: "share", 2475 href: window.location.href, 2476 link: window.location.href 2477 }); 2478 } 2479}; 2480'use strict'; 2481 2482DB['step'] = function (el) { 2483 2484 /* 2485 1. Store elements 2486 2. Set width and height for all indicator elements 2487 3. Set position for states 2488 4. Handle types of step indicators 2489 5. Click handler for indicatorLink 2490 6. Calculate steps 2491 7. Resize handler 2492 */ 2493 2494 // 1. Store elements 2495 var $el = $(el); 2496 var utils = DB.utils; 2497 var stepType = $el.data('step-type'); 2498 var $stepTrack = $el.find('.step-track'); 2499 var $stepsHidden = $el.find('.steps-hidden'); 2500 var $indicator = $el.find('.step-indicator'); 2501 var $indicatorLink = $el.find('.step-indicator-link'); 2502 var $state = $el.find('.step-state'); 2503 var indicatorLength = $indicator.length; 2504 var indicatorLast = $indicator[indicatorLength - 1]; 2505 2506 // 2. Set width and height for all indicators 2507 var height = function height() { 2508 switch (stepType) { 2509 case 'light': 2510 return 21; 2511 break; 2512 case 'regular': 2513 var regularHeight; 2514 regularHeight = 40; 2515 2516 // added stelu 2517 if ($el.data('autoshrink')==true) { 2518 var $elWidth = $el.outerWidth(); 2519 //console.log("width "+$elWidth); 2520 //console.log("antal "+indicatorLength); 2521 //console.log("gnm "+($elWidth-(indicatorLength*20))/indicatorLength); 2522 if (($elWidth-(indicatorLength*20))/indicatorLength < 40) { 2523 regularHeight = Math.floor(($elWidth-(indicatorLength*20))/indicatorLength); 2524 } 2525 } 2526 2527 return regularHeight; 2528 break; 2529 case 'extended': 2530 return 40; 2531 case 'complex': 2532 console.log($el.outerWidth()); 2533 if ($el.outerWidth()<800) { 2534 return 25; 2535 } else { 2536 return 40; 2537 } 2538 2539 } 2540 }; 2541 2542 $($indicator).each(function () { 2543 $(this).css('width', height); 2544 $(this).css('height', height); 2545 if ($(this).hasClass('active')) { 2546 $(this).find('.step-indicator-link').addClass('active'); 2547 $(this).find('.step-state').addClass('active'); 2548 if (stepType == 'regular') { 2549 $(this).find('.step-indicator-wrapper').addClass('active'); 2550 } 2551 } 2552 if ($(this).hasClass('mandatory')) { 2553 var mandatory = ['<span class="step-mandatory">', '*', '</span>'].join(''); 2554 var wrapper = $(this).find('.step-indicator-wrapper'); 2555 var link = $(this).find('.step-indicator-link'); 2556 wrapper.find('.step-indicator-wrapper').add(mandatory).insertBefore(link); 2557 } 2558 }); 2559 2560 // 3. Set position for states 2561 $($state).each(function () { 2562 var stateWidth = $(this).width(); 2563 $(this).css('marginLeft', -stateWidth / 2); 2564 }); 2565
2566 // 4. Handle icon for collapsed steps 2567 switch (stepType) { 2568 case 'extended': 2569 case 'complex': 2570 var template = ['<li class="step-indicator steps-hidden">', '<span class="step-indicator-wrapper">', '<a href="javascript:void(0)" role="tab" class="step-indicator-link">', '<span class="step-indicator-label">', '<img alt="" src="/image/more.png" />', '</span>', '</a>', '</span>', '</li>'].join(''); 2571 $($indicator).add(template).insertBefore(indicatorLast); 2572 $el.find('.steps-hidden').css('width', height); 2573 $el.find('.steps-hidden').css('height', height); 2574 break; 2575 } 2576 2577 // 5. Click handler for indicatorLink 2578 $indicatorLink.on('click', function (e) { 2579 2580 e.preventDefault(); 2581 $(e.currentTarget).blur(); 2582 2583 // Only for actual steps 2584 if ($(e.currentTarget).parent().parent()[0] != $($stepsHidden)[0]) { 2585 // Get information about states 2586 var allStates = $indicatorLink.parent().find('.step-state'); 2587 var currentState = $(this).parent().find('.step-state'); 2588 var currentStateWidth; 2589 2590 // Toggle status in indicators 2591 $indicator.removeClass('active'); 2592 $indicatorLink.removeClass('active'); 2593 $(this).addClass('active'); 2594 $(e.currentTarget).parent().parent().addClass('active'); 2595 2596 // // Toggle status in states 2597 allStates.removeClass('active'); 2598 currentState.addClass('active'); 2599 2600 // Handle types of step indicators 2601 switch (stepType) { 2602 case 'light': 2603 // console.log('light') 2604 break; 2605 case 'regular': 2606 $($indicator).css('width', height); 2607 $($indicator).css('height', height); 2608 $($indicator).find('.step-indicator-wrapper').removeClass('active'); 2609 $(e.currentTarget).parent().parent().css('width', height); 2610 $(e.currentTarget).parent().parent().css('height', height); 2611 $(e.currentTarget).parent().addClass('active'); 2612 break; 2613 case 'extended': 2614 break; 2615 case 'complex': 2616 // console.log('extended') 2617 break; 2618 } 2619 } 2620 onChange(true); 2621 }); 2622 2623 // 6. Calculate steps 2624 function calcSteps() { 2625 var containerWidth = $stepTrack.outerWidth(); 2626 var stepsWidth = 0; 2627 var dots = $el.find('.steps-hidden'); 2628 switch (stepType) { 2629 case 'extended': 2630 case 'complex': 2631 $($indicator).each(function (index, element) { 2632 stepsWidth = stepsWidth + $(this).outerWidth(true); 2633 // Toggle visibility for steps 2634 if (index != indicatorLength - 1 && element != dots[0] && stepsWidth > containerWidth - $(this).outerWidth(true) * 2) { 2635 $(this).hide(); 2636 } else { 2637 $(this).show(); 2638 } 2639 }); 2640 // Toggle visibility for dots 2641 if ($($indicator[indicatorLength - 2]).is(":hidden")) { 2642 $el.find('.steps-hidden').show(); 2643 } else { 2644 $el.find('.steps-hidden').hide(); 2645 } 2646 break; 2647 } 2648 2649 2650 } 2651 calcSteps(); 2652 2653 // 7. Resize handler 2654 $(window).on('resize', function (event) { 2655 calcSteps(); 2656 }); 2657 2658 function onChange(bSubmit) { 2659 // stelu tilføjet 2660 $($indicator).each(function (index, element) { 2661 if ($(this).hasClass('active')) { 2662 if ($(this).attr('value')) { 2663 var selectedValue = $(this).attr('value'); 2664 } else { 2665 var selectedValue = index; 2666 } 2667 //console.log(selectedValue); 2668 var dropTarget = $el.data('target'); 2669 if (dropTarget) $("#"+dropTarget).val(selectedValue); 2670 if (bSubmit) { 2671 var dropPost = $el.data('post'); 2672 if (dropPost) eval(dropPost); 2673 } 2674 } 2675 }); 2676 2677 } 2678 onChange(false); 2679}; 2680'use strict';
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.