From aea2b1ebc97c546edbb77d5b3d38532b86c1fc4b Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 11 Feb 2019 15:51:16 +0000 Subject: [PATCH 1/4] Convert VectorAuthPage to modern code style --- src/components/views/auth/VectorAuthPage.js | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/src/components/views/auth/VectorAuthPage.js b/src/components/views/auth/VectorAuthPage.js index e277cb18..0fc42f0a 100644 --- a/src/components/views/auth/VectorAuthPage.js +++ b/src/components/views/auth/VectorAuthPage.js @@ -16,17 +16,13 @@ limitations under the License. 'use strict'; -const React = require('react'); +import React from 'react'; import sdk from 'matrix-react-sdk/lib/index'; -module.exports = React.createClass({ - displayName: 'VectorAuthPage', +export default class VectorAuthPage extends React.PureComponent { + static replaces = 'AuthPage' - statics: { - replaces: 'AuthPage', - }, - - render: function() { + render() { const AuthFooter = sdk.getComponent('auth.AuthFooter'); const pageStyle = { @@ -66,5 +62,5 @@ module.exports = React.createClass({ ); - }, -}); + } +} From 86ced4cdad8006a6dfee89ffe5c82fb9698d42a2 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 11 Feb 2019 16:07:39 +0000 Subject: [PATCH 2/4] Allow configuring welcome background image --- README.md | 3 +++ src/components/views/auth/VectorAuthPage.js | 9 ++++++++- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index d4932874..a7621aa6 100644 --- a/README.md +++ b/README.md @@ -127,6 +127,9 @@ For a good example, see https://riot.im/develop/config.json release to release. 1. `brand`: String to pass to your homeserver when configuring email notifications, to let the homeserver know what email template to use when talking to you. +1. `branding`: Configures various branding and logo details, such as: + 1. `welcomeBackgroundUrl`: An image to use as a wallpaper outside the app + during authentication flows 1. `integrations_ui_url`: URL to the web interface for the integrations server. The integrations server is not Riot and normally not your homeserver either. The integration server settings may be left blank to disable integrations. diff --git a/src/components/views/auth/VectorAuthPage.js b/src/components/views/auth/VectorAuthPage.js index 0fc42f0a..bae685b9 100644 --- a/src/components/views/auth/VectorAuthPage.js +++ b/src/components/views/auth/VectorAuthPage.js @@ -18,6 +18,7 @@ limitations under the License. import React from 'react'; import sdk from 'matrix-react-sdk/lib/index'; +import SdkConfig from 'matrix-react-sdk/lib/SdkConfig'; export default class VectorAuthPage extends React.PureComponent { static replaces = 'AuthPage' @@ -25,8 +26,14 @@ export default class VectorAuthPage extends React.PureComponent { render() { const AuthFooter = sdk.getComponent('auth.AuthFooter'); + const brandingConfig = SdkConfig.get().branding; + let backgroundUrl = "themes/riot/img/backgrounds/valley.jpg"; + if (brandingConfig && brandingConfig.welcomeBackgroundUrl) { + backgroundUrl = brandingConfig.welcomeBackgroundUrl; + } + const pageStyle = { - background: 'center/cover fixed url(themes/riot/img/backgrounds/valley.jpg)', + background: `center/cover fixed url(${backgroundUrl})`, }; const modalStyle = { From 18d898cc1fe5852a8d325c3829722ba3e88ce81f Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 11 Feb 2019 16:14:34 +0000 Subject: [PATCH 3/4] Convert VectorAuthHeaderLogo to modern code style --- .../views/auth/VectorAuthHeaderLogo.js | 20 +++++++++---------- 1 file changed, 9 insertions(+), 11 deletions(-) diff --git a/src/components/views/auth/VectorAuthHeaderLogo.js b/src/components/views/auth/VectorAuthHeaderLogo.js index 7a40f445..38d10044 100644 --- a/src/components/views/auth/VectorAuthHeaderLogo.js +++ b/src/components/views/auth/VectorAuthHeaderLogo.js @@ -22,20 +22,18 @@ import PropTypes from 'prop-types'; const LOGO_URI = "themes/riot/img/logos/riot-im-logo-black-text.svg"; -module.exports = React.createClass({ - displayName: 'VectorAuthHeaderLogo', - statics: { - replaces: 'AuthHeaderLogo', - }, - propTypes: { - icon: PropTypes.string, - }, +export default class VectorAuthHeaderLogo extends React.PureComponent { + static replaces = 'AuthHeaderLogo' - render: function() { + static propTypes = { + icon: PropTypes.string, + } + + render() { return (
Riot
); - }, -}); + } +} From 678904dcfbdaec12913ee8ab31ebd2cfe962163f Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 11 Feb 2019 16:23:22 +0000 Subject: [PATCH 4/4] Allow configuring auth header logo --- README.md | 2 ++ src/components/views/auth/VectorAuthHeaderLogo.js | 11 ++++++++--- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index a7621aa6..b6451f82 100644 --- a/README.md +++ b/README.md @@ -130,6 +130,8 @@ For a good example, see https://riot.im/develop/config.json 1. `branding`: Configures various branding and logo details, such as: 1. `welcomeBackgroundUrl`: An image to use as a wallpaper outside the app during authentication flows + 1. `authHeaderLogoUrl`: An logo image that is shown in the header during + authentication flows 1. `integrations_ui_url`: URL to the web interface for the integrations server. The integrations server is not Riot and normally not your homeserver either. The integration server settings may be left blank to disable integrations. diff --git a/src/components/views/auth/VectorAuthHeaderLogo.js b/src/components/views/auth/VectorAuthHeaderLogo.js index 38d10044..0161fc3f 100644 --- a/src/components/views/auth/VectorAuthHeaderLogo.js +++ b/src/components/views/auth/VectorAuthHeaderLogo.js @@ -19,8 +19,7 @@ limitations under the License. import React from 'react'; import PropTypes from 'prop-types'; - -const LOGO_URI = "themes/riot/img/logos/riot-im-logo-black-text.svg"; +import SdkConfig from 'matrix-react-sdk/lib/SdkConfig'; export default class VectorAuthHeaderLogo extends React.PureComponent { static replaces = 'AuthHeaderLogo' @@ -30,9 +29,15 @@ export default class VectorAuthHeaderLogo extends React.PureComponent { } render() { + const brandingConfig = SdkConfig.get().branding; + let logoUrl = "themes/riot/img/logos/riot-im-logo-black-text.svg"; + if (brandingConfig && brandingConfig.authHeaderLogoUrl) { + logoUrl = brandingConfig.authHeaderLogoUrl; + } + return (
- Riot + Riot
); }