@sapui5/sap.ushell 1.138.1 → 1.139.0

package/src/main/js/sap/ushell/components/factsheet/controls/PictureViewer.js

@@ -5,18 +5,20 @@
  * @deprecated since 1.22. Please use {@link sap.m.Carousel} instead.
  */
 sap.ui.define([
+    "sap/ui/thirdparty/jquery",
     "sap/m/TileContainer",
     "sap/ui/Device",
     "sap/ushell/components/factsheet/controls/PictureTile",
     "sap/ushell/library", // css style dependency
     "./PictureViewerRenderer"
-], function (
+], (
+    jQuery,
     TileContainer,
     Device,
     PictureTile
     // ushellLibrary
     // PictureViewerRenderer
-) {
+) => {
     "use strict";
 
     /**
@@ -34,7 +36,7 @@ sap.ui.define([
      * @name sap.ushell.components.factsheet.controls.PictureViewer
      * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
      */
-    var PictureViewer = TileContainer.extend("sap.ushell.components.factsheet.controls.PictureViewer", /** @lends sap.ushell.components.factsheet.controls.PictureViewer.prototype */ {
+    const PictureViewer = TileContainer.extend("sap.ushell.components.factsheet.controls.PictureViewer", /** @lends sap.ushell.components.factsheet.controls.PictureViewer.prototype */ {
         metadata: {
             deprecated: true,
             library: "sap.ushell",
@@ -65,7 +67,7 @@ sap.ui.define([
 
         if (sap.ui.getCore().isMobile()) {
             jQuery(window).on("tap", this._reset.bind(this));
-            var oStaticArea = sap.ui.getCore().getStaticAreaRef();
+            const oStaticArea = sap.ui.getCore().getStaticAreaRef();
             this.$blocker = jQuery("<div class='sapCaPVBly sapUiBLy'></div>").css("visibility", "hidden");
             jQuery(oStaticArea).append(this.$blocker);
         }
@@ -89,13 +91,13 @@ sap.ui.define([
             return;
         }
 
-        setTimeout(function () {
+        setTimeout(() => {
             this._applyDimension();
             this._update(false);
             delete this._iInitialResizeTimeout;
-        }.bind(this), this._iInitialResizeTimeout);
+        }, this._iInitialResizeTimeout);
 
-        this._iInitialResizeTimeout = 0; //now we do not need to wait
+        this._iInitialResizeTimeout = 0; // now we do not need to wait
     };
 
     PictureViewer.prototype.exit = function () {
@@ -117,13 +119,13 @@ sap.ui.define([
      * Please note that if the factor is too close to 1, the navigation arrows usually displayed in desktop mode will not be available
      * @override
      * @public
-     * @param fTileScale
+     * @param {float} fTileScale the scale of the tile.
      */
     PictureViewer.prototype.setTileScaling = function (fTileScale) {
         if (fTileScale < 0 || fTileScale > 1) {
             fTileScale = 0.75;
-            jQuery.sap.log.error("Tile Scaling should be a float value between 0 and 1 and not " + fTileScale
-                + ". Setting it to 0.75 by default.");
+            jQuery.sap.log.error(`Tile Scaling should be a float value between 0 and 1 and not ${fTileScale
+            }. Setting it to 0.75 by default.`);
         }
         this.setProperty("tileScaling", fTileScale);
     };
@@ -142,6 +144,7 @@ sap.ui.define([
      */
     PictureViewer.prototype.addItem = function (oItem) {
         this.insertItem(oItem, this.getItems().length);
+        return this;
     };
 
     /**
@@ -162,7 +165,7 @@ sap.ui.define([
      * @deprecated since 1.18
      */
     PictureViewer.prototype.insertItem = function (oItem, iIndex) {
-        var tileToAdd = new PictureTile({
+        const tileToAdd = new PictureTile({
             tileContent: oItem
         });
         tileToAdd.attachPictureDelete(this._deletePictureRequestHandler.bind(this));
@@ -173,7 +176,7 @@ sap.ui.define([
         return this;
     };
 
-    PictureViewer.prototype.insertTile = function (oTile/*, iIndex*/) {
+    PictureViewer.prototype.insertTile = function (oTile/* , iIndex */) {
         oTile.attachPictureDelete(this._deletePictureRequestHandler.bind(this));
         TileContainer.prototype.insertTile.apply(this, arguments);
     };
@@ -196,8 +199,9 @@ sap.ui.define([
      * @function
      */
     PictureViewer.prototype.deletePicture = function (iIndex) {
-        var pictureTileIndexToDelete, pictureTileToDelete, numberOfPictures;
-        numberOfPictures = this.getTiles().length;
+        let pictureTileIndexToDelete;
+        let pictureTileToDelete;
+        const numberOfPictures = this.getTiles().length;
 
         if (typeof iIndex !== "number" || iIndex < 0 || iIndex >= numberOfPictures) {
             pictureTileIndexToDelete = this.getPageFirstTileIndex();
@@ -211,7 +215,7 @@ sap.ui.define([
             this.deleteTile(pictureTileToDelete);
             this.removeAggregation("items", pictureTileIndexToDelete, true);
         } else {
-            jQuery.sap.log.warning("Cannot find and delete a picture at index : " + iIndex);
+            jQuery.sap.log.warning(`Cannot find and delete a picture at index : ${iIndex}`);
         }
 
         return this;
@@ -230,7 +234,7 @@ sap.ui.define([
      * @function
      */
     PictureViewer.prototype.selectPicture = function (iIndex) {
-        var numberOfPictures = this.getTiles().length;
+        const numberOfPictures = this.getTiles().length;
 
         if (typeof iIndex !== "number") {
             iIndex = 0;
@@ -266,10 +270,12 @@ sap.ui.define([
     };
 
     /**
-     * Gets the image index from the TileContainer and fires an event
+     * Gets the image index from the TileContainer and fires an event.
+     *
+     * @param {sap.ui.base.Event} oEvent the UI5 event.
      */
     PictureViewer.prototype._deletePictureRequestHandler = function (oEvent) {
-        var pictureTileIndexToDelete = this.indexOfTile(oEvent.getSource());
+        const pictureTileIndexToDelete = this.indexOfTile(oEvent.getSource());
 
         this.deleteTile(oEvent.getSource());
 
@@ -282,18 +288,20 @@ sap.ui.define([
      * Get rid of potential visible "delete" button
      *
      * Only used on mobile devices
+     *
+     * @param {sap.ui.base.Event} oEvent the UI5 event.
      */
     PictureViewer.prototype._reset = function (oEvent) {
-        var i = this.getCurrentPictureIndex();
+        const i = this.getCurrentPictureIndex();
 
-        var aTiles = this.getTiles();
+        const aTiles = this.getTiles();
         if (i > -1 && aTiles && aTiles.length > i) {
-            var oTile = aTiles[i];
+            const oTile = aTiles[i];
             if (oTile) {
-                var $target = jQuery(oEvent.target);
-                var $this = this.$();
+                const $target = jQuery(oEvent.target);
+                const $this = this.$();
                 if ($this.length > 0 && $target.length > 0) {
-                    var $parent = $target.closest(this.$());
+                    const $parent = $target.closest(this.$());
 
                     if ($parent.length === 0) { // the "tap" was outside the PictureViewer
                         oTile.switchVisibility(false);
@@ -314,7 +322,7 @@ sap.ui.define([
         this.toggleStyleClass("sapCaPWEditable", bValue);
     };
 
-    PictureViewer.prototype.setEditable = function (/*bValue*/) {
+    PictureViewer.prototype.setEditable = function (/* bValue */) {
         // set Editable to false no matter what
         TileContainer.prototype.setEditable.call(this, false);
     };
@@ -329,8 +337,8 @@ sap.ui.define([
             return;
         }
 
-        var $scroller = jQuery.sap.byId(this.getId() + "-scrl");
-        var oTileDim = {
+        const $scroller = jQuery.sap.byId(`${this.getId()}-scrl`);
+        const oTileDim = {
             width: $scroller.width(),
             height: $scroller.height()
         };
@@ -346,13 +354,13 @@ sap.ui.define([
      * @private
      */
     PictureViewer.prototype.onAfterRendering = function () {
-        var that = this;
+        const that = this;
         this._bRendered = true;
-        //init resizing
-        //init the dimensions to the container scoll area
+        // init resizing
+        // init the dimensions to the container scoll area
         this._applyDimension();
         this.$().toggleClass("sapCaPWEditable", this.getRemovable() === true);
-        this._sInitialResizeTimeoutId = setTimeout(function () {
+        this._sInitialResizeTimeoutId = setTimeout(() => {
             that.addStyleClass("sapCaPWRendering");
             that._applyPageStartIndex(that._selectedIndex);
 
@@ -361,12 +369,12 @@ sap.ui.define([
 
         // Set initial focus
         if (Device.system.desktop) {
-            var oFocusTile = this.getTiles()[0],
-                iTimeout = this._iInitialResizeTimeout;
+            const oFocusTile = this.getTiles()[0];
+            const iTimeout = this._iInitialResizeTimeout;
             if (oFocusTile) {
-                setTimeout(function () {
+                setTimeout(() => {
                     this._findTile(oFocusTile.$()).focus();
-                }.bind(this), iTimeout);
+                }, iTimeout);
             }
         }
     };
@@ -374,15 +382,15 @@ sap.ui.define([
     /**
      * @override
      */
-    PictureViewer.prototype._update = function (/*bAnimated*/) {
+    PictureViewer.prototype._update = function (/* bAnimated */) {
         TileContainer.prototype._update.apply(this, arguments);
 
         this.removeStyleClass("sapCaPWRendering");
         if (sap.ui.getCore().isMobile()) {
-            var that = this;
-            var thatBlocker = this.$blocker;
-            setTimeout(function () {
-                thatBlocker.fadeOut(200, function () { that.css("visibility", "hidden").css("z-index", 0); });
+            const that = this;
+            const thatBlocker = this.$blocker;
+            setTimeout(() => {
+                thatBlocker.fadeOut(200, () => { that.css("visibility", "hidden").css("z-index", 0); });
             }, 250);
         }
     };
@@ -392,32 +400,29 @@ sap.ui.define([
      * @private
      */
     PictureViewer.prototype._applyDimension = function () {
-        var oDim = this._getContainerDimension(),
-            sId = this.getId(),
-            $this = this.$(),
-            oThisPos,
-            iOffset = 10,
-            iTopOffset = 60,
-            $Content = jQuery.sap.byId(sId + "-cnt"),
-            contentPos,
-            contentOuterHeight,
-            pagerHeight = jQuery.sap.byId(sId + "-pager").outerHeight();
-
-        jQuery.sap.byId(sId + "-scrl").css({
-            width: oDim.outerwidth + "px",
-            height: (oDim.outerheight - pagerHeight) + "px"
+        const oDim = this._getContainerDimension();
+        const sId = this.getId();
+        const $this = this.$();
+        let iOffset = 10;
+        const iTopOffset = 60;
+        const $Content = jQuery.sap.byId(`${sId}-cnt`);
+        const pagerHeight = jQuery.sap.byId(`${sId}-pager`).outerHeight();
+
+        jQuery.sap.byId(`${sId}-scrl`).css({
+            width: `${oDim.outerwidth}px`,
+            height: `${oDim.outerheight - pagerHeight}px`
         });
 
         $Content.css({
-            height: (oDim.outerheight - pagerHeight) + "px",
+            height: `${oDim.outerheight - pagerHeight}px`,
             visibility: "visible"
         });
 
         $this.css("visibility", "visible");
-        oThisPos = $this.position();
+        const oThisPos = $this.position();
 
-        contentPos = $Content.position();
-        contentOuterHeight = $Content.outerHeight();
+        const contentPos = $Content.position();
+        const contentOuterHeight = $Content.outerHeight();
 
         if (jQuery.device.is.phone) {
             iOffset = 2;
@@ -425,43 +430,45 @@ sap.ui.define([
             iOffset = 0;
         }
 
-        jQuery.sap.byId(sId + "-blind").css({
-            top: (contentPos.top + iOffset) + "px",
-            left: (contentPos.left + iOffset) + "px",
-            width: ($Content.outerWidth() - iOffset) + "px",
-            height: (contentOuterHeight - iOffset) + "px"
+        jQuery.sap.byId(`${sId}-blind`).css({
+            top: `${contentPos.top + iOffset}px`,
+            left: `${contentPos.left + iOffset}px`,
+            width: `${$Content.outerWidth() - iOffset}px`,
+            height: `${contentOuterHeight - iOffset}px`
         });
 
-        jQuery.sap.byId(sId + "-rightedge").css({
-            top: (oThisPos.top + iOffset + iTopOffset) + "px",
-            right: iOffset + "px",
-            height: (contentOuterHeight - iOffset - iTopOffset) + "px"
+        jQuery.sap.byId(`${sId}-rightedge`).css({
+            top: `${oThisPos.top + iOffset + iTopOffset}px`,
+            right: `${iOffset}px`,
+            height: `${contentOuterHeight - iOffset - iTopOffset}px`
         });
 
-        jQuery.sap.byId(sId + "-leftedge").css({
-            top: (oThisPos.top + iOffset + iTopOffset) + "px",
-            left: (oThisPos.left + iOffset) + "px",
-            height: (contentOuterHeight - iOffset - iTopOffset) + "px"
+        jQuery.sap.byId(`${sId}-leftedge`).css({
+            top: `${oThisPos.top + iOffset + iTopOffset}px`,
+            left: `${oThisPos.left + iOffset}px`,
+            height: `${contentOuterHeight - iOffset - iTopOffset}px`
         });
     };
 
     /**
-     * Adding overlay to hide blinking while switching orientation
+     * Adding overlay to hide blinking while switching orientation.
+     *
+     * @param {function} callback the callback function.
      *
      * @private
      */
     PictureViewer.prototype.showBlockerLayer = function (callback) {
         // get higher z-index
         if (sap.ui.getCore().isMobile()) {
-            var zindex = 20;
-            jQuery(sap.ui.getCore().getStaticAreaRef()).children().each(function (index, value) {
-                var z = parseInt(jQuery(value).css("z-index"), 10);
+            let zindex = 20;
+            jQuery(sap.ui.getCore().getStaticAreaRef()).children().each((index, value) => {
+                const z = parseInt(jQuery(value).css("z-index"), 10);
                 if (!isNaN(z)) {
                     zindex = Math.max(zindex, z);
                 }
             });
-            jQuery.sap.log.debug("blocker layer z-index calculated : " + zindex + 1);
-            this.$blocker.css("z-index", zindex + 1).css("visibility", "visible").fadeIn(200, function () {
+            jQuery.sap.log.debug(`blocker layer z-index calculated : ${zindex}${1}`);
+            this.$blocker.css("z-index", zindex + 1).css("visibility", "visible").fadeIn(200, () => {
                 if (callback) {
                     callback.call();
                 }

package/src/main/js/sap/ushell/components/factsheet/controls/PictureViewerItem.js

@@ -7,7 +7,7 @@
 sap.ui.define([
     "sap/ui/core/Control",
     "sap/m/Image"
-], function (Control, Image) {
+], (Control, Image) => {
     "use strict";
 
     /**
@@ -25,7 +25,7 @@ sap.ui.define([
      * @name sap.ushell.components.factsheet.controls.PictureViewerItem
      * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
      */
-    var PictureViewerItem = Control.extend("sap.ushell.components.factsheet.controls.PictureViewerItem", /** @lends sap.ushell.components.factsheet.controls.PictureViewerItem.prototype */ {
+    const PictureViewerItem = Control.extend("sap.ushell.components.factsheet.controls.PictureViewerItem", /** @lends sap.ushell.components.factsheet.controls.PictureViewerItem.prototype */ {
         metadata: {
             deprecated: true,
             library: "sap.ushell",
@@ -54,7 +54,7 @@ sap.ui.define([
     PictureViewerItem.prototype.setSrc = function (sSrc) {
         this.setProperty("src", sSrc);
         // Also create or update the internal image
-        var oImage = this.getImage();
+        let oImage = this.getImage();
         if (oImage == null) {
             oImage = new Image();
         }
@@ -67,7 +67,7 @@ sap.ui.define([
      * Called when the control is destroyed
      */
     PictureViewerItem.prototype.exit = function () {
-        var oImage = this.getImage();
+        const oImage = this.getImage();
         if (oImage) {
             oImage.destroy();
         }

package/src/main/js/sap/ushell/components/factsheet/controls/PictureViewerRenderer.js

@@ -2,7 +2,7 @@
 
 sap.ui.define([
     "jquery.sap.global", "sap/m/TileContainerRenderer"
-], function (jQuery, TileContainerRenderer) {
+], (jQuery, TileContainerRenderer) => {
     "use strict";
 
     /**
@@ -10,7 +10,7 @@ sap.ui.define([
      * @namespace
      * @static
      */
-    var PictureViewerRenderer = {};
+    const PictureViewerRenderer = {};
 
     /**
      * Renders the HTML for the given control, using the provided {@link sap.ui.core.RenderManager}.