Improve dragging experience
The entire page is draggable, except: - buttons - any input type - the filmstrip - the chat panel
This commit is contained in:
parent
79db9fab88
commit
1d3cfbb569
|
@ -213,7 +213,6 @@ class Conference extends Component<Props, State> {
|
|||
setupWiFiStats(iframe);
|
||||
|
||||
this._api.on('readyToClose', () => this._navigateToHome());
|
||||
|
||||
this._api.on('videoConferenceJoined',
|
||||
(conferenceInfo: Object) =>
|
||||
this._onVideoConferenceJoined(conferenceInfo));
|
||||
|
@ -266,6 +265,7 @@ class Conference extends Component<Props, State> {
|
|||
* @returns {void}
|
||||
*/
|
||||
_onVideoConferenceJoined(conferenceInfo: Object) {
|
||||
setupDragAreas(this._api.getIFrame());
|
||||
|
||||
this._setAvatarURL(this.props._avatarURL);
|
||||
this._setEmail(this.props._email);
|
||||
|
@ -311,6 +311,25 @@ class Conference extends Component<Props, State> {
|
|||
|
||||
}
|
||||
|
||||
/**
|
||||
* Inject some style into the iframe so everything except the filmstrip, chat,
|
||||
* buttons or any input is draggable.
|
||||
*
|
||||
* @param {Object} iframe - reference to the iframe where the drag areas will
|
||||
* be set.
|
||||
* @returns {void}
|
||||
*/
|
||||
function setupDragAreas(iframe) {
|
||||
const injectStyle = document.createElement('style');
|
||||
|
||||
injectStyle.type = 'text/css';
|
||||
injectStyle.textContent
|
||||
= 'body { -webkit-app-region: drag; }'
|
||||
+ 'button, input { -webkit-app-region: no-drag }'
|
||||
+ '#chatconversation, .filmstrip { -webkit-app-region: no-drag; }';
|
||||
iframe.contentDocument.head.appendChild(injectStyle);
|
||||
}
|
||||
|
||||
/**
|
||||
* Maps (parts of) the redux state to the React props.
|
||||
*
|
||||
|
|
|
@ -8,6 +8,9 @@
|
|||
body {
|
||||
-webkit-app-region: drag
|
||||
}
|
||||
button, input {
|
||||
-webkit-app-region: no-drag
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
Loading…
Reference in New Issue