@oat-sa/tao-core-ui 3.19.2 → 3.21.0

package/dist/datatable.js

@@ -228,7 +228,7 @@ define(['jquery', 'lodash', 'i18n', 'core/pluginifier', 'handlebars', 'lib/handl
       buffer += ">";
       if (helper = helpers.label) { stack1 = helper.call(depth0, {hash:{},data:data}); }
       else { helper = (depth0 && depth0.label); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
-      buffer += escapeExpression(stack1);
+      if(stack1 || stack1 === 0) { buffer += stack1; }
       stack1 = helpers['if'].call(depth0, (depth0 && depth0.alias), {hash:{},inverse:self.noop,fn:self.program(51, program51, data),data:data});
       if(stack1 || stack1 === 0) { buffer += stack1; }
       stack1 = helpers['if'].call(depth0, (depth0 && depth0.comment), {hash:{},inverse:self.noop,fn:self.program(53, program53, data),data:data});
@@ -563,9 +563,10 @@ define(['jquery', 'lodash', 'i18n', 'core/pluginifier', 'handlebars', 'lib/handl
       buffer += ">\n                                ";
       stack1 = helpers['if'].call(depth0, (depth2 && depth2.icon), {hash:{},inverse:self.noop,fn:self.programWithDepth(75, program75, data, depth2),data:data});
       if(stack1 || stack1 === 0) { buffer += stack1; }
-      buffer += "\n                                "
-        + escapeExpression(((stack1 = (depth2 && depth2.label)),typeof stack1 === functionType ? stack1.apply(depth0) : stack1))
-        + "\n                            </button>\n                                        ";
+      buffer += "\n                                ";
+      stack1 = ((stack1 = (depth2 && depth2.label)),typeof stack1 === functionType ? stack1.apply(depth0) : stack1);
+      if(stack1 || stack1 === 0) { buffer += stack1; }
+      buffer += "\n                            </button>\n                                        ";
       return buffer;
       }
 

package/dist/dialog.js

@@ -118,8 +118,8 @@ define(['jquery', 'lodash', 'i18n', 'handlebars', 'lib/handlebars/helpers', 'ui/
       buffer += "\n        <span class=\"label\">";
       if (helper = helpers.label) { stack1 = helper.call(depth0, {hash:{},data:data}); }
       else { helper = (depth0 && depth0.label); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
-      buffer += escapeExpression(stack1)
-        + "</span>\n    </button>\n";
+      if(stack1 || stack1 === 0) { buffer += stack1; }
+      buffer += "</span>\n    </button>\n";
       return buffer;
       }
     function program2(depth0,data) {

package/dist/feedback.js

@@ -96,6 +96,32 @@ define(['jquery', 'lodash', 'core/format', 'ui/component', 'util/wrapLongWords',
       //change the display (absolute or in the flow)
       popup: true
     };
+    var feedbackFactory;
+    const RUBY_HTML = /<\s*(?:ruby|rt|rp|rb)\b/i;
+    const RUBY_BLOCK = /<ruby\b[^>]*>[\s\S]*?<\/ruby>/gi;
+
+    /**
+     * HTML-encodes a string while preserving ruby annotation blocks.
+     *
+     * @param {String} str
+     * @returns {String}
+     */
+    function encodeHtmlPreservingRuby(str) {
+      var parts = [];
+      var rubies = [];
+      var lastIndex = 0;
+      var match;
+      RUBY_BLOCK.lastIndex = 0;
+      while ((match = RUBY_BLOCK.exec(str)) !== null) {
+        parts.push(str.slice(lastIndex, match.index));
+        rubies.push(match[0]);
+        lastIndex = match.index + match[0].length;
+      }
+      parts.push(str.slice(lastIndex));
+      return parts.map(function (part, index) {
+        return encode.html(part) + (rubies[index] || '');
+      }).join('');
+    }
 
     /**
      * Creates a feedback object.
@@ -110,7 +136,7 @@ define(['jquery', 'lodash', 'core/format', 'ui/component', 'util/wrapLongWords',
      * @returns {feedback} the feedback object
      * @throws {TypeError} without a container
      */
-    var feedbackFactory = function feedbackFactory($container, config) {
+    feedbackFactory = function ($container, config) {
       var feedback;
       const codeEnter = 13;
       const codeSpace = 32;
@@ -146,14 +172,15 @@ define(['jquery', 'lodash', 'core/format', 'ui/component', 'util/wrapLongWords',
           }
           this.config = _.defaults(options || {}, this.config);
           this.config.level = level;
+          const hasRubyHtml = typeof displayedMessage === 'string' && RUBY_HTML.test(displayedMessage);
 
           // encode plain text string to html
           if (this.config.encodeHtml) {
-            displayedMessage = encode.html(displayedMessage);
+            displayedMessage = hasRubyHtml ? encodeHtmlPreservingRuby(displayedMessage) : encode.html(displayedMessage);
           }
 
           // wrap long words
-          if (this.config.wrapLongWordsAfter) {
+          if (this.config.wrapLongWordsAfter && !hasRubyHtml) {
             displayedMessage = wrapLongWords(displayedMessage, this.config.wrapLongWordsAfter);
           }
 
@@ -285,7 +312,8 @@ define(['jquery', 'lodash', 'core/format', 'ui/component', 'util/wrapLongWords',
         _.pull(currents, this);
       }).init(config);
     };
+    var feedbackFactory$1 = feedbackFactory;
 
-    return feedbackFactory;
+    return feedbackFactory$1;
 
 });

package/dist/login/login.js

@@ -86,9 +86,9 @@ define(['jquery', 'lodash', 'i18n', 'ui/component', 'ui/feedback', 'util/url', '
       buffer += " aria-required=\"true\">\n            ";
       stack1 = helpers['if'].call(depth0, ((stack1 = (depth0 && depth0.fieldMessages)),stack1 == null || stack1 === false ? stack1 : stack1.password), {hash:{},inverse:self.noop,fn:self.program(7, program7, data),data:data});
       if(stack1 || stack1 === 0) { buffer += stack1; }
-      buffer += "\n        </div>\n        <div class=\"form-toolbar\"><input type=\"submit\" id=\"connect\" name=\"connect\" disabled=\"disabled\" class=\"disabled\" value=\""
+      buffer += "\n        </div>\n        <div class=\"form-toolbar\">\n            <button type=\"submit\" id=\"connect\" name=\"connect\" disabled=\"disabled\" class=\"disabled\">"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Log in", options) : helperMissing.call(depth0, "__", "Log in", options)))
-        + "\"></div>\n    </form>\n</div>\n";
+        + "</button>\n        </div>\n    </form>\n</div>\n";
       return buffer;
       });
     function loginTpl(data, options, asString) {

package/dist/resource/selector.js

@@ -124,8 +124,8 @@ define(['jquery', 'lodash', 'i18n', 'ui/component', 'ui/hider', 'ui/class/select
         + " ";
       if (helper = helpers.type) { stack1 = helper.call(depth0, {hash:{},data:data}); }
       else { helper = (depth0 && depth0.type); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
-      buffer += escapeExpression(stack1)
-        + " : </span><span class=\"selected-num\">0</span>\n        </div>\n    </footer>\n    ";
+      if(stack1 || stack1 === 0) { buffer += stack1; }
+      buffer += " : </span><span class=\"selected-num\">0</span>\n        </div>\n    </footer>\n    ";
       return buffer;
       }
 

package/dist/resourcemgr/fileBrowser.js

@@ -242,7 +242,7 @@ define(['jquery', 'lodash', 'core/request', 'ui/pagination', 'handlebars', 'lib/
 	        $selected.parent('li').addClass('active');
 
 	        //internal event to set the file-selector content
-	        updateSelectedClass(fullPath, subTree.total, $selected.data('children-limit'));
+	        updateSelectedClass(fullPath, content.total, content.childrenLimit);
 	        $container.trigger(`folderselect.${ns}`, [content.label, getPage(content.children), content.path, content]);
 	        renderPagination();
 	      }
@@ -267,9 +267,11 @@ define(['jquery', 'lodash', 'core/request', 'ui/pagination', 'handlebars', 'lib/
 	          // if not all, new file will be loaded with next page
 	          subTree.children.push(file);
 	        }
-	        subTree.total++;
-	        selectedClass.total++;
-	        $container.trigger(`folderselect.${ns}`, [subTree.label, getPage(subTree.children), path]);
+	        subTree.total = Number.isFinite(Number(subTree.total)) ? Number(subTree.total) + 1 : 1;
+	        if (selectedClass.path === path) {
+	          selectedClass.total = subTree.total;
+	        }
+	        $container.trigger(`folderselect.${ns}`, [subTree.label, getPage(subTree.children), path, subTree]);
 	        renderPagination();
 	      }
 	    }
@@ -328,7 +330,9 @@ define(['jquery', 'lodash', 'core/request', 'ui/pagination', 'handlebars', 'lib/
 	            return !!item.uri;
 	          });
 	          setToPath(tree, path, {
-	            children: loadedFiles
+	            children: loadedFiles,
+	            total: data.total,
+	            childrenLimit: data.childrenLimit
 	          });
 	          content = getByPath(tree, path);
 	          cb(content);
@@ -392,7 +396,12 @@ define(['jquery', 'lodash', 'core/request', 'ui/pagination', 'handlebars', 'lib/
 	    if (tree) {
 	      if (tree.path === path) {
 	        tree.children = tree.children ? tree.children.concat(data.children) : data.children;
-	        tree.total = data.total;
+	        if (Object.prototype.hasOwnProperty.call(data, 'total')) {
+	          tree.total = data.total;
+	        }
+	        if (Object.prototype.hasOwnProperty.call(data, 'childrenLimit')) {
+	          tree.childrenLimit = data.childrenLimit;
+	        }
 	      } else if (tree.children) {
 	        _.forEach(tree.children, function (child) {
 	          done = setToPath(child, path, data);
@@ -483,10 +492,12 @@ define(['jquery', 'lodash', 'core/request', 'ui/pagination', 'handlebars', 'lib/
 	   * @param {Number} childrenLimit - page size
 	   */
 	  function updateSelectedClass(path, total, childrenLimit) {
+	    const normalizedTotal = Number(total);
+	    const normalizedChildrenLimit = Number(childrenLimit);
 	    selectedClass = {
 	      path,
-	      total,
-	      childrenLimit,
+	      total: Number.isFinite(normalizedTotal) && normalizedTotal >= 0 ? normalizedTotal : 0,
+	      childrenLimit: Number.isFinite(normalizedChildrenLimit) && normalizedChildrenLimit > 0 ? normalizedChildrenLimit : selectedClass.childrenLimit || 10,
 	      page: 1
 	    };
 	  }
@@ -495,9 +506,14 @@ define(['jquery', 'lodash', 'core/request', 'ui/pagination', 'handlebars', 'lib/
 	   */
 	  function renderPagination() {
 	    const $paginationContainer = $$1('.pagination-bottom', $container);
+	    const total = Number(selectedClass.total);
+	    const childrenLimit = Number(selectedClass.childrenLimit);
 	    $paginationContainer.empty();
-	    const totalPages = Math.ceil(selectedClass.total / selectedClass.childrenLimit);
-	    if (selectedClass.total && totalPages > 1) {
+	    if (!Number.isFinite(total) || !Number.isFinite(childrenLimit) || childrenLimit <= 0) {
+	      return;
+	    }
+	    const totalPages = Math.ceil(total / childrenLimit);
+	    if (total > 0 && totalPages > 1) {
 	      paginationComponent({
 	        mode: 'simple',
 	        activePage: selectedClass.page,

package/dist/resourcemgr/fileSelector.js

@@ -375,19 +375,16 @@ define(['jquery', 'lodash', 'async', 'i18n', 'core/mimetype', 'handlebars', 'lib
       function setUpUploader(currentPath) {
         let errors = [];
         let $switcher = $$1('.upload-switcher a', $fileSelector);
+        let isUploadMode = false;
         $uploader.on('upload.uploader', function (e, file, result) {
-          let path = $$1(`[data-display="${currentPath}"]`).data('path') || $$1(`[data-display="/${currentPath}"]`).data('path');
-          if (!path) {
-            path = currentPath;
-          }
-          $container.trigger(`filenew.${ns}`, [result, path]);
+          $container.trigger(`filenew.${ns}`, [result, currentPath]);
         });
         $uploader.on('fail.uploader', function (e, file, err) {
           errors.push(__('Unable to upload file %s : %s', file.name, err.message));
         });
         $uploader.on('end.uploader', function () {
           if (errors.length === 0) {
-            _.delay(switchUpload, 500);
+            setUploadMode(false);
           } else {
             feedback().error(`<ul><li>${errors.join('</li><li>')}</li></ul>`, {
               encodeHtml: false
@@ -461,8 +458,9 @@ define(['jquery', 'lodash', 'async', 'i18n', 'core/mimetype', 'handlebars', 'lib
             uploadUrl: `${options.uploadUrl}?${$$1.param(options.params)}&${options.pathParam}=${currentPath}&relPath=${currentPath}`
           });
         });
-        function switchUpload() {
-          if ($fileContainer.css('display') === 'none') {
+        function setUploadMode(enableUploadMode) {
+          if (!enableUploadMode) {
+            isUploadMode = false;
             $uploader.hide();
             $fileContainer.show();
             // Note: show() would display as inline, not inline-block!
@@ -472,6 +470,7 @@ define(['jquery', 'lodash', 'async', 'i18n', 'core/mimetype', 'handlebars', 'lib
             $switcher.filter('.listing').hide();
             $browserTitle.text(__('Browse folders:'));
           } else {
+            isUploadMode = true;
             $fileContainer.hide();
             $placeholder.hide();
             $uploader.show();
@@ -487,8 +486,13 @@ define(['jquery', 'lodash', 'async', 'i18n', 'core/mimetype', 'handlebars', 'lib
         //switch to upload mode
         $switcher.click(function (e) {
           e.preventDefault();
-          switchUpload();
+          if ($$1(this).hasClass('upload')) {
+            setUploadMode(true);
+          } else if ($$1(this).hasClass('listing')) {
+            setUploadMode(false);
+          }
         });
+        setUploadMode(isUploadMode);
       }
       function updateFiles(path, files) {
         $fileContainer.empty();

package/dist/resourcemgr.js

@@ -32,8 +32,8 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
       buffer += "\">\n\n    <h2>";
       if (helper = helpers.title) { stack1 = helper.call(depth0, {hash:{},data:data}); }
       else { helper = (depth0 && depth0.title); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
-      buffer += escapeExpression(stack1)
-        + "</h2>\n\n    <div class=\"file-wrapper\">\n\n        <!-- left section: items selection -->\n        <section class=\"file-browser\">\n            <h1>"
+      if(stack1 || stack1 === 0) { buffer += stack1; }
+      buffer += "</h2>\n\n    <div class=\"file-wrapper\">\n\n        <!-- left section: items selection -->\n        <section class=\"file-browser\">\n            <h1>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Browse resources", options) : helperMissing.call(depth0, "__", "Browse resources", options)))
         + "</h1>\n            <div class=\"file-browser-wrapper\"></div>\n        </section>\n\n        <!-- test editor  -->\n        <section class=\"file-selector\">\n\n            <h1>\n                <div class=\"title lft\"></div>\n                <div class=\"upload-switcher rgt\">\n                    <a href=\"#\" class=\"btn-info small upload hidden\"><span class=\"icon-add\"></span>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Add file(s)", options) : helperMissing.call(depth0, "__", "Add file(s)", options)))

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@oat-sa/tao-core-ui",
-    "version": "3.19.2",
+    "version": "3.21.0",
     "displayName": "TAO Core UI",
     "description": "UI libraries of TAO",
     "scripts": {
@@ -52,7 +52,7 @@
         "@oat-sa/prettier-config": "^0.1.1",
         "@oat-sa/rollup-plugin-wildcard-external": "^1.0.0",
         "@oat-sa/tao-calculator": "^0.6.2",
-        "@oat-sa/tao-core-libs": "^1.0.0",
+        "@oat-sa/tao-core-libs": "^1.2.1",
         "@oat-sa/tao-core-sdk": "^3.0.0",
         "@oat-sa/tao-core-shared-libs": "^1.6.1",
         "@oat-sa/tao-qunit-testrunner": "^2.0.0",

package/src/datatable/tpl/layout.tpl

@@ -64,7 +64,7 @@
                                 data-sort-by="{{#if sortId}}{{sortId}}{{else}}{{id}}{{/if}}"
                                 {{#if sorttype}}data-sort-type="{{sorttype}}"{{/if}}
                                 tabindex="0"
-                            {{/if}}>{{label}}{{#if alias}} <span class="alias">({{alias}})</span>{{/if}}{{#if comment}} <span class="comment">/ {{comment}}</span>{{/if}}</div>
+                            {{/if}}>{{{label}}}{{#if alias}} <span class="alias">({{alias}})</span>{{/if}}{{#if comment}} <span class="comment">/ {{comment}}</span>{{/if}}</div>
                         {{#if filterable}}
                         <aside data-column="{{id}}" class="filter column
                             {{#if customFilter}} customInput" >
@@ -132,7 +132,7 @@
                                 {{#if ../../title}} title="{{../../../title}}"{{/if}}
                                 {{#if ../../disabled}} disabled="disabled"{{/if}}>
                                 {{#if ../../icon}}<span class="icon-{{../../../icon}}"></span>{{/if}}
-                                {{../../label}}
+                                {{{../../label}}}
                             </button>
                                         {{/unless}}
                                     {{/with}}

package/src/dialog/tpl/buttons.tpl

@@ -1,6 +1,6 @@
 {{#each buttons}}
     <button class="btn-{{type}} small {{id}}" data-control="{{id}}" type="button">
         {{#if icon}}<span class="icon-{{icon}}"></span> {{/if}}
-        <span class="label">{{label}}</span>
+        <span class="label">{{{label}}}</span>
     </button>
 {{/each}}

package/src/feedback.js

@@ -70,6 +70,36 @@ var defaultOptions = {
     popup: true
 };
 
+var feedbackFactory;
+
+const RUBY_HTML = /<\s*(?:ruby|rt|rp|rb)\b/i;
+const RUBY_BLOCK = /<ruby\b[^>]*>[\s\S]*?<\/ruby>/gi;
+
+/**
+ * HTML-encodes a string while preserving ruby annotation blocks.
+ *
+ * @param {String} str
+ * @returns {String}
+ */
+function encodeHtmlPreservingRuby(str) {
+    var parts = [];
+    var rubies = [];
+    var lastIndex = 0;
+    var match;
+
+    RUBY_BLOCK.lastIndex = 0;
+    while ((match = RUBY_BLOCK.exec(str)) !== null) {
+        parts.push(str.slice(lastIndex, match.index));
+        rubies.push(match[0]);
+        lastIndex = match.index + match[0].length;
+    }
+    parts.push(str.slice(lastIndex));
+
+    return parts.map(function(part, index) {
+        return encode.html(part) + (rubies[index] || '');
+    }).join('');
+}
+
 /**
  * Creates a feedback object.
  *
@@ -83,7 +113,7 @@ var defaultOptions = {
  * @returns {feedback} the feedback object
  * @throws {TypeError} without a container
  */
-var feedbackFactory = function feedbackFactory($container, config) {
+feedbackFactory = function ($container, config) {
     var feedback;
     const codeEnter = 13;
     const codeSpace = 32;
@@ -124,13 +154,18 @@ var feedbackFactory = function feedbackFactory($container, config) {
                 this.config = _.defaults(options || {}, this.config);
                 this.config.level = level;
 
+                const hasRubyHtml =
+                    typeof displayedMessage === 'string' && RUBY_HTML.test(displayedMessage);
+
                 // encode plain text string to html
                 if (this.config.encodeHtml) {
-                    displayedMessage = encode.html(displayedMessage);
+                    displayedMessage = hasRubyHtml
+                        ? encodeHtmlPreservingRuby(displayedMessage)
+                        : encode.html(displayedMessage);
                 }
 
                 // wrap long words
-                if (this.config.wrapLongWordsAfter) {
+                if (this.config.wrapLongWordsAfter && !hasRubyHtml) {
                     displayedMessage = wrapLongWords(displayedMessage, this.config.wrapLongWordsAfter);
                 }
 

package/src/login/tpl/login.tpl

@@ -24,6 +24,8 @@
                 </div>
             {{/if}}
         </div>
-        <div class="form-toolbar"><input type="submit" id="connect" name="connect" disabled="disabled" class="disabled" value="{{__ "Log in"}}"></div>
+        <div class="form-toolbar">
+            <button type="submit" id="connect" name="connect" disabled="disabled" class="disabled">{{__ "Log in"}}</button>
+        </div>
     </form>
 </div>

package/src/resource/tpl/selector.tpl

@@ -39,7 +39,7 @@
     {{#if multiple}}
     <footer>
         <div class="get-selection">
-           <span>{{__ 'Selected'}} {{type}} : </span><span class="selected-num">0</span>
+           <span>{{__ 'Selected'}} {{{ type }}} : </span><span class="selected-num">0</span>
         </div>
     </footer>
     {{/if}}

package/src/resourcemgr/fileBrowser.js

@@ -107,7 +107,7 @@ export default function (options) {
                 $selected.parent('li').addClass('active');
 
                 //internal event to set the file-selector content
-                updateSelectedClass(fullPath, subTree.total, $selected.data('children-limit'));
+                updateSelectedClass(fullPath, content.total, content.childrenLimit);
                 $container.trigger(`folderselect.${ns}`, [
                     content.label,
                     getPage(content.children),
@@ -137,9 +137,11 @@ export default function (options) {
                     // if not all, new file will be loaded with next page
                     subTree.children.push(file);
                 }
-                subTree.total++;
-                selectedClass.total++;
-                $container.trigger(`folderselect.${ns}`, [subTree.label, getPage(subTree.children), path]);
+                subTree.total = Number.isFinite(Number(subTree.total)) ? Number(subTree.total) + 1 : 1;
+                if (selectedClass.path === path) {
+                    selectedClass.total = subTree.total;
+                }
+                $container.trigger(`folderselect.${ns}`, [subTree.label, getPage(subTree.children), path, subTree]);
                 renderPagination();
             }
         }
@@ -201,7 +203,11 @@ export default function (options) {
                     const loadedFiles = _.filter(data.children, function (item) {
                         return !!item.uri;
                     });
-                    setToPath(tree, path, { children: loadedFiles });
+                    setToPath(tree, path, {
+                        children: loadedFiles,
+                        total: data.total,
+                        childrenLimit: data.childrenLimit
+                    });
                     content = getByPath(tree, path);
                     cb(content);
                 });
@@ -263,7 +269,12 @@ export default function (options) {
         if (tree) {
             if (tree.path === path) {
                 tree.children = tree.children ? tree.children.concat(data.children) : data.children;
-                tree.total = data.total;
+                if (Object.prototype.hasOwnProperty.call(data, 'total')) {
+                    tree.total = data.total;
+                }
+                if (Object.prototype.hasOwnProperty.call(data, 'childrenLimit')) {
+                    tree.childrenLimit = data.childrenLimit;
+                }
             } else if (tree.children) {
                 _.forEach(tree.children, function (child) {
                     done = setToPath(child, path, data);
@@ -356,10 +367,16 @@ export default function (options) {
      * @param {Number} childrenLimit - page size
      */
     function updateSelectedClass(path, total, childrenLimit) {
+        const normalizedTotal = Number(total);
+        const normalizedChildrenLimit = Number(childrenLimit);
+
         selectedClass = {
             path,
-            total,
-            childrenLimit,
+            total: Number.isFinite(normalizedTotal) && normalizedTotal >= 0 ? normalizedTotal : 0,
+            childrenLimit:
+                Number.isFinite(normalizedChildrenLimit) && normalizedChildrenLimit > 0
+                    ? normalizedChildrenLimit
+                    : selectedClass.childrenLimit || 10,
             page: 1
         };
     }
@@ -368,10 +385,18 @@ export default function (options) {
      */
     function renderPagination() {
         const $paginationContainer = $('.pagination-bottom', $container);
+        const total = Number(selectedClass.total);
+        const childrenLimit = Number(selectedClass.childrenLimit);
+
         $paginationContainer.empty();
-        const totalPages = Math.ceil(selectedClass.total / selectedClass.childrenLimit);
 
-        if (selectedClass.total && totalPages > 1) {
+        if (!Number.isFinite(total) || !Number.isFinite(childrenLimit) || childrenLimit <= 0) {
+            return;
+        }
+
+        const totalPages = Math.ceil(total / childrenLimit);
+
+        if (total > 0 && totalPages > 1) {
             paginationComponent({
                 mode: 'simple',
                 activePage: selectedClass.page,

package/src/resourcemgr/fileSelector.js

@@ -231,14 +231,10 @@ export default function (options) {
     function setUpUploader(currentPath) {
         let errors = [];
         let $switcher = $('.upload-switcher a', $fileSelector);
+        let isUploadMode = false;
 
         $uploader.on('upload.uploader', function (e, file, result) {
-            let path =
-                $(`[data-display="${currentPath}"]`).data('path') || $(`[data-display="/${currentPath}"]`).data('path');
-            if (!path) {
-                path = currentPath;
-            }
-            $container.trigger(`filenew.${ns}`, [result, path]);
+            $container.trigger(`filenew.${ns}`, [result, currentPath]);
         });
         $uploader.on('fail.uploader', function (e, file, err) {
             errors.push(__('Unable to upload file %s : %s', file.name, err.message));
@@ -246,7 +242,7 @@ export default function (options) {
 
         $uploader.on('end.uploader', function () {
             if (errors.length === 0) {
-                _.delay(switchUpload, 500);
+                setUploadMode(false);
             } else {
                 feedback().error(`<ul><li>${errors.join('</li><li>')}</li></ul>`, { encodeHtml: false });
             }
@@ -333,8 +329,9 @@ export default function (options) {
             });
         });
 
-        function switchUpload() {
-            if ($fileContainer.css('display') === 'none') {
+        function setUploadMode(enableUploadMode) {
+            if (!enableUploadMode) {
+                isUploadMode = false;
                 $uploader.hide();
                 $fileContainer.show();
                 // Note: show() would display as inline, not inline-block!
@@ -342,6 +339,7 @@ export default function (options) {
                 $switcher.filter('.listing').hide();
                 $browserTitle.text(__('Browse folders:'));
             } else {
+                isUploadMode = true;
                 $fileContainer.hide();
                 $placeholder.hide();
                 $uploader.show();
@@ -355,8 +353,14 @@ export default function (options) {
         //switch to upload mode
         $switcher.click(function (e) {
             e.preventDefault();
-            switchUpload();
+            if ($(this).hasClass('upload')) {
+                setUploadMode(true);
+            } else if ($(this).hasClass('listing')) {
+                setUploadMode(false);
+            }
         });
+
+        setUploadMode(isUploadMode);
     }
 
     function updateFiles(path, files) {

package/src/resourcemgr/tpl/layout.tpl

@@ -1,6 +1,6 @@
 <div class="resourcemgr modal {{#if className}}{{className}}{{/if}}">
 
-    <h2>{{title}}</h2>
+    <h2>{{{ title }}}</h2>
 
     <div class="file-wrapper">