https://collectie.hetnoordbrabantsmuseum.nl/Scripts/Base/PopupLookup.js

1if (typeof (AIS) !== "object") { var AIS = new Object(); }
2
3AIS.PopupAutoCompleteScan = function () {
4  var localStorageAccess = false;
5  var spinner, typingTimer, autocompleteTag, scanTag, scanDom, useSpans, url, database, siDatabase, enteredValueInFilterBox, popupmethod, cache, inputfield;
6  var dialogElement = $("#popupAutoSuggestScan");
7  var content = $(".popup-content");
8  var doneTypingInterval = 200;
9  var response = {};
10  var isLoading = false;
11  var language = "";
12
13  $("#popupLookupValue").keyup(function () {
14    enteredValueInFilterBox = $(this).val();
15
16    var key = popupmethod;
17    key += popupmethod === "autocomplete" ? autocompleteTag : scanTag;
18    key += enteredValueInFilterBox;
19
20    // If value is already in cache, then dont apply typing interval
21    if (localStorageAccess) {
22      if (localStorage[key]) {
23        clearTimeout(typingTimer);
24        makeApiCallOrReturnCacheData();
25      }
26    }
27
28    clearTimeout(typingTimer);
29    typingTimer = setTimeout(function () {
30      makeApiCallOrReturnCacheData();
31    }, doneTypingInterval);
32  });
33
34  function parseData(adlibJSON) {
35    if (adlibJSON.recordList === undefined)
36      return;
37    /* temp API backward compatibility fix: old webapi misses record node in json, later/current versions have a record node */
38    var recordList = adlibJSON.recordList.record === undefined ? adlibJSON.recordList : adlibJSON.recordList.record;
39    if (recordList === undefined) {
40      return;
41    }
42    if (recordList === 0) {
43      return;
44    }
45    loopOverRecords(recordList);
46    setPaging(adlibJSON.diagnostic);
47  };
48
49  function showLoading() {
50    isLoading = true;
51    spinner.show();
52  }
53
54  function hideLoading() {
55    isLoading = false;
56    spinner.hide();
57  }
58
59  function setPaging(diagnostics) {
60    $("#currentPage").text(response.CurrentPage);
61    if (response.HasNext) {
62      var b = $("#popupNextButton");//.show();
63      b.addClass('enabled');
64      b.removeClass('disabled');
65    } else {
66      b = $("#popupNextButton");//.hide();
67      b.removeClass('enabled');
68      b.addClass('disabled');
69    }
70    if (response.HasPrevious) {
71      b = $("#popupPreviousButton");//.show();
72      b.addClass('enabled');
73      b.removeClass('disabled');
74    } else {
75      b = $("#popupPreviousButton");
76      b.removeClass('enabled');
77      b.addClass('disabled');
78      b.off('click');
79      //$("#popupPreviousButton").hide();
80    }
81  }
82
83  function loopOverRecords(recordList) {
84    var ul = document.createElement("ul");
85    for (var i = 0; i < recordList.length; i++) {
86      var item = recordList[i];
87      if (popupmethod === "autocomplete") {
88        ul.appendChild(createLiElement(item.term[0]));
89      } else {
90        ul.appendChild(createLiElement(item.TE[0]));
91      }
92
93    }
94    content.append(ul);
95  };
96
97  function createLiElement(item) {
98    var li = document.createElement("li");
99    li.setAttribute("onclick", "AIS.PopupAutoCompleteScan.Click(this);");
100    if (item.spans === undefined) {
101      li.innerHTML = item;
102      li.setAttribute("class", "popup-lookup-item");
103      li.setAttribute("tabindex", 0);
104      li.setAttribute("cleartext", item);
105      li.setAttribute("title", AIS.Helpers.Translate("SearchFor") + " " + item);
106    } else {
107      addCombinedSpansToLi(item.spans, li);
108    }
109    return li;
110  };
111  function addCombinedSpansToLi(spans, liElement, clearText) {
112    var clearText = "";
113    for (var i = 0; i < spans.length; i++) {
114      var span = spans[i];
115      clearText += span.text;
116
117      // attributes can contain: 1 = bold
118      if (span.attributes === undefined) {
119        liElement.innerHTML += span.text;
120      } else {
121        if (span.attributes === 1) {
122          var spanelement = document.createElement("span");
123          spanelement.innerHTML += span.text;
124          spanelement.className = "span";
125          liElement.appendChild(spanelement);
126        }
127      }
128    }
129    liElement.setAttribute("cleartext", clearText);
130  }
131
132  function createAutoCompleteData() {
133    return {
134      url: url,
135      dataType: "json",
136      data: {
137        database: database,
138        autocompletetag: autocompleteTag,
139        language: language,
140        usespans: useSpans,
141        enteredvalue: enteredValueInFilterBox,
142        popupmethod: popupmethod
143      },
144      success: successCallback,
145      error: errorCallback
146    }
147  };
148
149  function createScanData() {
150    if (enteredValueInFilterBox === '') {
151      enteredValueInFilterBox = inputfield.val();//el.parent().children(".webapi").val();
152    }
153    return {
154      url: url,
155      dataType: "json",
156      data: {
157        database: database,
158        scantag: scanTag,
159        scandom: scanDom,
160        language: language,
161        usespans: useSpans,
162        enteredvalue: enteredValueInFilterBox,
163        popupmethod: popupmethod
164      },
165      success: successCallback,
166      error: errorCallback
167    }
168  };
169
170  function makeApiCallOrReturnCacheData() {
171    showLoading();
172
173    // Get from cache, else get from api
174    var data = getFromCache(enteredValueInFilterBox);
175    if (data !== null) {
176      successCallback(JSON.parse(data));
177    }
178    else if (popupmethod === "autocomplete") {
179      var data = createAutoCompleteData();
180      $.ajax(data);
181    } else if (scanTag === undefined || scanTag === "") {
182      content.text("Error: No scantag defined, and autocomplete is not defined or turned off in formsettings.");
183      hideLoading();
184    } else {
185      var data = createScanData();
186      $.ajax(data);
187    }
188  };
189
190  function goNextOrPrevious(type) {
191    showLoading();
192
193    var minOrPlus = 0;
194    if (type === "next") {
195      minOrPlus = 1;
196    } else {

197      minOrPlus = -1;
198    }
199    var data = getFromCache(enteredValueInFilterBox, response.CurrentPage + minOrPlus);
200    if (data !== null) {
201      successCallback(JSON.parse(data));
202      return;
203    }
204
205    if (popupmethod == "autocomplete") {
206      data = createAutoCompleteData();
207    } else {
208      data = createScanData();
209    }
210
211    if (type === "next") {
212      data.data.startfrom = response.NextStartFrom;
213    } else {
214      data.data.startfrom = response.PreviousStartFrom;
215    }
216
217    $.ajax(data);
218  }
219
220  function getFromCache(value, page) {
221    var key = popupmethod;
222    key += popupmethod === "autocomplete" ? autocompleteTag : scanTag;
223    key += value || "";
224    key += page || response.CurrentPage;
225    key += language;
226    if (!localStorageAccess) {
227      return cache[key];
228    }
229    return localStorage.getItem(key);
230  }
231  function successCallback(dto) {
232    response = dto;
233    var val = dto.Value === null ? "" : dto.Value;
234    if (enteredValueInFilterBox !== val) {
235      writeCache(dto);
236      return;
237    }
238    content.text("");
239    if (dto.AdlibJson.adlibJSON !== undefined) {
240      writeCache(dto);
241      parseData(dto.AdlibJson.adlibJSON);
242    }
243    hideLoading();
244  };
245
246  function writeCache(dto) {
247    if (localStorageAccess) {
248      var cacheDate = localStorage.getItem("cachedate");
249      var dateNow = new Date();
250      if (cacheDate === null) {
251        cacheDate = new Date();
252        localStorage.setItem("cachedate", cacheDate);
253      } else if ((dateNow.getTime() - new Date(cacheDate).getTime()) > 1800000) { // 30 Minutes cache | 1000 = 1 sec | 60000 = 1 minute | 3600000 = 1 hour
254        localStorage.clear();
255      }
256      var tag = popupmethod === "autocomplete" ? autocompleteTag : scanTag;
257      var val = dto.Value === null ? "" : dto.Value;
258      var key = dto.PopupMethod + tag + val + response.CurrentPage + language;
259      var storageItem = localStorage.getItem(key);
260
261      try {
262        localStorage.setItem(key, JSON.stringify(dto));
263      }
264      catch (error) {
265        localStorage.clear();
266      }
267
268    } else {
269      cache[data.Value] = data;
270    }
271  }
272
273  function errorCallback(error) {
274    hideLoading();
275  }
276
277  function init(element) {
278    response = {};
279    dialogElement.dialog({ autoOpen: false });
280    spinner = $("#popupAutoSuggestScan  .popup-spinner").show();
281    document.getElementById("popupLookupValue").value = "";
282    autocompleteTag = element.siblings("input[autocompletetag]").attr('autocompletetag');
283    scanTag = element.siblings("input[scantag]").attr('scantag');
284    scanDom = element.siblings("input[scantag]").attr('scandom');
285    //language = $('#ais-search-language').val();
286    useSpans = element.siblings("input[usespans]").attr('usespans') === "true";
287    url = AIS.Helpers.ResolveUrl("/helper/GetAutoCompleteOrScanValues");
288    database = $(".ais-database-choices-script option:selected").val();
289    if (database === undefined) database = $("#SourceName").val();
290    siDatabase = element.siblings("input[popupmethod]").attr('database');
291    if (siDatabase != '') database = siDatabase; 
292    enteredValueInFilterBox = "";
293    popupmethod = element.siblings("input[popupmethod]").attr('popupmethod');
294    cache = {
295      startCacheDate: new Date()
296    };
297    inputfield = element.siblings(".form-input");
298
299    if (typeof (Storage) !== "undefined") {
300      localStorageAccess = true;
301    }
302  };
303
304  function close() {
305    dialogElement.dialog("close");
306  }
307
308  var click = function (element) {
309    inputfield.val(element.getAttribute("cleartext"));
310    close();
311  };
312
313  var open = function (element, isExpert) {
314    response = {};
315    var popuptitle = null;
316    if (isExpert) {
317      popuptitle = element.parent().parent().children(".ais-field-selector-script").children("option:selected").text();
318    } else {
319      popuptitle = element.parent().parent().children(".form-label").find("a").text();
320    }
321    init(element);
322    content.text("")
323    makeApiCallOrReturnCacheData(element);
324    $("#popupAutoSuggestScan").dialog({ autoOpen: true, modal: true, title: popuptitle, draggable: false, resizable: false });
325  };
326
327  var nextPage = function (event) {
328    if (isLoading) return;
329    event.preventDefault();
330    goNextOrPrevious("next");
331  };
332
333  var previousPage = function (event) {
334    if (isLoading) return;
335    event.preventDefault();
336    goNextOrPrevious("previous");
337  }
338
339  return {
340    Open: open,
341    Click: click,
342    NextPage: nextPage,
343    PreviousPage: previousPage
344  }
345}();
346
347AIS.PopupLookup = function () {
348
349  var loadHtmlPopup = function (controllerUrl, lookupInput, term, page) {
350
351    // Takes each argument name and value from lookupInput and puts it in the query string
352    //var query = $.map(lookupInput, function (v, p) { return p + "=" + v; })
353    //  .join("&") + "&term=" + term + "&page=" + page;
354    //var query = $.map(lookupInput, function (v, p) { return p + "=" + v; })
355    //  .join("&");
356
357
358    $.ajax({

359      type: "get",
360      url: AIS.Helpers.ResolveUrl(controllerUrl),
361      data: {
362        database: lookupInput.database,
363        fieldName: lookupInput.fieldName,
364        searchType: lookupInput.searchType,
365        term: term,
366        page: page
367      },
368      dataType: "json",
369      success: function (data) {
370        AIS.PopupLookup.Popup().html(data.content);
371
372        AIS.PopupLookup.Popup().dialog({
373          modal: true,
374          title: AIS.PopupLookup.PopupTitle().val(),
375          resizable: false,
376          width: 'auto'
377        });
378        updateButtonsDisplay(controllerUrl, lookupInput);
379      }
380    });
381  };
382
383  var disableButton = function (b) {
384    b.removeClass('enabled');
385    b.addClass('disabled');
386    b.off('click');
387  };
388
389  var enableButton = function (b) {
390    b.addClass('enabled');
391    b.removeClass('disabled');
392  };
393
394  var updateButtonsDisplay = function (controllerUrl, lookupInput) {
395
396    disableButton(AIS.PopupLookup.FirstPageNavigationButton());
397    disableButton(AIS.PopupLookup.BackNavigationButton());
398    disableButton(AIS.PopupLookup.NextNavigationButton());
399    disableButton(AIS.PopupLookup.LastPageNavigationButton());
400
401    if (AIS.PopupLookup.Options().length !== 0) {
402
403      AIS.PopupLookup.NoResultsMessage().addClass('ais-not-visible');
404
405      if (AIS.PopupLookup.LastPage() > 1) {
406        AIS.PopupLookup.Navigator().show();
407
408        if (AIS.PopupLookup.CurrentPage() !== AIS.PopupLookup.FirstPage()) {
409
410          enableButton(AIS.PopupLookup.FirstPageNavigationButton());
411          AIS.PopupLookup.FirstPageNavigationButton().on('click', function () {
412            loadHtmlPopup(controllerUrl, lookupInput,
413              AIS.PopupLookup.SearchTerm(), AIS.PopupLookup.FirstPage());
414          });
415
416          enableButton(AIS.PopupLookup.BackNavigationButton());
417          AIS.PopupLookup.BackNavigationButton().on('click', function () {
418            loadHtmlPopup(controllerUrl, lookupInput,
419              AIS.PopupLookup.SearchTerm(), AIS.PopupLookup.CurrentPage() - 1);
420          });
421
422        }
423
424        if (AIS.PopupLookup.CurrentPage() !== AIS.PopupLookup.LastPage()) {
425
426          enableButton(AIS.PopupLookup.NextNavigationButton());
427          AIS.PopupLookup.NextNavigationButton().on('click', function () {
428            loadHtmlPopup(controllerUrl, lookupInput,
429              AIS.PopupLookup.SearchTerm(), AIS.PopupLookup.CurrentPage() + 1);
430          });
431
432          enableButton(AIS.PopupLookup.LastPageNavigationButton());
433          AIS.PopupLookup.LastPageNavigationButton().on('click', function () {
434            loadHtmlPopup(controllerUrl, lookupInput,
435              AIS.PopupLookup.SearchTerm(), AIS.PopupLookup.LastPage());
436          });
437        }
438      } else {
439        AIS.PopupLookup.Navigator().hide();
440      }
441    } else {
442      AIS.PopupLookup.NoResultsMessage().removeClass('ais-not-visible');
443      AIS.PopupLookup.Navigator().hide();
444    }
445  };
446
447  return {
448
449    Open: function (controllerUrl, lookupInput, fieldId, term, page, callback) {
450
451      // Unbind any previous live events
452      AIS.PopupLookup.Options().off('click');
453      AIS.PopupLookup.SearchButton().off('click');
454      AIS.PopupLookup.FirstPageNavigationButton().off('click');
455      AIS.PopupLookup.BackNavigationButton().off('click');
456      AIS.PopupLookup.NextNavigationButton().off('click');
457      AIS.PopupLookup.LastPageNavigationButton().off('click');
458      AIS.PopupLookup.GoToPageNavigationButton().off('click');
459
460      // First page popup
461      loadHtmlPopup(controllerUrl, lookupInput, term, AIS.PopupLookup.DefaultPage());
462
463      // Bind live events
464
465      // Lookup value
466      AIS.PopupLookup.Options().on('click', function () {
467        var selectorExpression = AIS.Helpers.EscapeSelectorExpression(fieldId);
468        $('#' + selectorExpression).val($(this).text());
469
470        //execute function sent as parameter
471        if (callback !== undefined) callback();
472
473        AIS.PopupLookup.Popup().dialog('close');
474      });
475
476      // Search button
477      AIS.PopupLookup.SearchButton().on('click', function () {
478        loadHtmlPopup(controllerUrl, lookupInput, AIS.PopupLookup.SearchTerm(), AIS.PopupLookup.DefaultPage());
479      });
480
481      // Go To Navigation buttons
482      AIS.PopupLookup.GoToPageNavigationButton().on('click', function () {
483        loadHtmlPopup(controllerUrl, lookupInput, AIS.PopupLookup.SearchTerm(), AIS.PopupLookup.CurrentPage());
484      });
485    },
486
487    FirstPage: function () { return 1; },
488
489    DefaultPage: function () { return AIS.PopupLookup.FirstPage(); },
490
491    Popup: function () { return $(".ais-popupwrapper-script"); },
492
493    PopupTitle: function () { return $(".ais-popupwrapper-script .popup-lookup-title-value"); },
494
495    Options: function () { return $('.ais-popupwrapper-script .popup-lookup-list-script li a'); },
496
497    NoResultsMessage: function () { return $('.ais-popupwrapper-script .no-results-found-element'); },
498
499    Navigator: function () { return $('.ais-popupwrapper-script .ais-navigator-script'); },
500
501    SearchButton: function () { return $('.ais-popupwrapper-script .ais-popup-lookup-search-script'); },
502
503    FirstPageNavigationButton: function () { return $('.ais-popupwrapper-script .ais-navigator-script .first-page-script'); },
504
505    BackNavigationButton: function () { return $('.ais-popupwrapper-script .ais-navigator-script .prev-page-script'); },
506
507    NextNavigationButton: function () { return $('.ais-popupwrapper-script .ais-navigator-script .next-page-script'); },
508
509    LastPageNavigationButton: function () { return $('.ais-popupwrapper-script .ais-navigator-script .last-page-script'); },
510
511    GoToPageNavigationButton: function () { return $('.ais-popupwrapper-script .ais-navigator-script .goto-page-script'); },
512
513    SearchTerm: function () { return $(".ais-popupwrapper-script .ais-popup-lookup-value").val(); },
514
515    CurrentPage: function () { return parseInt($(".ais-popupwrapper-script .current-page-script").val()); },
516
517    LastPage: function () { return parseInt($(".ais-popupwrapper-script .total-pages-script").text()); }
518  }
519}();