diff --git a/bigbluebutton-html5/imports/startup/client/intl.jsx b/bigbluebutton-html5/imports/startup/client/intl.jsx index 235671f0811ed347073756a4adf2670526845bae..cb2d127b92d59fa7364d8a353235a86fb349e94c 100644 --- a/bigbluebutton-html5/imports/startup/client/intl.jsx +++ b/bigbluebutton-html5/imports/startup/client/intl.jsx @@ -6,6 +6,7 @@ import Settings from '/imports/ui/services/settings'; import LoadingScreen from '/imports/ui/components/loading-screen/component'; import getFromUserSettings from '/imports/ui/services/users-settings'; import _ from 'lodash'; +import { Session } from 'meteor/session'; const propTypes = { locale: PropTypes.string, @@ -15,6 +16,7 @@ const propTypes = { const DEFAULT_LANGUAGE = Meteor.settings.public.app.defaultSettings.application.fallbackLocale; const RTL_LANGUAGES = ['ar', 'he', 'fa']; +const LARGE_FONT_LANGUAGES = ['te', 'km']; const defaultProps = { locale: DEFAULT_LANGUAGE, @@ -30,6 +32,8 @@ class IntlStartup extends Component { document.body.parentNode.setAttribute('dir', 'ltr'); Settings.application.isRTL = false; } + Session.set('isLargeFont', LARGE_FONT_LANGUAGES.includes(localeName.substring(0, 2))); + window.dispatchEvent(new Event('localeChanged')); Settings.save(); } diff --git a/bigbluebutton-html5/imports/ui/components/app/component.jsx b/bigbluebutton-html5/imports/ui/components/app/component.jsx index 5414528214023822ce3954354a17917235117319..d8aaa0d486584dcdb388087e972720d7aad0e399 100755 --- a/bigbluebutton-html5/imports/ui/components/app/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/app/component.jsx @@ -28,7 +28,7 @@ import { withDraggableContext } from '../media/webcam-draggable-overlay/context' import { styles } from './styles'; import { makeCall } from '/imports/ui/services/api'; import ConnectionStatusService from '/imports/ui/components/connection-status/service'; -import { NAVBAR_HEIGHT } from '/imports/ui/components/layout/layout-manager/component'; +import { NAVBAR_HEIGHT, LARGE_NAVBAR_HEIGHT } from '/imports/ui/components/layout/layout-manager/component'; const MOBILE_MEDIA = 'only screen and (max-width: 40em)'; const APP_CONFIG = Meteor.settings.public.app; @@ -267,15 +267,17 @@ class App extends Component { } renderNavBar() { - const { navbar } = this.props; + const { navbar, isLargeFont } = this.props; if (!navbar) return null; + const realNavbarHeight = isLargeFont ? LARGE_NAVBAR_HEIGHT : NAVBAR_HEIGHT; + return ( <header className={styles.navbar} style={{ - height: NAVBAR_HEIGHT, + height: realNavbarHeight, }} > {navbar} diff --git a/bigbluebutton-html5/imports/ui/components/app/container.jsx b/bigbluebutton-html5/imports/ui/components/app/container.jsx index ede6446121d5b2a8df8c8eb5727c8ed6a2255aa3..204a6c26e7377ebde7ca09103c740b7ef6b28e28 100755 --- a/bigbluebutton-html5/imports/ui/components/app/container.jsx +++ b/bigbluebutton-html5/imports/ui/components/app/container.jsx @@ -124,6 +124,7 @@ export default injectIntl(withModalMounter(withTracker(({ intl, baseControls }) randomlySelectedUser, currentUserId: currentUser.userId, isPresenter: currentUser.presenter, + isLargeFont: Session.get('isLargeFont') }; })(AppContainer))); diff --git a/bigbluebutton-html5/imports/ui/components/layout/layout-manager/component.jsx b/bigbluebutton-html5/imports/ui/components/layout/layout-manager/component.jsx index 8ba2e9e276cce36257a3ea137fe9605b0d4b951c..d90d6ea385c4dcf6489d0a9e6581a695863589cd 100644 --- a/bigbluebutton-html5/imports/ui/components/layout/layout-manager/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/layout/layout-manager/component.jsx @@ -25,6 +25,7 @@ const NOTE_MAX_WIDTH = 800; const WAITING_MIN_WIDTH = 340; const WAITING_MAX_WIDTH = 800; const NAVBAR_HEIGHT = 112; +const LARGE_NAVBAR_HEIGHT = 170; const ACTIONSBAR_HEIGHT = isMobile ? 50 : 42; const BREAKOUT_MIN_WIDTH = 320; const BREAKOUT_MAX_WIDTH = 400; @@ -109,6 +110,10 @@ class LayoutManagerComponent extends Component { window.addEventListener('fullscreenchange', () => { setTimeout(() => this.setLayoutSizes(), 200); }); + + window.addEventListener('localeChanged', () => { + setTimeout(() => this.setLayoutSizes(), 200); + }); } componentDidUpdate(prevProps) { @@ -763,12 +768,15 @@ class LayoutManagerComponent extends Component { secondPanel = newBreakoutRoomSize; } - const mediaAreaHeight = windowHeight() - (NAVBAR_HEIGHT + ACTIONSBAR_HEIGHT) - 10; + const isLargeFont = Session.get('isLargeFont'); + const realNavbarHeight = isLargeFont ? LARGE_NAVBAR_HEIGHT : NAVBAR_HEIGHT; + + const mediaAreaHeight = windowHeight() - (realNavbarHeight + ACTIONSBAR_HEIGHT) - 10; const mediaAreaWidth = windowWidth() - (firstPanel.width + secondPanel.width); const newMediaBounds = { width: mediaAreaWidth, height: mediaAreaHeight, - top: NAVBAR_HEIGHT, + top: realNavbarHeight, left: firstPanel.width + secondPanel.width, }; @@ -838,6 +846,7 @@ export { WAITING_MIN_WIDTH, WAITING_MAX_WIDTH, NAVBAR_HEIGHT, + LARGE_NAVBAR_HEIGHT, ACTIONSBAR_HEIGHT, WEBCAMSAREA_MIN_PERCENT, WEBCAMSAREA_MAX_PERCENT,