@openui5/sap.f 1.117.0 → 1.118.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +4 -4
- package/src/sap/f/.library +1 -1
- package/src/sap/f/Avatar.js +1 -1
- package/src/sap/f/AvatarGroup.js +1 -1
- package/src/sap/f/AvatarGroupItem.js +1 -1
- package/src/sap/f/CalendarAppointmentInCard.js +1 -1
- package/src/sap/f/CalendarInCard.js +1 -1
- package/src/sap/f/Card.js +1 -1
- package/src/sap/f/CardBase.js +1 -1
- package/src/sap/f/DynamicPage.js +1 -1
- package/src/sap/f/DynamicPageAccessibleLandmarkInfo.js +1 -1
- package/src/sap/f/DynamicPageHeader.js +1 -1
- package/src/sap/f/DynamicPageTitle.js +23 -10
- package/src/sap/f/DynamicPageTitleRenderer.js +1 -1
- package/src/sap/f/FlexibleColumnLayout.js +1 -1
- package/src/sap/f/FlexibleColumnLayoutAccessibleLandmarkInfo.js +1 -1
- package/src/sap/f/FlexibleColumnLayoutSemanticHelper.js +1 -1
- package/src/sap/f/GridContainer.js +1 -1
- package/src/sap/f/GridContainerItemLayoutData.js +1 -1
- package/src/sap/f/GridContainerSettings.js +2 -2
- package/src/sap/f/GridList.js +1 -4
- package/src/sap/f/GridListItem.js +1 -1
- package/src/sap/f/IllustratedMessage.js +1 -1
- package/src/sap/f/Illustration.js +1 -1
- package/src/sap/f/PlanningCalendarInCardLegend.js +1 -1
- package/src/sap/f/ProductSwitch.js +1 -1
- package/src/sap/f/ProductSwitchItem.js +1 -1
- package/src/sap/f/SearchManager.js +1 -1
- package/src/sap/f/ShellBar.js +1 -1
- package/src/sap/f/SidePanel.js +4 -2
- package/src/sap/f/SidePanelItem.js +1 -1
- package/src/sap/f/SidePanelRenderer.js +1 -1
- package/src/sap/f/cards/BaseHeader.js +28 -4
- package/src/sap/f/cards/BaseHeaderRenderer.js +68 -0
- package/src/sap/f/cards/Header.js +7 -6
- package/src/sap/f/cards/HeaderRenderer.js +15 -17
- package/src/sap/f/cards/NumericHeader.js +174 -19
- package/src/sap/f/cards/NumericHeaderRenderer.js +25 -6
- package/src/sap/f/cards/NumericIndicators.js +1 -1
- package/src/sap/f/cards/NumericSideIndicator.js +1 -1
- package/src/sap/f/cards/loading/AnalyticalPlaceholder.js +1 -1
- package/src/sap/f/cards/loading/CalendarPlaceholder.js +1 -1
- package/src/sap/f/cards/loading/GenericPlaceholder.js +1 -1
- package/src/sap/f/cards/loading/ListPlaceholder.js +1 -1
- package/src/sap/f/cards/loading/ListPlaceholderRenderer.js +1 -2
- package/src/sap/f/cards/loading/ObjectPlaceholder.js +1 -1
- package/src/sap/f/cards/loading/PlaceholderBase.js +1 -1
- package/src/sap/f/cards/loading/TablePlaceholder.js +1 -1
- package/src/sap/f/cards/loading/TimelinePlaceholder.js +1 -1
- package/src/sap/f/changeHandler/MoveDynamicPageTitleActions.js +1 -1
- package/src/sap/f/delegate/GridContainerItemNavigation.js +8 -8
- package/src/sap/f/delegate/GridItemNavigation.js +1 -1
- package/src/sap/f/dnd/GridDragOver.js +1 -1
- package/src/sap/f/dnd/GridDropInfo.js +1 -1
- package/src/sap/f/library.js +2 -2
- package/src/sap/f/semantic/AddAction.js +1 -1
- package/src/sap/f/semantic/CloseAction.js +1 -1
- package/src/sap/f/semantic/CopyAction.js +1 -1
- package/src/sap/f/semantic/DeleteAction.js +1 -1
- package/src/sap/f/semantic/DiscussInJamAction.js +1 -1
- package/src/sap/f/semantic/EditAction.js +1 -1
- package/src/sap/f/semantic/ExitFullScreenAction.js +1 -1
- package/src/sap/f/semantic/FavoriteAction.js +1 -1
- package/src/sap/f/semantic/FlagAction.js +1 -1
- package/src/sap/f/semantic/FooterMainAction.js +1 -1
- package/src/sap/f/semantic/FullScreenAction.js +1 -1
- package/src/sap/f/semantic/MainAction.js +1 -1
- package/src/sap/f/semantic/MessagesIndicator.js +1 -1
- package/src/sap/f/semantic/NegativeAction.js +1 -1
- package/src/sap/f/semantic/PositiveAction.js +1 -1
- package/src/sap/f/semantic/PrintAction.js +1 -1
- package/src/sap/f/semantic/SemanticButton.js +1 -1
- package/src/sap/f/semantic/SemanticConfiguration.js +1 -1
- package/src/sap/f/semantic/SemanticControl.js +1 -1
- package/src/sap/f/semantic/SemanticPage.js +4 -2
- package/src/sap/f/semantic/SemanticToggleButton.js +1 -1
- package/src/sap/f/semantic/SendEmailAction.js +1 -1
- package/src/sap/f/semantic/SendMessageAction.js +1 -1
- package/src/sap/f/semantic/ShareInJamAction.js +1 -1
- package/src/sap/f/semantic/TitleMainAction.js +1 -1
- package/src/sap/f/shellBar/AdditionalContentSupport.js +1 -1
- package/src/sap/f/shellBar/CoPilot.js +1 -1
- package/src/sap/f/shellBar/ControlSpacer.js +1 -1
- package/src/sap/f/shellBar/Search.js +1 -1
- package/src/sap/f/themes/base/Card.less +42 -2
- package/src/sap/f/themes/base/SidePanel.less +3 -3
|
@@ -4,12 +4,14 @@
|
|
|
4
4
|
* Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
|
-
sap.ui.define([
|
|
7
|
+
sap.ui.define([
|
|
8
|
+
"sap/f/cards/BaseHeaderRenderer",
|
|
9
|
+
"sap/ui/core/Renderer"
|
|
10
|
+
], function (BaseHeaderRenderer, Renderer) {
|
|
8
11
|
"use strict";
|
|
9
12
|
|
|
10
|
-
var HeaderRenderer =
|
|
11
|
-
|
|
12
|
-
};
|
|
13
|
+
var HeaderRenderer = Renderer.extend(BaseHeaderRenderer);
|
|
14
|
+
HeaderRenderer.apiVersion = 2;
|
|
13
15
|
|
|
14
16
|
/**
|
|
15
17
|
* Render a header.
|
|
@@ -24,13 +26,12 @@ sap.ui.define([], function () {
|
|
|
24
26
|
oTitle = oHeader.getAggregation("_title"),
|
|
25
27
|
oSubtitle = oHeader.getAggregation("_subtitle"),
|
|
26
28
|
bHasSubtitle = oHeader.getSubtitle() || oBindingInfos.subtitle,
|
|
27
|
-
oAvatar = oHeader.getAggregation("_avatar"),
|
|
28
29
|
oDataTimestamp = oHeader.getAggregation("_dataTimestamp"),
|
|
29
30
|
bHasDataTimestamp = oHeader.getDataTimestamp() || oBindingInfos.dataTimestamp,
|
|
30
31
|
bLoading = oHeader.isLoading(),
|
|
31
32
|
oError = oHeader.getAggregation("_error"),
|
|
32
33
|
oToolbar = oHeader.getToolbar(),
|
|
33
|
-
|
|
34
|
+
bUseTileLayout = oHeader.getProperty("useTileLayout");
|
|
34
35
|
|
|
35
36
|
oRm.openStart("div", oHeader)
|
|
36
37
|
.class("sapFCardHeader");
|
|
@@ -71,17 +72,8 @@ sap.ui.define([], function () {
|
|
|
71
72
|
return;
|
|
72
73
|
}
|
|
73
74
|
|
|
74
|
-
if (
|
|
75
|
-
|
|
76
|
-
.class("sapFCardHeaderImage")
|
|
77
|
-
.openEnd();
|
|
78
|
-
|
|
79
|
-
if (oBindingInfos.iconSrc && oBindingInfos.iconSrc.binding && !oBindingInfos.iconSrc.binding.getValue()) {
|
|
80
|
-
oAvatar.addStyleClass("sapFCardHeaderItemBinded");
|
|
81
|
-
}
|
|
82
|
-
oRm.renderControl(oAvatar);
|
|
83
|
-
oRm.renderControl(oHeader._oAriaAvatarText);
|
|
84
|
-
oRm.close("div");
|
|
75
|
+
if (!bUseTileLayout) {
|
|
76
|
+
BaseHeaderRenderer.renderAvatar(oRm, oHeader);
|
|
85
77
|
}
|
|
86
78
|
|
|
87
79
|
oRm.openStart("div")
|
|
@@ -143,6 +135,12 @@ sap.ui.define([], function () {
|
|
|
143
135
|
|
|
144
136
|
oRm.close("div");
|
|
145
137
|
|
|
138
|
+
if (bUseTileLayout) {
|
|
139
|
+
BaseHeaderRenderer.renderAvatar(oRm, oHeader);
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
BaseHeaderRenderer.renderBanner(oRm, oHeader);
|
|
143
|
+
|
|
146
144
|
oRm.close("div");
|
|
147
145
|
|
|
148
146
|
if (oToolbar) {
|
|
@@ -6,16 +6,33 @@
|
|
|
6
6
|
sap.ui.define([
|
|
7
7
|
"./BaseHeader",
|
|
8
8
|
"./NumericIndicators",
|
|
9
|
+
"sap/base/Log",
|
|
10
|
+
"sap/m/library",
|
|
9
11
|
"sap/m/Text",
|
|
10
|
-
"sap/
|
|
12
|
+
"sap/m/ObjectStatus",
|
|
13
|
+
"sap/f/cards/NumericHeaderRenderer",
|
|
14
|
+
"sap/ui/core/library",
|
|
15
|
+
"sap/m/Avatar",
|
|
16
|
+
"sap/ui/core/InvisibleText"
|
|
11
17
|
], function (
|
|
12
18
|
BaseHeader,
|
|
13
19
|
NumericIndicators,
|
|
20
|
+
Log,
|
|
21
|
+
mLibrary,
|
|
14
22
|
Text,
|
|
15
|
-
|
|
23
|
+
ObjectStatus,
|
|
24
|
+
NumericHeaderRenderer,
|
|
25
|
+
coreLibrary,
|
|
26
|
+
Avatar,
|
|
27
|
+
InvisibleText
|
|
16
28
|
) {
|
|
17
29
|
"use strict";
|
|
18
30
|
|
|
31
|
+
var ValueState = coreLibrary.ValueState;
|
|
32
|
+
var AvatarShape = mLibrary.AvatarShape;
|
|
33
|
+
var AvatarColor = mLibrary.AvatarColor;
|
|
34
|
+
var AvatarImageFitType = mLibrary.AvatarImageFitType;
|
|
35
|
+
|
|
19
36
|
/**
|
|
20
37
|
* Constructor for a new <code>NumericHeader</code>.
|
|
21
38
|
*
|
|
@@ -39,7 +56,7 @@ sap.ui.define([
|
|
|
39
56
|
* @extends sap.f.cards.BaseHeader
|
|
40
57
|
*
|
|
41
58
|
* @author SAP SE
|
|
42
|
-
* @version 1.
|
|
59
|
+
* @version 1.118.0
|
|
43
60
|
*
|
|
44
61
|
* @constructor
|
|
45
62
|
* @public
|
|
@@ -79,6 +96,51 @@ sap.ui.define([
|
|
|
79
96
|
*/
|
|
80
97
|
statusText: { type: "string", defaultValue: "" },
|
|
81
98
|
|
|
99
|
+
/**
|
|
100
|
+
* Defines the shape of the icon.
|
|
101
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
102
|
+
* @since 1.118
|
|
103
|
+
*/
|
|
104
|
+
iconDisplayShape: { type: "sap.m.AvatarShape", defaultValue: AvatarShape.Circle },
|
|
105
|
+
|
|
106
|
+
/**
|
|
107
|
+
* Defines the icon source.
|
|
108
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
109
|
+
* @since 1.118
|
|
110
|
+
*/
|
|
111
|
+
iconSrc: { type: "sap.ui.core.URI", defaultValue: "" },
|
|
112
|
+
|
|
113
|
+
/**
|
|
114
|
+
* Defines the initials of the icon.
|
|
115
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
116
|
+
* @since 1.118
|
|
117
|
+
*/
|
|
118
|
+
iconInitials: { type: "string", defaultValue: "" },
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* Defines an alt text for the avatar or icon.
|
|
122
|
+
*
|
|
123
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
124
|
+
* @since 1.118
|
|
125
|
+
*/
|
|
126
|
+
iconAlt: { type: "string", defaultValue: "" },
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* Defines a background color for the avatar or icon.
|
|
130
|
+
*
|
|
131
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
132
|
+
* @since 1.118
|
|
133
|
+
*/
|
|
134
|
+
iconBackgroundColor: { type: "sap.m.AvatarColor", defaultValue: AvatarColor.Transparent },
|
|
135
|
+
|
|
136
|
+
/**
|
|
137
|
+
* Defines whether the card icon is visible.
|
|
138
|
+
*
|
|
139
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
140
|
+
* @since 1.118
|
|
141
|
+
*/
|
|
142
|
+
iconVisible: { type: "boolean", defaultValue: true },
|
|
143
|
+
|
|
82
144
|
/**
|
|
83
145
|
* General unit of measurement for the header. Displayed as side information to the subtitle.
|
|
84
146
|
*/
|
|
@@ -120,6 +182,13 @@ sap.ui.define([
|
|
|
120
182
|
*/
|
|
121
183
|
details: { "type": "string", group: "Appearance" },
|
|
122
184
|
|
|
185
|
+
/**
|
|
186
|
+
* The semantic color which represents the state of the details text.
|
|
187
|
+
* @experimental Since 1.118. For usage only by Work Zone.
|
|
188
|
+
* @since 1.118
|
|
189
|
+
*/
|
|
190
|
+
detailsState: { type : "sap.ui.core.ValueState", group: "Appearance", defaultValue: ValueState.None },
|
|
191
|
+
|
|
123
192
|
/**
|
|
124
193
|
* Limits the number of lines for the details.
|
|
125
194
|
* @experimental since 1.101
|
|
@@ -130,7 +199,6 @@ sap.ui.define([
|
|
|
130
199
|
* The alignment of the side indicators.
|
|
131
200
|
*/
|
|
132
201
|
sideIndicatorsAlignment: { "type": "sap.f.cards.NumericHeaderSideIndicatorsAlignment", group: "Appearance", defaultValue : "Begin" }
|
|
133
|
-
|
|
134
202
|
},
|
|
135
203
|
aggregations: {
|
|
136
204
|
|
|
@@ -156,6 +224,11 @@ sap.ui.define([
|
|
|
156
224
|
*/
|
|
157
225
|
_subtitle: { type: "sap.m.Text", multiple: false, visibility: "hidden" },
|
|
158
226
|
|
|
227
|
+
/**
|
|
228
|
+
* Defines the inner avatar control.
|
|
229
|
+
*/
|
|
230
|
+
_avatar: { type: "sap.m.Avatar", multiple: false, visibility: "hidden" },
|
|
231
|
+
|
|
159
232
|
/**
|
|
160
233
|
* Shows unit of measurement next to subtitle
|
|
161
234
|
*/
|
|
@@ -164,7 +237,7 @@ sap.ui.define([
|
|
|
164
237
|
/**
|
|
165
238
|
* Display details
|
|
166
239
|
*/
|
|
167
|
-
_details: { type: "sap.
|
|
240
|
+
_details: { type: "sap.ui.core.Control", multiple: false, visibility: "hidden" },
|
|
168
241
|
|
|
169
242
|
/**
|
|
170
243
|
* Displays the main and side indicators
|
|
@@ -190,10 +263,16 @@ sap.ui.define([
|
|
|
190
263
|
BaseHeader.prototype.init.apply(this, arguments);
|
|
191
264
|
|
|
192
265
|
this.data("sap-ui-fastnavgroup", "true", true); // Define group for F6 handling
|
|
266
|
+
|
|
267
|
+
this._oAriaAvatarText = new InvisibleText({id: this.getId() + "-ariaAvatarText"});
|
|
268
|
+
this._oAriaAvatarText.setText(this._oRb.getText("ARIA_HEADER_AVATAR_TEXT"));
|
|
193
269
|
};
|
|
194
270
|
|
|
195
271
|
NumericHeader.prototype.exit = function () {
|
|
196
272
|
BaseHeader.prototype.exit.apply(this, arguments);
|
|
273
|
+
|
|
274
|
+
this._oAriaAvatarText.destroy();
|
|
275
|
+
this._oAriaAvatarText = null;
|
|
197
276
|
};
|
|
198
277
|
|
|
199
278
|
/**
|
|
@@ -212,9 +291,28 @@ sap.ui.define([
|
|
|
212
291
|
.setMaxLines(this.getSubtitleMaxLines());
|
|
213
292
|
|
|
214
293
|
this._getUnitOfMeasurement().setText(this.getUnitOfMeasurement());
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
294
|
+
|
|
295
|
+
var oAvatar = this._getAvatar();
|
|
296
|
+
|
|
297
|
+
oAvatar.setDisplayShape(this.getIconDisplayShape());
|
|
298
|
+
oAvatar.setSrc(this.getIconSrc());
|
|
299
|
+
oAvatar.setInitials(this.getIconInitials());
|
|
300
|
+
oAvatar.setTooltip(this.getIconAlt());
|
|
301
|
+
oAvatar.setBackgroundColor(this.getIconBackgroundColor());
|
|
302
|
+
|
|
303
|
+
if (!this.isPropertyInitial("detailsState") && !this.isPropertyInitial("detailsMaxLines")) {
|
|
304
|
+
Log.error("Both details state and details max lines can not be used at the same time. Max lines setting will be ignored.");
|
|
305
|
+
}
|
|
306
|
+
|
|
307
|
+
if (!this.isPropertyInitial("detailsState")) {
|
|
308
|
+
this._createDetails(true)
|
|
309
|
+
.setText(this.getDetails())
|
|
310
|
+
.setState(this.getDetailsState());
|
|
311
|
+
} else {
|
|
312
|
+
this._createDetails()
|
|
313
|
+
.setText(this.getDetails())
|
|
314
|
+
.setMaxLines(this.getDetailsMaxLines());
|
|
315
|
+
}
|
|
218
316
|
|
|
219
317
|
this._getNumericIndicators()
|
|
220
318
|
.setNumber(this.getNumber())
|
|
@@ -225,6 +323,13 @@ sap.ui.define([
|
|
|
225
323
|
.setNumberVisible(this.getNumberVisible());
|
|
226
324
|
};
|
|
227
325
|
|
|
326
|
+
/**
|
|
327
|
+
* @protected
|
|
328
|
+
* @returns {boolean} If the icon should be shown.
|
|
329
|
+
*/
|
|
330
|
+
NumericHeader.prototype.shouldShowIcon = function () {
|
|
331
|
+
return this.getIconVisible();
|
|
332
|
+
};
|
|
228
333
|
|
|
229
334
|
/**
|
|
230
335
|
* This method is a hook for the RenderManager that gets called
|
|
@@ -285,6 +390,22 @@ sap.ui.define([
|
|
|
285
390
|
return oControl;
|
|
286
391
|
};
|
|
287
392
|
|
|
393
|
+
/**
|
|
394
|
+
* Lazily creates an avatar control and returns it.
|
|
395
|
+
* @private
|
|
396
|
+
* @returns {sap.m.Avatar} The inner avatar aggregation
|
|
397
|
+
*/
|
|
398
|
+
NumericHeader.prototype._getAvatar = function () {
|
|
399
|
+
var oAvatar = this.getAggregation("_avatar");
|
|
400
|
+
if (!oAvatar) {
|
|
401
|
+
oAvatar = new Avatar({
|
|
402
|
+
imageFitType: AvatarImageFitType.Contain
|
|
403
|
+
}).addStyleClass("sapFCardIcon");
|
|
404
|
+
this.setAggregation("_avatar", oAvatar);
|
|
405
|
+
}
|
|
406
|
+
return oAvatar;
|
|
407
|
+
};
|
|
408
|
+
|
|
288
409
|
/**
|
|
289
410
|
* Lazily create a unit of measurement and return it.
|
|
290
411
|
*
|
|
@@ -306,24 +427,53 @@ sap.ui.define([
|
|
|
306
427
|
};
|
|
307
428
|
|
|
308
429
|
/**
|
|
309
|
-
*
|
|
310
|
-
*
|
|
430
|
+
* Create details and return it.
|
|
311
431
|
* @private
|
|
312
|
-
* @
|
|
432
|
+
* @param {boolean} bUseObjectStatus If set to true the details will be sap.m.ObjectStatus
|
|
433
|
+
* @return {sap.m.Text|sap.m.ObjectStatus} The details aggregation
|
|
313
434
|
*/
|
|
314
|
-
NumericHeader.prototype.
|
|
435
|
+
NumericHeader.prototype._createDetails = function (bUseObjectStatus) {
|
|
315
436
|
var oControl = this.getAggregation("_details");
|
|
316
437
|
|
|
317
|
-
if (
|
|
318
|
-
oControl
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
438
|
+
if (oControl?.isA("sap.m.Text") && bUseObjectStatus) {
|
|
439
|
+
oControl.destroy();
|
|
440
|
+
} else if (oControl) {
|
|
441
|
+
return oControl;
|
|
442
|
+
}
|
|
443
|
+
|
|
444
|
+
var oSettings = {
|
|
445
|
+
id: this._getDetailsId()
|
|
446
|
+
};
|
|
447
|
+
|
|
448
|
+
if (bUseObjectStatus) {
|
|
449
|
+
oControl = new ObjectStatus(oSettings);
|
|
450
|
+
} else {
|
|
451
|
+
oControl = new Text(oSettings);
|
|
322
452
|
}
|
|
323
453
|
|
|
454
|
+
this.setAggregation("_details", oControl);
|
|
455
|
+
|
|
324
456
|
return oControl;
|
|
325
457
|
};
|
|
326
458
|
|
|
459
|
+
/**
|
|
460
|
+
* Gets the control create for showing details.
|
|
461
|
+
* @private
|
|
462
|
+
* @return {sap.m.Text|sap.m.ObjectStatus} The details aggregation
|
|
463
|
+
*/
|
|
464
|
+
NumericHeader.prototype._getDetails = function () {
|
|
465
|
+
return this.getAggregation("_details");
|
|
466
|
+
};
|
|
467
|
+
|
|
468
|
+
/**
|
|
469
|
+
* Gets the id for details control.
|
|
470
|
+
* @private
|
|
471
|
+
* @return {string} The id for details control.
|
|
472
|
+
*/
|
|
473
|
+
NumericHeader.prototype._getDetailsId = function () {
|
|
474
|
+
return this.getId() + "-details";
|
|
475
|
+
};
|
|
476
|
+
|
|
327
477
|
/**
|
|
328
478
|
* Lazily create numeric content and return it.
|
|
329
479
|
*
|
|
@@ -353,6 +503,7 @@ sap.ui.define([
|
|
|
353
503
|
sSubtitleId = "",
|
|
354
504
|
sStatusTextId = "",
|
|
355
505
|
sUnitOfMeasureId = this._getUnitOfMeasurement().getId(),
|
|
506
|
+
sAvatarId = "",
|
|
356
507
|
sMainIndicatorId = "",
|
|
357
508
|
sSideIndicatorsIds = this._getSideIndicatorIds(),
|
|
358
509
|
sDetailsId = "",
|
|
@@ -374,15 +525,19 @@ sap.ui.define([
|
|
|
374
525
|
sStatusTextId = this.getId() + "-status";
|
|
375
526
|
}
|
|
376
527
|
|
|
528
|
+
if (this.getIconSrc() || this.getIconInitials()) {
|
|
529
|
+
sAvatarId = this.getId() + "-ariaAvatarText";
|
|
530
|
+
}
|
|
531
|
+
|
|
377
532
|
if (this.getDetails()) {
|
|
378
|
-
sDetailsId = this.
|
|
533
|
+
sDetailsId = this._getDetailsId();
|
|
379
534
|
}
|
|
380
535
|
|
|
381
536
|
if (this.getNumber() || this.getScale()) {
|
|
382
537
|
sMainIndicatorId = this._getNumericIndicators()._getMainIndicator().getId();
|
|
383
538
|
}
|
|
384
539
|
|
|
385
|
-
sIds = sCardTypeId + " " + sTitleId + " " + sSubtitleId + " " + sStatusTextId + " " + sUnitOfMeasureId + " " + sMainIndicatorId + " " + sSideIndicatorsIds + " " + sDetailsId;
|
|
540
|
+
sIds = sCardTypeId + " " + sTitleId + " " + sSubtitleId + " " + sStatusTextId + " " + sUnitOfMeasureId + " " + sAvatarId + " " + sMainIndicatorId + " " + sSideIndicatorsIds + " " + sDetailsId;
|
|
386
541
|
|
|
387
542
|
// remove whitespace from both sides
|
|
388
543
|
// and merge the consecutive spaces into one
|
|
@@ -4,13 +4,14 @@
|
|
|
4
4
|
* Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
sap
|
|
7
|
+
sap.ui.define([
|
|
8
|
+
"sap/f/cards/BaseHeaderRenderer",
|
|
9
|
+
"sap/ui/core/Renderer"
|
|
10
|
+
], function (BaseHeaderRenderer, Renderer) {
|
|
9
11
|
"use strict";
|
|
10
12
|
|
|
11
|
-
var NumericHeaderRenderer =
|
|
12
|
-
|
|
13
|
-
};
|
|
13
|
+
var NumericHeaderRenderer = Renderer.extend(BaseHeaderRenderer);
|
|
14
|
+
NumericHeaderRenderer.apiVersion = 2;
|
|
14
15
|
|
|
15
16
|
/**
|
|
16
17
|
* Render a numeric header.
|
|
@@ -58,8 +59,9 @@ sap.ui.define([], function () {
|
|
|
58
59
|
oRm.renderControl(oError);
|
|
59
60
|
} else {
|
|
60
61
|
NumericHeaderRenderer.renderHeaderText(oRm, oNumericHeader);
|
|
61
|
-
NumericHeaderRenderer.
|
|
62
|
+
NumericHeaderRenderer.renderAvatarAndIndicatorsLine(oRm, oNumericHeader);
|
|
62
63
|
NumericHeaderRenderer.renderDetails(oRm, oNumericHeader);
|
|
64
|
+
BaseHeaderRenderer.renderBanner(oRm, oNumericHeader);
|
|
63
65
|
}
|
|
64
66
|
|
|
65
67
|
oRm.close("div");
|
|
@@ -180,6 +182,23 @@ sap.ui.define([], function () {
|
|
|
180
182
|
}
|
|
181
183
|
};
|
|
182
184
|
|
|
185
|
+
/**
|
|
186
|
+
* Render avatar, main indicator and side indicators if any.
|
|
187
|
+
*
|
|
188
|
+
* @param {sap.ui.core.RenderManager} oRm The RenderManager that can be used for writing to the render output buffer
|
|
189
|
+
* @param {sap.f.cards.NumericHeader} oNH An object representation of the control that should be rendered
|
|
190
|
+
*/
|
|
191
|
+
NumericHeaderRenderer.renderAvatarAndIndicatorsLine = function(oRm, oNH) {
|
|
192
|
+
oRm.openStart("div")
|
|
193
|
+
.class("sapFCardAvatarAndIndicatorsLine")
|
|
194
|
+
.openEnd();
|
|
195
|
+
|
|
196
|
+
BaseHeaderRenderer.renderAvatar(oRm, oNH);
|
|
197
|
+
NumericHeaderRenderer.renderIndicators(oRm, oNH);
|
|
198
|
+
|
|
199
|
+
oRm.close("div");
|
|
200
|
+
};
|
|
201
|
+
|
|
183
202
|
/**
|
|
184
203
|
* Render main indicator and side indicators if any.
|
|
185
204
|
*
|
|
@@ -77,7 +77,6 @@ sap.ui.define(["sap/ui/core/Renderer", "./PlaceholderBaseRenderer"], function(Re
|
|
|
77
77
|
};
|
|
78
78
|
|
|
79
79
|
ListPlaceholderRenderer.renderContent = function(oControl, oRm) {
|
|
80
|
-
|
|
81
80
|
var iMinItems = oControl.getMinItems(),
|
|
82
81
|
oItem = oControl.getItem();
|
|
83
82
|
|
|
@@ -98,7 +97,7 @@ sap.ui.define(["sap/ui/core/Renderer", "./PlaceholderBaseRenderer"], function(Re
|
|
|
98
97
|
oRm.openStart("div")
|
|
99
98
|
.class("sapFCardListPlaceholderRows")
|
|
100
99
|
.openEnd();
|
|
101
|
-
|
|
100
|
+
|
|
102
101
|
if (oItem) {
|
|
103
102
|
this.renderTitleAndDescription(oRm, oItem);
|
|
104
103
|
this.renderAttributes(oRm, oItem);
|
|
@@ -10,7 +10,7 @@ sap.ui.define([
|
|
|
10
10
|
"sap/ui/dom/containsOrEquals",
|
|
11
11
|
"sap/ui/thirdparty/jquery",
|
|
12
12
|
"sap/ui/dom/jquery/Selectors" // provides jQuery custom selector ":sapTabbable"
|
|
13
|
-
], function
|
|
13
|
+
], function(
|
|
14
14
|
Element,
|
|
15
15
|
ItemNavigation,
|
|
16
16
|
GridItemNavigation,
|
|
@@ -41,7 +41,7 @@ sap.ui.define([
|
|
|
41
41
|
*
|
|
42
42
|
*
|
|
43
43
|
* @author SAP SE
|
|
44
|
-
* @version 1.
|
|
44
|
+
* @version 1.118.0
|
|
45
45
|
*
|
|
46
46
|
* @extends sap.f.delegate.GridItemNavigation
|
|
47
47
|
*
|
|
@@ -50,16 +50,16 @@ sap.ui.define([
|
|
|
50
50
|
* @alias sap.f.delegate.GridContainerItemNavigation
|
|
51
51
|
*/
|
|
52
52
|
var GridContainerItemNavigation = GridItemNavigation.extend("sap.f.delegate.GridContainerItemNavigation", /** @lends sap.f.delegate.GridContainerItemNavigation.prototype */ {
|
|
53
|
-
constructor: function
|
|
53
|
+
constructor: function() {
|
|
54
54
|
GridItemNavigation.apply(this, arguments);
|
|
55
55
|
|
|
56
56
|
this.attachEvent(ItemNavigation.Events.FocusLeave, this._onFocusLeave, this);
|
|
57
57
|
}
|
|
58
58
|
});
|
|
59
59
|
|
|
60
|
-
GridContainerItemNavigation.prototype._onFocusLeave = function
|
|
60
|
+
GridContainerItemNavigation.prototype._onFocusLeave = function(oEvent) {
|
|
61
61
|
var currentFocused = this.getFocusedDomRef();
|
|
62
|
-
this.getItemDomRefs().forEach(function
|
|
62
|
+
this.getItemDomRefs().forEach(function(item, index) {
|
|
63
63
|
if (currentFocused === item) {
|
|
64
64
|
var nextFocusableIndex = index++;
|
|
65
65
|
this.setFocusedIndex(nextFocusableIndex);
|
|
@@ -100,13 +100,13 @@ sap.ui.define([
|
|
|
100
100
|
var $AllTabbables = $LastFocused.find(":sapTabbable");
|
|
101
101
|
|
|
102
102
|
// leave only real tabbable elements in the tab chain, GridContainer and List types have dummy areas
|
|
103
|
-
$AllTabbables.map(function
|
|
104
|
-
if (element.className.indexOf("DummyArea") === -1) {
|
|
103
|
+
$AllTabbables.map(function(index, element) {
|
|
104
|
+
if (element.className.indexOf("DummyArea") === -1 && element.className.indexOf("sapMListUl") === -1) {
|
|
105
105
|
Tabbables.push(element);
|
|
106
106
|
}
|
|
107
107
|
});
|
|
108
108
|
|
|
109
|
-
var focusableIndex = Tabbables.length
|
|
109
|
+
var focusableIndex = Tabbables.length - 1;
|
|
110
110
|
if (focusableIndex === -1 ||
|
|
111
111
|
(Element.closestTo(Tabbables[focusableIndex]) && Element.closestTo(Tabbables[focusableIndex]).getId() === oEvent.target.id)) {
|
|
112
112
|
this._lastFocusedElement = oEvent.target;
|
package/src/sap/f/library.js
CHANGED
|
@@ -36,13 +36,13 @@ sap.ui.define(["sap/ui/base/DataType",
|
|
|
36
36
|
* @namespace
|
|
37
37
|
* @alias sap.f
|
|
38
38
|
* @author SAP SE
|
|
39
|
-
* @version 1.
|
|
39
|
+
* @version 1.118.0
|
|
40
40
|
* @since 1.44
|
|
41
41
|
* @public
|
|
42
42
|
*/
|
|
43
43
|
var thisLib = sap.ui.getCore().initLibrary({
|
|
44
44
|
name : "sap.f",
|
|
45
|
-
version: "1.
|
|
45
|
+
version: "1.118.0",
|
|
46
46
|
dependencies : ["sap.ui.core", "sap.m", "sap.ui.layout"],
|
|
47
47
|
designtime: "sap/f/designtime/library.designtime",
|
|
48
48
|
interfaces: [
|