Create submenu

This commit is contained in:
Pierre HUBERT 2020-04-13 16:30:13 +02:00
parent 92989a6341
commit d297bf92d0
2 changed files with 76 additions and 5 deletions

View File

@ -137,10 +137,26 @@
background-color: #fff3; background-color: #fff3;
} }
.call-window .window-bottom div i {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.call-window .window-bottom div.hang-up-button { .call-window .window-bottom div.hang-up-button {
color: #dd4b39; color: #dd4b39;
} }
.call-window .window-bottom .dropdown-menu {
left: -95px;
}
.call-window .window-bottom .dropdown-menu i {
display: inline;
}
/** /**
* Responsive mode * Responsive mode
*/ */

View File

@ -156,18 +156,29 @@ class CallWindow extends CustomEvents {
}, },
// Submenu button
{
subMenu: true,
icon: "fa-ellipsis-v",
selected: true,
label: "submenu",
onclick: () => {}
},
]
// Sub-menu entries
const menuEntries = [
//Full screen button //Full screen button
{ {
icon: "fa-expand", icon: "fa-expand",
selected: false, text: "Toggle fullscreen",
needVideo: true, needVideo: true,
onclick: (btn) => { onclick: () => {
RequestFullScreen(this.rootEl); RequestFullScreen(this.rootEl);
setTimeout(() => {
setButtonSelected(btn, IsFullScreen());
}, 1000);
} }
}, },
] ]
//Add buttons //Add buttons
@ -176,6 +187,7 @@ class CallWindow extends CustomEvents {
if(button.needVideo && !this.allowVideo) if(button.needVideo && !this.allowVideo)
return; return;
const buttonEl = createElem2({ const buttonEl = createElem2({
appendTo: bottomArea, appendTo: bottomArea,
type: "div", type: "div",
@ -222,6 +234,49 @@ class CallWindow extends CustomEvents {
// Process sub menu
const menu = bottomArea.querySelector("[data-label=\"submenu\"]");
menu.classList.add("dropup");
const menuButton = menu.firstChild;
menuButton.classList.add("dropdown-toggle");
menuButton.setAttribute("data-toggle", "dropdown")
const menuEntriesTarget = createElem2({
appendTo: menu,
type: "ul",
class: "dropdown-menu"
})
// Parse list of menu entries
for(const entry of menuEntries) {
const a = createElem2({
appendTo: menuEntriesTarget,
type: "li",
innerHTML: "<a></a>"
}).firstChild;
// Add icon
createElem2({
appendTo: a,
type: "i",
class: "fa " + entry.icon,
})
// Add label
a.innerHTML += entry.text
a.addEventListener("click", () => entry.onclick())
}
// Check for anchors // Check for anchors
this.CheckNewTargetForWindow() this.CheckNewTargetForWindow()