jfinn
/
jitsi_corner2
關注 1
收藏 0
複製 0
程式碼 問題 0 合併請求 0 版本發佈 0 Wiki 活動
瀏覽代碼

feat(welcome): add posibility to extend settings toolbar

efficient_tiling
Mihai Uscat 5 年之前
父節點
0fa6ffc439
當前提交
5ade0cad8b
共有 5 個檔案被更改，包括 66 行新增 和 0 行删除
統一視圖 顯示文件統計
  1. 1
    0
      css/_settings_toolbar.scss
  2. 1
    0
      index.html
  3. 1
    0
      interface_config.js
  4. 62
    0
      react/features/welcome/components/WelcomePage.web.js
  5. 1
    0
      static/settingsToolbarAdditionalContent.html

+ 1
- 0
css/_settings_toolbar.scss 查看文件

1 
+/** Insert custom CSS for any additional content in the welcome page settings toolbar **/

+ 1
- 0
index.html 查看文件

148 
     <!--#include virtual="title.html" -->
 148 
     <!--#include virtual="title.html" -->
149 
     <!--#include virtual="plugin.head.html" -->
 149 
     <!--#include virtual="plugin.head.html" -->
150 
     <!--#include virtual="static/welcomePageAdditionalContent.html" -->
 150 
     <!--#include virtual="static/welcomePageAdditionalContent.html" -->
151 
+    <!--#include virtual="static/settingsToolbarAdditionalContent.html" -->
151 
   </head>
 152 
   </head>
152 
   <body>
 153 
   <body>
153 
     <div id="react"></div>
 154 
     <div id="react"></div>

+ 1
- 0
interface_config.js 查看文件

27 
     SHOW_DEEP_LINKING_IMAGE: false,
 27 
     SHOW_DEEP_LINKING_IMAGE: false,
28 
     GENERATE_ROOMNAMES_ON_WELCOME_PAGE: true,
 28 
     GENERATE_ROOMNAMES_ON_WELCOME_PAGE: true,
29 
     DISPLAY_WELCOME_PAGE_CONTENT: true,
 29 
     DISPLAY_WELCOME_PAGE_CONTENT: true,
30 
+    DISPLAY_WELCOME_PAGE_TOOLBAR_CONTENT: false,
30 
     APP_NAME: 'Jitsi Meet',
 31 
     APP_NAME: 'Jitsi Meet',
31 
     NATIVE_APP_NAME: 'Jitsi Meet',
 32 
     NATIVE_APP_NAME: 'Jitsi Meet',
32 
     PROVIDER_NAME: 'Jitsi',
 33 
     PROVIDER_NAME: 'Jitsi',

+ 62
- 0
react/features/welcome/components/WelcomePage.web.js 查看文件

53 
          */
 53 
          */
54 
         this._additionalContentRef = null;
 54 
         this._additionalContentRef = null;
55
55
56 
+        /**
57 
+         * The HTML Element used as the container for additional toolbar content. Used
58 
+         * for directly appending the additional content template to the dom.
59 
+         *
60 
+         * @private
61 
+         * @type {HTMLTemplateElement|null}
62 
+         */
63 
+        this._additionalToolbarContentRef = null;
64 
+
56 
         /**
 65 
         /**
57 
          * The template to use as the main content for the welcome page. If
 66 
          * The template to use as the main content for the welcome page. If
58 
          * not found then only the welcome page head will display.
 67 
          * not found then only the welcome page head will display.
63 
         this._additionalContentTemplate = document.getElementById(
 72 
         this._additionalContentTemplate = document.getElementById(
64 
             'welcome-page-additional-content-template');
 73 
             'welcome-page-additional-content-template');
65
74
75 
+        /**
76 
+         * The template to use as the additional content for the welcome page header toolbar.
77 
+         * If not found then only the settings icon will be displayed.
78 
+         *
79 
+         * @private
80 
+         * @type {HTMLTemplateElement|null}
81 
+         */
82 
+        this._additionalToolbarContentTemplate = document.getElementById(
83 
+            'settings-toolbar-additional-content-template'
84 
+        );
85 
+
66 
         // Bind event handlers so they are only bound once per instance.
 86 
         // Bind event handlers so they are only bound once per instance.
67 
         this._onFormSubmit = this._onFormSubmit.bind(this);
 87 
         this._onFormSubmit = this._onFormSubmit.bind(this);
68 
         this._onRoomChange = this._onRoomChange.bind(this);
 88 
         this._onRoomChange = this._onRoomChange.bind(this);
69 
         this._setAdditionalContentRef
 89 
         this._setAdditionalContentRef
70 
             = this._setAdditionalContentRef.bind(this);
 90 
             = this._setAdditionalContentRef.bind(this);
91 
+        this._setAdditionalToolbarContentRef
92 
+            = this._setAdditionalToolbarContentRef.bind(this);
71 
         this._onTabSelected = this._onTabSelected.bind(this);
 93 
         this._onTabSelected = this._onTabSelected.bind(this);
72 
     }
 94 
     }
73
95
90 
             this._additionalContentRef.appendChild(
 112 
             this._additionalContentRef.appendChild(
91 
                 this._additionalContentTemplate.content.cloneNode(true));
 113 
                 this._additionalContentTemplate.content.cloneNode(true));
92 
         }
 114 
         }
115 
+
116 
+        if (this._shouldShowAdditionalToolbarContent()) {
117 
+            this._additionalToolbarContentRef.appendChild(
118 
+                this._additionalToolbarContentTemplate.content.cloneNode(true)
119 
+            );
120 
+        }
93 
     }
 121 
     }
94
122
95 
     /**
 123 
     /**
114 
         const { t } = this.props;
 142 
         const { t } = this.props;
115 
         const { APP_NAME } = interfaceConfig;
 143 
         const { APP_NAME } = interfaceConfig;
116 
         const showAdditionalContent = this._shouldShowAdditionalContent();
 144 
         const showAdditionalContent = this._shouldShowAdditionalContent();
145 
+        const showAdditionalToolbarContent = this._shouldShowAdditionalToolbarContent();
117
146
118 
         return (
 147 
         return (
119 
             <div
 148 
             <div
127 
                     <div className = 'welcome-page-settings'>
 156 
                     <div className = 'welcome-page-settings'>
128 
                         <SettingsButton
 157 
                         <SettingsButton
129 
                             defaultTab = { SETTINGS_TABS.CALENDAR } />
 158 
                             defaultTab = { SETTINGS_TABS.CALENDAR } />
159 
+                        { showAdditionalToolbarContent
160 
+                            ? <div
161 
+                                className = 'settings-toolbar-content'
162 
+                                ref = { this._setAdditionalToolbarContentRef } />
163 
+                            : null
164 
+                        }
130 
                     </div>
 165 
                     </div>
131 
                     <div className = 'header-image' />
 166 
                     <div className = 'header-image' />
132 
                     <div className = 'header-text'>
 167 
                     <div className = 'header-text'>
263 
         this._additionalContentRef = el;
 298 
         this._additionalContentRef = el;
264 
     }
 299 
     }
265
300
301 
+    /**
302 
+     * Sets the internal reference to the HTMLDivElement used to hold the
303 
+     * toolbar additional content.
304 
+     *
305 
+     * @param {HTMLDivElement} el - The HTMLElement for the div that is the root
306 
+     * of the additional toolbar content.
307 
+     * @private
308 
+     * @returns {void}
309 
+     */
310 
+    _setAdditionalToolbarContentRef(el) {
311 
+        this._additionalToolbarContentRef = el;
312 
+    }
313 
+
266 
     /**
 314 
     /**
267 
      * Returns whether or not additional content should be displayed below
 315 
      * Returns whether or not additional content should be displayed below
268 
      * the welcome page's header for entering a room name.
 316 
      * the welcome page's header for entering a room name.
276 
             && this._additionalContentTemplate.content
 324 
             && this._additionalContentTemplate.content
277 
             && this._additionalContentTemplate.innerHTML.trim();
 325 
             && this._additionalContentTemplate.innerHTML.trim();
278 
     }
 326 
     }
327 
+
328 
+    /**
329 
+     * Returns whether or not additional content should be displayed inside
330 
+     * the header toolbar.
331 
+     *
332 
+     * @private
333 
+     * @returns {boolean}
334 
+     */
335 
+    _shouldShowAdditionalToolbarContent() {
336 
+        return interfaceConfig.DISPLAY_WELCOME_PAGE_TOOLBAR_CONTENT
337 
+            && this._additionalToolbarContentTemplate
338 
+            && this._additionalToolbarContentTemplate.content
339 
+            && this._additionalToolbarContentTemplate.innerHTML.trim();
340 
+    }
279 
 }
 341 
 }
280
342
281 
 export default translate(connect(_mapStateToProps)(WelcomePage));
 343 
 export default translate(connect(_mapStateToProps)(WelcomePage));

+ 1
- 0
static/settingsToolbarAdditionalContent.html 查看文件

1 
+<template id="settings-toolbar-additional-content-template"></template>

Write Preview
Loading…
取消
儲存