@openui5/sap.ui.rta 1.99.1 → 1.102.0

package/src/sap/ui/rta/util/changeVisualization/ChangeVisualization.js

@@ -5,6 +5,7 @@
  */
 
 sap.ui.define([
+	"sap/ui/core/Fragment",
 	"sap/base/util/restricted/_difference",
 	"sap/base/util/deepEqual",
 	"sap/base/Log",
@@ -12,7 +13,6 @@ sap.ui.define([
 	"sap/ui/core/Control",
 	"sap/ui/dt/OverlayRegistry",
 	"sap/ui/dt/ElementUtil",
-	"sap/ui/events/KeyCodes",
 	"sap/ui/fl/apply/_internal/changes/Utils",
 	"sap/ui/fl/write/api/ChangesWriteAPI",
 	"sap/ui/fl/write/api/PersistenceWriteAPI",
@@ -23,6 +23,7 @@ sap.ui.define([
 	"sap/ui/rta/util/changeVisualization/ChangeIndicator",
 	"sap/ui/rta/util/changeVisualization/ChangeIndicatorRegistry"
 ], function(
+	Fragment,
 	difference,
 	deepEqual,
 	Log,
@@ -30,7 +31,6 @@ sap.ui.define([
 	Control,
 	OverlayRegistry,
 	ElementUtil,
-	KeyCodes,
 	ChangesUtils,
 	ChangesWriteAPI,
 	PersistenceWriteAPI,
@@ -79,8 +79,9 @@ sap.ui.define([
 	 * When clicking anywhere on the application, the menu must close
 	 */
 	function _onClick() {
-		if (this.oMenuButton) {
-			this.oMenuButton.getMenu().close();
+		var oPopover = this.getPopover();
+		if (oPopover && oPopover.isOpen()) {
+			oPopover.close();
 		}
 	}
 
@@ -92,7 +93,7 @@ sap.ui.define([
 	 * @alias sap.ui.rta.util.changeVisualization.ChangeVisualization
 	 * @author SAP SE
 	 * @since 1.84.0
-	 * @version 1.99.1
+	 * @version 1.102.0
 	 * @private
 	 */
 	var ChangeVisualization = Control.extend("sap.ui.rta.util.changeVisualization.ChangeVisualization", {
@@ -112,6 +113,12 @@ sap.ui.define([
 					type: "boolean",
 					defaultValue: false
 				}
+			},
+			aggregations: {
+				popover: {
+					type: "sap.m.Popover",
+					multiple: false
+				}
 			}
 		},
 		constructor: function() {
@@ -163,9 +170,7 @@ sap.ui.define([
 
 	ChangeVisualization.prototype.exit = function() {
 		this._oChangeIndicatorRegistry.destroy();
-		if (this.oRootOverlay) {
-			this.oRootOverlay.getDomRef().removeEventListener("click", this._fnOnClickHandler, { capture: true });
-		}
+		this._toggleRootOverlayClickHandler(false);
 	};
 
 	ChangeVisualization.prototype._reset = function() {
@@ -173,12 +178,25 @@ sap.ui.define([
 	};
 
 	ChangeVisualization.prototype._updateVisualizationModelMenuData = function() {
+		var aVisualizedChanges = this._oChangeVisualizationModel.getData().visualizedChanges;
+		var aHiddenChanges = [];
+		var aRegisteredChanges = this._oChangeIndicatorRegistry.getChanges();
+		aRegisteredChanges.forEach(function(oChange) {
+			var oVisualizedChange = aVisualizedChanges.find(function(oVisualizedChange) {
+				return oChange.change.getId() === oVisualizedChange.id;
+			});
+			if (!oVisualizedChange && !oChange.dependent) {
+				aHiddenChanges.push(oChange);
+			}
+		});
 		var aCommandData = Object.keys(VALID_COMMANDS).map(function(sCommandCategoryName) {
-			var sTitle = this._getCommandCategoryLabel(sCommandCategoryName,
-				this._getChangesForCommandCategory(sCommandCategoryName).length);
+			var sTitle = this._getCommandCategoryLabel(
+				sCommandCategoryName,
+				this._getChangesForCommandCategory(sCommandCategoryName, aVisualizedChanges).length
+			);
 			return {
 				key: sCommandCategoryName,
-				count: this._getChangesForCommandCategory(sCommandCategoryName).length,
+				count: this._getChangesForCommandCategory(sCommandCategoryName, aVisualizedChanges).length,
 				title: sTitle,
 				icon: CATEGORY_ICONS[sCommandCategoryName]
 			};
@@ -186,19 +204,23 @@ sap.ui.define([
 
 		aCommandData.unshift({
 			key: CATEGORY_ALL,
-			count: this._getChangesForCommandCategory(CATEGORY_ALL).length,
-			title: this._getCommandCategoryLabel(CATEGORY_ALL, this._getChangesForCommandCategory(CATEGORY_ALL).length),
+			count: this._getChangesForCommandCategory(CATEGORY_ALL, aVisualizedChanges).length,
+			title: this._getCommandCategoryLabel(CATEGORY_ALL, this._getChangesForCommandCategory(CATEGORY_ALL, aVisualizedChanges).length),
 			icon: CATEGORY_ICONS[CATEGORY_ALL]
 		});
 
 		this._updateVisualizationModel({
-			commandCategories: aCommandData
+			commandCategories: aCommandData,
+			hiddenChanges: aHiddenChanges,
+			popupInfoMessage: this._oTextBundle.getText(
+				"MSG_CHANGEVISUALIZATION_HIDDEN_CHANGES_INFO",
+				[aHiddenChanges.length]
+			)
 		});
 	};
 
-	ChangeVisualization.prototype._getChangesForCommandCategory = function(sCommandCategory) {
-		var aRegisteredChanges = this._oChangeIndicatorRegistry.getChanges();
-		return aRegisteredChanges.filter(function(oChange) {
+	ChangeVisualization.prototype._getChangesForCommandCategory = function(sCommandCategory, aChanges) {
+		return aChanges.filter(function(oChange) {
 			return sCommandCategory === CATEGORY_ALL
 				? oChange.commandCategory !== undefined
 				: sCommandCategory === oChange.commandCategory;
@@ -215,21 +237,52 @@ sap.ui.define([
 		return this._oTextBundle.getText(sButtonKey);
 	};
 
+	ChangeVisualization.prototype.openChangeCategorySelectionPopover = function(oEvent) {
+		if (!this._oToolbarButton) {
+			// Event bubbled through the toolbar, get original source
+			this._oToolbarButton = sap.ui.getCore().byId(oEvent.getParameter("id"));
+		}
+		var oPopover = this.getPopover();
+
+		if (!oPopover) {
+			Fragment.load({
+				name: "sap.ui.rta.util.changeVisualization.ChangeIndicatorCategorySelection",
+				id: this._getComponent().createId("changeVisualization_changesListPopover"),
+				controller: this
+			})
+				.then(function(oPopover) {
+					this._oToolbarButton.addDependent(oPopover);
+					oPopover.setModel(this._oChangeVisualizationModel, "visualizationModel");
+					oPopover.openBy(this._oToolbarButton);
+					this.setPopover(oPopover);
+				}.bind(this));
+			return;
+		}
+
+		if (oPopover.isOpen()) {
+			oPopover.close();
+		} else {
+			oPopover.openBy(this._oToolbarButton);
+		}
+	};
+
 	/**
 	 * Sets the selected command category and visualizes all changes for the given category
 	 *
 	 * @param {event} oEvent - Event
-	 * @returns {promise} - Promise of category change
+	 * @returns {Promise} - Promise of category change
 	 */
 	ChangeVisualization.prototype.onCommandCategorySelection = function(oEvent) {
-		var sSelectedCommandCategory = oEvent.getParameter("item").getKey();
+		var sSelectedCommandCategory = oEvent.getSource().getBindingContext("visualizationModel").getObject().key;
 		return this._selectCommandCategory(sSelectedCommandCategory);
 	};
 
 	ChangeVisualization.prototype._selectCommandCategory = function(sSelectedCommandCategory) {
 		this._sSelectedCommandCategory = sSelectedCommandCategory;
 
-		var aRelevantChanges = this._getChangesForCommandCategory(sSelectedCommandCategory);
+		var aRegisteredChanges = this._oChangeIndicatorRegistry.getChanges();
+		var aRelevantChanges = this._getChangesForCommandCategory(sSelectedCommandCategory, aRegisteredChanges);
+
 		var sCommandCategoryText = this._getCommandCategoryButton(sSelectedCommandCategory);
 
 		this._updateVisualizationModel({
@@ -362,12 +415,12 @@ sap.ui.define([
 	ChangeVisualization.prototype._collectChanges = function() {
 		var oComponent = this._getComponent();
 		var mPropertyBag = {
-			oComponent: oComponent,
 			selector: oComponent,
 			invalidateCache: false,
 			// includeCtrlVariants: true,
 			currentLayer: Layer.CUSTOMER,
-			includeDirtyChanges: true
+			includeDirtyChanges: true,
+			onlyCurrentVariants: true
 		};
 		return PersistenceWriteAPI._getUIChanges(mPropertyBag);
 	};
@@ -427,20 +480,24 @@ sap.ui.define([
 	ChangeVisualization.prototype._updateChangeIndicators = function() {
 		var oSelectors = this._oChangeIndicatorRegistry.getChangeIndicatorData();
 		var oIndicators = {};
+		var aVisualizedChanges = [];
 		Object.keys(oSelectors)
 			.forEach(function(sSelectorId) {
 				var aChanges = oSelectors[sSelectorId];
 				var oOverlay = OverlayRegistry.getOverlay(sSelectorId);
-				if (!oOverlay || !oOverlay.getDomRef()) {
+				if (!oOverlay || !oOverlay.getDomRef() || !oOverlay.isVisible()) {
 					// Change is not visible
 					return undefined;
 				}
-
 				var oOverlayPosition = oOverlay.getDomRef().getClientRects()[0] || { left: 0, top: 0 };
+				var aRelevantChanges = this._filterRelevantChanges(aChanges);
+				aRelevantChanges.forEach(function (oChange) {
+					aVisualizedChanges.push(oChange);
+				});
 				oIndicators[sSelectorId] = {
 					posX: parseInt(oOverlayPosition.left),
 					posY: parseInt(oOverlayPosition.top),
-					changes: this._filterRelevantChanges(aChanges)
+					changes: aRelevantChanges
 				};
 
 				if (!this._oChangeIndicatorRegistry.hasChangeIndicator(sSelectorId)) {
@@ -453,10 +510,14 @@ sap.ui.define([
 			!deepEqual(
 				oIndicators,
 				this._oChangeVisualizationModel.getData().content
+			) || !deepEqual(
+				aVisualizedChanges,
+				this._oChangeVisualizationModel.getData().visualizedChanges
 			)
 		) {
 			this._updateVisualizationModel({
-				content: oIndicators
+				content: oIndicators,
+				visualizedChanges: aVisualizedChanges
 			});
 		}
 	};
@@ -524,6 +585,25 @@ sap.ui.define([
 		aVisibleIndicators[0].focus();
 	};
 
+	ChangeVisualization.prototype._toggleRootOverlayClickHandler = function (bEnable) {
+		var oRootOverlayDomRef = this.oRootOverlay && this.oRootOverlay.getDomRef();
+		if (oRootOverlayDomRef) {
+			if (bEnable) {
+				oRootOverlayDomRef.addEventListener(
+					"click",
+					this._fnOnClickHandler,
+					{ capture: true }
+				);
+			} else {
+				oRootOverlayDomRef.removeEventListener(
+					"click",
+					this._fnOnClickHandler,
+					{ capture: true }
+				);
+			}
+		}
+	};
+
 	/**
 	 * Triggers the mode switch (on/off).
 	 *
@@ -536,14 +616,10 @@ sap.ui.define([
 
 		if (this.getIsActive()) {
 			this.setIsActive(false);
-			if (this.oRootOverlay) {
-				this.oRootOverlay.getDomRef().removeEventListener("click", this._fnOnClickHandler, { capture: true });
-			}
+			this._toggleRootOverlayClickHandler(false);
 			return;
 		}
-		if (this.oRootOverlay) {
-			this.oRootOverlay.getDomRef().addEventListener("click", this._fnOnClickHandler, { capture: true });
-		}
+		this._toggleRootOverlayClickHandler(true);
 		if (!this.getRootControlId()) {
 			this.setRootControlId(oRootControl);
 		}

package/src/sap/ui/rta/util/changeVisualization/categories/MoveVisualization.js

@@ -5,9 +5,11 @@
  */
 
 sap.ui.define([
-	"sap/ui/rta/util/changeVisualization/ChangeVisualizationUtils"
+	"sap/ui/rta/util/changeVisualization/ChangeVisualizationUtils",
+	"sap/ui/core/util/reflection/JsControlTreeModifier"
 ], function(
-	ChangeVisualizationUtils
+	ChangeVisualizationUtils,
+	JsControlTreeModifier
 ) {
 	"use strict";
 
@@ -19,14 +21,30 @@ sap.ui.define([
 	 *
 	 * @param {object} mPayload - Change visualization payload from the change handler
 	 * @param {string} sLabel - Change handler label
+	 * @param {object} mPropertyBag - Additional properties
 	 * @returns {object} Localized description text and button text
 	 */
-	MoveVisualization.getDescription = function (mPayload, sLabel) {
+	MoveVisualization.getDescription = function(mPayload, sLabel, mPropertyBag) {
 		var oRtaResourceBundle = sap.ui.getCore().getLibraryResourceBundle("sap.ui.rta");
-		var sDescriptionText = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", ChangeVisualizationUtils.shortenString(sLabel));
-		var sDescriptionTooltip = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", sLabel);
-		var sButtonText = oRtaResourceBundle.getText("BTN_CHANGEVISUALIZATION_SHOW_DEPENDENT_CONTAINER_MOVE");
-		return { descriptionText: sDescriptionText, descriptionTooltip: sDescriptionTooltip, buttonText: sButtonText};
+		var sDescriptionText = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE_WITHIN", ChangeVisualizationUtils.shortenString(sLabel));
+		var sDescriptionTooltip = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE_WITHIN", sLabel);
+		var sButtonText;
+		var oAppComponent = mPropertyBag.appComponent;
+		var sSourceParentId = (
+			mPayload.sourceParentContainer
+			&& JsControlTreeModifier.getControlIdBySelector(mPayload.sourceParentContainer, oAppComponent)
+		);
+		var sTargetParentId = (
+			mPayload.targetParentContainer
+			&& JsControlTreeModifier.getControlIdBySelector(mPayload.targetParentContainer, oAppComponent)
+		);
+
+		if (sSourceParentId !== sTargetParentId) {
+			sButtonText = oRtaResourceBundle.getText("BTN_CHANGEVISUALIZATION_SHOW_DEPENDENT_CONTAINER_MOVE");
+			sDescriptionText = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", ChangeVisualizationUtils.shortenString(sLabel));
+			sDescriptionTooltip = oRtaResourceBundle.getText("TXT_CHANGEVISUALIZATION_CHANGE_MOVE", sLabel);
+		}
+		return { descriptionText: sDescriptionText, descriptionTooltip: sDescriptionTooltip, buttonText: sButtonText };
 	};
 
 	return MoveVisualization;

package/src/sap/ui/rta/themes/sap_hcb/Toolbar.standalone.less

@@ -1,9 +0,0 @@
-/* type: standalone */
-.sapUiRtaToolbar.type_standalone.color_default .sapMBtn .sapMBtnContent,
-.sapUiRtaToolbar.type_standalone.color_default .sapMBtn .sapMBtnTransparent .sapMBtnIcon {
-	color: inherit;
-	}
-	.sapUiRtaToolbar.type_standalone.color_default .sapMBtn.sapMBtnDisabled .sapMBtnContent,
-	.sapUiRtaToolbar.type_standalone.color_default .sapMBtn.sapMBtnDisabled .sapMBtnIcon {
-		color: inherit;
-		}