@progress/telerik-jquery-report-viewer 21.24.305 → 22.24.514

package/dist/es/search.js

@@ -0,0 +1,630 @@
+import { each, stringFormat } from './utils.js';
+import { stringResources } from './stringResources.js';
+import { Binder } from './binder.js';
+import { PageModes } from './enums.js';
+
+var defaultOptions = {};
+function Search(placeholder, options, viewerOptions) {
+  options = $.extend({}, defaultOptions, options);
+  var controller = options.controller;
+  var initialized = false;
+  var dialogVisible = false;
+  var $placeholder;
+  var $inputBox;
+  var $searchOptionsPlaceholder;
+  var searchOptionsMenu;
+  var $stopSearchPlaceholder;
+  var stopSearchMenu;
+  var $navigationPlaceholder;
+  var navigationMenu;
+  var $resultsLabel;
+  var $resultsPlaceholder;
+  var kendoComboBox;
+  var kendoSearchDialog;
+  var stopSearchCommand;
+  var optionsCommandSet;
+  var navigationCommandSet;
+  var searchResults;
+  var mruList = [];
+  var inputComboRebinding;
+  var searchMetadataRequested;
+  var searchMetadataLoaded;
+  var pendingHighlightItem;
+  var windowLocation;
+  var reportViewerWrapper = $("[data-selector='" + viewerOptions.viewerSelector + "']").find(".trv-report-viewer");
+  var lastSearch = "";
+  var highlightManager = {
+    shadedClassName: "trv-search-dialog-shaded-result",
+    //the results that are found, but not selected (highlighted)
+    highlightedClassName: "trv-search-dialog-highlighted-result",
+    //the result that is currently selected (highlighted)
+    current: null,
+    elements: []
+  };
+  if (!controller) {
+    throw "No controller (telerikReporting.ReportViewerController) has been specified.";
+  }
+  controller.pageReady(onPageReady).scrollPageReady(onPageReady).beginLoadReport(closeAndClear).viewModeChanged(closeAndClear);
+  controller.setSendEmailDialogVisible(function(event, args) {
+    if (args.visible && dialogVisible) {
+      toggle(!dialogVisible);
+    }
+  }).getSearchDialogState(function(event, args) {
+    args.visible = dialogVisible;
+  }).setSearchDialogVisible(function(event, args) {
+    toggleSearchDialog(args.visible);
+  });
+  function closeAndClear() {
+    if (searchMetadataRequested) {
+      return;
+    }
+    toggle(false);
+    searchMetadataLoaded = false;
+  }
+  function toggleSearchDialog(show) {
+    dialogVisible = show;
+    if (show) {
+      var searchMetadataOnDemand = viewerOptions.searchMetadataOnDemand;
+      if (searchMetadataOnDemand && !searchMetadataLoaded) {
+        searchMetadataRequested = true;
+        controller.reportLoadComplete(function() {
+          if (searchMetadataRequested) {
+            toggle(true);
+            searchMetadataRequested = false;
+          }
+        });
+        controller.refreshReport(true);
+        return;
+      }
+    }
+    toggle(show);
+  }
+  function toggle(show) {
+    dialogVisible = show;
+    if (show) {
+      searchMetadataLoaded = true;
+      ensureInitialized();
+      kendoSearchDialog.open();
+      kendoComboBox.value("");
+      updateResultsUI(null);
+      toggleErrorLabel(false, null);
+    } else {
+      clearColoredItems();
+      if (kendoSearchDialog && kendoSearchDialog.options.visible) {
+        kendoSearchDialog.close();
+      }
+    }
+  }
+  function ensureInitialized() {
+    if (!initialized) {
+      $placeholder = $(placeholder);
+      $inputBox = $placeholder.find(".trv-search-dialog-input-box");
+      $resultsLabel = $placeholder.find(".trv-search-dialog-results-label");
+      $resultsPlaceholder = $placeholder.find(".trv-search-dialog-results-area");
+      initResultsArea();
+      replaceStringResources($placeholder);
+      try {
+        $searchOptionsPlaceholder = $placeholder.find(".trv-search-dialog-search-options").kendoMenu();
+        $stopSearchPlaceholder = $placeholder.find(".trv-search-dialog-stopsearch-placeholder").kendoMenu();
+        $navigationPlaceholder = $placeholder.find(".trv-search-dialog-navigational-buttons").kendoMenu();
+      } catch (e) {
+        console.error("Instantiation of Kendo Menu for Search Dialog threw an exception", e);
+        throw e;
+      }
+      searchOptionsMenu = $searchOptionsPlaceholder.data("kendoMenu");
+      stopSearchMenu = $stopSearchPlaceholder.data("kendoMenu");
+      navigationMenu = $navigationPlaceholder.data("kendoMenu");
+      searchOptionsMenu.element.on("keydown", onKeyDown);
+      stopSearchMenu.element.on("keydown", onKeyDown);
+      navigationMenu.element.on("keydown", onKeyDown);
+      overrideDefaultMenuStyling(".trv-search-dialog-search-options");
+      try {
+        kendoComboBox = $inputBox.kendoComboBox({
+          dataTextField: "value",
+          dataValueField: "value",
+          dataSource: mruList,
+          contentElement: "",
+          change: kendoComboBoxSelect,
+          ignoreCase: false,
+          filtering: onInputFiltering,
+          //the actual search-when-typing performs on this event.
+          filter: "startswith",
+          delay: 1e3,
+          open: function(e) {
+            if (inputComboRebinding) {
+              e.preventDefault();
+            }
+          },
+          select: processComboBoxEvent
+        }).data("kendoComboBox");
+      } catch (e) {
+        console.error("Instantiation of Kendo ComboBox as search input threw an exception", e);
+        throw e;
+      }
+      try {
+        kendoSearchDialog = reportViewerWrapper.find(".trv-search-window").kendoWindow({
+          title: stringResources.searchDialogTitle,
+          height: 390,
+          width: 310,
+          minWidth: 310,
+          minHeight: 390,
+          maxHeight: 700,
+          scrollable: false,
+          close: function() {
+            storeDialogPosition();
+            lastSearch = "";
+          },
+          open: function() {
+            adjustDialogPosition();
+          },
+          deactivate: function() {
+            controller.setSearchDialogVisible({
+              visible: false
+            });
+          },
+          activate: function() {
+            kendoComboBox.input.focus();
+          }
+        }).data("kendoWindow");
+      } catch (e) {
+        console.error("Instantiation of Kendo Window for Search dialog threw an exception", e);
+        throw e;
+      }
+      kendoSearchDialog.wrapper.addClass("trv-search");
+      initCommands();
+      initialized = true;
+    }
+  }
+  function overrideDefaultMenuStyling(kendoMenuSelector) {
+    var menuItems = $(kendoMenuSelector).find(".k-menu-item");
+    for (var i = 0; i < menuItems.length; i++) {
+      $(menuItems[i]).removeClass("k-item");
+    }
+  }
+  function onKeyDown(event) {
+    var item = $(event.target).find(".k-focus");
+    if (event.keyCode === 13 && item && item.length > 0) {
+      var anchor = item.children("a");
+      if (anchor.length > 0) {
+        anchor.click();
+      }
+    }
+  }
+  $(window).resize(function() {
+    if (kendoSearchDialog && kendoSearchDialog.options.visible) {
+      storeDialogPosition();
+      adjustDialogPosition();
+    }
+  });
+  function storeDialogPosition() {
+    var kendoWindow = kendoSearchDialog.element.parent(".k-window");
+    windowLocation = kendoWindow.offset();
+  }
+  function adjustDialogPosition() {
+    var windowWidth = $(window).innerWidth();
+    var windowHeight = $(window).innerHeight();
+    var kendoWindow = kendoSearchDialog.wrapper;
+    var width = kendoWindow.outerWidth(true);
+    var height = kendoWindow.outerHeight(true);
+    var padding = 10;
+    if (!windowLocation) {
+      var reportViewerCoords = reportViewerWrapper[0].getBoundingClientRect();
+      kendoWindow.css({
+        top: reportViewerCoords.top + padding,
+        left: reportViewerCoords.right - width - padding
+      });
+      kendoSearchDialog.setOptions({
+        position: {
+          top: reportViewerCoords.top + padding,
+          left: reportViewerCoords.right - width - padding
+        }
+      });
+    } else {
+      var left = windowLocation.left;
+      var top = windowLocation.top;
+      var right = left + width;
+      var bottom = top + height;
+      if (right > windowWidth - padding) {
+        left = Math.max(padding, windowWidth - width - padding);
+        kendoWindow.css({ left });
+        kendoSearchDialog.setOptions({
+          position: {
+            left
+          }
+        });
+      }
+      if (bottom > windowHeight - padding) {
+        top = Math.max(padding, windowHeight - height - padding);
+        kendoWindow.css({ top });
+        kendoSearchDialog.setOptions({
+          position: {
+            top
+          }
+        });
+      }
+    }
+  }
+  function processComboBoxEvent(e) {
+    if (!(window.event || window.event.type)) {
+      return;
+    }
+    var evt = window.event;
+    if (evt.type === "keydown") {
+      e.preventDefault();
+      if (evt.keyCode === 40) {
+        moveListSelection(1);
+      } else if (evt.keyCode === 38) {
+        moveListSelection(-1);
+      }
+    }
+  }
+  function initCommands() {
+    optionsCommandSet = {
+      //the command names MUST match the commands in the template.html with the "telerik_Reportviewer" prefix so the binder could work.
+      "searchDialog_MatchCase": new command(function() {
+        toggleCommand(this);
+      }),
+      "searchDialog_MatchWholeWord": new command(function() {
+        toggleCommand(this);
+      }),
+      "searchDialog_UseRegex": new command(function() {
+        toggleCommand(this);
+      })
+    };
+    Binder.bind(
+      $searchOptionsPlaceholder,
+      {
+        controller,
+        commands: optionsCommandSet
+      },
+      viewerOptions
+    );
+    stopSearchCommand = new command(function() {
+      stopSearch();
+    });
+    Binder.bind(
+      $stopSearchPlaceholder,
+      {
+        controller,
+        commands: { "searchDialog_StopSearch": stopSearchCommand }
+      },
+      viewerOptions
+    );
+    navigationCommandSet = {
+      "searchDialog_NavigateUp": new command(function() {
+        moveListSelection(-1);
+      }),
+      "searchDialog_NavigateDown": new command(function() {
+        moveListSelection(1);
+      })
+    };
+    Binder.bind(
+      $navigationPlaceholder,
+      {
+        controller,
+        commands: navigationCommandSet
+      },
+      viewerOptions
+    );
+  }
+  function initResultsArea() {
+    try {
+      $resultsPlaceholder.kendoListView({
+        selectable: true,
+        navigatable: true,
+        dataSource: {},
+        contentElement: "",
+        template: "<div class='trv-search-dialog-results-row'><span>#: description #</span> <span class='trv-search-dialog-results-pageSpan'>" + stringResources.searchDialogPageText + " #:page#</span></div>",
+        change: function() {
+          var index = this.select().index();
+          var view = this.dataSource.view();
+          var dataItem = view[index];
+          onSelectedItem(dataItem);
+          updateUI(index, view.length);
+        }
+      });
+    } catch (e) {
+      console.error("Instantiation of Kendo ListView as search result area threw an exception", e);
+      throw e;
+    }
+  }
+  function stopSearch() {
+    setStopButtonEnabledState(false);
+  }
+  function toggleCommand(cmd) {
+    cmd.checked(!cmd.checked());
+    searchForCurrentToken();
+  }
+  function setStopButtonEnabledState(enabledState) {
+    stopSearchCommand.enabled(enabledState);
+  }
+  function onPageReady(args, page) {
+    if (dialogVisible) {
+      colorPageElements(searchResults);
+    }
+  }
+  function onInputFiltering(e) {
+    e.preventDefault();
+    if (e.filter && e.filter.value !== lastSearch) {
+      lastSearch = e.filter.value;
+      searchForToken(lastSearch);
+    }
+  }
+  function kendoComboBoxSelect(e) {
+    var newValue = e.sender.value();
+    if (newValue && lastSearch !== newValue) {
+      lastSearch = newValue;
+      searchForToken(lastSearch);
+    }
+  }
+  function searchForCurrentToken() {
+    if (kendoComboBox) {
+      searchForToken(kendoComboBox.value());
+    }
+  }
+  function searchForToken(token) {
+    onSearchStarted();
+    addToMRU(token);
+    controller.getSearchResults(
+      {
+        searchToken: token,
+        matchCase: optionsCommandSet.searchDialog_MatchCase.checked(),
+        matchWholeWord: optionsCommandSet.searchDialog_MatchWholeWord.checked(),
+        useRegex: optionsCommandSet.searchDialog_UseRegex.checked()
+      }
+    ).then(function(results) {
+      updateResultsUI(results, null);
+    }).catch(function(errorMessage) {
+      if (errorMessage) {
+        updateResultsUI(null, errorMessage);
+      }
+    });
+  }
+  function onSearchStarted() {
+    $resultsLabel.text(stringResources.searchDialogSearchInProgress);
+    clearColoredItems();
+    searchResults = null;
+    setStopButtonEnabledState(true);
+    toggleErrorLabel(false, null);
+  }
+  function updateResultsUI(results, error) {
+    setStopButtonEnabledState(false);
+    if (error) {
+      toggleErrorLabel(true, error);
+    }
+    displayResultsList(results);
+    searchResults = results;
+    if (results && results.length > 0) {
+      colorPageElements(results);
+      selectFirstElement();
+    } else {
+      updateUI(-1, 0);
+    }
+  }
+  function addToMRU(token) {
+    if (!token || token === "") {
+      return;
+    }
+    var exists = mruList.filter(function(mru) {
+      return mru.value === token;
+    });
+    if (exists && exists.length > 0) {
+      return;
+    }
+    mruList.unshift({ value: token });
+    if (mruList.length > 10) {
+      mruList.pop();
+    }
+    inputComboRebinding = true;
+    kendoComboBox.dataSource.data(mruList);
+    kendoComboBox.select(function(item) {
+      return item.value === token;
+    });
+    inputComboRebinding = false;
+  }
+  function displayResultsList(results) {
+    var $listView = $resultsPlaceholder.data("kendoListView");
+    if (!results) {
+      results = [];
+    }
+    $listView.dataSource.data(results);
+  }
+  function colorPageElements(results) {
+    if (!results || results.length === 0) {
+      return;
+    }
+    var $parent = $placeholder.parent();
+    var $pageContainer = $parent.find(".trv-page-container");
+    var elements = $pageContainer.find("[data-search-id]");
+    each(results, function() {
+      var $searchElement = elements.filter("[data-search-id=" + this.id + "]");
+      if ($searchElement) {
+        $searchElement.addClass(highlightManager.shadedClassName);
+        highlightManager.elements.push($searchElement);
+      }
+    });
+    highlightItem(pendingHighlightItem);
+    pendingHighlightItem = null;
+  }
+  function highlightItem(item) {
+    if (item) {
+      var currentItemId = item.id;
+      var newHighlighted = $(highlightManager.elements.filter(function(i) {
+        return i.attr("data-search-id") === currentItemId;
+      })).first();
+      if (newHighlighted) {
+        highlightManager.current = newHighlighted[0];
+        if (highlightManager.current) {
+          var current = $("[data-search-id='" + currentItemId + "']");
+          current.removeClass(highlightManager.shadedClassName);
+          current.addClass(highlightManager.highlightedClassName);
+        }
+      }
+    }
+  }
+  function selectFirstElement() {
+    var $listView = $resultsPlaceholder.data("kendoListView");
+    var first = $listView.element.children().first();
+    $listView.select(first);
+    $listView.trigger("change");
+  }
+  function onSelectedItem(item) {
+    if (!item) {
+      return;
+    }
+    if (highlightManager.current) {
+      highlightManager.current.removeClass(highlightManager.highlightedClassName);
+      highlightManager.current.addClass(highlightManager.shadedClassName);
+    }
+    if (item.page === controller.getCurrentPageNumber()) {
+      highlightItem(item);
+    } else {
+      if (controller.getPageMode() !== PageModes.CONTINUOUS_SCROLL) {
+        clearColoredItems();
+      } else {
+        highlightItem(item);
+      }
+    }
+    pendingHighlightItem = item;
+    controller.navigateToPage(item.page, { type: "search", id: item.id });
+  }
+  function updateUI(index, count) {
+    var str = count === 0 ? stringResources.searchDialogNoResultsLabel : stringFormat(stringResources.searchDialogResultsFormatLabel, [index + 1, count]);
+    $resultsLabel.text(str);
+    var allowMoveUp = index > 0;
+    var allowMoveDown = index < count - 1;
+    navigationCommandSet.searchDialog_NavigateUp.enabled(allowMoveUp);
+    navigationCommandSet.searchDialog_NavigateDown.enabled(allowMoveDown);
+  }
+  function clearColoredItems() {
+    if (highlightManager.elements && highlightManager.elements.length > 0) {
+      each(highlightManager.elements, function() {
+        this.removeClass(highlightManager.shadedClassName);
+      });
+    }
+    if (highlightManager.current) {
+      highlightManager.current.removeClass(highlightManager.highlightedClassName);
+    }
+    highlightManager.elements = [];
+    highlightManager.current = null;
+  }
+  function moveListSelection(offset) {
+    var $listView = $resultsPlaceholder.data("kendoListView");
+    var $selected = $listView.select();
+    if (!$selected) {
+      $selected = $listView.element.children().first();
+      $listView.select($selected);
+      $listView.trigger("change");
+    } else {
+      var index = $listView.select().trigger("change").index();
+      var view = $listView.dataSource.view();
+      var newIndex = Math.min(view.length - 1, Math.max(0, index + offset));
+      if (newIndex !== index) {
+        var dataItem = view[newIndex];
+        var element = $listView.element.find('[data-uid="' + dataItem.uid + '"]');
+        if (element) {
+          $listView.select(element);
+          $listView.trigger("change");
+          scrollIfNeeded(element[0], $listView.element[0]);
+        }
+      }
+    }
+  }
+  function scrollIfNeeded(element, container) {
+    if (element.offsetTop - element.clientHeight < container.scrollTop) {
+      element.scrollIntoView();
+    } else {
+      var offsetBottom = element.offsetTop + element.offsetHeight;
+      var scrollBottom = container.scrollTop + container.offsetHeight;
+      if (offsetBottom > scrollBottom) {
+        container.scrollTop = offsetBottom - container.offsetHeight;
+      }
+    }
+  }
+  function toggleErrorLabel(show, message) {
+    var $errorIcon = $searchOptionsPlaceholder.find("i[data-role='telerik_ReportViewer_SearchDialog_Error']");
+    if (!$errorIcon || $errorIcon.length === 0) {
+      console.log(message);
+      return;
+    }
+    var menuItem = $searchOptionsPlaceholder.data("kendoMenu").element.find("li").last();
+    if (show) {
+      $errorIcon[0].title = message;
+      menuItem.show();
+    } else {
+      menuItem.hide();
+    }
+  }
+  function replaceStringResources($search) {
+    if (!$search) {
+      return;
+    }
+    var $searchCaption = $search.find(".trv-search-dialog-caption-label");
+    var $searchOptions = $search.find(".trv-search-dialog-search-options");
+    var $searchStopButton = $search.find("a[data-command='telerik_ReportViewer_searchDialog_StopSearch']");
+    var $searchMatchCaseButton = $search.find("a[data-command='telerik_ReportViewer_searchDialog_MatchCase']");
+    var $searchMatchWholeWordButton = $search.find("a[data-command='telerik_ReportViewer_searchDialog_MatchWholeWord']");
+    var $searchUseRegexButton = $search.find("a[data-command='telerik_ReportViewer_searchDialog_UseRegex']");
+    var $searchNavigateUpButton = $search.find("a[data-command='telerik_ReportViewer_searchDialog_NavigateUp']");
+    var $searchNavigateDownButton = $search.find("a[data-command='telerik_ReportViewer_searchDialog_NavigateDown']");
+    replaceAttribute($search, "aria-label");
+    replaceAttribute($searchOptions, "aria-label");
+    replaceText($searchCaption);
+    replaceTitleAndAriaLabel($searchStopButton);
+    replaceTitleAndAriaLabel($searchMatchCaseButton);
+    replaceTitleAndAriaLabel($searchMatchWholeWordButton);
+    replaceTitleAndAriaLabel($searchUseRegexButton);
+    replaceTitleAndAriaLabel($searchNavigateUpButton);
+    replaceTitleAndAriaLabel($searchNavigateDownButton);
+  }
+  function replaceTitleAndAriaLabel($a) {
+    replaceAttribute($a, "title");
+    replaceAttribute($a, "aria-label");
+  }
+  function replaceText($el) {
+    if ($el) {
+      $el.text(stringResources[$el.text()]);
+    }
+  }
+  function replaceAttribute($el, attribute) {
+    if ($el) {
+      $el.attr(attribute, stringResources[$el.attr(attribute)]);
+    }
+  }
+  function command(execCallback) {
+    var enabledState = true;
+    var checkedState = false;
+    var cmd = {
+      enabled: function(state) {
+        if (arguments.length === 0) {
+          return enabledState;
+        }
+        var newState = Boolean(state);
+        enabledState = newState;
+        $(this).trigger("enabledChanged");
+        return cmd;
+      },
+      checked: function(state) {
+        if (arguments.length === 0) {
+          return checkedState;
+        }
+        var newState = Boolean(state);
+        checkedState = newState;
+        $(this).trigger("checkedChanged");
+        return cmd;
+      },
+      exec: execCallback
+    };
+    return cmd;
+  }
+}
+var pluginName = "telerik_ReportViewer_SearchDialog";
+$.fn[pluginName] = function(options, viewerOptions) {
+  return each(this, function() {
+    if (!$.data(this, pluginName)) {
+      $.data(this, pluginName, new Search(this, options, viewerOptions));
+    }
+  });
+};
+
+export { Search };