|
- const $ = global.$;
- // Plain InfiniteScroll without jquery plugin to avoid overhead
- // If needed plase see https://v3.infinite-scroll.com/extras.html
- // $(elem).infiniteScroll does not work
- // For API Reference See Vanila js Section of docs
- const InfiniteScroll = require('infinite-scroll');
-
- import {EtrackerUtils} from "./EtrackerUtils";
-
- export class SearchUtils {
- static loadResults() {
- this.shouldPreloadSearchEnteries = false;
- this.initEventsScrollPreservance();
- this.initialSearchRequest();
- }
-
- static initialSearchRequest(){
- const query = $('#query').val();
- const querySource = $('#querySource').val();
- const infiniteScrollInstance = InfiniteScroll.data(".search-results #dummy-wrapper");
- $(".results-wrapper").detach();
- $(".search-hits").empty();
- if(infiniteScrollInstance instanceof InfiniteScroll){
- infiniteScrollInstance.destroy();
- }
- // ETracker-Event asynchron absetzen:
- if (query.length > 0) {
- const searchCategory = $("#query").data('search-category'), hasCategory = typeof searchCategory !== "undefined";
- if (!window.isPbe) {
- window.setTimeout(EtrackerUtils.fireETrackerEvent, 250,
- (hasCategory ? searchCategory : 'Kombi-Suche'), query,
- 'Suche', '');
- }
- }
-
- $('#infscr-initial-loading').show();
-
- const ajaxUrl = $('.search-results').data("initialsearch-url")
- + "?preSearch=oidSearch&querySource=" + encodeURIComponent(querySource) + "&query="
- + encodeURIComponent(query) + SearchUtils.getQueryParameter();
- const resultWrapper = $("#dummy-wrapper");
-
-
- $.ajax({
- url: ajaxUrl,
- success: function (result) {
- $(resultWrapper).append(result);
- // oidSearch redirect:
- var rUrl = $("#oidmatch").data("redirect-url");
- if (rUrl !== undefined && rUrl.trim().length > 0) {
- location.href = rUrl;
- } else {
- SearchUtils.initInfiniteScroll();
- SearchUtils.initFeedbackToggle();
- SearchUtils.fillSearchCategoryAddition(query);
- $('#infscr-initial-loading').hide();
-
- }
- }
- });
- if (window.OMQHelp && query.length >0) {
- if (window.history.replaceState) {
- const cleanUrl = window.location.origin + window.location.pathname;
- window.history.replaceState(null, '', cleanUrl);
- }
- const omqAccount = $("#omq-help-container").data('omq-help-account');
- window.OMQHelp.update({
- query: query,
- account: omqAccount
- });
- }
- }
-
- /**
- * Dient zum Ein/Ausblenden der Feedback Funktion von Einschub-Suchen.
- * (insbesondere dem Wegweiser)
- */
- static initFeedbackToggle() {
- $('#feedbackToggle').click(function () {
- var feedbackBlock = $('#feedbackBlock');
- if (feedbackBlock.is(':hidden')) {
- $.ajax({
- url: $(this).data("feedback-url"),
- success: function (result) {
- // TODO: Feedback form prüfen
- $(feedbackBlock).append($(result));
- console.log($(result).find("#feedbackBlock"));
- $(this).show('slow');
- SearchUtils.initFeedback();
- }
- });
-
- } else {
- feedbackBlock.hide('slow');
- }
- return false;
- });
- }
-
- /**
- * Feedback Formular für Einschub-Suchen.
- */
- static initFeedback() {
- $('#feedbackBlock').find('form').submit(
- function () {
- $
- .post($('#feedbackToggle').data('feedback-url'), $(
- '#feedbackBlock').find('form').serialize(),
- function (msg) {
- $('#feedbackBlock').html(msg);
- if ($('#feedbackBlock').find('form')
- .size() > 0) {
- SearchUtils.initFeedback();
- } else {
- $('#feedbackToggle').hide();
- }
-
- });
- return false;
- });
- }
-
- static fillSearchCategoryAddition(queryP) {
- const buttonWrapper = $('#searchcategoryaddition');
- const firstWrapper = $('.results-wrapper').first();
- const btnAll = $('<a class="btn btn-small" />');
- const isZeroResults = $('.search-results .results-wrapper').length === 0;
- const isKombiWrapper = $('.search-results').hasClass("kombi-wrapper");
- const searchCategoryAdditionLink = buttonWrapper.attr('data-searchcategoryaddition-link');
- // const searchCategoryAdditionTitle = buttonWrapper.attr('data-searchcategoryaddition-title');
- const defaultSearchText = "Allgemeine Suche";
-
- buttonWrapper.children().remove();
- buttonWrapper.append(btnAll);
-
- // btnAll.text(searchCategoryAdditionTitle);
- btnAll.attr('href', searchCategoryAdditionLink + "?query=" + encodeURIComponent(queryP));
-
- if (isKombiWrapper && !isZeroResults) {
-
- const defaultSearchTextAll = "Alle ";
- const ephasizedText = $('<strong/>').text(`${firstWrapper.attr('data-totalresults')} Treffer`);
-
- btnAll.addClass('active').html(defaultSearchTextAll).append(ephasizedText);
- $('.results-wrapper').not('.no-border').each(function () {
- const rw = $(this);
-
- const btn = $('<a />').addClass('btn btn-small primary-light').attr('href', rw.attr('data-searchcategoryaddition-link')).appendTo(buttonWrapper);
- let txt = rw.attr('data-searchcategoryaddition-title');
- if (rw.attr('data-result-count') !== undefined) {
- txt = txt + ' (' + rw.attr('data-result-count') + ')';
- }
- btn.text(txt);
- })
-
- } else if(!isKombiWrapper){
- buttonWrapper.insertAfter('.search-filter-form');
- btnAll.text(defaultSearchText);
- btnAll.addClass("primary-light");
- btnAll.attr('href', buttonWrapper.attr('data-searchcategoryaddition-link') + "?query=" + encodeURIComponent(queryP));
-
- } else {
- buttonWrapper.children().remove();
- }
-
-
- }
-
- /**
- * Berechnet die Url-Parameter für die Suchfilter.
- */
- static getQueryParameter() {
- var queryFields = $('#ev-search-filter-form').find('[data-queryparam]');
- var queryParams = "";
- if (queryFields.length) {
- var input = queryFields.filter('input[type!="checkbox"]');
- if (input.length) {
- queryParams = queryParams + "&" + $.param(input);
- }
- var select = queryFields.filter('select');
- if (select.length) {
- queryParams = queryParams + "&" + $.param(select);
- }
- var check = queryFields.filter('input[type="checkbox"]:checked');
- if (check.length) {
- queryParams = queryParams + "&" + $.param(check);
- }
- }
- return queryParams;
- }
-
-
- /**
- * Berechnet die Url-Parameter für die Seitenpaginierung.
- */
- static getPagingParameter() {
- var params = "";
-
- var resultWrapper = $('.results-wrapper');
- if (resultWrapper.length) {
- var total = resultWrapper.data("totalresults");
- var itemsPerPage = resultWrapper.data("resultsperpage");
- var numPages = resultWrapper.data("numpages");
- var pointerWithName = resultWrapper[resultWrapper.length -1].dataset.pointermap;
- var currentPageWithName = resultWrapper[resultWrapper.length -1].dataset.currentpagemap;
-
- if (!(total === undefined)) {
- params = params + "&totalResults=" + total;
- }
- if (!(itemsPerPage === undefined)) {
- params = params + "&resultsPerPage=" + itemsPerPage;
- }
- if (!(numPages === undefined)) {
- params = params + "&numPages=" + numPages;
- }
- if (!(pointerWithName === undefined)) {
- params = params + "&pointerMap=" + encodeURIComponent(pointerWithName);
- }
- if (!(currentPageWithName === undefined)) {
- params = params + "¤tPageMap=" + encodeURIComponent(currentPageWithName);
- }
- }
- return params;
- }
-
- static initEventsScrollPreservance(){
- $(document).on("click", "#search-results .results-wrapper .event-component",function(event){
- const originalHistoryState = history.state ||{};
- originalHistoryState.lastScrollPosition = $(window).scrollTop();
- history.replaceState(originalHistoryState, document.title);
-
- });
- }
-
- static scrollToLastViewedEvent(){
- if(history.state && history.state.lastScrollPosition){
- requestAnimationFrame(()=>{
- $('html, body').animate(
- {
- scrollTop : history.state.lastScrollPosition
- }, 500);
- });
-
- }
-
- }
-
- static updateSearchHistoryState(lastScrolledPage){
- try{
- const originalHistoryState = {};
- originalHistoryState.lastScrolledSearchPage = lastScrolledPage;
- history.replaceState(originalHistoryState, document.title);
- } catch(e) {
- console.warn("Could not update history state", e);
- }
- }
-
- /**
- * Initialisiert das Endlosscrolling für Trefferlisten.
- */
- static initInfiniteScroll() {
- ihk.resources = ihk.resources || {loadSpinner: ""};
- const $infiniteScrollContainer = $('.search-results #dummy-wrapper');
- if ($infiniteScrollContainer.length > 0) {
- const $pagingNav = $('.paging-nav');
- $pagingNav.hide();
- SearchUtils.updateSearchResultsMessage();
- SearchUtils.highlightSearchTerm();
- const infiniteScrollObj = new InfiniteScroll($infiniteScrollContainer[0],{
- onInit: function(){
- if(history.state && history.state.lastScrolledSearchPage ){
- const lastScrolledPageFromHistory = history.state.lastScrolledSearchPage;
- // load the last scrolled page after leaving the page and returning
- if((lastScrolledPageFromHistory > 1) && (lastScrolledPageFromHistory >= this.pageIndex)){
- SearchUtils.shouldPreloadSearchEnteries = true;
- requestAnimationFrame(()=>{
- this.loadNextPage().then(function (loaded) {
- let { response, body, items } = loaded;
- console.log( response );
- console.log( body );
- console.log( items );
- /** const resultWrapper = $('.results-wrapper');
- resultWrapper.data("pointermap", "{antrago=6, sweap=4}");
- resultWrapper.data("currentpagemap", "{antrago=2, sweap=1}");
- console.log(resultWrapper);**/
- });
- });
- }
- }
-
- },
- path: function () {
- // Load the second page because we do presearch
- const index = this.pageIndex + 1;
- const resultWrapper = $('.results-wrapper');
- if (resultWrapper.length) {
- const numPages = resultWrapper
- .data("numpages");
- if ((numPages === undefined)
- || (index <= numPages)) {
- return $('.search-results')
- .data(
- "infinitescroll-normal-return-url")
- + "?query="
- + encodeURIComponent($(
- '#query').val())
- + "¤tPage="
- + index
- + SearchUtils.getQueryParameter()
- + SearchUtils.getPagingParameter();
- }
- }
- return "";// damit nicht stumpf wiederholt
- // das letzte Ergebnis
- // angehangen wird!
- },
- append: ".results-wrapper",
- responseBody: "html",
- history: false,
- // debug: true -> for developement
- });
-
- infiniteScrollObj.on( 'append', function( response, path, items ) {
- if($(items).is(".results-wrapper")){
- const pageIndex = this.pageIndex;
- if(SearchUtils.shouldPreloadSearchEnteries){
- if(history.state && history.state.lastScrolledSearchPage > pageIndex){
- this.loadNextPage();
- } else {
- SearchUtils.shouldPreloadSearchEnteries = false;
- SearchUtils.scrollToLastViewedEvent();
- }
- }else {
- SearchUtils.updateSearchHistoryState(pageIndex);
- SearchUtils.highlightSearchTerm();
- }
-
- }else {
- // Destroy falls keine results mehr
- infiniteScrollObj.destroy();
- }
-
- });
-
- }
- }
-
- /**
- * Markiert nach erfolgter Suche den Suchbegriff innerhalb der Trefferliste.
- */
- static highlightSearchTerm() {
- var $searchResults = $('.search-results .results-wrapper .result'), $searchField = $('#query');
-
- // highlight search term
- if ($searchResults.length > 0 && $searchField.length > 0) {
- var searchTerm = $searchField.val();
- if (typeof searchTerm !== 'undefined') {
- if ($searchResults.highlight) {
- $searchResults.highlight(searchTerm);
- }
- }
- }
- }
-
- /**
- * Liefert nach erfolgter Suche die korrekte Anzahl Treffer. und erzeugt
- * gegebenfalls für Etracker einen 0-Treffer Event.
- */
- static updateSearchResultsMessage() {
- var searchHits = $('.search-hits');
- var resultWrapper = $('.results-wrapper');
- var resultVal = 0;
- if (typeof resultWrapper.val() !== "undefined") {
- resultVal = resultWrapper.data("totalresults");
- }
-
- // IHK-2681: 0-Treffer-Suche
- if (resultVal === 0) {
- var searchCategoryE = $("#query").data('search-category'), hasCategoryE = typeof searchCategoryE !== "undefined";
- var queryE = $('#query').val();
- var actionE = '0-Treffer-Suche';
- var querySource = $('#querySource').val();
-
- if ('autocomplete' === querySource) {
- actionE = '0-Treffer-Vorschlag';
- $('#querySource').val('manual');
- }
- if (!window.isPbe) {
- //todo: etracker
- window.setTimeout(EtrackerUtils.fireETrackerEvent, 250,
- (hasCategoryE ? searchCategoryE : 'Kombi-Suche'),
- queryE, actionE, '');
- }
- }
- searchHits.text(resultVal + " Treffer");
- }
-
- static getAllUrlParams(url) {
-
- // get query string from url (optional) or window
- var queryString = url ? url.split('?')[1] : window.location.search.slice(1);
-
- // we'll store the parameters here
- var obj = {};
-
- // if query string exists
- if (queryString) {
-
- // stuff after # is not part of query string, so get rid of it
- queryString = queryString.split('#')[0];
-
- // split our query string into its component parts
- var arr = queryString.split('&');
-
- for (var i=0; i<arr.length; i++) {
- // separate the keys and the values
- var a = arr[i].split('=');
-
- // in case params look like: list[]=thing1&list[]=thing2
- var paramNum = undefined;
- var paramName = a[0].replace(/\[\d*\]/, function(v) {
- paramNum = v.slice(1,-1);
- return '';
- });
-
- // set parameter value (use 'true' if empty)
- var paramValue = typeof(a[1])==='undefined' ? true : a[1];
-
- // if parameter name already exists
- if (obj[paramName]) {
- // convert value to array (if still string)
- if (typeof obj[paramName] === 'string') {
- obj[paramName] = [obj[paramName]];
- }
- // if no array index number specified...
- if (typeof paramNum === 'undefined') {
- // put the value on the end of the array
- obj[paramName].push(paramValue);
- }
- // if array index number specified...
- else {
- // put the value at that index number
- obj[paramName][paramNum] = paramValue;
- }
- }
- // if param name doesn't exist yet, set it
- else {
- obj[paramName] = paramValue;
- }
- }
- }
-
- return obj;
- }
-
-
- }
-
- $(document).ready(function () {
- // Submit-Event abfangen und stattdessen den Ajax-Call ausführen:
- $("#search-form").bind("submit", function () {
- SearchUtils.loadResults();
- SearchUtils.updateSearchHistoryState(1);
- });
-
- // Click-Event abfangen und stattdessen den Ajax-Call ausführen:
- $("#search-submit, #search-submit-button").click(function () {
- SearchUtils.loadResults();
- SearchUtils.updateSearchHistoryState(1);
- });
-
- if ($('#query').val() != null) {
- SearchUtils.loadResults();
- }
- });
|