@openui5/sap.ui.rta 1.92.0 → 1.95.0

package/src/sap/ui/rta/toolbar/Adaptation.js

@@ -5,22 +5,26 @@
  */
 
 sap.ui.define([
-	"sap/ui/core/Fragment",
 	"sap/ui/core/format/DateFormat",
-	"sap/ui/Device",
-	"./Base",
+	"sap/ui/core/Fragment",
 	"sap/ui/core/library",
 	"sap/ui/fl/library",
-	"sap/ui/rta/Utils"
+	"sap/ui/rta/Utils",
+	"sap/ui/rta/toolbar/translation/Translation",
+	"sap/ui/rta/appVariant/Feature",
+	"sap/ui/rta/toolbar/Base",
+	"sap/ui/Device"
 ],
 function(
-	Fragment,
 	DateFormat,
-	Device,
-	Base,
+	Fragment,
 	coreLibrary,
 	flexLibrary,
-	Utils
+	Utils,
+	Translation,
+	AppVariantFeature,
+	Base,
+	Device
 ) {
 	"use strict";
 
@@ -35,7 +39,7 @@ function(
 	 * @extends sap.ui.rta.toolbar.Base
 	 *
 	 * @author SAP SE
-	 * @version 1.92.0
+	 * @version 1.95.0
 	 *
 	 * @constructor
 	 * @private
@@ -58,13 +62,10 @@ function(
 				restore: {},
 				transport: {},
 				modeChange: {},
-				manageApps: {},
-				appVariantOverview: {},
-				saveAs: {},
 				activate: {},
 				discardDraft: {},
 				switchVersion: {},
-				toggleChangeVisualization: {}
+				toggleChangeVisualizationPopover: {}
 			}
 		}
 	});
@@ -103,7 +104,7 @@ function(
 		Base.prototype.exit.apply(this, arguments);
 	};
 
-	function _setButtonProperties(sButtonName, sIcon, sTextKey, sToolTipKey) {
+	function setButtonProperties(sButtonName, sIcon, sTextKey, sToolTipKey) {
 		var oButton = this.getControl(sButtonName);
 		var sText = sTextKey ? this.getTextResources().getText(sTextKey) : "";
 		var sToolTip = sToolTipKey ? this.getTextResources().getText(sToolTipKey) : "";
@@ -253,16 +254,21 @@ function(
 		});
 	};
 
+	Adaptation.prototype.showTranslationPopover = function (oEvent) {
+		var oTranslation = this.addExtension("translation", Translation);
+		return oTranslation.showTranslationPopover(oEvent, this);
+	};
+
 	Adaptation.prototype.showRestore = function (bVersioningEnabled) {
 		return !bVersioningEnabled;
 	};
 
 	Adaptation.prototype._showButtonIcon = function(sButtonName, sIcon, sToolTipKey) {
-		_setButtonProperties.call(this, sButtonName, sIcon, "", sToolTipKey);
+		setButtonProperties.call(this, sButtonName, sIcon, "", sToolTipKey);
 	};
 
 	Adaptation.prototype._showButtonText = function(sButtonName, sTextKey) {
-		_setButtonProperties.call(this, sButtonName, "", sTextKey, "");
+		setButtonProperties.call(this, sButtonName, "", sTextKey, "");
 	};
 
 	Adaptation.prototype._switchToIcons = function() {
@@ -273,6 +279,7 @@ function(
 		oIconSpacer.setVisible(false);
 		this._showButtonIcon("adaptationSwitcherButton", "sap-icon://wrench", "BTN_ADAPTATION");
 		this._showButtonIcon("navigationSwitcherButton", "sap-icon://explorer", "BTN_NAVIGATION");
+		this._showButtonIcon("visualizationSwitcherButton", "sap-icon://show", "BTN_VISUALIZATION");
 		this._showButtonIcon("exit", "sap-icon://decline", "BTN_EXIT");
 	};
 
@@ -284,6 +291,7 @@ function(
 		oIconSpacer.setVisible(true);
 		this._showButtonText("adaptationSwitcherButton", "BTN_ADAPTATION");
 		this._showButtonText("navigationSwitcherButton", "BTN_NAVIGATION");
+		this._showButtonText("visualizationSwitcherButton", "BTN_VISUALIZATION");
 		this._showButtonText("exit", "BTN_EXIT");
 	};
 
@@ -311,14 +319,7 @@ function(
 	};
 
 	/**
-	 * format of the controls that get added here:
-	 * 	HBox (this)
-	 * 		HBox
-	 * 			place for Icon in Fiori Toolbar
-	 * 		HBox
-	 * 			OverflowToolbar
-	 * 				Segmented Button, Buttons for Undo, Redo, manageApps, appVariantOverview, restore, publish, saveAs
-	 * 			Save & Exit Button
+	 * Loads and creates the Fragment of the Toolbar
 	 *
 	 * @returns {sap.ui.core.Control[]} Returns the controls in a structure described above.
 	 */
@@ -331,14 +332,15 @@ function(
 				discardDraft: this.eventHandler.bind(this, "DiscardDraft"),
 				formatDiscardDraftVisible: this.formatDiscardDraftVisible.bind(this),
 				modeChange: this.eventHandler.bind(this, "ModeChange"),
+				showTranslationPopover: this.showTranslationPopover.bind(this),
 				undo: this.eventHandler.bind(this, "Undo"),
 				redo: this.eventHandler.bind(this, "Redo"),
-				toggleChangeVisualization: this.eventHandler.bind(this, "ToggleChangeVisualization"),
-				manageApps: this.eventHandler.bind(this, "ManageApps"),
-				appVariantOverview: this.eventHandler.bind(this, "AppVariantOverview"),
+				toggleChangeVisualizationPopover: this.eventHandler.bind(this, "ToggleChangeVisualizationPopover"),
+				manageApps: onManageAppsPressed.bind(this),
+				appVariantOverview: onOverviewPressed.bind(this),
+				saveAs: onSaveAsPressed.bind(this),
 				restore: this.eventHandler.bind(this, "Restore"),
 				publish: this.eventHandler.bind(this, "Transport"),
-				saveAs: this.eventHandler.bind(this, "SaveAs"),
 				exit: this.eventHandler.bind(this, "Exit"),
 				formatVersionButtonText: this.formatVersionButtonText.bind(this),
 				showVersionHistory: this.showVersionHistory.bind(this),
@@ -347,13 +349,27 @@ function(
 		});
 	};
 
-	function _resetDialog() {
+	function onSaveAsPressed() {
+		AppVariantFeature.onSaveAs(true, true, this.getRtaInformation().flexSettings.layer, null);
+	}
+
+	function onOverviewPressed(oEvent) {
+		var oItem = oEvent.getParameter("item");
+		var bTriggeredForKeyUser = oItem.getId().endsWith("keyUser");
+		return AppVariantFeature.onGetOverview(bTriggeredForKeyUser, this.getRtaInformation().flexSettings.layer);
+	}
+
+	function onManageAppsPressed() {
+		AppVariantFeature.onGetOverview(true, this.getRtaInformation().flexSettings.layer);
+	}
+
+	function resetDialog() {
 		this.getControl("versionTitleInput").setValue("");
 		this.getControl("confirmVersionTitleButton").setEnabled(false);
 		return Promise.resolve(this._oDialog);
 	}
 
-	function _createDialog() {
+	function createDialog() {
 		return Fragment.load({
 			name: "sap.ui.rta.toolbar.VersionTitleDialog",
 			id: this.getId() + "_fragment",
@@ -386,9 +402,9 @@ function(
 		var oDialogPromise;
 
 		if (this._oDialog) {
-			oDialogPromise = _resetDialog.call(this);
+			oDialogPromise = resetDialog.call(this);
 		} else {
-			oDialogPromise = _createDialog.call(this);
+			oDialogPromise = createDialog.call(this);
 		}
 
 		return oDialogPromise.then(function () {
@@ -419,9 +435,5 @@ function(
 		}
 	};
 
-	/* Methods propagation */
-	Adaptation.prototype.show = function () { return Base.prototype.show.apply(this, arguments); };
-	Adaptation.prototype.hide = function () { return Base.prototype.hide.apply(this, arguments); };
-
 	return Adaptation;
-}, true);
+});

package/src/sap/ui/rta/toolbar/AdaptationRenderer.js

@@ -5,17 +5,16 @@
  */
 
 sap.ui.define([
-	'./BaseRenderer'
-],
-function(
+	"sap/ui/rta/toolbar/BaseRenderer"
+], function(
 	BaseRenderer
 ) {
 	"use strict";
 
-	var AdaptationRenderer = BaseRenderer.extend('sap.ui.rta.toolbar.AdaptationRenderer');
+	var AdaptationRenderer = BaseRenderer.extend("sap.ui.rta.toolbar.AdaptationRenderer");
 
 	AdaptationRenderer.render = function (oRM, oControl) {
-		oRM.addClass('sapUiRtaToolbarAdaptation');
+		oRM.addClass("sapUiRtaToolbarAdaptation");
 
 		BaseRenderer.render(oRM, oControl);
 	};

package/src/sap/ui/rta/toolbar/Base.js

@@ -5,16 +5,15 @@
  */
 
 sap.ui.define([
-	"sap/ui/model/resource/ResourceModel",
 	"sap/m/HBox",
-	"sap/ui/rta/util/Animation",
-	"sap/ui/dt/util/ZIndexManager"
-],
-function(
-	ResourceModel,
+	"sap/ui/dt/util/ZIndexManager",
+	"sap/ui/model/resource/ResourceModel",
+	"sap/ui/rta/util/Animation"
+], function(
 	HBox,
-	Animation,
-	ZIndexManager
+	ZIndexManager,
+	ResourceModel,
+	Animation
 ) {
 	"use strict";
 
@@ -26,7 +25,7 @@ function(
 	 * @extends sap.m.HBox
 	 *
 	 * @author SAP SE
-	 * @version 1.92.0
+	 * @version 1.95.0
 	 *
 	 * @constructor
 	 * @private
@@ -50,6 +49,17 @@ function(
 					type: "int"
 				},
 
+				/**
+				 * information from the rta instance needed for some Toolbar extensions.
+				 * Includes the flexSettings, command stack and the root control from the RuntimeAuthoring instance
+				 */
+				rtaInformation: {
+					type: "object",
+					defaultValue: {
+						flexSettings: {}
+					}
+				},
+
 				/** i18n bundle */
 				textResources: "object"
 			}
@@ -58,6 +68,7 @@ function(
 			// call parent constructor
 			HBox.apply(this, arguments);
 
+			this._oExtensions = {};
 			this.setAlignItems("Center");
 			this.setVisible(false);
 			this.placeToContainer();
@@ -90,6 +101,40 @@ function(
 		return this.buildContent();
 	};
 
+	Base.prototype.exit = function() {
+		Object.values(this._oExtensions).forEach(function(oExtension) {
+			oExtension.destroy();
+		});
+		this._oExtensions = {};
+
+		HBox.prototype.exit.apply(this, arguments);
+	};
+
+	/**
+	 * Adds an extension to the toolbar, if it is not already registered.
+	 * The new extension gets created with the toolbar itself as property 'context'.
+	 *
+	 * @param {string} sName - Name of the extension
+	 * @param {sap.ui.base.ManagedObject} Extension - Extension Class to be instantiated
+	 * @returns {sap.ui.base.ManagedObject} Returns the newly created module.
+	 */
+	Base.prototype.addExtension = function(sName, Extension) {
+		if (!Object.keys(this._oExtensions).includes(sName)) {
+			this._oExtensions[sName] = new Extension({context: this});
+		}
+		return this._oExtensions[sName];
+	};
+
+	/**
+	 * Returns the extension with the passed name
+	 *
+	 * @param {string} sName - Name of the extension
+	 * @returns {sap.ui.base.ManagedObject|undefined} Returns the extension or undefined if it does not exist
+	 */
+	Base.prototype.getExtension = function(sName) {
+		return this._oExtensions[sName];
+	};
+
 	/**
 	 * @override
 	 */
@@ -110,13 +155,13 @@ function(
 	 * @param {sap.ui.base.Event} oEvent - Event object
 	 */
 	Base.prototype.eventHandler = function (sEventName, oEvent) {
-		this['fire' + sEventName](oEvent.getParameters());
+		this["fire" + sEventName](oEvent.getParameters());
 	};
 
 	/**
 	 * Function provides controls which should be rendered into the Toolbar. Controls are going to be rendered
 	 * in the same order as provided in returned array.
-	 * @return {Array.<sap.ui.core.Control>} - returns an array of controls
+	 * @returns {Array.<sap.ui.core.Control>} An array of controls
 	 * @protected
 	 */
 	Base.prototype.buildControls = function () {
@@ -135,6 +180,7 @@ function(
 	/**
 	 * Adds content into the Toolbar
 	 * @protected
+	 * @returns {Promise} An empty Promise
 	 */
 	Base.prototype.buildContent = function () {
 		return this.buildControls().then(function (aControls) {
@@ -144,7 +190,7 @@ function(
 
 	/**
 	 * Makes the Toolbar visible
-	 * @return {Promise} - returns Promise which resolves after animation has been completed
+	 * @returns {Promise} A Promise which resolves after animation has been completed
 	 * @public
 	 */
 	Base.prototype.show = function() {
@@ -163,7 +209,7 @@ function(
 		// 2) animate DomRef
 		.then(function () {
 			return this.animation
-				? Animation.waitTransition(this.$(), this.addStyleClass.bind(this, 'is_visible'))
+				? Animation.waitTransition(this.$(), this.addStyleClass.bind(this, "is_visible"))
 				: Promise.resolve();
 		}.bind(this))
 		// 3) focus on Toolbar
@@ -174,27 +220,32 @@ function(
 
 	/**
 	 * Makes the Toolbar invisible
-	 * @return {Promise} - returns Promise which resolves after animation has been completed
+	 * @param {boolean} bSkipTransition - skips the transition for cases like page reloads - where the animation won't be visible and can cause timing issues
+	 * @returns {Promise} A Promise which resolves after animation has been completed
 	 * @public
 	 */
-	Base.prototype.hide = function() {
+	Base.prototype.hide = function(bSkipTransition) {
+		var oPromise = Promise.resolve();
 		// 1) animate DomRef
-		return (
-			this.animation
-				? Animation.waitTransition(this.$(), this.removeStyleClass.bind(this, 'is_visible'))
-				: Promise.resolve()
-		)
+		if (this.animation) {
+			if (bSkipTransition) {
+				this.removeStyleClass("is_visible");
+			} else {
+				oPromise = Animation.waitTransition(this.$(), this.removeStyleClass.bind(this, "is_visible"));
+			}
+		}
+		return oPromise
 		// 2) hide DomRef
-		.then(function () {
-			this.setVisible(false);
-		}.bind(this));
+			.then(function () {
+				this.setVisible(false);
+			}.bind(this));
 	};
 
 	/**
 	 * Getter for inner controls
 	 *
 	 * @param {string} sName - Name of the control
-	 * @return {sap.ui.core.Control|undefined} - returns control or undefined if there is no control with provided name
+	 * @returns {sap.ui.core.Control|undefined} A control or undefined if there is no control with provided name
 	 * @public
 	 */
 	Base.prototype.getControl = function(sName) {
@@ -210,4 +261,4 @@ function(
 	};
 
 	return Base;
-}, true);
+});

package/src/sap/ui/rta/toolbar/BaseRenderer.js

@@ -14,10 +14,10 @@ function(
 ) {
 	"use strict";
 
-	var BaseRenderer = Renderer.extend.call(HBoxRenderer, 'sap.ui.rta.toolbar.BaseRenderer');
+	var BaseRenderer = Renderer.extend.call(HBoxRenderer, "sap.ui.rta.toolbar.BaseRenderer");
 
 	BaseRenderer.render = function (oRM, oControl) {
-		oRM.addClass('sapUiRtaToolbar');
+		oRM.addClass("sapUiRtaToolbar");
 		oRM.addClass("color_" + oControl.getColor());
 
 		// setting type if exists

package/src/sap/ui/rta/toolbar/Fiori.js

@@ -22,7 +22,7 @@ function(
 	 * This class is being assigned to the original Fiori Header Toolbar when RTA Toolbar shows
 	 * @type {string}
 	 */
-	var FIORI_HIDDEN_CLASS = 'sapUiRtaFioriHeaderInvisible';
+	var FIORI_HIDDEN_CLASS = "sapUiRtaFioriHeaderInvisible";
 
 	/**
 	 * Constructor for a new sap.ui.rta.toolbar.Fiori control
@@ -32,7 +32,7 @@ function(
 	 * @extends sap.ui.rta.toolbar.Adaptation
 	 *
 	 * @author SAP SE
-	 * @version 1.92.0
+	 * @version 1.95.0
 	 *
 	 * @constructor
 	 * @private
@@ -44,8 +44,8 @@ function(
 		metadata: {
 			library: "sap.ui.rta"
 		},
-		renderer: 'sap.ui.rta.toolbar.AdaptationRenderer',
-		type: 'fiori'
+		renderer: "sap.ui.rta.toolbar.AdaptationRenderer",
+		type: "fiori"
 	});
 
 	Fiori.prototype.init = function () {
@@ -65,7 +65,7 @@ function(
 
 			if (this._oFioriHeader.getShowLogo() && sLogoPath) {
 				// Unstable: if FLP changes ID of <img> element, logo could be not found
-				var $logo = this._oFioriHeader.$().find('#shell-header-icon');
+				var $logo = this._oFioriHeader.$().find("#shell-header-icon");
 				var iWidth;
 				var iHeight;
 
@@ -81,8 +81,8 @@ function(
 				this.getControl("iconBox").addItem(
 					new Image(this.getId() + "_fragment--sapUiRta_icon", {
 						src: sLogoPath,
-						width: iWidth ? iWidth + 'px' : iWidth,
-						height: iHeight ? iHeight + 'px' : iHeight
+						width: iWidth ? iWidth + "px" : iWidth,
+						height: iHeight ? iHeight + "px" : iHeight
 					})
 				);
 			}
@@ -106,7 +106,7 @@ function(
 				"sap.ui.rta: please check Fiori Launchpad logo, expected size is",
 				iWidth + "x" + iHeight + ",",
 				"but actual is " + iNaturalWidth + "x" + iNaturalHeight
-			].join(' '));
+			].join(" "));
 		}
 	};
 
@@ -121,4 +121,4 @@ function(
 	};
 
 	return Fiori;
-}, true);
+});

package/src/sap/ui/rta/toolbar/FioriLike.js

@@ -20,7 +20,7 @@ function(
 	 * @extends sap.ui.rta.toolbar.Adaptation
 	 *
 	 * @author SAP SE
-	 * @version 1.92.0
+	 * @version 1.95.0
 	 *
 	 * @constructor
 	 * @private
@@ -32,9 +32,9 @@ function(
 		metadata: {
 			library: "sap.ui.rta"
 		},
-		renderer: 'sap.ui.rta.toolbar.AdaptationRenderer',
-		type: 'fiori'
+		renderer: "sap.ui.rta.toolbar.AdaptationRenderer",
+		type: "fiori"
 	});
 
 	return FioriLike;
-}, true);
+});

package/src/sap/ui/rta/toolbar/OverflowToolbarButton.js

@@ -0,0 +1,98 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+sap.ui.define([
+	"sap/m/OverflowToolbarButton",
+	"sap/m/ButtonRenderer",
+	"sap/m/Button"
+],
+function(
+	SapMOverflowToolbarButton,
+	ButtonRenderer,
+	Button
+) {
+	"use strict";
+
+	/**
+	 * Constructor for a new sap.ui.rta.toolbar.OverflowToolbarButton control
+	 *
+	 * @class
+	 * Base class for Toolbar control
+	 * @extends sap.m.OverflowToolbarButton
+	 *
+	 * @author SAP SE
+	 * @version 1.95.0
+	 *
+	 * @constructor
+	 * @private
+	 * @since 1.94
+	 * @alias sap.ui.rta.toolbar.OverflowToolbarButton
+	 * @experimental Since 1.94. This class is experimental. The API might be changed in the future.
+	 */
+
+	var OverflowToolbarButton = SapMOverflowToolbarButton.extend("sap.ui.rta.toolbar.OverflowToolbarButton", {
+		metadata: {
+			library: "sap.ui.rta",
+			interfaces: [
+				"sap.m.IOverflowToolbarContent"
+			],
+			properties: {
+				visibleIcon: {type: "string", defaultValue: ""}
+			}
+		},
+		renderer: ButtonRenderer
+	});
+
+	/**
+	 * Remove the icon when entering the OverflowArea
+	 *
+	 * @private
+	 */
+	OverflowToolbarButton.prototype._onBeforeEnterOverflow = function () {
+		SapMOverflowToolbarButton.prototype._onBeforeEnterOverflow.apply(this, arguments);
+		this.setVisibleIcon(this.getIcon());
+		this.setIcon("");
+	};
+
+	/**
+	 * Restore the icon when leaving the OverflowArea
+	 *
+	 * @private
+	 */
+	OverflowToolbarButton.prototype._onAfterExitOverflow = function () {
+		SapMOverflowToolbarButton.prototype._onAfterExitOverflow.apply(this, arguments);
+		this.setIcon(this.getVisibleIcon());
+	};
+
+	/**
+	 * Get the Text if in Overflow-Area or Text in Toolbar is wanted
+	 *
+	 * @private
+	 */
+	OverflowToolbarButton.prototype._getText = function() {
+		if ((this.getIcon() === "" && this.getVisibleIcon() === "") || this._bInOverflow) {
+			return Button.prototype._getText.call(this);
+		}
+		return "";
+	};
+
+	/**
+	 * Special Icon handling when moving the Button in the OverflowArea
+	 * Required by the {@link sap.m.IOverflowToolbarContent} interface.
+	 *
+	 * @public
+	 * @returns {object} Configuration information for the <code>sap.m.IOverflowToolbarContent</code> interface.
+	 */
+	OverflowToolbarButton.prototype.getOverflowToolbarConfig = function () {
+		return {
+			canOverflow: true,
+			onBeforeEnterOverflow: this._onBeforeEnterOverflow.bind(this),
+			onAfterExitOverflow: this._onAfterExitOverflow.bind(this)
+		};
+	};
+
+	return OverflowToolbarButton;
+}, false);

package/src/sap/ui/rta/toolbar/Personalization.js

@@ -22,7 +22,7 @@ function(
 	 * @extends sap.ui.rta.toolbar.Base
 	 *
 	 * @author SAP SE
-	 * @version 1.92.0
+	 * @version 1.95.0
 	 *
 	 * @constructor
 	 * @private
@@ -31,8 +31,8 @@ function(
 	 * @experimental Since 1.48. This class is experimental. API might be changed in future.
 	 */
 	var Personalization = Base.extend("sap.ui.rta.toolbar.Personalization", {
-		renderer: 'sap.ui.rta.toolbar.BaseRenderer',
-		type: 'personalization',
+		renderer: "sap.ui.rta.toolbar.BaseRenderer",
+		type: "personalization",
 		metadata: {
 			library: "sap.ui.rta",
 			events: {
@@ -55,13 +55,13 @@ function(
 				type: "Transparent",
 				text: "{i18n>BTN_RESTORE}",
 				visible: true,
-				press: this.eventHandler.bind(this, 'Restore')
-			}).data('name', 'restore'),
+				press: this.eventHandler.bind(this, "Restore")
+			}).data("name", "restore"),
 			new Button("sapUiRta_exit", {
 				type: "Emphasized",
 				text: "{i18n>BTN_DONE}",
-				press: this.eventHandler.bind(this, 'Exit')
-			}).data('name', 'exit')
+				press: this.eventHandler.bind(this, "Exit")
+			}).data("name", "exit")
 		].forEach(function (oControl) {
 			this.addItem(oControl);
 		}.bind(this));
@@ -70,4 +70,4 @@ function(
 	};
 
 	return Personalization;
-}, true);
+});

package/src/sap/ui/rta/toolbar/Standalone.js

@@ -20,7 +20,7 @@ function(
 	 * @extends sap.ui.rta.toolbar.Adaptation
 	 *
 	 * @author SAP SE
-	 * @version 1.92.0
+	 * @version 1.95.0
 	 *
 	 * @constructor
 	 * @private
@@ -32,9 +32,9 @@ function(
 		metadata: {
 			library: "sap.ui.rta"
 		},
-		renderer: 'sap.ui.rta.toolbar.AdaptationRenderer',
-		type: 'standalone'
+		renderer: "sap.ui.rta.toolbar.AdaptationRenderer",
+		type: "standalone"
 	});
 
 	return Standalone;
-}, true);
+});