From 66e93c8a8cad6bde32e42d7b3b3a3eb3ce13ff14 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Wed, 1 Mar 2017 10:04:48 +0000 Subject: [PATCH 01/15] Fix for vector-im/riot-web#3298 - height:100% for welcome pages on Safari --- .../vector/css/matrix-react-sdk/structures/_MatrixChat.scss | 5 +++++ src/skins/vector/css/vector-web/structures/_HomePage.scss | 2 ++ 2 files changed, 7 insertions(+) diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss index 05a39ea7..473f292f 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss @@ -100,6 +100,11 @@ limitations under the License. * flex itself. */ display: flex; + + /* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari + needed height 100% all the way down to the HomePage. + */ + height: 100%; } .mx_MatrixChat .mx_RightPanel { diff --git a/src/skins/vector/css/vector-web/structures/_HomePage.scss b/src/skins/vector/css/vector-web/structures/_HomePage.scss index 11040c4b..e2af399d 100644 --- a/src/skins/vector/css/vector-web/structures/_HomePage.scss +++ b/src/skins/vector/css/vector-web/structures/_HomePage.scss @@ -18,6 +18,8 @@ limitations under the License. .mx_HomePage { max-width: 960px; width: 100%; + height: 100%; + overflow-y: hidden; margin-left: auto; margin-right: auto; } From a7db42d18474f9289b2c2a7695b9ecd4ec270b1f Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Tue, 7 Mar 2017 09:21:50 +0000 Subject: [PATCH 02/15] CSS for redacted EventTiles --- .../css/matrix-react-sdk/views/rooms/_EventTile.scss | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss index 52c88cab..f241d2c5 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss @@ -130,6 +130,16 @@ limitations under the License. color: $event-notsent-color; } +.mx_EventTile_redacted { + padding-top: 0px; +} + +.mx_EventTile_redacted .mx_EventTile_line, +.mx_EventTile_redacted:hover .mx_EventTile_line, +.mx_EventTile_redacted.menu .mx_EventTile_line { + background-color: $primary-fg-color; +} + .mx_EventTile_highlight, .mx_EventTile_highlight .markdown-body { From 9d96baa613bff80c34d0400be0f607cccfe31232 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Tue, 7 Mar 2017 10:22:45 +0000 Subject: [PATCH 03/15] Alter comments on height: auto Having tested Riot with the middlePanel having a height of 100%, it seems to be OK. --- .../css/matrix-react-sdk/structures/_MatrixChat.scss | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss index 473f292f..10528b36 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss @@ -90,19 +90,11 @@ limitations under the License. */ overflow-x: auto; - /* XXX: Hack: apparently if you try to nest a flex-box - * within a non-flex-box within a flex-box, the height - * of the innermost element gets miscalculated if the - * parents are both auto. Height has to be auto here - * for RoomView to correctly fit when the Toolbar is shown. - * Ideally we'd launch straight into the RoomView at this - * point, but instead we fudge it and make the middlePanel - * flex itself. - */ display: flex; /* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari - needed height 100% all the way down to the HomePage. + needed height 100% all the way down to the HomePage. Height does not + have to be auto, empirically. */ height: 100%; } From eddf33a68952f71148786038ef0e001deda3c57c Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Wed, 8 Mar 2017 14:57:13 +0000 Subject: [PATCH 04/15] Refactor screen set after login --- src/vector/index.js | 47 +++++++++++++++++++++------------------------ 1 file changed, 22 insertions(+), 25 deletions(-) diff --git a/src/vector/index.js b/src/vector/index.js index 05346888..892d9086 100644 --- a/src/vector/index.js +++ b/src/vector/index.js @@ -101,15 +101,24 @@ var validBrowser = checkBrowserFeatures([ "objectfit" ]); +// Parse the given window.location and return parameters that can be used when calling +// MatrixChat.showScreen(screen, params) +function getScreenFromLocation(location) { + const fragparts = parseQsFromFragment(location); + return { + screen: fragparts.location.substring(1), + params: fragparts.params, + } +} + // Here, we do some crude URL analysis to allow // deep-linking. function routeUrl(location) { if (!window.matrixChat) return; - console.log("Routing URL "+location); - var fragparts = parseQsFromFragment(location); - window.matrixChat.showScreen(fragparts.location.substring(1), - fragparts.params); + console.log("Routing URL ", location.href); + const s = getScreenFromLocation(location); + window.matrixChat.showScreen(s.screen, s.params); } function onHashChange(ev) { @@ -120,22 +129,13 @@ function onHashChange(ev) { routeUrl(window.location); } -var loaded = false; -var lastLoadedScreen = null; - // This will be called whenever the SDK changes screens, // so a web page can update the URL bar appropriately. var onNewScreen = function(screen) { console.log("newscreen "+screen); - // just remember the most recent screen while we are loading, so that the - // user doesn't see the URL bar doing a dance - if (!loaded) { - lastLoadedScreen = screen; - } else { - var hash = '#/' + screen; - lastLocationHashSet = hash; - window.location.hash = hash; - } + var hash = '#/' + screen; + lastLocationHashSet = hash; + window.location.hash = hash; } // We use this to work out what URL the SDK should @@ -255,6 +255,11 @@ async function loadApp() { var MatrixChat = sdk.getComponent('structures.MatrixChat'); + // Clone the current location before MatrixChat gets a chance to change it. This + // can be used to go to the correct screen after login + const entryLocation = {}; + Object.keys(window.location).forEach((k) => {entryLocation[k] = window.location[k]}); + window.matrixChat = ReactDOM.render( , document.getElementById('matrixchat') ); - - routeUrl(window.location); - - // we didn't propagate screen changes to the URL bar while we were loading; do it now. - loaded = true; - if (lastLoadedScreen) { - onNewScreen(lastLoadedScreen); - lastLoadedScreen = null; - } } else { console.error("Browser is missing required features."); From cbc31a6c418c4b87878b74f915e5fdefec9f8ed7 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Thu, 9 Mar 2017 10:03:23 +0000 Subject: [PATCH 05/15] Remove redundant thing --- src/vector/index.js | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/vector/index.js b/src/vector/index.js index 892d9086..6fb6506d 100644 --- a/src/vector/index.js +++ b/src/vector/index.js @@ -254,12 +254,6 @@ async function loadApp() { UpdateChecker.start(); var MatrixChat = sdk.getComponent('structures.MatrixChat'); - - // Clone the current location before MatrixChat gets a chance to change it. This - // can be used to go to the correct screen after login - const entryLocation = {}; - Object.keys(window.location).forEach((k) => {entryLocation[k] = window.location[k]}); - window.matrixChat = ReactDOM.render( Date: Thu, 9 Mar 2017 10:04:15 +0000 Subject: [PATCH 06/15] const --- src/vector/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/vector/index.js b/src/vector/index.js index 6fb6506d..e4471be7 100644 --- a/src/vector/index.js +++ b/src/vector/index.js @@ -253,7 +253,7 @@ async function loadApp() { } else if (validBrowser) { UpdateChecker.start(); - var MatrixChat = sdk.getComponent('structures.MatrixChat'); + const MatrixChat = sdk.getComponent('structures.MatrixChat'); window.matrixChat = ReactDOM.render( Date: Thu, 9 Mar 2017 10:58:58 +0000 Subject: [PATCH 07/15] Support for phone number registration / signin (#3381) * WIP msisdn signin (css) * Changed how highlights are done to support keyboard based navigation * Support for new InteractiveAuth registration * CSS for msisdn auth entry component * CSS tweaks for msisdn login * Fix tests --- src/skins/vector/css/_components.scss | 2 + .../structures/login/_Login.scss | 17 ++++ .../views/elements/_Dropdown.scss | 93 +++++++++++++++++++ .../_InteractiveAuthEntryComponents.scss | 42 +++++++++ test/app-tests/loading.js | 6 +- 5 files changed, 158 insertions(+), 2 deletions(-) create mode 100644 src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss create mode 100644 src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss index 6a1fefb0..63109377 100644 --- a/src/skins/vector/css/_components.scss +++ b/src/skins/vector/css/_components.scss @@ -21,9 +21,11 @@ @import "./matrix-react-sdk/views/elements/_AddressSelector.scss"; @import "./matrix-react-sdk/views/elements/_AddressTile.scss"; @import "./matrix-react-sdk/views/elements/_DirectorySearchBox.scss"; +@import "./matrix-react-sdk/views/elements/_Dropdown.scss"; @import "./matrix-react-sdk/views/elements/_MemberEventListSummary.scss"; @import "./matrix-react-sdk/views/elements/_ProgressBar.scss"; @import "./matrix-react-sdk/views/elements/_RichText.scss"; +@import "./matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss"; @import "./matrix-react-sdk/views/login/_ServerConfig.scss"; @import "./matrix-react-sdk/views/messages/_MImageBody.scss"; @import "./matrix-react-sdk/views/messages/_MNoticeBody.scss"; diff --git a/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss b/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss index a359627a..f21bb169 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss @@ -66,6 +66,10 @@ limitations under the License. margin-bottom: 14px; } +.mx_Login_username { + margin-bottom: 0px; +} + .mx_Login_fieldLabel { margin-top: -10px; margin-left: 8px; @@ -163,3 +167,16 @@ limitations under the License. margin-bottom: 12px; } +.mx_Login_phoneSection { + display: table; +} + +.mx_Login_phoneCountry { + display: table-cell; + width: 70px; +} + +.mx_Login_phoneNumberField { + width: 210px; + margin-left: 3px; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss b/src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss new file mode 100644 index 00000000..b96290bd --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss @@ -0,0 +1,93 @@ +/* +Copyright 2017 OpenMarket Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +.mx_Dropdown { + position: relative; +} + +.mx_Dropdown_input { + position: relative; + border-radius: 3px; + border: 1px solid $strong-input-border-color; + font-weight: 300; + font-size: 13px; + user-select: none; +} + +.mx_Dropdown_arrow { + border-color: $primary-fg-color transparent transparent; + border-style: solid; + border-width: 5px 5px 0; + display: block; + height: 0; + position: absolute; + right: 10px; + top: 14px; + width: 0 +} + +.mx_Dropdown_option { + height: 35px; + line-height: 35px; + padding-left: 8px; + padding-right: 8px; +} + +.mx_Dropdown_option img { + margin: 5px; + width: 25px; + vertical-align: middle; +} + +input.mx_Dropdown_option, input.mx_Dropdown_option:focus { + border: 0; + padding-top: 0; + padding-bottom: 0; + // XXX: hack to prevent text box being too big and pushing + // its parent out / overlapping the dropdown arrow. Only really + // works in the Country dropdown. + width: 60%; +} + +.mx_Dropdown_menu { + position: absolute; + left: -1px; + right: -1px; + top: 100%; + z-index: 2; + margin: 0; + padding: 0px; + border-radius: 3px; + border: 1px solid $accent-color; + background-color: $primary-bg-color; + max-height: 200px; + overflow-y: scroll; +} + +.mx_Dropdown_menu .mx_Dropdown_option_highlight { + background-color: $focus-bg-color; +} + +.mx_Dropdown_menu { + font-weight: bold; +} + +.mx_Dropdown_searchPrompt { + font-weight: normal; + margin-left: 5px; + margin-bottom: 5px; +} + diff --git a/src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss b/src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss new file mode 100644 index 00000000..183b5cd2 --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss @@ -0,0 +1,42 @@ +/* +Copyright 2017 Vector Creations Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +.mx_InteractiveAuthEntryComponents_msisdnWrapper { + text-align: center; +} + +.mx_InteractiveAuthEntryComponents_msisdnEntry { + font-size: 200%; + font-weight: bold; + border: 1px solid $strong-input-border-color; + border-radius: 3px; + width: 6em; +} + +.mx_InteractiveAuthEntryComponents_msisdnEntry:focus { + border: 1px solid $accent-color; +} + +.mx_InteractiveAuthEntryComponents_msisdnSubmit { + margin-top: 4px; + margin-bottom: 5px; +} + +// XXX: This should be a common button class +.mx_InteractiveAuthEntryComponents_msisdnSubmit:disabled { + background-color: $light-fg-color; + cursor: default; +} diff --git a/test/app-tests/loading.js b/test/app-tests/loading.js index d2cb78d0..ef555830 100644 --- a/test/app-tests/loading.js +++ b/test/app-tests/loading.js @@ -188,15 +188,17 @@ describe('loading:', function () { let login = ReactTestUtils.findRenderedComponentWithType( matrixChat, sdk.getComponent('structures.login.Login')); httpBackend.when('POST', '/login').check(function(req) { + console.log(req); expect(req.data.type).toEqual('m.login.password'); - expect(req.data.user).toEqual('user'); + expect(req.data.identifier.type).toEqual('m.id.user'); + expect(req.data.identifier.user).toEqual('user'); expect(req.data.password).toEqual('pass'); }).respond(200, { user_id: '@user:id', device_id: 'DEVICE_ID', access_token: 'access_token', }); - login.onPasswordLogin("user", "pass") + login.onPasswordLogin("user", undefined, undefined, "pass") return httpBackend.flush(); }).then(() => { // Wait for another trip around the event loop for the UI to update From 927d305ed98ce5153aef9f38e9a3efdbbba07813 Mon Sep 17 00:00:00 2001 From: Tom Lant Date: Thu, 9 Mar 2017 12:00:54 +0000 Subject: [PATCH 08/15] Fixing triage markdown as per #3382 --- README.md | 33 ++++++++++++++++++++------------- 1 file changed, 20 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index 61499d39..f3a200a8 100644 --- a/README.md +++ b/README.md @@ -267,21 +267,28 @@ Triaging issues Issues will be triaged by the core team using the following primary set of tags: priority: - P1: top priority; typically blocks releases. - P2: one below that - P3: non-urgent - P4/P5: bluesky some day, who knows. + +* P1: top priority; typically blocks releases +* P2: still need to fix, but lower than P1 +* P3: non-urgent +* P4: intereseting idea - bluesky some day +* P5: recorded for posterity/to avoid duplicates. No intention to resolves right now. bug or feature: - bug severity: - * cosmetic - feature works functionally but UI/UX is broken. - * critical - whole app doesn't work - * major - entire feature doesn't work - * minor - partially broken feature (but still usable) - * release blocker +* bug +* feature - * ui/ux (think of this as cosmetic) +bug severity: + +* cosmetic - feature works functionally but UI/UX is broken +* critical - whole app doesn't work +* major - entire feature doesn't work +* minor - partially broken feature (but still usable) - * network (specific to network conditions) - * platform (platform specific) +additional categories: + +* release blocker +* ui/ux (think of this as cosmetic) +* network (specific to network conditions) +* platform (platform specific) From e5b3ec83b33822debad0ee0ea100b74b27426e38 Mon Sep 17 00:00:00 2001 From: Richard van der Hoff Date: Thu, 9 Mar 2017 20:41:11 +0000 Subject: [PATCH 09/15] Revert "Support for phone number registration / signin (#3381)" This reverts commit 271fedd1e9779f74fda812e1fb8adb74907b0c89. This breaks against the current synapse release. We need to think more carefully about backwards compatibility. --- src/skins/vector/css/_components.scss | 2 - .../structures/login/_Login.scss | 17 ---- .../views/elements/_Dropdown.scss | 93 ------------------- .../_InteractiveAuthEntryComponents.scss | 42 --------- test/app-tests/loading.js | 6 +- 5 files changed, 2 insertions(+), 158 deletions(-) delete mode 100644 src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss delete mode 100644 src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss index 63109377..6a1fefb0 100644 --- a/src/skins/vector/css/_components.scss +++ b/src/skins/vector/css/_components.scss @@ -21,11 +21,9 @@ @import "./matrix-react-sdk/views/elements/_AddressSelector.scss"; @import "./matrix-react-sdk/views/elements/_AddressTile.scss"; @import "./matrix-react-sdk/views/elements/_DirectorySearchBox.scss"; -@import "./matrix-react-sdk/views/elements/_Dropdown.scss"; @import "./matrix-react-sdk/views/elements/_MemberEventListSummary.scss"; @import "./matrix-react-sdk/views/elements/_ProgressBar.scss"; @import "./matrix-react-sdk/views/elements/_RichText.scss"; -@import "./matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss"; @import "./matrix-react-sdk/views/login/_ServerConfig.scss"; @import "./matrix-react-sdk/views/messages/_MImageBody.scss"; @import "./matrix-react-sdk/views/messages/_MNoticeBody.scss"; diff --git a/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss b/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss index f21bb169..a359627a 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss @@ -66,10 +66,6 @@ limitations under the License. margin-bottom: 14px; } -.mx_Login_username { - margin-bottom: 0px; -} - .mx_Login_fieldLabel { margin-top: -10px; margin-left: 8px; @@ -167,16 +163,3 @@ limitations under the License. margin-bottom: 12px; } -.mx_Login_phoneSection { - display: table; -} - -.mx_Login_phoneCountry { - display: table-cell; - width: 70px; -} - -.mx_Login_phoneNumberField { - width: 210px; - margin-left: 3px; -} diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss b/src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss deleted file mode 100644 index b96290bd..00000000 --- a/src/skins/vector/css/matrix-react-sdk/views/elements/_Dropdown.scss +++ /dev/null @@ -1,93 +0,0 @@ -/* -Copyright 2017 OpenMarket Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.mx_Dropdown { - position: relative; -} - -.mx_Dropdown_input { - position: relative; - border-radius: 3px; - border: 1px solid $strong-input-border-color; - font-weight: 300; - font-size: 13px; - user-select: none; -} - -.mx_Dropdown_arrow { - border-color: $primary-fg-color transparent transparent; - border-style: solid; - border-width: 5px 5px 0; - display: block; - height: 0; - position: absolute; - right: 10px; - top: 14px; - width: 0 -} - -.mx_Dropdown_option { - height: 35px; - line-height: 35px; - padding-left: 8px; - padding-right: 8px; -} - -.mx_Dropdown_option img { - margin: 5px; - width: 25px; - vertical-align: middle; -} - -input.mx_Dropdown_option, input.mx_Dropdown_option:focus { - border: 0; - padding-top: 0; - padding-bottom: 0; - // XXX: hack to prevent text box being too big and pushing - // its parent out / overlapping the dropdown arrow. Only really - // works in the Country dropdown. - width: 60%; -} - -.mx_Dropdown_menu { - position: absolute; - left: -1px; - right: -1px; - top: 100%; - z-index: 2; - margin: 0; - padding: 0px; - border-radius: 3px; - border: 1px solid $accent-color; - background-color: $primary-bg-color; - max-height: 200px; - overflow-y: scroll; -} - -.mx_Dropdown_menu .mx_Dropdown_option_highlight { - background-color: $focus-bg-color; -} - -.mx_Dropdown_menu { - font-weight: bold; -} - -.mx_Dropdown_searchPrompt { - font-weight: normal; - margin-left: 5px; - margin-bottom: 5px; -} - diff --git a/src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss b/src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss deleted file mode 100644 index 183b5cd2..00000000 --- a/src/skins/vector/css/matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss +++ /dev/null @@ -1,42 +0,0 @@ -/* -Copyright 2017 Vector Creations Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.mx_InteractiveAuthEntryComponents_msisdnWrapper { - text-align: center; -} - -.mx_InteractiveAuthEntryComponents_msisdnEntry { - font-size: 200%; - font-weight: bold; - border: 1px solid $strong-input-border-color; - border-radius: 3px; - width: 6em; -} - -.mx_InteractiveAuthEntryComponents_msisdnEntry:focus { - border: 1px solid $accent-color; -} - -.mx_InteractiveAuthEntryComponents_msisdnSubmit { - margin-top: 4px; - margin-bottom: 5px; -} - -// XXX: This should be a common button class -.mx_InteractiveAuthEntryComponents_msisdnSubmit:disabled { - background-color: $light-fg-color; - cursor: default; -} diff --git a/test/app-tests/loading.js b/test/app-tests/loading.js index ef555830..d2cb78d0 100644 --- a/test/app-tests/loading.js +++ b/test/app-tests/loading.js @@ -188,17 +188,15 @@ describe('loading:', function () { let login = ReactTestUtils.findRenderedComponentWithType( matrixChat, sdk.getComponent('structures.login.Login')); httpBackend.when('POST', '/login').check(function(req) { - console.log(req); expect(req.data.type).toEqual('m.login.password'); - expect(req.data.identifier.type).toEqual('m.id.user'); - expect(req.data.identifier.user).toEqual('user'); + expect(req.data.user).toEqual('user'); expect(req.data.password).toEqual('pass'); }).respond(200, { user_id: '@user:id', device_id: 'DEVICE_ID', access_token: 'access_token', }); - login.onPasswordLogin("user", undefined, undefined, "pass") + login.onPasswordLogin("user", "pass") return httpBackend.flush(); }).then(() => { // Wait for another trip around the event loop for the UI to update From 611bb3a857c111976fbdac52259b7e6d216b0071 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Sun, 12 Mar 2017 20:04:02 +0000 Subject: [PATCH 10/15] beautiful error on roomdirectory fail --- src/components/structures/RoomDirectory.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index 5fb0324c..a6436885 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -162,7 +162,7 @@ module.exports = React.createClass({ var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); Modal.createDialog(ErrorDialog, { title: "Failed to get public room list", - description: err.message + description: "The server may be unavailable or overloaded", }); }); }, From 4ad825e4fed2522edaf299d7029e8490728fb84a Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Sun, 12 Mar 2017 20:04:07 +0000 Subject: [PATCH 11/15] fix up cancelbutton CSS --- src/skins/vector/css/_common.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/skins/vector/css/_common.scss b/src/skins/vector/css/_common.scss index 25c94238..1f5abcd2 100644 --- a/src/skins/vector/css/_common.scss +++ b/src/skins/vector/css/_common.scss @@ -187,9 +187,9 @@ textarea { } .mx_Dialog_cancelButton { - float: right; - margin-top: 5px; - margin-right: 5px; + position: absolute; + right: 11px; + top: 13px; cursor: pointer; } From 0a0293d8fbd4647ee37700b2fb429f6b1326e6b0 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Sun, 12 Mar 2017 20:13:53 +0000 Subject: [PATCH 12/15] fix focus on cancel button --- src/skins/vector/css/_common.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/skins/vector/css/_common.scss b/src/skins/vector/css/_common.scss index 1f5abcd2..a44a503e 100644 --- a/src/skins/vector/css/_common.scss +++ b/src/skins/vector/css/_common.scss @@ -193,6 +193,10 @@ textarea { cursor: pointer; } +.mx_Dialog_cancelButton object { + pointer-events: none; +} + .mx_Dialog_content { margin: 24px 58px 68px 0; font-size: 14px; From d639eb10498e9ee6170bf1aa6477a4561cca6e09 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Sun, 12 Mar 2017 23:26:26 +0000 Subject: [PATCH 13/15] beautify all error msgs --- src/components/structures/RoomDirectory.js | 5 +++-- src/components/structures/RoomSubList.js | 5 +++-- .../views/context_menus/RoomTagContextMenu.js | 15 +++++++++------ src/components/views/rooms/DNDRoomTile.js | 10 ++++++---- src/components/views/settings/Notifications.js | 15 +++++++++------ 5 files changed, 30 insertions(+), 20 deletions(-) diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index a6436885..e723cf1a 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -208,9 +208,10 @@ module.exports = React.createClass({ }, function(err) { modal.close(); this.refreshRoomList(); + console.error("Failed to " + step + ": " + err); Modal.createDialog(ErrorDialog, { - title: "Failed to "+step, - description: err.toString() + title: "Error", + description: "Failed to " + step, }); }); } diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 0469f52a..67c47263 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -505,9 +505,10 @@ var RoomSubList = React.createClass({ // Do any final stuff here }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to add tag " + self.props.tagName + " to room" + err); Modal.createDialog(ErrorDialog, { - title: "Failed to add tag " + self.props.tagName + " to room", - description: err.toString() + title: "Error", + description: "Failed to add tag " + self.props.tagName + " to room", }); }); break; diff --git a/src/components/views/context_menus/RoomTagContextMenu.js b/src/components/views/context_menus/RoomTagContextMenu.js index 8a44051f..19b5e6de 100644 --- a/src/components/views/context_menus/RoomTagContextMenu.js +++ b/src/components/views/context_menus/RoomTagContextMenu.js @@ -58,9 +58,10 @@ module.exports = React.createClass({ }; }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to remove tag " + tagNameOff + " from room: " + err); Modal.createDialog(ErrorDialog, { - title: "Failed to remove tag " + tagNameOff + " from room", - description: err.toString() + title: "Error", + description: "Failed to remove tag " + tagNameOff + " from room", }); }); } @@ -75,9 +76,10 @@ module.exports = React.createClass({ }; }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to add tag " + tagNameOn + " to room: " + err); Modal.createDialog(ErrorDialog, { - title: "Failed to add tag " + tagNameOn + " to room", - description: err.toString() + title: "Error", + description: "Failed to add tag " + tagNameOn + " to room", }); }); } @@ -148,9 +150,10 @@ module.exports = React.createClass({ }; }, (err) => { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to set DM status of room: " + err); Modal.createDialog(ErrorDialog, { - title: "Failed to set Direct Message status of room", - description: err.toString() + title: "Error", + description: "Failed to set Direct Message status of room", }); }); }); diff --git a/src/components/views/rooms/DNDRoomTile.js b/src/components/views/rooms/DNDRoomTile.js index 233fb8bb..6296552d 100644 --- a/src/components/views/rooms/DNDRoomTile.js +++ b/src/components/views/rooms/DNDRoomTile.js @@ -84,9 +84,10 @@ var roomTileSource = { //component.state.set({ spinner: component.state.spinner-- }); }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to remove tag " + item.originalList.props.tagName + " from room: " + err); Modal.createDialog(ErrorDialog, { - title: "Failed to remove tag " + item.originalList.props.tagName + " from room", - description: err.toString() + title: "Error", + description: "Failed to remove tag " + item.originalList.props.tagName + " from room", }); }); } @@ -103,9 +104,10 @@ var roomTileSource = { //component.state.set({ spinner: component.state.spinner-- }); }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to add tag " + item.targetList.props.tagName + " to room: " + err); Modal.createDialog(ErrorDialog, { - title: "Failed to add tag " + item.targetList.props.tagName + " to room", - description: err.toString() + title: "Error", + description: "Failed to add tag " + item.targetList.props.tagName + " to room", }); }); } diff --git a/src/components/views/settings/Notifications.js b/src/components/views/settings/Notifications.js index 506b34df..b5fc2f3d 100644 --- a/src/components/views/settings/Notifications.js +++ b/src/components/views/settings/Notifications.js @@ -238,9 +238,10 @@ module.exports = React.createClass({ self._refreshFromServer(); }, function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to change settings: " + error); Modal.createDialog(ErrorDialog, { - title: "Can't change settings", - description: error.toString(), + title: "Error", + description: "Failed to change settings", onFinished: self._refreshFromServer }); }); @@ -307,9 +308,10 @@ module.exports = React.createClass({ self._refreshFromServer(); }, function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Can't update user notification settings: " + error); Modal.createDialog(ErrorDialog, { - title: "Can't update user notification settings", - description: error.toString(), + title: "Error", + description: "Can't update user notification settings", onFinished: self._refreshFromServer }); }); @@ -348,9 +350,10 @@ module.exports = React.createClass({ var onError = function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + console.error("Failed to update keywords: " + error); Modal.createDialog(ErrorDialog, { - title: "Can't update keywords", - description: error.toString(), + title: "Error", + description: "Failed to update keywords", onFinished: self._refreshFromServer }); } From ffba088192313f58a82814d0dfc25af34a834655 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Mon, 13 Mar 2017 00:03:53 +0000 Subject: [PATCH 14/15] fix CSS for ChatCreateOrReuseDialog --- src/skins/vector/css/_components.scss | 1 + .../dialogs/_ChatCreateOrReuseChatDialog.scss | 27 +++++++++++++++++++ 2 files changed, 28 insertions(+) create mode 100644 src/skins/vector/css/matrix-react-sdk/views/dialogs/_ChatCreateOrReuseChatDialog.scss diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss index 6a1fefb0..cd2dad5b 100644 --- a/src/skins/vector/css/_components.scss +++ b/src/skins/vector/css/_components.scss @@ -13,6 +13,7 @@ @import "./matrix-react-sdk/structures/login/_Login.scss"; @import "./matrix-react-sdk/views/avatars/_BaseAvatar.scss"; @import "./matrix-react-sdk/views/dialogs/_BugReportDialog.scss"; +@import "./matrix-react-sdk/views/dialogs/_ChatCreateOrReuseChatDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_ChatInviteDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_ConfirmUserActionDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_EncryptedEventDialog.scss"; diff --git a/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ChatCreateOrReuseChatDialog.scss b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ChatCreateOrReuseChatDialog.scss new file mode 100644 index 00000000..926e7411 --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ChatCreateOrReuseChatDialog.scss @@ -0,0 +1,27 @@ +/* +Copyright 2016 OpenMarket Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +.mx_ChatCreateOrReuseDialog .mx_ChatCreateOrReuseDialog_tiles { + margin-top: 24px; +} + +.mx_ChatCreateOrReuseDialog .mx_Dialog_content { + margin-bottom: 24px; +} + +.mx_ChatCreateOrReuseDialog .mx_RoomTile_badge { + display: none; +} From df22c900160c7b002aa4294c34b23db0315c1171 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Mon, 13 Mar 2017 00:47:20 +0000 Subject: [PATCH 15/15] fix kick dialog CSS --- .../dialogs/_ConfirmUserActionDialog.scss | 27 +++++++++++++++---- 1 file changed, 22 insertions(+), 5 deletions(-) diff --git a/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ConfirmUserActionDialog.scss b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ConfirmUserActionDialog.scss index 58ea56ee..abd4e9c1 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ConfirmUserActionDialog.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_ConfirmUserActionDialog.scss @@ -14,22 +14,39 @@ See the License for the specific language governing permissions and limitations under the License. */ +.mx_ConfirmUserActionDialog .mx_Dialog_content { + min-height: 48px; + margin-bottom: 24px; +} + .mx_ConfirmUserActionDialog_avatar { float: left; margin-right: 20px; + margin-top: -2px; } .mx_ConfirmUserActionDialog_name { - font-size: 150%; + font-size: 18px; } .mx_ConfirmUserActionDialog_userId { - font-style: italic; + font-size: 13px; } .mx_ConfirmUserActionDialog_reasonField { - margin-bottom: 40px; + font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; + font-size: 14px; + color: $primary-fg-color; + + border-radius: 3px; + border: solid 1px $input-border-color; + line-height: 36px; + padding-left: 16px; + padding-right: 16px; + padding-top: 1px; + padding-bottom: 1px; + + margin-bottom: 24px; + width: 90%; - font-size: 120%; - height: 35px; }