diff --git a/modules/UI/util/JitsiPopover.js b/modules/UI/util/JitsiPopover.js index 24acae8de..6331c647a 100644 --- a/modules/UI/util/JitsiPopover.js +++ b/modules/UI/util/JitsiPopover.js @@ -8,17 +8,14 @@ var JitsiPopover = (function () { */ function JitsiPopover(element, options) { - this.options = { - skin: "white", - content: "" - }; - if(options) - { - if(options.skin) - this.options.skin = options.skin; + let { skin, content, hasArrow } = options; + this.options = {}; + this.options.skin = skin || 'white'; + this.options.content = content || ''; + this.options.hasArrow = true; - if(options.content) - this.options.content = options.content; + if (typeof(hasArrow) !== 'undefined') { + this.options.hasArrow = false; } this.elementIsHovered = false; @@ -27,10 +24,7 @@ var JitsiPopover = (function () { element.data("jitsi_popover", this); this.element = element; - this.template = '
' + - '
' + - '
'; + this.template = this.getTemplate(); var self = this; this.element.on("mouseenter", function () { self.elementIsHovered = true; @@ -43,6 +37,22 @@ var JitsiPopover = (function () { }); } + /** + * Returns template for popover + */ + JitsiPopover.prototype.getTemplate = function () { + let arrow = ''; + if (this.options.hasArrow) { + arrow = '
'; + } + return ( + `
+ ${arrow} +
+
` + ); + }; + /** * Shows the popover */ diff --git a/modules/UI/videolayout/RemoteVideo.js b/modules/UI/videolayout/RemoteVideo.js index 6749de3af..b3699e624 100644 --- a/modules/UI/videolayout/RemoteVideo.js +++ b/modules/UI/videolayout/RemoteVideo.js @@ -22,7 +22,7 @@ function RemoteVideo(user, VideoLayout, emitter) { this.emitter = emitter; this.videoSpanId = `participant_${this.id}`; SmallVideo.call(this, VideoLayout); - this.hasRemoteVideoMenu = false; + this.hasRemoteVideoMenu = true; this.addRemoteVideoContainer(); this.connectionIndicator = new ConnectionIndicator(this, this.id); this.setDisplayName(); @@ -75,14 +75,17 @@ RemoteVideo.prototype.addRemoteVideoContainer = function() { * to display in the popup */ RemoteVideo.prototype._initPopupMenu = function (popupMenuElement) { - this.popover = new JitsiPopover( - $("#" + this.videoSpanId + " .remotevideomenu"), - { content: popupMenuElement.outerHTML, - skin: "black"}); + let options = { + content: popupMenuElement.outerHTML, + skin: "black", + hasArrow: false + }; + let element = $("#" + this.videoSpanId + " .remotevideomenu"); + this.popover = new JitsiPopover(element, options); // override popover show method to make sure we will update the content // before showing the popover - var origShowFunc = this.popover.show; + let origShowFunc = this.popover.show; this.popover.show = function () { // update content by forcing it, to finish even if popover // is not visible