@sapui5/sap.fe.core 1.99.0 → 1.100.0

package/src/sap/fe/core/controls/filterbar/VisualFilterContainer.ts

@@ -0,0 +1,125 @@
+import IFilterContainer from "sap/ui/mdc/filterbar/IFilterContainer";
+import HeaderContainer from "sap/m/HeaderContainer";
+import FlexBox from "sap/m/FlexBox";
+import { system } from "sap/ui/Device";
+import coreLibrabry from "sap/ui/core/library";
+/**
+ * Constructor for a new Visual Filter Container.
+ * Used for visual filters
+ *
+ * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+ * @extends sap.ui.mdc.filterbar.IFilterContainer
+ * @class
+ * @private
+ * @alias sap.fe.core.controls.filterbar.VisualFilterContainer
+ */
+const VisualFilterContainer = IFilterContainer.extend("sap.fe.core.controls.filterbar.VisualFilterContainer", {
+	metadata: {
+		aggregations: {
+			/**
+			 * Internal hidden aggregation to hold the inner layout.
+			 */
+			_layout: {
+				type: "sap.ui.core.Control",
+				multiple: false,
+				visibility: "hidden"
+			}
+		}
+	}
+});
+VisualFilterContainer.prototype.init = function(...args: any[]) {
+	IFilterContainer.prototype.init.apply(this, args);
+	//var oRB = sap.ui.getCore().getLibraryResourceBundle("sap.ui.mdc");
+	const sDeviceSystem = system,
+		Orientation = coreLibrabry.Orientation,
+		sOrientation = sDeviceSystem.phone ? Orientation.Vertical : undefined,
+		sDirection = sDeviceSystem.phone ? "ColumnReverse" : "Column";
+
+	this.oHeaderContainer = new HeaderContainer({
+		orientation: sOrientation
+	});
+	this.oButtonFlexBox = new FlexBox({
+		alignItems: "End",
+		justifyContent: "End"
+	});
+
+	this.oLayout = new FlexBox({
+		direction: sDirection, // Direction is Column Reverse for Phone
+		items: [this.oHeaderContainer, this.oButtonFlexBox]
+	});
+
+	this.aAllFilterFields = [];
+	this.aVisualFilterFields = {};
+};
+VisualFilterContainer.prototype.exit = function(...args: any[]) {
+	// destroy layout
+	IFilterContainer.prototype.exit.apply(this, args);
+	// destroy all filter fields which are not in the layout
+	const aAllFilterFields = this.getAllFilterFields();
+	aAllFilterFields.forEach(function(oFilterField: any) {
+		oFilterField.destroy();
+	});
+	this.oHeaderContainer = null;
+	this.oButtonFlexBox = null;
+	this.aAllFilterFields = [];
+};
+VisualFilterContainer.prototype.insertFilterField = function(oControl: any, iIndex: any) {
+	const oFilterItemLayoutEventDelegate = {
+		onBeforeRendering: function() {
+			// visual filter does not need to render a label
+			// hence override the getContent of the FilterItemLayout
+			// and store the original getContent for later usage in the compact filters
+			if (!oControl._fnGetContentCopy) {
+				oControl._fnGetContentCopy = oControl.getContent;
+			}
+			// override getContent of FilterItemLayout
+			// to add only filterField and not label
+			oControl.getContent = function() {
+				const aContent = [];
+				aContent.push(oControl._oFilterField);
+				return aContent;
+			};
+			oControl.removeEventDelegate(oFilterItemLayoutEventDelegate);
+		}
+	};
+	oControl.addEventDelegate(oFilterItemLayoutEventDelegate);
+
+	// Setting VF control for the Filterfield.
+	const oVisualFilters = this.aVisualFilterFields;
+	oControl.getContent().some((oInnerControl: any) => {
+		const sFFId = oInnerControl.getId();
+		if (oVisualFilters[sFFId] && oInnerControl.isA("sap.ui.mdc.FilterField")) {
+			oInnerControl.setContent(oVisualFilters[sFFId]);
+			this.oHeaderContainer.insertContent(oControl, iIndex);
+		}
+	});
+};
+VisualFilterContainer.prototype.removeFilterField = function(oControl: any) {
+	this.oHeaderContainer.removeContent(oControl);
+};
+VisualFilterContainer.prototype.removeAllFilterFields = function() {
+	this.aAllFilterFields = [];
+	this.aVisualFilterFields = {};
+	this.oHeaderContainer.removeAllContent();
+};
+VisualFilterContainer.prototype.getFilterFields = function() {
+	return this.oHeaderContainer.getContent();
+};
+VisualFilterContainer.prototype.addButton = function(oControl: any) {
+	this.oButtonFlexBox.insertItem(oControl);
+};
+VisualFilterContainer.prototype.getAllButtons = function() {
+	return this.oButtonFlexBox.getItems().reverse();
+};
+VisualFilterContainer.prototype.removeButton = function(oControl: any) {
+	this.oButtonFlexBox.removeItem(oControl);
+};
+VisualFilterContainer.prototype.getAllFilterFields = function() {
+	return this.aAllFilterFields.slice();
+};
+VisualFilterContainer.prototype.setAllFilterFields = function(aFilterFields: any, aVisualFilterFields: any) {
+	this.aAllFilterFields = aFilterFields;
+	this.aVisualFilterFields = aVisualFilterFields;
+};
+
+export default VisualFilterContainer;