diff --git a/css/videolayout_default.css b/css/videolayout_default.css
index 58f86498db..1bfddccf25 100644
--- a/css/videolayout_default.css
+++ b/css/videolayout_default.css
@@ -286,7 +286,6 @@
position: absolute;
color: #FFFFFF;
top: 0;
- right: 23px;
padding: 8px 5px;
width: 25px;
font-size: 8pt;
diff --git a/index.html b/index.html
index 185e6b1d98..b00f78eaf7 100644
--- a/index.html
+++ b/index.html
@@ -47,7 +47,7 @@
-
+
@@ -58,12 +58,12 @@
-
+
-
+
diff --git a/jitsipopover.js b/jitsipopover.js
index 5a99b87419..af7b755b8f 100644
--- a/jitsipopover.js
+++ b/jitsipopover.js
@@ -56,12 +56,18 @@ var JitsiPopover = (function () {
JitsiPopover.prototype.hide = function () {
if(!this.elementIsHovered && !this.popoverIsHovered && this.popoverShown)
{
- $(".jitsipopover").remove();
- this.popoverShown = false;
-
+ this.forceHide();
}
};
+ /**
+ * Hides the popover
+ */
+ JitsiPopover.prototype.forceHide = function () {
+ $(".jitsipopover").remove();
+ this.popoverShown = false;
+ };
+
/**
* Creates the popover html
*/
diff --git a/videolayout.js b/videolayout.js
index 86696f86b1..45cebf7ac2 100644
--- a/videolayout.js
+++ b/videolayout.js
@@ -797,12 +797,27 @@ var VideoLayout = (function (my) {
"top");
videoMutedSpan.appendChild(mutedIndicator);
}
- var audioMutedSpan = $('#' + videoSpanId + '>span.audioMuted');
- videoMutedSpan = $('#' + videoSpanId + '>span.videoMuted');
- videoMutedSpan.css({right: ((audioMutedSpan.length > 0)?'50px':'30px')});
+
+ VideoLayout.updateMutePosition(videoSpanId);
+
}
};
+ my.updateMutePosition = function (videoSpanId) {
+ var audioMutedSpan = $('#' + videoSpanId + '>span.audioMuted');
+ var connectionIndicator = $('#' + videoSpanId + '>div.connectionindicator');
+ var videoMutedSpan = $('#' + videoSpanId + '>span.videoMuted');
+ if(connectionIndicator.length > 0
+ && connectionIndicator[0].style.display != "none") {
+ audioMutedSpan.css({right: "23px"});
+ videoMutedSpan.css({right: ((audioMutedSpan.length > 0? 23 : 0) + 30) + "px"});
+ }
+ else
+ {
+ audioMutedSpan.css({right: "0px"});
+ videoMutedSpan.css({right: (audioMutedSpan.length > 0? 30 : 0) + "px"});
+ }
+ }
/**
* Shows audio muted indicator over small videos.
* @param {string} isMuted
@@ -817,19 +832,20 @@ var VideoLayout = (function (my) {
}
}
else {
- if(audioMutedSpan.length > 0 )
- return;
- audioMutedSpan = document.createElement('span');
- audioMutedSpan.className = 'audioMuted';
- Util.setTooltip(audioMutedSpan,
- "Participant is muted",
- "top");
+ if(audioMutedSpan.length == 0 ) {
+ audioMutedSpan = document.createElement('span');
+ audioMutedSpan.className = 'audioMuted';
+ Util.setTooltip(audioMutedSpan,
+ "Participant is muted",
+ "top");
- $('#' + videoSpanId)[0].appendChild(audioMutedSpan);
+ $('#' + videoSpanId)[0].appendChild(audioMutedSpan);
+ var mutedIndicator = document.createElement('i');
+ mutedIndicator.className = 'icon-mic-disabled';
+ audioMutedSpan.appendChild(mutedIndicator);
- var mutedIndicator = document.createElement('i');
- mutedIndicator.className = 'icon-mic-disabled';
- audioMutedSpan.appendChild(mutedIndicator);
+ }
+ VideoLayout.updateMutePosition(videoSpanId);
}
};
@@ -1683,8 +1699,8 @@ var VideoLayout = (function (my) {
*/
ConnectionIndicator.prototype.remove = function()
{
- this.popover.hide();
this.connectionIndicatorContainer.remove();
+ this.popover.forceHide();
};
@@ -1698,11 +1714,15 @@ var VideoLayout = (function (my) {
if(percent === null)
{
this.connectionIndicatorContainer.style.display = "none";
+ this.popover.forceHide();
return;
}
else
{
- this.connectionIndicatorContainer.style.display = "block";
+ if(this.connectionIndicatorContainer.style.display == "none") {
+ this.connectionIndicatorContainer.style.display = "block";
+ VideoLayout.updateMutePosition(this.videoContainer.id);
+ }
}
this.bandwidth = object.bandwidth;
this.bitrate = object.bitrate;
@@ -1742,7 +1762,7 @@ var VideoLayout = (function (my) {
* Hides the popover
*/
ConnectionIndicator.prototype.hide = function () {
- this.popover.hide();
+ this.popover.forceHide();
};
/**
@@ -1750,6 +1770,8 @@ var VideoLayout = (function (my) {
*/
ConnectionIndicator.prototype.hideIndicator = function () {
this.connectionIndicatorContainer.style.display = "none";
+ if(this.popover)
+ this.popover.forceHide();
};
/**