@oat-sa/tao-core-ui 3.24.0 → 3.24.2

package/dist/resourcemgr/assetSearch.js

@@ -48,7 +48,7 @@ define(['jquery', 'i18n', 'ui/pagination', 'ui/searchModal/advancedSearch', 'han
      */
     const ns = 'resourcemgr';
     const EVENT_NS = 'resourcemgrAssetSearch';
-    const DEFAULT_AJAX_TIMEOUT_MS = 10000;
+    const DEFAULT_AJAX_TIMEOUT_MS = 30000;
     const DEFAULT_ROOT_CLASS_URI = 'http://www.tao.lu/Ontologies/TAOMedia.rdf#Media';
     const SEARCH_MODE_MODAL_TITLE = __('Please select a file from the resource manager.');
 
@@ -753,7 +753,7 @@ define(['jquery', 'i18n', 'ui/pagination', 'ui/searchModal/advancedSearch', 'han
       function showLoading() {
         searchInFlight = true;
         $searchButton.prop('disabled', true).addClass('is-searching').attr('aria-busy', 'true');
-        $searchButtonSpinner.removeClass('hidden').removeAttr('hidden');
+        $searchButtonSpinner.removeClass('hidden');
         $searchButtonLabel.text(__('Searching'));
         $resultsRegion.attr('aria-busy', 'true');
       }
@@ -764,7 +764,7 @@ define(['jquery', 'i18n', 'ui/pagination', 'ui/searchModal/advancedSearch', 'han
       function hideLoading() {
         searchInFlight = false;
         $searchButton.removeClass('is-searching').attr('aria-busy', 'false');
-        $searchButtonSpinner.addClass('hidden').attr('hidden', 'hidden');
+        $searchButtonSpinner.addClass('hidden');
         $searchButtonLabel.text(__('Search'));
         $resultsRegion.attr('aria-busy', 'false');
         updateSearchActionState();

package/dist/resourcemgr/assetSearchContract.js

@@ -48,7 +48,7 @@ define(['exports'], function (exports) { 'use strict';
      * Default page size for search results.
      * @type {number}
      */
-    const DEFAULT_PAGE_SIZE = 10;
+    const DEFAULT_PAGE_SIZE = 11;
 
     /**
      * Minimum universal query length before Search is enabled (matches indexed prefix rules).
@@ -56,6 +56,14 @@ define(['exports'], function (exports) { 'use strict';
      */
     const MIN_TEXT_QUERY_LENGTH = 3;
 
+    /**
+     * @param {*} entry
+     * @returns {boolean}
+     */
+    function isNonemptyCriterionValue(entry) {
+      return entry !== '' && entry !== null && typeof entry !== 'undefined';
+    }
+
     /**
      * Whether a rendered metadata criterion has a usable value.
      * @param {Object} criterion
@@ -72,9 +80,7 @@ define(['exports'], function (exports) { 'use strict';
         if (!Array.isArray(criterion.value)) {
           return false;
         }
-        return criterion.value.some(function (entry) {
-          return entry !== '' && entry !== null && typeof entry !== 'undefined';
-        });
+        return criterion.value.some(isNonemptyCriterionValue);
       }
       return true;
     }
@@ -187,10 +193,8 @@ define(['exports'], function (exports) { 'use strict';
           return;
         }
         if (criterion.type === 'list' && Array.isArray(criterion.value)) {
-          const first = criterion.value.find(function (entry) {
-            return entry !== '' && entry !== null && typeof entry !== 'undefined';
-          });
-          if (typeof first !== 'undefined' && first !== null && first !== '') {
+          const first = criterion.value.find(isNonemptyCriterionValue);
+          if (isNonemptyCriterionValue(first)) {
             metadata[criterion.propertyUri] = String(first);
           }
         }
@@ -216,6 +220,31 @@ define(['exports'], function (exports) { 'use strict';
       return normalized;
     }
 
+    /**
+     * @param {number} [requestedPageSize]
+     * @param {number} [normalizedPageSize]
+     * @returns {number}
+     */
+    function resolveSearchPageSize(requestedPageSize, normalizedPageSize) {
+      const requested = Number(requestedPageSize);
+      if (requested > 0) {
+        return requested;
+      }
+      const fallback = Number(normalizedPageSize);
+      if (fallback > 0) {
+        return fallback;
+      }
+      return DEFAULT_PAGE_SIZE;
+    }
+
+    /**
+     * @param {{field: string, direction: string}} [sort]
+     * @returns {{field: string, direction: string}}
+     */
+    function mergeSortWithDefaults(sort) {
+      return Object.assign({}, DEFAULT_SORT, sort || {});
+    }
+
     /**
      * Normalize a search service payload into a stable picker shape.
      *
@@ -273,8 +302,8 @@ define(['exports'], function (exports) { 'use strict';
      */
     function applyLocalSearchFallback(normalized, options) {
       const metadata = normalizeMetadataMap(options && options.metadata);
+      const pageSize = resolveSearchPageSize(options && options.pageSize, normalized.pageSize);
       if (Object.keys(metadata).length) {
-        const pageSize = Number(options && options.pageSize) > 0 ? Number(options.pageSize) : normalized.pageSize || DEFAULT_PAGE_SIZE;
         return {
           items: [],
           total: 0,
@@ -284,8 +313,7 @@ define(['exports'], function (exports) { 'use strict';
         };
       }
       const query = String(options && options.query || '').trim().toLowerCase();
-      const sort = options && options.sort || DEFAULT_SORT;
-      const pageSize = Number(options && options.pageSize) > 0 ? Number(options.pageSize) : normalized.pageSize || DEFAULT_PAGE_SIZE;
+      const sort = mergeSortWithDefaults(options && options.sort);
       const page = Number(options && options.page) > 0 ? Number(options.page) : 1;
       let items = (normalized.items || []).filter(isSearchableAsset);
       if (query) {
@@ -414,7 +442,7 @@ define(['exports'], function (exports) { 'use strict';
      * @returns {Array}
      */
     function sortAssetItems(items, sort) {
-      const resolved = Object.assign({}, DEFAULT_SORT, sort || {});
+      const resolved = mergeSortWithDefaults(sort);
       return (items || []).slice().sort(function (a, b) {
         const primary = compareSortValues(getSortValue(a, resolved.field), getSortValue(b, resolved.field), resolved.direction);
         if (primary !== 0) {

package/dist/resourcemgr/css/resourcemgr.css

@@ -298,7 +298,7 @@ Usage:
   font-size: 1.2rem;
   display: inline-block;
   margin: 0;
-  color: #626262;
+  color: rgb(38.3333333333%, 38.3333333333%, 38.3333333333%);
   font-weight: normal;
   flex: 0 1 auto;
   min-width: 0;
@@ -321,7 +321,7 @@ Usage:
   max-width: 100%;
   flex: 0 1 auto;
   overflow: hidden;
-  color: #626262;
+  color: rgb(38.3333333333%, 38.3333333333%, 38.3333333333%);
   line-height: 1.6;
   font-weight: normal;
 }
@@ -471,7 +471,7 @@ Usage:
   content: "·";
   display: inline-block;
   margin: 0 6px;
-  color: #aeaeae;
+  color: rgb(68.3333333333%, 68.3333333333%, 68.3333333333%);
 }
 .resourcemgr .file-browser .asset-search .applied-filters-summary.hidden {
   display: none;
@@ -660,7 +660,7 @@ Usage:
   line-height: 1.3;
 }
 .resourcemgr .file-browser .asset-search .filter-spoiler-body .select2-container-multi .select2-choices .select2-search-choice.select2-search-choice-focus {
-  background-color: #dbd9d7;
+  background-color: rgb(85.7647058824%, 85.0588235294%, 84.3529411765%);
 }
 .resourcemgr .file-browser .asset-search .filter-spoiler-body .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close {
   background-image: none !important;
@@ -764,14 +764,18 @@ Usage:
 .resourcemgr .file-browser .asset-search-actions .asset-search-submit .asset-search-submit-spinner.hidden, .resourcemgr .file-browser .asset-search-actions .asset-search-submit .asset-search-submit-spinner[hidden] {
   display: none;
 }
-.resourcemgr .file-browser .asset-search-actions .asset-search-submit.is-searching .asset-search-submit-spinner:not(.hidden):not([hidden]) {
+.resourcemgr .file-browser .asset-search-actions .asset-search-submit.is-searching .asset-search-submit-spinner:not(.hidden) {
   display: inline-block;
+}
+.resourcemgr .file-browser .asset-search-actions .asset-search-submit.is-searching .asset-search-submit-spinner:not(.hidden).icon-loop::before {
+  display: inline-block;
+  transform-origin: 50% 50%;
   animation: rm-search-button-spin 1.4s linear infinite;
 }
 .resourcemgr .file-browser .asset-search-actions .asset-search-submit:disabled, .resourcemgr .file-browser .asset-search-actions .asset-search-submit[disabled] {
   color: #ffffff;
-  background-color: #aeaeae;
-  border-color: #aeaeae;
+  background-color: rgb(68.3333333333%, 68.3333333333%, 68.3333333333%);
+  border-color: rgb(68.3333333333%, 68.3333333333%, 68.3333333333%);
   cursor: not-allowed;
   opacity: 1;
   text-shadow: none;
@@ -779,8 +783,8 @@ Usage:
 }
 .resourcemgr .file-browser .asset-search-actions .asset-search-submit:disabled:hover, .resourcemgr .file-browser .asset-search-actions .asset-search-submit:disabled:focus, .resourcemgr .file-browser .asset-search-actions .asset-search-submit:disabled:active, .resourcemgr .file-browser .asset-search-actions .asset-search-submit[disabled]:hover, .resourcemgr .file-browser .asset-search-actions .asset-search-submit[disabled]:focus, .resourcemgr .file-browser .asset-search-actions .asset-search-submit[disabled]:active {
   color: #ffffff;
-  background-color: #aeaeae;
-  border-color: #aeaeae;
+  background-color: rgb(68.3333333333%, 68.3333333333%, 68.3333333333%);
+  border-color: rgb(68.3333333333%, 68.3333333333%, 68.3333333333%);
   opacity: 1;
 }
 .resourcemgr .file-browser .asset-search-actions .asset-search-submit.is-searching, .resourcemgr .file-browser .asset-search-actions .asset-search-submit.is-searching:disabled, .resourcemgr .file-browser .asset-search-actions .asset-search-submit.is-searching[disabled] {
@@ -805,11 +809,56 @@ Usage:
   }
 }
 .resourcemgr .file-browser .file-browser-wrapper {
-  overflow: auto;
+  position: relative;
+  display: flex;
+  flex-direction: column;
   flex: 1 1 auto;
   min-height: 0;
+  overflow: hidden;
+}
+.resourcemgr .file-browser .file-browser-wrapper.is-tree-loading {
+  pointer-events: none;
+}
+.resourcemgr .file-browser .file-browser-wrapper.is-tree-loading .file-browser-scroll {
+  overflow: hidden;
+}
+.resourcemgr .file-browser .file-browser-wrapper .file-browser-scroll {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow: auto;
   padding: 8px 4px 12px;
 }
+.resourcemgr .file-browser .file-browser-wrapper .file-browser-tree-loading {
+  position: absolute;
+  inset: 0;
+  z-index: 3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: rgba(255, 255, 255, 0.75);
+}
+.resourcemgr .file-browser .file-browser-wrapper .file-browser-tree-loading.hidden {
+  display: none;
+}
+.resourcemgr .file-browser .file-browser-wrapper .file-browser-tree-loading .icon-loop {
+  color: #286d9c;
+  font-size: 22px;
+  font-size: 2.2rem;
+}
+.resourcemgr .file-browser .file-browser-wrapper .file-browser-tree-loading .icon-loop::before {
+  display: inline-block;
+  transform-origin: 50% 50%;
+  animation: rm-search-button-spin 1.4s linear infinite;
+}
+.resourcemgr .file-browser .file-browser-wrapper .file-browser-tree-loading .file-browser-tree-loading-status {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  clip: rect(1px, 1px, 1px, 1px);
+  margin: 0;
+  padding: 0;
+}
 .resourcemgr .file-browser ul {
   list-style-type: none;
   padding-left: 5px;
@@ -847,7 +896,7 @@ Usage:
 }
 .resourcemgr .file-browser ul li a > .tree-toggle {
   width: 1em;
-  color: #626262;
+  color: rgb(38.3333333333%, 38.3333333333%, 38.3333333333%);
 }
 .resourcemgr .file-browser ul li a > .tree-toggle.is-leaf:before, .resourcemgr .file-browser ul li a > .tree-toggle:not(.icon-right):not(.icon-down):before {
   content: none;
@@ -866,7 +915,7 @@ Usage:
   content: "\e60d";
 }
 .resourcemgr .file-browser ul li.active > a {
-  background-color: #eaf0f5;
+  background-color: rgb(91.568627451%, 94.2745098039%, 96.1176470588%);
   border: 0;
   outline: none;
   box-shadow: none;
@@ -947,7 +996,7 @@ Usage:
 }
 .resourcemgr .file-selector .empty {
   display: none;
-  color: #626262;
+  color: rgb(38.3333333333%, 38.3333333333%, 38.3333333333%);
   font-style: italic;
   font-size: 18px;
   font-size: 1.8rem;
@@ -974,9 +1023,53 @@ Usage:
 }
 .resourcemgr .file-selector .files-wrapper {
   position: relative;
+  display: flex;
+  flex-direction: column;
   flex-grow: 1;
-  overflow-y: auto;
   min-height: 0;
+  overflow: hidden;
+}
+.resourcemgr .file-selector .files-wrapper.is-files-loading {
+  pointer-events: none;
+}
+.resourcemgr .file-selector .files-wrapper.is-files-loading .files-scroll {
+  overflow-y: hidden;
+}
+.resourcemgr .file-selector .files-wrapper .files-scroll {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow-y: auto;
+}
+.resourcemgr .file-selector .files-wrapper .files-list-loading {
+  position: absolute;
+  inset: 0;
+  z-index: 2;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: rgba(255, 255, 255, 0.82);
+}
+.resourcemgr .file-selector .files-wrapper .files-list-loading.hidden {
+  display: none;
+}
+.resourcemgr .file-selector .files-wrapper .files-list-loading .icon-loop {
+  color: #286d9c;
+  font-size: 22px;
+  font-size: 2.2rem;
+}
+.resourcemgr .file-selector .files-wrapper .files-list-loading .icon-loop::before {
+  display: inline-block;
+  transform-origin: 50% 50%;
+  animation: rm-search-button-spin 1.4s linear infinite;
+}
+.resourcemgr .file-selector .files-wrapper .files-list-loading .files-list-loading-status {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  clip: rect(1px, 1px, 1px, 1px);
+  margin: 0;
+  padding: 0;
 }
 .resourcemgr .file-selector table.files {
   width: 100%;
@@ -988,7 +1081,7 @@ Usage:
   text-align: left;
   font-weight: bold;
   padding: 12px 12px 10px;
-  border-bottom: 1px solid #ebecee;
+  border-bottom: 1px solid rgb(92%, 92.4705882353%, 93.1764705882%);
   background-color: transparent;
   color: #222222;
   white-space: nowrap;
@@ -1010,7 +1103,6 @@ Usage:
   height: 12px;
   opacity: 0.55;
   background-color: #222222;
-  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Cpath fill='black' d='M0 1h12v1.5H0zm0 3.5h9v1.5H0zm0 3.5h6v1.5H0z'/%3E%3Cpath fill='black' d='M9.5 8.5L12 12H7z'/%3E%3C/svg%3E") center/contain no-repeat;
   mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Cpath fill='black' d='M0 1h12v1.5H0zm0 3.5h9v1.5H0zm0 3.5h6v1.5H0z'/%3E%3Cpath fill='black' d='M9.5 8.5L12 12H7z'/%3E%3C/svg%3E") center/contain no-repeat;
 }
 .resourcemgr .file-selector table.files thead th.sortable:hover .sort-label:after, .resourcemgr .file-selector table.files thead th.sortable:focus .sort-label:after {
@@ -1029,7 +1121,7 @@ Usage:
   cursor: pointer;
 }
 .resourcemgr .file-selector table.files tbody tr.active, .resourcemgr .file-selector table.files tbody tr:hover {
-  background-color: #eaf0f5;
+  background-color: rgb(91.568627451%, 94.2745098039%, 96.1176470588%);
 }
 .resourcemgr .file-selector table.files tbody tr td {
   padding: 10px 12px;
@@ -1120,7 +1212,7 @@ Usage:
 .resourcemgr .file-selector table.files .meta {
   font-size: 12px;
   font-size: 1.2rem;
-  color: #626262;
+  color: rgb(38.3333333333%, 38.3333333333%, 38.3333333333%);
 }
 .resourcemgr .file-selector table.files .row-actions {
   display: inline-flex;
@@ -1272,7 +1364,7 @@ Usage:
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > a,
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > span,
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > button {
-  color: #959595;
+  color: rgb(58.3333333333%, 58.3333333333%, 58.3333333333%);
   cursor: not-allowed;
   text-decoration: none;
   pointer-events: none;
@@ -1287,7 +1379,7 @@ Usage:
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > button:hover,
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > button:focus,
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > button:active {
-  color: #959595;
+  color: rgb(58.3333333333%, 58.3333333333%, 58.3333333333%);
   text-decoration: none;
   background: transparent;
   background-color: transparent;
@@ -1307,7 +1399,7 @@ Usage:
 .resourcemgr .file-selector .pagination-bottom .pagination .pages > .disabled > button:active {
   background-color: transparent !important;
   border: none !important;
-  color: #959595 !important;
+  color: rgb(58.3333333333%, 58.3333333333%, 58.3333333333%) !important;
   cursor: not-allowed !important;
   opacity: 1 !important;
   text-shadow: none !important;