diff --git a/css/modals/speaker_stats/_speaker_stats.scss b/css/modals/speaker_stats/_speaker_stats.scss
index ab493b832..4d0e6baeb 100644
--- a/css/modals/speaker_stats/_speaker_stats.scss
+++ b/css/modals/speaker_stats/_speaker_stats.scss
@@ -32,14 +32,30 @@
margin: 5px 0;
vertical-align: middle;
}
+ .speaker-stats-item__poop {
+ display: inline-block;
+ margin: 5px 0;
+ vertical-align: middle;
+ }
+ .speaker-stats-item__heart {
+ display: inline-block;
+ margin: 5px 0;
+ vertical-align: middle;
+ }
.speaker-stats-item__status {
width: 5%;
}
.speaker-stats-item__name {
- width: 40%;
+ width: 30%;
}
.speaker-stats-item__time {
- width: 55%;
+ width: 35%;
+ }
+ .speaker-stats-item__poop {
+ width: 15%;
+ }
+ .speaker-stats-item__heart {
+ width: 15%;
}
.speaker-stats-item:nth-child(even) {
@@ -52,4 +68,14 @@
text-overflow: ellipsis;
white-space: nowrap;
}
+ .speaker-stats-item__poop {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .speaker-stats-item__heart {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
}
diff --git a/react/features/speaker-stats/components/Count.js b/react/features/speaker-stats/components/Count.js
new file mode 100644
index 000000000..19e4a6b62
--- /dev/null
+++ b/react/features/speaker-stats/components/Count.js
@@ -0,0 +1,41 @@
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+
+
+/**
+ * React component for displaying a count. For example a number of poops.
+ *
+ * @extends Component
+ */
+class Count extends Component {
+ /**
+ * TimeElapsed component's property types.
+ *
+ * @static
+ */
+ static propTypes = {
+ /**
+ * Count
+ */
+ count: PropTypes.number
+ };
+
+ /**
+ * Implements React's {@link Component#render()}.
+ *
+ * @inheritdoc
+ * @returns {ReactElement}
+ */
+ render() {
+ const {count} = this.props;
+
+ return (
+
+ {count}
+
+ );
+ }
+}
+
+export default Count;
+
diff --git a/react/features/speaker-stats/components/SpeakerStats.js b/react/features/speaker-stats/components/SpeakerStats.js
index 30e82f21b..a9fdae61a 100644
--- a/react/features/speaker-stats/components/SpeakerStats.js
+++ b/react/features/speaker-stats/components/SpeakerStats.js
@@ -13,6 +13,7 @@ import SpeakerStatsLabels from './SpeakerStatsLabels';
declare var interfaceConfig: Object;
/**
+ *
* React component for displaying a list of speaker stats.
*
* @extends Component
@@ -122,6 +123,8 @@ class SpeakerStats extends Component<*, *> {
const isDominantSpeaker = statsModel.isDominantSpeaker();
const dominantSpeakerTime = statsModel.getTotalDominantSpeakerTime();
+ const poopCount = statsModel.getPoopCount();
+ const heartCount = statsModel.getHeartCount();
const hasLeft = statsModel.hasLeft();
let displayName;
@@ -143,6 +146,8 @@ class SpeakerStats extends Component<*, *> {
diff --git a/react/features/speaker-stats/components/SpeakerStatsItem.js b/react/features/speaker-stats/components/SpeakerStatsItem.js
index 5f94ab87f..becb88fba 100644
--- a/react/features/speaker-stats/components/SpeakerStatsItem.js
+++ b/react/features/speaker-stats/components/SpeakerStatsItem.js
@@ -2,6 +2,7 @@ import PropTypes from 'prop-types';
import React, { Component } from 'react';
import TimeElapsed from './TimeElapsed';
+import Count from './Count';
/**
* React component for display an individual user's speaker stats.
@@ -25,6 +26,9 @@ class SpeakerStatsItem extends Component {
*/
dominantSpeakerTime: PropTypes.number,
+ poopCount: PropTypes.number,
+ heartCount: PropTypes.number,
+
/**
* True if the participant is no longer in the meeting.
*/
@@ -62,6 +66,14 @@ class SpeakerStatsItem extends Component {
+
+
+
+
+
+
);
}
diff --git a/react/features/speaker-stats/components/SpeakerStatsLabels.js b/react/features/speaker-stats/components/SpeakerStatsLabels.js
index b63b123c5..170a6d70a 100644
--- a/react/features/speaker-stats/components/SpeakerStatsLabels.js
+++ b/react/features/speaker-stats/components/SpeakerStatsLabels.js
@@ -39,6 +39,12 @@ class SpeakerStatsLabels extends Component {
{ t('speakerStats.speakerTime') }
+
+ { "💩"}
+
+
+ { "💖"}
+
);
}