Skip to content

Commit

Permalink
[INTERNAL] Fix for initial rendering and Iconnitials in controls
Browse files Browse the repository at this point in the history
BCP: 2180176684, 2180176686
Change-Id: I9c4a612f018ccc9f4ee7cdc52ad9fe3b6202ba06
  • Loading branch information
Madhu552 authored and bhuwan-Rawat committed Jun 7, 2021
1 parent 6867a3c commit 8aba9a4
Show file tree
Hide file tree
Showing 4 changed files with 54 additions and 31 deletions.
24 changes: 16 additions & 8 deletions src/sap.m/src/sap/m/FeedInput.js
Expand Up @@ -11,18 +11,18 @@ sap.ui.define([
"./FeedInputRenderer",
"sap/ui/thirdparty/jquery",
"sap/base/security/URLListValidator",
"sap/base/security/sanitizeHTML"
"sap/base/security/sanitizeHTML",
"sap/m/Avatar",
"sap/m/AvatarShape",
"sap/m/AvatarSize"
],
function(library, Control, IconPool, TextArea, Button, FeedInputRenderer, jQuery, URLListValidator, sanitizeHTML0) {
function(library, Control, IconPool, TextArea, Button, FeedInputRenderer, jQuery, URLListValidator, sanitizeHTML0, Avatar,
AvatarShape, AvatarSize) {
"use strict";

// shortcut for sap.m.ButtonType
var ButtonType = library.ButtonType;

// shortcut for sap.m.Avatar
var Avatar = library.Avatar;
var AvatarSize = library.AvatarSize;
var AvatarShape = library.AvatarShape;

var MAX_ROWS = 15,
MIN_ROWS = 2,
Expand Down Expand Up @@ -155,6 +155,12 @@ sap.ui.define([
*/
ariaLabelForPicture : {type : "string", group : "Accessibility", defaultValue : null}
},
aggregations : {
/**
* Defines the inner avatar control.
*/
_avatar: { type: "sap.m.Avatar", multiple: false, visibility: "hidden" }
},
events : {

/**
Expand Down Expand Up @@ -498,10 +504,10 @@ sap.ui.define([
* @returns {sap.m.Avatar} The Avatar control
*/
FeedInput.prototype._getAvatar = function() {
var sIcon = this.getIcon();
var sIconSrc = sIcon ? sIcon : IconPool.getIconURI("person-placeholder");
var sIconSrc = this.getIcon();
var sId = this.getId() + '-icon';

this.oAvatar = this.getAggregation("_avatar");
if (!this.oAvatar) {
this.oAvatar = new Avatar({
id: sId,
Expand All @@ -518,6 +524,8 @@ sap.ui.define([
.setDisplaySize(this.getIconSize());
}

this.setAggregation("_avatar", this.oAvatar);

return this.oAvatar;
};

Expand Down
50 changes: 28 additions & 22 deletions src/sap.m/src/sap/m/FeedListItem.js
Expand Up @@ -10,7 +10,10 @@ sap.ui.define([
"sap/ui/core/IconPool",
"sap/m/Button",
"sap/ui/Device",
"./FeedListItemRenderer"
"./FeedListItemRenderer",
"sap/m/Avatar",
"sap/m/AvatarShape",
"sap/m/AvatarSize"
],
function(
ListItemBase,
Expand All @@ -20,20 +23,16 @@ function(
IconPool,
Button,
Device,
FeedListItemRenderer
FeedListItemRenderer,
Avatar,
AvatarShape,
AvatarSize
) {
"use strict";

// shortcut for sap.m.ListType
var ListType = library.ListType;

// shortcut for sap.m.Avatar
var Avatar = library.Avatar;

var AvatarSize = library.AvatarSize;

var AvatarShape = library.AvatarShape;

// shortcut for sap.m.LinkConversion
var LinkConversion = library.LinkConversion;

Expand Down Expand Up @@ -196,7 +195,12 @@ function(
/**
* Hidden aggregation that displays the action button.
*/
_actionButton: {type: "sap.m.Button", multiple: false, visibility: "hidden"}
_actionButton: {type: "sap.m.Button", multiple: false, visibility: "hidden"},

/**
* Defines the inner avatar control.
*/
_avatar: { type: "sap.m.Avatar", multiple: false, visibility: "hidden" }
},
events: {

Expand Down Expand Up @@ -439,20 +443,19 @@ function(
* @returns {sap.m.Avatar} Avatar control based on the provided 'icon' control property
*/
FeedListItem.prototype._getAvatar = function() {
var sIcon = this.getIcon();
var sIconSrc = sIcon ? sIcon : IconPool.getIconURI("person-placeholder");
var sIconSrc = this.getIcon();
var sId = this.getId() + '-icon';

if (!this.oAvatar) {
this.oAvatar = new Avatar({
id: sId,
src: sIconSrc,
displayShape: this.getIconDisplayShape(),
initials: this.getIconInitials(),
displaySize: this.getIconSize(),
ariaLabelledBy: this.getSender()
});
}
this.oAvatar = this.getAggregation("_avatar");

this.oAvatar = this.oAvatar || new Avatar(sId);
this.oAvatar.applySettings({
src: sIconSrc,
displayShape: this.getIconDisplayShape(),
initials: this.getIconInitials(),
displaySize: this.getIconSize(),
ariaLabelledBy: this.getSender()
});

var that = this;
if (this.getIconActive()) {
Expand All @@ -469,6 +472,9 @@ function(
this.oAvatar.addStyleClass("sapMFeedListItemImageInactive");
}

this.setAggregation("_avatar", this.oAvatar);


return this.oAvatar;
};

Expand Down
9 changes: 9 additions & 0 deletions src/sap.m/test/sap/m/qunit/FeedInput.qunit.js
Expand Up @@ -87,9 +87,18 @@ sap.ui.define([
assert.strictEqual(this.oFeedInput._getAvatar().getDisplayShape(), "Circle", "Should have 'Square' shape");
assert.strictEqual(this.oFeedInput._getAvatar().getDisplaySize(), "M", "Should have 'M' size");

this.oFeedInput.setIcon("");
this.oFeedInput.setIconInitials("TT");
sap.ui.getCore().applyChanges();
assert.strictEqual(this.oFeedInput._getAvatar().getInitials(), "TT", "Should have initials set");
assert.strictEqual(this.oFeedInput._getAvatar()._getActualDisplayType(),
"Initials", "Should have initials set");

this.oFeedInput.setIcon("");
this.oFeedInput.setIconInitials("");
sap.ui.getCore().applyChanges();
assert.strictEqual(this.oFeedInput._getAvatar()._getActualDisplayType(),
"Icon", "Should have default placeholder icon");
});

QUnit.test("MaxLength", function (assert) {
Expand Down
2 changes: 1 addition & 1 deletion src/sap.m/test/sap/m/qunit/FeedListItem.qunit.js
Expand Up @@ -318,7 +318,7 @@ sap.ui.define([
});

QUnit.test("Show default icon (icon is initial + showIcon = true)", function (assert) {
assert.ok(oFeedList.getItems()[3].oAvatar.getSrc() === IconPool.getIconURI("person-placeholder"), "Placeholder icon rendered (icon initial)");
assert.ok(oFeedList.getItems()[3].oAvatar._getIcon().getSrc() === IconPool.getIconURI("person-placeholder"), "Placeholder icon rendered (icon initial)");
});

QUnit.test("Do not show icon", function (assert) {
Expand Down

1 comment on commit 8aba9a4

@boghyon
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixes: #3258
Fixes: #3259

Please sign in to comment.