From 8129333dcc35d4ea8cec32521489e1819cc52f5b Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Wed, 16 Sep 2020 22:38:12 -0600 Subject: [PATCH 1/6] Make the PIP Jitsi look and feel like the 1:1 PIP * Similar sizing * Fix pointers so the jitsi widget doesn't feel clickable when it's not * We might want to introduce click-to-visit-room for the Jitsi widget (like the 1:1 call), however the Jitsi widget has many more controls to worry about * Remove the menu bar from the widget to avoid accidents --- res/css/views/rooms/_AppsDrawer.scss | 4 ++-- res/css/views/voip/_CallContainer.scss | 14 ++++++++++++-- src/components/views/elements/PersistentApp.js | 1 + 3 files changed, 15 insertions(+), 4 deletions(-) diff --git a/res/css/views/rooms/_AppsDrawer.scss b/res/css/views/rooms/_AppsDrawer.scss index fee3d61153..b9249d310a 100644 --- a/res/css/views/rooms/_AppsDrawer.scss +++ b/res/css/views/rooms/_AppsDrawer.scss @@ -15,7 +15,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -$MiniAppTileHeight: 114px; +$MiniAppTileHeight: 200px; .mx_AppsDrawer { margin: 5px 5px 5px 18px; @@ -220,7 +220,7 @@ $MiniAppTileHeight: 114px; } .mx_AppTileBody_mini { - height: 112px; + height: $MiniAppTileHeight; width: 100%; overflow: hidden; } diff --git a/res/css/views/voip/_CallContainer.scss b/res/css/views/voip/_CallContainer.scss index 4d26d8a312..650302b7e1 100644 --- a/res/css/views/voip/_CallContainer.scss +++ b/res/css/views/voip/_CallContainer.scss @@ -23,9 +23,16 @@ limitations under the License. z-index: 100; box-shadow: 0px 14px 24px rgba(0, 0, 0, 0.08); - cursor: pointer; + // Disable pointer events for Jitsi widgets to function. Direct + // calls have their own cursor and behaviour, but we need to make + // sure the cursor hits the iframe for Jitsi which will be at a + // different level. + pointer-events: none; .mx_CallPreview { + pointer-events: initial; // restore pointer events so the user can leave/interact + cursor: pointer; + .mx_VideoView { width: 350px; } @@ -37,7 +44,7 @@ limitations under the License. } .mx_AppTile_persistedWrapper div { - min-width: 300px; + min-width: 350px; } .mx_IncomingCallBox { @@ -45,6 +52,9 @@ limitations under the License. background-color: $primary-bg-color; padding: 8px; + pointer-events: initial; // restore pointer events so the user can accept/decline + cursor: pointer; + .mx_IncomingCallBox_CallerInfo { display: flex; direction: row; diff --git a/src/components/views/elements/PersistentApp.js b/src/components/views/elements/PersistentApp.js index 686739a9f7..a3e413151a 100644 --- a/src/components/views/elements/PersistentApp.js +++ b/src/components/views/elements/PersistentApp.js @@ -82,6 +82,7 @@ export default class PersistentApp extends React.Component { showDelete={false} showMinimise={false} miniMode={true} + showMenubar={false} />; } } From 849a5e4a3976b7856e0c1efb998ed375c0a5887f Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Thu, 17 Sep 2020 14:58:48 -0600 Subject: [PATCH 2/6] Round the jitsi pip corners --- res/css/views/rooms/_AppsDrawer.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/res/css/views/rooms/_AppsDrawer.scss b/res/css/views/rooms/_AppsDrawer.scss index b9249d310a..244e88ca3e 100644 --- a/res/css/views/rooms/_AppsDrawer.scss +++ b/res/css/views/rooms/_AppsDrawer.scss @@ -223,6 +223,7 @@ $MiniAppTileHeight: 200px; height: $MiniAppTileHeight; width: 100%; overflow: hidden; + border-radius: 8px; } .mx_AppTile .mx_AppTileBody, From bc0c30f99fba1f2c5b0348f3d2454543fa0e3dc2 Mon Sep 17 00:00:00 2001 From: Daniel Maslowski Date: Tue, 29 Sep 2020 04:46:59 +0200 Subject: [PATCH 3/6] fix link to classic yarn's `yarn link` Signed-off-by: Daniel Maslowski --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index e468d272d0..4db02418ba 100644 --- a/README.md +++ b/README.md @@ -160,8 +160,8 @@ yarn link matrix-js-sdk yarn install ``` -See the [help for `yarn link`](https://yarnpkg.com/docs/cli/link) for more -details about this. +See the [help for `yarn link`](https://classic.yarnpkg.com/docs/cli/link) for +more details about this. Running tests ============= From ffa7ceb70e056d5914787c73c7906a140beeb0ff Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 29 Sep 2020 14:15:20 +0100 Subject: [PATCH 4/6] Trim range when formatting so that it excludes leading/trailing spaces Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .../views/rooms/BasicMessageComposer.tsx | 9 +++++---- src/editor/range.ts | 9 +++++++++ test/editor/range-test.js | 15 +++++++++++++++ 3 files changed, 29 insertions(+), 4 deletions(-) diff --git a/src/components/views/rooms/BasicMessageComposer.tsx b/src/components/views/rooms/BasicMessageComposer.tsx index 7c2eb83a94..d9b34b93ef 100644 --- a/src/components/views/rooms/BasicMessageComposer.tsx +++ b/src/components/views/rooms/BasicMessageComposer.tsx @@ -619,13 +619,14 @@ export default class BasicMessageEditor extends React.Component } private onFormatAction = (action: Formatting) => { - const range = getRangeForSelection( - this.editorRef.current, - this.props.model, - document.getSelection()); + const range = getRangeForSelection(this.editorRef.current, this.props.model, document.getSelection()); + // trim the range as we want it to exclude leading/trailing spaces + range.trim(); + if (range.length === 0) { return; } + this.historyManager.ensureLastChangesPushed(this.props.model); this.modifiedFlag = true; switch (action) { diff --git a/src/editor/range.ts b/src/editor/range.ts index 27f59f34a9..1d9c75e238 100644 --- a/src/editor/range.ts +++ b/src/editor/range.ts @@ -18,6 +18,10 @@ import EditorModel from "./model"; import DocumentPosition, {Predicate} from "./position"; import {Part} from "./parts"; +const whileSpacePredicate: Predicate = (index, offset, part) => { + return part.text[offset] === " "; +}; + export default class Range { private _start: DocumentPosition; private _end: DocumentPosition; @@ -35,6 +39,11 @@ export default class Range { }); } + trim() { + this._start = this._start.forwardsWhile(this.model, whileSpacePredicate); + this._end = this._end.backwardsWhile(this.model, whileSpacePredicate); + } + expandBackwardsWhile(predicate: Predicate) { this._start = this._start.backwardsWhile(this.model, predicate); } diff --git a/test/editor/range-test.js b/test/editor/range-test.js index b69ed9eb53..60055af824 100644 --- a/test/editor/range-test.js +++ b/test/editor/range-test.js @@ -88,4 +88,19 @@ describe('editor/range', function() { expect(model.parts[1].text).toBe("man"); expect(model.parts.length).toBe(2); }); + it('range trim spaces off both ends', () => { + const renderer = createRenderer(); + const pc = createPartCreator(); + const model = new EditorModel([ + pc.plain("abc abc abc"), + ], pc, renderer); + const range = model.startRange( + model.positionForOffset(3, false), // at end of first `abc` + model.positionForOffset(8, false), // at start of last `abc` + ); + + expect(range.parts[0].text).toBe(" abc "); + range.trim(); + expect(range.parts[0].text).toBe("abc"); + }); }); From af4c95e267809efefa268d031dd193f4f2282a3e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 29 Sep 2020 14:17:44 +0100 Subject: [PATCH 5/6] apply to whitespace in general Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/editor/range.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/editor/range.ts b/src/editor/range.ts index 1d9c75e238..838dfd8b98 100644 --- a/src/editor/range.ts +++ b/src/editor/range.ts @@ -18,8 +18,8 @@ import EditorModel from "./model"; import DocumentPosition, {Predicate} from "./position"; import {Part} from "./parts"; -const whileSpacePredicate: Predicate = (index, offset, part) => { - return part.text[offset] === " "; +const whitespacePredicate: Predicate = (index, offset, part) => { + return part.text[offset].trim() === ""; }; export default class Range { @@ -40,8 +40,8 @@ export default class Range { } trim() { - this._start = this._start.forwardsWhile(this.model, whileSpacePredicate); - this._end = this._end.backwardsWhile(this.model, whileSpacePredicate); + this._start = this._start.forwardsWhile(this.model, whitespacePredicate); + this._end = this._end.backwardsWhile(this.model, whitespacePredicate); } expandBackwardsWhile(predicate: Predicate) { From 76a9803c6cf4212055c786ba870262f0a59bbafa Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 29 Sep 2020 14:24:01 +0100 Subject: [PATCH 6/6] Fix button label on the Set Password Dialog Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/dialogs/SetPasswordDialog.js | 4 +++- src/components/views/settings/ChangePassword.js | 3 ++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/components/views/dialogs/SetPasswordDialog.js b/src/components/views/dialogs/SetPasswordDialog.js index 3649190ac9..f2d5a96b4c 100644 --- a/src/components/views/dialogs/SetPasswordDialog.js +++ b/src/components/views/dialogs/SetPasswordDialog.js @@ -117,7 +117,9 @@ export default class SetPasswordDialog extends React.Component { autoFocusNewPasswordInput={true} shouldAskForEmail={true} onError={this._onPasswordChangeError} - onFinished={this._onPasswordChanged} /> + onFinished={this._onPasswordChanged} + buttonLabel={_t("Set Password")} + />
{ this.state.error }
diff --git a/src/components/views/settings/ChangePassword.js b/src/components/views/settings/ChangePassword.js index 0b62f1fa81..8ae000f087 100644 --- a/src/components/views/settings/ChangePassword.js +++ b/src/components/views/settings/ChangePassword.js @@ -35,6 +35,7 @@ export default class ChangePassword extends React.Component { rowClassName: PropTypes.string, buttonClassName: PropTypes.string, buttonKind: PropTypes.string, + buttonLabel: PropTypes.string, confirm: PropTypes.bool, // Whether to autoFocus the new password input autoFocusNewPasswordInput: PropTypes.bool, @@ -271,7 +272,7 @@ export default class ChangePassword extends React.Component { /> - { _t('Change Password') } + { this.props.buttonLabel || _t('Change Password') } );