Merge pull request #14 from pexip/13-move-the-button-from-settings-to-the-toolbar

chore: move the button from settings to the toolbar

Author: marcos-cereijo-pexip

README.md

@@ -8,13 +8,13 @@ to use this version or a later one.
 
 ## How to use
 
-To activate this feature the host user should click on the settings button
-located on the top-right corner. One thing to take into account is that this
-option will only be available during conferences.
+To activate this feature, the host must click the toolbar button. Note that this
+option is only available during conferences that do not use direct media. If the
+conference uses direct media, the button will not be available.
 
 <div align='center'>
 
-![settings panel](./images/settings.png)
+![button](./images/button.png)
 
 </div>
 

images/button.png

@@ -8,14 +8,17 @@ import { i18next } from './i18n'
 
 const version = 1
 
+const icon =
+  '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="rgb(50, 50, 50)"><path d="M240-320h320v-80H240v80Zm400 0h80v-80h-80v80ZM240-480h80v-80h-80v80Zm160 0h320v-80H400v80ZM160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm0-80h640v-480H160v480Zm0 0v-480 480Z"/></svg>'
+
 const plugin = await registerPlugin({
   id: 'message-overlay',
   version
 })
 
 setPlugin(plugin)
 
-let button: Button<'settingsMenu'> | null = null
+let button: Button<'toolbar'> | null = null
 let creatingButton = false
 
 const breakoutRooms = new Map<string, string>()
@@ -59,9 +62,14 @@ const addButton = async (): Promise<void> => {
   try {
     creatingButton = true
     button = await plugin.ui.addButton({
-      position: 'settingsMenu',
-      label: i18next.t('setMessageOverlay'),
-      inMeetingOnly: true,
+      position: 'toolbar',
+      tooltip: i18next.t('setMessageOverlay'),
+      icon: {
+        custom: {
+          main: icon,
+          hover: icon
+        }
+      },
       roles: ['chair']
     })
     button.onClick.add(handleClickButton)