From 20e296b20e4bf27f78ff57f37330a43303645175 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Thu, 10 Jan 2019 19:37:28 -0600 Subject: [PATCH] Convert image URLs in React to `require` calls This allows Webpack to insert the proper image URL after builds steps like adding a hash and so on. The path you supply to `require` is relative to the JS source file, just like any other would be. --- res/css/views/rooms/_EventTile.scss | 4 +-- src/Avatar.js | 2 +- src/components/structures/GroupView.js | 18 +++++------ src/components/structures/HomePage.js | 2 +- src/components/structures/MyGroups.js | 4 +-- src/components/structures/RoomDirectory.js | 2 +- src/components/structures/RoomStatusBar.js | 10 +++--- src/components/structures/RoomView.js | 8 ++--- src/components/structures/TagPanel.js | 2 +- .../structures/TopLeftMenuButton.js | 2 +- src/components/structures/UploadBar.js | 4 +-- src/components/structures/UserSettings.js | 8 ++--- .../GroupInviteTileContextMenu.js | 2 +- .../context_menus/RoomTileContextMenu.js | 32 +++++++++---------- .../views/context_menus/TagTileContextMenu.js | 4 +-- src/components/views/dialogs/BaseDialog.js | 2 +- .../views/dialogs/ChatCreateOrReuseDialog.js | 2 +- src/components/views/dialogs/ShareDialog.js | 12 +++---- .../views/directory/NetworkDropdown.js | 4 +-- .../views/elements/AddressSelector.js | 2 +- src/components/views/elements/AddressTile.js | 4 +-- .../views/elements/AppPermission.js | 2 +- src/components/views/elements/AppTile.js | 16 ++++++---- src/components/views/elements/AppWarning.js | 2 +- .../views/elements/CreateRoomButton.js | 2 +- .../views/elements/EditableItemList.js | 4 +-- src/components/views/elements/HomeButton.js | 2 +- src/components/views/elements/ImageView.js | 2 +- .../views/elements/InlineSpinner.js | 2 +- .../views/elements/ManageIntegsButton.js | 8 +++-- .../views/elements/MessageSpinner.js | 2 +- .../views/elements/RoomDirectoryButton.js | 2 +- .../views/elements/SettingsButton.js | 2 +- src/components/views/elements/Spinner.js | 2 +- .../views/elements/StartChatButton.js | 2 +- src/components/views/globals/CookieBar.js | 4 +-- src/components/views/globals/MatrixToolbar.js | 4 +-- src/components/views/globals/NewVersionBar.js | 2 +- .../views/globals/PasswordNagBar.js | 2 +- .../views/globals/UpdateCheckBar.js | 6 ++-- .../views/groups/GroupMemberInfo.js | 2 +- .../views/groups/GroupMemberList.js | 4 +-- src/components/views/groups/GroupRoomInfo.js | 2 +- src/components/views/groups/GroupRoomList.js | 4 +-- src/components/views/login/CountryDropdown.js | 2 +- src/components/views/messages/MAudioBody.js | 4 +-- src/components/views/messages/MFileBody.js | 10 +++--- src/components/views/messages/MImageBody.js | 9 ++++-- src/components/views/messages/MStickerBody.js | 2 +- src/components/views/messages/MVideoBody.js | 4 +-- src/components/views/messages/RoomCreate.js | 2 +- .../views/right_panel/GroupHeaderButtons.js | 4 +-- .../views/right_panel/RoomHeaderButtons.js | 6 ++-- .../views/room_settings/ColorSettings.js | 2 +- src/components/views/rooms/AuxPanel.js | 2 +- src/components/views/rooms/EntityTile.js | 6 ++-- src/components/views/rooms/EventTile.js | 20 ++++++++---- .../views/rooms/LinkPreviewWidget.js | 2 +- .../views/rooms/MemberDeviceInfo.js | 6 ++-- src/components/views/rooms/MemberInfo.js | 4 +-- src/components/views/rooms/MemberList.js | 2 +- src/components/views/rooms/MessageComposer.js | 26 +++++++-------- .../views/rooms/MessageComposerInput.js | 2 +- src/components/views/rooms/PinnedEventTile.js | 2 +- .../views/rooms/PinnedEventsPanel.js | 2 +- src/components/views/rooms/ReplyPreview.js | 2 +- src/components/views/rooms/RoomHeader.js | 16 +++++----- src/components/views/rooms/RoomPreviewBar.js | 2 +- src/components/views/rooms/RoomSettings.js | 6 ++-- src/components/views/rooms/RoomTile.js | 8 ++++- .../views/rooms/SearchableEntityList.js | 2 +- .../views/rooms/SimpleRoomHeader.js | 2 +- src/components/views/rooms/Stickerpicker.js | 6 ++-- .../views/settings/AddPhoneNumber.js | 2 +- src/components/views/voip/IncomingCallBox.js | 2 +- 75 files changed, 201 insertions(+), 176 deletions(-) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 7fb6812c79..ee9971887e 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -291,8 +291,8 @@ limitations under the License. } /* always override hidden attribute for blocked and warning */ -.mx_EventTile_e2eIcon_hidden[src="img/e2e-blocked.svg"], -.mx_EventTile_e2eIcon_hidden[src="img/e2e-warning.svg"] { +.mx_EventTile_e2eIcon_hidden[src*="img/e2e-blocked.svg"], +.mx_EventTile_e2eIcon_hidden[src*="img/e2e-warning.svg"] { display: block; } diff --git a/src/Avatar.js b/src/Avatar.js index d41a3f6a79..d3df12eb49 100644 --- a/src/Avatar.js +++ b/src/Avatar.js @@ -56,6 +56,6 @@ module.exports = { for (let i = 0; i < s.length; ++i) { total += s.charCodeAt(i); } - return 'img/' + images[total % images.length] + '.png'; + return require('../res/img/' + images[total % images.length] + '.png'); }, }; diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js index 834fcd2340..8e0e5a3d32 100644 --- a/src/components/structures/GroupView.js +++ b/src/components/structures/GroupView.js @@ -125,7 +125,7 @@ const CategoryRoomList = React.createClass({ ( - +
{ _t('Add a Room') }
@@ -226,7 +226,7 @@ const FeaturedRoom = React.createClass({ const deleteButton = this.props.editing ? Delete - +
{ _t('Add a User') }
@@ -379,7 +379,7 @@ const FeaturedUser = React.createClass({ const deleteButton = this.props.editing ? Delete
- +
{ _t('Add rooms to this community') } @@ -1189,7 +1189,7 @@ export default React.createClass({
@@ -1255,7 +1255,7 @@ export default React.createClass({ ); rightButtons.push( - {_t("Cancel")} , ); @@ -1265,13 +1265,13 @@ export default React.createClass({ - + , ); } rightButtons.push( - + , ); } diff --git a/src/components/structures/HomePage.js b/src/components/structures/HomePage.js index 8f0c270513..aa17e63d73 100644 --- a/src/components/structures/HomePage.js +++ b/src/components/structures/HomePage.js @@ -108,7 +108,7 @@ class HomePage extends React.Component { if (this.context.matrixClient.isGuest()) { guestWarning = (
- +
{ _t("You are currently using Riot anonymously as a guest.") } diff --git a/src/components/structures/MyGroups.js b/src/components/structures/MyGroups.js index c5bf74d561..7411c7e6c1 100644 --- a/src/components/structures/MyGroups.js +++ b/src/components/structures/MyGroups.js @@ -107,7 +107,7 @@ export default withMatrixClient(React.createClass({ } return
- +
@@ -124,7 +124,7 @@ export default withMatrixClient(React.createClass({
{/*
- +
diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index 762185146c..1ddfa92305 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -571,7 +571,7 @@ module.exports = React.createClass({ const DirectorySearchBox = sdk.getComponent('elements.DirectorySearchBox'); return (
- +
-
); @@ -209,7 +209,7 @@ module.exports = React.createClass({ return ( - {_t("Scroll @@ -219,7 +219,7 @@ module.exports = React.createClass({ if (this.props.hasActiveCall) { const TintableSvg = sdk.getComponent("elements.TintableSvg"); return ( - + ); } @@ -327,7 +327,7 @@ module.exports = React.createClass({ } return
- +
{ title } @@ -346,7 +346,7 @@ module.exports = React.createClass({ if (this._shouldShowConnectionError()) { return (
- /!\ + /!\
{ _t('Connectivity to the server has been lost.') } diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index e93d58a3dc..c34b618645 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -1777,20 +1777,20 @@ module.exports = React.createClass({ if (call.type === "video") { zoomButton = (
- +
); videoMuteButton =
-
; } voiceMuteButton =
-
; @@ -1802,7 +1802,7 @@ module.exports = React.createClass({ { videoMuteButton } { zoomButton } { statusBar } - +
; } diff --git a/src/components/structures/TagPanel.js b/src/components/structures/TagPanel.js index 7e77a64e62..af463efaf9 100644 --- a/src/components/structures/TagPanel.js +++ b/src/components/structures/TagPanel.js @@ -136,7 +136,7 @@ const TagPanel = React.createClass({ let clearButton; if (itemsSelected) { clearButton = - diff --git a/src/components/structures/TopLeftMenuButton.js b/src/components/structures/TopLeftMenuButton.js index 00e669acdd..592b64634f 100644 --- a/src/components/structures/TopLeftMenuButton.js +++ b/src/components/structures/TopLeftMenuButton.js @@ -89,7 +89,7 @@ export default class TopLeftMenuButton extends React.Component { resizeMethod="crop" /> { nameElement } - + ); } diff --git a/src/components/structures/UploadBar.js b/src/components/structures/UploadBar.js index fed4ff33b3..b54ea00c16 100644 --- a/src/components/structures/UploadBar.js +++ b/src/components/structures/UploadBar.js @@ -91,8 +91,8 @@ module.exports = React.createClass({displayName: 'UploadBar',
- - +
diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js index d76e1c1716..65e1897137 100644 --- a/src/components/structures/UserSettings.js +++ b/src/components/structures/UserSettings.js @@ -1227,7 +1227,7 @@ module.exports = React.createClass({ />
-
@@ -1252,7 +1252,7 @@ module.exports = React.createClass({ onValueChanged={this._onAddEmailEditFinished} />
- +
); @@ -1322,7 +1322,7 @@ module.exports = React.createClass({
- {_t("Remove
diff --git a/src/components/views/context_menus/GroupInviteTileContextMenu.js b/src/components/views/context_menus/GroupInviteTileContextMenu.js index e30acca16d..4a8a33614b 100644 --- a/src/components/views/context_menus/GroupInviteTileContextMenu.js +++ b/src/components/views/context_menus/GroupInviteTileContextMenu.js @@ -79,7 +79,7 @@ export default class GroupInviteTileContextMenu extends React.Component { render() { return
- + { _t('Reject') }
; diff --git a/src/components/views/context_menus/RoomTileContextMenu.js b/src/components/views/context_menus/RoomTileContextMenu.js index 8e56c055f9..521282488e 100644 --- a/src/components/views/context_menus/RoomTileContextMenu.js +++ b/src/components/views/context_menus/RoomTileContextMenu.js @@ -245,26 +245,26 @@ module.exports = React.createClass({ return (
- +
- - + + { _t('All messages (noisy)') }
- - + + { _t('All messages') }
- - + + { _t('Mentions only') }
- - + + { _t('Mute') }
@@ -298,7 +298,7 @@ module.exports = React.createClass({ return (
- + { leaveText }
@@ -327,18 +327,18 @@ module.exports = React.createClass({ return (
- - + + { _t('Favourite') }
- - + + { _t('Low Priority') }
- - + + { _t('Direct Chat') }
diff --git a/src/components/views/context_menus/TagTileContextMenu.js b/src/components/views/context_menus/TagTileContextMenu.js index 32f5365b82..8b868e7b11 100644 --- a/src/components/views/context_menus/TagTileContextMenu.js +++ b/src/components/views/context_menus/TagTileContextMenu.js @@ -59,7 +59,7 @@ export default class TagTileContextMenu extends React.Component {
@@ -67,7 +67,7 @@ export default class TagTileContextMenu extends React.Component {
- + { _t('Remove') }
; diff --git a/src/components/views/dialogs/BaseDialog.js b/src/components/views/dialogs/BaseDialog.js index 3e9052cc34..82ea649db4 100644 --- a/src/components/views/dialogs/BaseDialog.js +++ b/src/components/views/dialogs/BaseDialog.js @@ -111,7 +111,7 @@ export default React.createClass({ let cancelButton; if (this.props.hasCancel) { cancelButton = - + ; } diff --git a/src/components/views/dialogs/ChatCreateOrReuseDialog.js b/src/components/views/dialogs/ChatCreateOrReuseDialog.js index 19b7d83717..3171c2db39 100644 --- a/src/components/views/dialogs/ChatCreateOrReuseDialog.js +++ b/src/components/views/dialogs/ChatCreateOrReuseDialog.js @@ -127,7 +127,7 @@ export default class ChatCreateOrReuseDialog extends React.Component { onClick={this.props.onNewDMClick} >
- +
{ _t("Start new chat") }
; diff --git a/src/components/views/dialogs/ShareDialog.js b/src/components/views/dialogs/ShareDialog.js index f074d9b1fa..3a0b00adf2 100644 --- a/src/components/views/dialogs/ShareDialog.js +++ b/src/components/views/dialogs/ShareDialog.js @@ -26,11 +26,11 @@ import * as ContextualMenu from "../../structures/ContextualMenu"; const socials = [ { name: 'Facebook', - img: 'img/social/facebook.png', + img: require("../../../../res/img/social/facebook.png"), url: (url) => `https://www.facebook.com/sharer/sharer.php?u=${url}`, }, { name: 'Twitter', - img: 'img/social/twitter-2.png', + img: require("../../../../res/img/social/twitter-2.png"), url: (url) => `https://twitter.com/home?status=${url}`, }, /* // icon missing name: 'Google Plus', @@ -38,15 +38,15 @@ const socials = [ url: (url) => `https://plus.google.com/share?url=${url}`, },*/ { name: 'LinkedIn', - img: 'img/social/linkedin.png', + img: require("../../../../res/img/social/linkedin.png"), url: (url) => `https://www.linkedin.com/shareArticle?mini=true&url=${url}`, }, { name: 'Reddit', - img: 'img/social/reddit.png', + img: require("../../../../res/img/social/reddit.png"), url: (url) => `http://www.reddit.com/submit?url=${url}`, }, { name: 'email', - img: 'img/social/email-1.png', + img: require("../../../../res/img/social/email-1.png"), url: (url) => `mailto:?body=${url}`, }, ]; @@ -202,7 +202,7 @@ export default class ShareDialog extends React.Component {
- +
{ diff --git a/src/components/views/directory/NetworkDropdown.js b/src/components/views/directory/NetworkDropdown.js index ad51f501fb..053849863c 100644 --- a/src/components/views/directory/NetworkDropdown.js +++ b/src/components/views/directory/NetworkDropdown.js @@ -18,7 +18,7 @@ import React from 'react'; import MatrixClientPeg from '../../../MatrixClientPeg'; import {instanceForInstanceId} from '../../../utils/DirectoryUtils'; -const DEFAULT_ICON_URL = "img/network-matrix.svg"; +const DEFAULT_ICON_URL = require("../../../../res/img/network-matrix.svg"); export default class NetworkDropdown extends React.Component { constructor(props) { @@ -191,7 +191,7 @@ export default class NetworkDropdown extends React.Component { } else if (!instance) { key = server + '_all'; name = 'Matrix'; - icon = ; + icon = ; span_class = 'mx_NetworkDropdown_menu_network'; } else { key = server + '_inst_' + instance.instance_id; diff --git a/src/components/views/elements/AddressSelector.js b/src/components/views/elements/AddressSelector.js index b4279c7f70..23e6939a24 100644 --- a/src/components/views/elements/AddressSelector.js +++ b/src/components/views/elements/AddressSelector.js @@ -150,7 +150,7 @@ export default React.createClass({ showAddress={this.props.showAddress} justified={true} networkName="vector" - networkUrl="img/search-icon-vector.svg" + networkUrl={require("../../../../res/img/search-icon-vector.svg")} />
, ); diff --git a/src/components/views/elements/AddressTile.js b/src/components/views/elements/AddressTile.js index 16e340756a..8011a6c55f 100644 --- a/src/components/views/elements/AddressTile.js +++ b/src/components/views/elements/AddressTile.js @@ -54,7 +54,7 @@ export default React.createClass({ address.avatarMxc, 25, 25, 'crop', )); } else if (address.addressType === 'email') { - imgUrls.push('img/icon-email-user.svg'); + imgUrls.push(require("../../../../res/img/icon-email-user.svg")); } // Removing networks for now as they're not really supported @@ -141,7 +141,7 @@ export default React.createClass({ if (this.props.canDismiss) { dismiss = (
- +
); } diff --git a/src/components/views/elements/AppPermission.js b/src/components/views/elements/AppPermission.js index 6b4536b620..8f4a434df0 100644 --- a/src/components/views/elements/AppPermission.js +++ b/src/components/views/elements/AppPermission.js @@ -47,7 +47,7 @@ export default class AppPermission extends React.Component { return (
- {_t('Warning!')} + {_t('Warning!')}
{ _t('Do you want to load widget from URL:') } { this.state.curlBase } diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js index f4f929a3c2..85d28baee7 100644 --- a/src/components/views/elements/AppTile.js +++ b/src/components/views/elements/AppTile.js @@ -582,19 +582,21 @@ export default class AppTile extends React.Component { // editing is done in scalar const showEditButton = Boolean(this._scalarClient && this._canUserModify()); const deleteWidgetLabel = this._deleteWidgetLabel(); - let deleteIcon = 'img/cancel_green.svg'; + let deleteIcon = require("../../../../res/img/cancel_green.svg"); let deleteClasses = 'mx_AppTileMenuBarWidget'; if (this._canUserModify()) { - deleteIcon = 'img/icon-delete-pink.svg'; + deleteIcon = require("../../../../res/img/icon-delete-pink.svg"); deleteClasses += ' mx_AppTileMenuBarWidgetDelete'; } // Picture snapshot - only show button when apps are maximised. const showPictureSnapshotButton = this._hasCapability('m.capability.screenshot') && this.props.show; - const showPictureSnapshotIcon = 'img/camera_green.svg'; - const popoutWidgetIcon = 'img/button-new-window.svg'; - const reloadWidgetIcon = 'img/button-refresh.svg'; - const windowStateIcon = (this.props.show ? 'img/minimize.svg' : 'img/maximize.svg'); + const showPictureSnapshotIcon = require("../../../../res/img/camera_green.svg"); + const popoutWidgetIcon = require("../../../../res/img/button-new-window.svg"); + const reloadWidgetIcon = require("../../../../res/img/button-refresh.svg"); + const minimizeIcon = require("../../../../res/img/minimize.svg"); + const maximizeIcon = require("../../../../res/img/maximize.svg"); + const windowStateIcon = (this.props.show ? minimizeIcon : maximizeIcon); let appTileClass; if (this.props.miniMode) { @@ -653,7 +655,7 @@ export default class AppTile extends React.Component { { /* Edit widget */ } { showEditButton && { return (
- +
{ props.errorMsg } diff --git a/src/components/views/elements/CreateRoomButton.js b/src/components/views/elements/CreateRoomButton.js index 177d033c75..da937be3e1 100644 --- a/src/components/views/elements/CreateRoomButton.js +++ b/src/components/views/elements/CreateRoomButton.js @@ -25,7 +25,7 @@ const CreateRoomButton = function(props) { diff --git a/src/components/views/elements/EditableItemList.js b/src/components/views/elements/EditableItemList.js index 02fdc96a78..f4c016d9f2 100644 --- a/src/components/views/elements/EditableItemList.js +++ b/src/components/views/elements/EditableItemList.js @@ -62,13 +62,13 @@ const EditableItem = React.createClass({ { this.props.onAdd ?
{_t("Add")}
:
{_t("Delete")}
} diff --git a/src/components/views/elements/HomeButton.js b/src/components/views/elements/HomeButton.js index 05e21487eb..ecfce9b5f2 100644 --- a/src/components/views/elements/HomeButton.js +++ b/src/components/views/elements/HomeButton.js @@ -24,7 +24,7 @@ const HomeButton = function(props) { return ( diff --git a/src/components/views/elements/ImageView.js b/src/components/views/elements/ImageView.js index 4ac5eda170..2c0f4a0d86 100644 --- a/src/components/views/elements/ImageView.js +++ b/src/components/views/elements/ImageView.js @@ -176,7 +176,7 @@ module.exports = React.createClass({
- { + {
diff --git a/src/components/views/elements/InlineSpinner.js b/src/components/views/elements/InlineSpinner.js index cce4705512..f82f309493 100644 --- a/src/components/views/elements/InlineSpinner.js +++ b/src/components/views/elements/InlineSpinner.js @@ -26,7 +26,7 @@ module.exports = React.createClass({ return (
- +
); }, diff --git a/src/components/views/elements/ManageIntegsButton.js b/src/components/views/elements/ManageIntegsButton.js index f45053de44..40d4cf9377 100644 --- a/src/components/views/elements/ManageIntegsButton.js +++ b/src/components/views/elements/ManageIntegsButton.js @@ -80,7 +80,11 @@ export default class ManageIntegsButton extends React.Component { }); if (this.state.scalarError && !this.scalarClient.hasCredentials()) { - integrationsWarningTriangle = ; + integrationsWarningTriangle = ; // Popup shown when hovering over integrationsButton_error (via CSS) integrationsErrorPopup = ( @@ -91,7 +95,7 @@ export default class ManageIntegsButton extends React.Component { integrationsButton = ( - + { integrationsWarningTriangle } { integrationsErrorPopup } diff --git a/src/components/views/elements/MessageSpinner.js b/src/components/views/elements/MessageSpinner.js index 500c919d45..19d804f511 100644 --- a/src/components/views/elements/MessageSpinner.js +++ b/src/components/views/elements/MessageSpinner.js @@ -27,7 +27,7 @@ module.exports = React.createClass({ return (
{ msg }
  - +
); }, diff --git a/src/components/views/elements/RoomDirectoryButton.js b/src/components/views/elements/RoomDirectoryButton.js index d8f88034e3..1498157ee4 100644 --- a/src/components/views/elements/RoomDirectoryButton.js +++ b/src/components/views/elements/RoomDirectoryButton.js @@ -25,7 +25,7 @@ const RoomDirectoryButton = function(props) { diff --git a/src/components/views/elements/SettingsButton.js b/src/components/views/elements/SettingsButton.js index 215d757e6c..f63d17d93c 100644 --- a/src/components/views/elements/SettingsButton.js +++ b/src/components/views/elements/SettingsButton.js @@ -24,7 +24,7 @@ const SettingsButton = function(props) { return ( diff --git a/src/components/views/elements/Spinner.js b/src/components/views/elements/Spinner.js index 67fde4bf66..ca1ee0ef42 100644 --- a/src/components/views/elements/Spinner.js +++ b/src/components/views/elements/Spinner.js @@ -27,7 +27,7 @@ module.exports = React.createClass({ const imgClass = this.props.imgClassName || ""; return (
- +
); }, diff --git a/src/components/views/elements/StartChatButton.js b/src/components/views/elements/StartChatButton.js index 199c5e44a6..2132d63940 100644 --- a/src/components/views/elements/StartChatButton.js +++ b/src/components/views/elements/StartChatButton.js @@ -25,7 +25,7 @@ const StartChatButton = function(props) { diff --git a/src/components/views/globals/CookieBar.js b/src/components/views/globals/CookieBar.js index deb1cbffa8..f2bcd647d7 100644 --- a/src/components/views/globals/CookieBar.js +++ b/src/components/views/globals/CookieBar.js @@ -51,7 +51,7 @@ export default class CookieBar extends React.Component { const toolbarClasses = "mx_MatrixToolbar"; return (
- +
{ this.props.policyUrl ? _t( "Please help improve Riot.im by sending anonymous usage data. " + @@ -95,7 +95,7 @@ export default class CookieBar extends React.Component { { _t("Yes, I want to help!") } - {_t('Close')} + {_t('Close')}
); diff --git a/src/components/views/globals/MatrixToolbar.js b/src/components/views/globals/MatrixToolbar.js index 400d9e0c83..efcbfcba48 100644 --- a/src/components/views/globals/MatrixToolbar.js +++ b/src/components/views/globals/MatrixToolbar.js @@ -35,11 +35,11 @@ module.exports = React.createClass({ render: function() { return (
- +
{ _t('You are not receiving desktop notifications') } { _t('Enable them now') }
- {_t('Close')} + {_t('Close')}
); }, diff --git a/src/components/views/globals/NewVersionBar.js b/src/components/views/globals/NewVersionBar.js index 47eed4dc59..d802af63d4 100644 --- a/src/components/views/globals/NewVersionBar.js +++ b/src/components/views/globals/NewVersionBar.js @@ -96,7 +96,7 @@ export default React.createClass({ } return (
- +
{_t("A new version of Riot is available.")}
diff --git a/src/components/views/globals/PasswordNagBar.js b/src/components/views/globals/PasswordNagBar.js index 5e3da3ad6d..71901ad922 100644 --- a/src/components/views/globals/PasswordNagBar.js +++ b/src/components/views/globals/PasswordNagBar.js @@ -31,7 +31,7 @@ export default React.createClass({ return (
; + image = ; } else { - image = ; + image = ; } return ( @@ -83,7 +83,7 @@ export default React.createClass({ {message}
- {_t('Close')} + {_t('Close')}
); diff --git a/src/components/views/groups/GroupMemberInfo.js b/src/components/views/groups/GroupMemberInfo.js index ca59075912..aa40f1c8b3 100644 --- a/src/components/views/groups/GroupMemberInfo.js +++ b/src/components/views/groups/GroupMemberInfo.js @@ -188,7 +188,7 @@ module.exports = React.createClass({
- +
{ avatar } diff --git a/src/components/views/groups/GroupMemberList.js b/src/components/views/groups/GroupMemberList.js index 9a8196f12b..9045c92a2e 100644 --- a/src/components/views/groups/GroupMemberList.js +++ b/src/components/views/groups/GroupMemberList.js @@ -87,7 +87,7 @@ export default React.createClass({ const text = _t("and %(count)s others...", { count: overflowCount }); return ( + } name={text} presenceState="online" suppressOnHover={true} onClick={this._showFullMemberList} /> ); @@ -214,7 +214,7 @@ export default React.createClass({ onClick={this.onInviteToGroupButtonClick} >
- +
{ _t('Invite to this community') }
); diff --git a/src/components/views/groups/GroupRoomInfo.js b/src/components/views/groups/GroupRoomInfo.js index 41e5f68736..05c6b9cfd4 100644 --- a/src/components/views/groups/GroupRoomInfo.js +++ b/src/components/views/groups/GroupRoomInfo.js @@ -215,7 +215,7 @@ module.exports = React.createClass({
- +
{ avatar } diff --git a/src/components/views/groups/GroupRoomList.js b/src/components/views/groups/GroupRoomList.js index 81fcfa8c8b..ec41cd036b 100644 --- a/src/components/views/groups/GroupRoomList.js +++ b/src/components/views/groups/GroupRoomList.js @@ -77,7 +77,7 @@ export default React.createClass({ const text = _t("and %(count)s others...", { count: overflowCount }); return ( + } name={text} presenceState="online" suppressOnHover={true} onClick={this._showFullRoomList} /> ); @@ -137,7 +137,7 @@ export default React.createClass({ onClick={this.onAddRoomToGroupButtonClick} >
- +
{ _t('Add rooms to this community') }
diff --git a/src/components/views/login/CountryDropdown.js b/src/components/views/login/CountryDropdown.js index 8c4467bb99..5f5dbf41a4 100644 --- a/src/components/views/login/CountryDropdown.js +++ b/src/components/views/login/CountryDropdown.js @@ -70,7 +70,7 @@ export default class CountryDropdown extends React.Component { } _flagImgForIso2(iso2) { - return ; + return ; } _getShortOption(iso2) { diff --git a/src/components/views/messages/MAudioBody.js b/src/components/views/messages/MAudioBody.js index efc6c4a069..b4f26d0cbd 100644 --- a/src/components/views/messages/MAudioBody.js +++ b/src/components/views/messages/MAudioBody.js @@ -81,7 +81,7 @@ export default class MAudioBody extends React.Component { if (this.state.error !== null) { return ( - + { _t("Error decrypting audio") } ); @@ -94,7 +94,7 @@ export default class MAudioBody extends React.Component { // Not sure how tall the audio player is so not sure how tall it should actually be. return ( - {content.body} + {content.body} ); } diff --git a/src/components/views/messages/MFileBody.js b/src/components/views/messages/MFileBody.js index 292ac25d42..781d340252 100644 --- a/src/components/views/messages/MFileBody.js +++ b/src/components/views/messages/MFileBody.js @@ -29,15 +29,15 @@ import request from 'browser-request'; import Modal from '../../../Modal'; -// A cached tinted copy of "img/download.svg" +// A cached tinted copy of require("../../../../res/img/download.svg") let tintedDownloadImageURL; // Track a list of mounted MFileBody instances so that we can update -// the "img/download.svg" when the tint changes. +// the require("../../../../res/img/download.svg") when the tint changes. let nextMountId = 0; const mounts = {}; /** - * Updates the tinted copy of "img/download.svg" when the tint changes. + * Updates the tinted copy of require("../../../../res/img/download.svg") when the tint changes. */ function updateTintedDownloadImage() { // Download the svg as an XML document. @@ -46,7 +46,7 @@ function updateTintedDownloadImage() { // Also note that we can't use fetch here because fetch doesn't support // file URLs, which the download image will be if we're running from // the filesystem (like in an Electron wrapper). - request({uri: "img/download.svg"}, (err, response, body) => { + request({uri: require("../../../../res/img/download.svg")}, (err, response, body) => { if (err) return; const svg = new DOMParser().parseFromString(body, "image/svg+xml"); @@ -254,7 +254,7 @@ module.exports = React.createClass({ }, tint: function() { - // Update our tinted copy of "img/download.svg" + // Update our tinted copy of require("../../../../res/img/download.svg") if (this.refs.downloadImage) { this.refs.downloadImage.src = tintedDownloadImageURL; } diff --git a/src/components/views/messages/MImageBody.js b/src/components/views/messages/MImageBody.js index dc891b86ff..dd1165cf58 100644 --- a/src/components/views/messages/MImageBody.js +++ b/src/components/views/messages/MImageBody.js @@ -282,7 +282,12 @@ export default class MImageBody extends React.Component { // e2e image hasn't been decrypted yet if (content.file !== undefined && this.state.decryptedUrl === null) { - placeholder = {content.body}; + placeholder = {content.body}; } else if (!this.state.imgLoaded) { // Deliberately, getSpinner is left unimplemented here, MStickerBody overides placeholder = this.getPlaceholder(); @@ -363,7 +368,7 @@ export default class MImageBody extends React.Component { if (this.state.error !== null) { return ( - + { _t("Error decrypting image") } ); diff --git a/src/components/views/messages/MStickerBody.js b/src/components/views/messages/MStickerBody.js index 82a530d503..55263ef7b7 100644 --- a/src/components/views/messages/MStickerBody.js +++ b/src/components/views/messages/MStickerBody.js @@ -35,7 +35,7 @@ export default class MStickerBody extends MImageBody { // img onLoad hasn't fired yet. getPlaceholder() { const TintableSVG = sdk.getComponent('elements.TintableSvg'); - return ; + return ; } // Tooltip to show on mouse over diff --git a/src/components/views/messages/MVideoBody.js b/src/components/views/messages/MVideoBody.js index 37fc94d1ed..f1199263e7 100644 --- a/src/components/views/messages/MVideoBody.js +++ b/src/components/views/messages/MVideoBody.js @@ -135,7 +135,7 @@ module.exports = React.createClass({ if (this.state.error !== null) { return ( - + { _t("Error decrypting video") } ); @@ -148,7 +148,7 @@ module.exports = React.createClass({ return (
- {content.body} + {content.body}
); diff --git a/src/components/views/messages/RoomCreate.js b/src/components/views/messages/RoomCreate.js index 0bb832f8ea..592afe984a 100644 --- a/src/components/views/messages/RoomCreate.js +++ b/src/components/views/messages/RoomCreate.js @@ -48,7 +48,7 @@ module.exports = React.createClass({ return
; // We should never have been instaniated in this case } return
- +
{_t("This room is a continuation of another conversation.")}
diff --git a/src/components/views/right_panel/GroupHeaderButtons.js b/src/components/views/right_panel/GroupHeaderButtons.js index 6fcba1d815..6867b0bb9d 100644 --- a/src/components/views/right_panel/GroupHeaderButtons.js +++ b/src/components/views/right_panel/GroupHeaderButtons.js @@ -65,12 +65,12 @@ export default class GroupHeaderButtons extends HeaderButtons { ]; return [ - , - , - , - - ./ + ./
); } diff --git a/src/components/views/rooms/AuxPanel.js b/src/components/views/rooms/AuxPanel.js index 5370b4d8b5..f52a3c52ab 100644 --- a/src/components/views/rooms/AuxPanel.js +++ b/src/components/views/rooms/AuxPanel.js @@ -147,7 +147,7 @@ module.exports = React.createClass({
- +
{ _t("Drop file here to upload") }
diff --git a/src/components/views/rooms/EntityTile.js b/src/components/views/rooms/EntityTile.js index 3f3bdbf47a..009da0ebd4 100644 --- a/src/components/views/rooms/EntityTile.js +++ b/src/components/views/rooms/EntityTile.js @@ -160,7 +160,7 @@ const EntityTile = React.createClass({ if (this.props.showInviteButton) { inviteButton = (
- +
); } @@ -169,8 +169,8 @@ const EntityTile = React.createClass({ const powerStatus = this.props.powerStatus; if (powerStatus) { const src = { - [EntityTile.POWER_STATUS_MODERATOR]: "img/mod.svg", - [EntityTile.POWER_STATUS_ADMIN]: "img/admin.svg", + [EntityTile.POWER_STATUS_MODERATOR]: require("../../../../res/img/mod.svg"), + [EntityTile.POWER_STATUS_ADMIN]: require("../../../../res/img/admin.svg"), }[powerStatus]; const alt = { [EntityTile.POWER_STATUS_MODERATOR]: _t("Moderator"), diff --git a/src/components/views/rooms/EventTile.js b/src/components/views/rooms/EventTile.js index 692111361a..acb122ad4e 100644 --- a/src/components/views/rooms/EventTile.js +++ b/src/components/views/rooms/EventTile.js @@ -768,23 +768,31 @@ module.exports.haveTileForEvent = function(e) { function E2ePadlockUndecryptable(props) { return ( ); } function E2ePadlockEncrypting(props) { - return ; + return ( + + ); } function E2ePadlockNotSent(props) { - return ; + return ( + + ); } function E2ePadlockVerified(props) { return ( ); } @@ -792,7 +800,7 @@ function E2ePadlockVerified(props) { function E2ePadlockUnverified(props) { return ( ); } @@ -800,7 +808,7 @@ function E2ePadlockUnverified(props) { function E2ePadlockUnencrypted(props) { return ( ); } diff --git a/src/components/views/rooms/LinkPreviewWidget.js b/src/components/views/rooms/LinkPreviewWidget.js index 7f74176878..1483fbffae 100644 --- a/src/components/views/rooms/LinkPreviewWidget.js +++ b/src/components/views/rooms/LinkPreviewWidget.js @@ -135,7 +135,7 @@ module.exports = React.createClass({
); diff --git a/src/components/views/rooms/MemberDeviceInfo.js b/src/components/views/rooms/MemberDeviceInfo.js index 41ed995ffb..b9c276f0d1 100644 --- a/src/components/views/rooms/MemberDeviceInfo.js +++ b/src/components/views/rooms/MemberDeviceInfo.js @@ -27,19 +27,19 @@ export default class MemberDeviceInfo extends React.Component { if (this.props.device.isBlocked()) { indicator = (
- {_t("Blacklisted")} + {_t("Blacklisted")}
); } else if (this.props.device.isVerified()) { indicator = (
- {_t("Verified")} + {_t("Verified")}
); } else { indicator = (
- {_t("Unverified")} + {_t("Unverified")}
); } diff --git a/src/components/views/rooms/MemberInfo.js b/src/components/views/rooms/MemberInfo.js index 6a796bc160..9859861870 100644 --- a/src/components/views/rooms/MemberInfo.js +++ b/src/components/views/rooms/MemberInfo.js @@ -815,7 +815,7 @@ module.exports = withMatrixClient(React.createClass({ onClick={this.onNewDMClick} >
- +
{ _t("Start a chat") }
; @@ -963,7 +963,7 @@ module.exports = withMatrixClient(React.createClass({
- {_t('Close')} + {_t('Close')} { memberName }
diff --git a/src/components/views/rooms/MemberList.js b/src/components/views/rooms/MemberList.js index 0924a5ec38..f01ef3e3ec 100644 --- a/src/components/views/rooms/MemberList.js +++ b/src/components/views/rooms/MemberList.js @@ -253,7 +253,7 @@ module.exports = React.createClass({ const text = _t("and %(count)s others...", { count: overflowCount }); return ( + } name={text} presenceState="online" suppressOnHover={true} onClick={onClick} /> ); diff --git a/src/components/views/rooms/MessageComposer.js b/src/components/views/rooms/MessageComposer.js index 91ef549185..7681c2dc13 100644 --- a/src/components/views/rooms/MessageComposer.js +++ b/src/components/views/rooms/MessageComposer.js @@ -155,12 +155,12 @@ export default class MessageComposer extends React.Component { const fileAcceptedOrError = this.props.uploadAllowed(files[i]); if (fileAcceptedOrError === true) { acceptedFiles.push(
  • - { files[i].name || _t('Attachment') } + { files[i].name || _t('Attachment') }
    • ); fileList.push(files[i]); } else { failedFiles.push(
  • - { files[i].name || _t('Attachment') }

    { _t('Reason') + ": " + fileAcceptedOrError}

    + { files[i].name || _t('Attachment') }

    { _t('Reason') + ": " + fileAcceptedOrError}

    • ); } } @@ -320,11 +320,11 @@ export default class MessageComposer extends React.Component { const roomIsEncrypted = MatrixClientPeg.get().isRoomEncrypted(this.props.room.roomId); if (roomIsEncrypted) { // FIXME: show a /!\ if there are untrusted devices in the room... - e2eImg = 'img/e2e-verified.svg'; + e2eImg = require("../../../../res/img/e2e-verified.svg"); e2eTitle = _t('Encrypted room'); e2eClass = 'mx_MessageComposer_e2eIcon'; } else { - e2eImg = 'img/e2e-unencrypted.svg'; + e2eImg = require("../../../../res/img/e2e-unencrypted.svg"); e2eTitle = _t('Unencrypted room'); e2eClass = 'mx_MessageComposer_e2eIcon mx_filterFlipColor'; } @@ -344,16 +344,16 @@ export default class MessageComposer extends React.Component { if (this.props.callState && this.props.callState !== 'ended') { hangupButton = - {_t('Hangup')} + {_t('Hangup')} ; } else { callButton = - + ; videoCallButton = - + ; } @@ -395,7 +395,7 @@ export default class MessageComposer extends React.Component { const uploadButton = ( - + @@ -451,7 +451,7 @@ export default class MessageComposer extends React.Component { controls.push(
    - + {_t("This room has been replaced and is no longer active.")}
    @@ -487,7 +487,7 @@ export default class MessageComposer extends React.Component { title={_t(name)} onMouseDown={onFormatButtonClicked} key={name} - src={`img/button-text-${name}${suffix}.svg`} + src={require(`../../../../res/img/button-text-${name}${suffix}.svg`)} height="17" />; }, ); @@ -500,11 +500,11 @@ export default class MessageComposer extends React.Component { + src={require(`../../../../res/img/button-md-${!this.state.inputState.isRichTextEnabled}.png`)} /> + src={require("../../../../res/img/icon-text-cancel.svg")} />
    ; } diff --git a/src/components/views/rooms/MessageComposerInput.js b/src/components/views/rooms/MessageComposerInput.js index ff7cfcbd6d..22bc965813 100644 --- a/src/components/views/rooms/MessageComposerInput.js +++ b/src/components/views/rooms/MessageComposerInput.js @@ -1599,7 +1599,7 @@ export default class MessageComposerInput extends React.Component { + src={require(`../../../../res/img/button-md-${!this.state.isRichTextEnabled}.png`)} /> - {_t('Unpin + {_t('Unpin     ); } diff --git a/src/components/views/rooms/PinnedEventsPanel.js b/src/components/views/rooms/PinnedEventsPanel.js index 50c40142da..3a0bc0e326 100644 --- a/src/components/views/rooms/PinnedEventsPanel.js +++ b/src/components/views/rooms/PinnedEventsPanel.js @@ -130,7 +130,7 @@ module.exports = React.createClass({
    - +

    { _t("Pinned Messages") }

    { tiles } diff --git a/src/components/views/rooms/ReplyPreview.js b/src/components/views/rooms/ReplyPreview.js index 46e2826634..7656d21832 100644 --- a/src/components/views/rooms/ReplyPreview.js +++ b/src/components/views/rooms/ReplyPreview.js @@ -68,7 +68,7 @@ export default class ReplyPreview extends React.Component { { '💬 ' + _t('Replying') }
    -
    diff --git a/src/components/views/rooms/RoomHeader.js b/src/components/views/rooms/RoomHeader.js index 4292fa6a4d..3cdb9237be 100644 --- a/src/components/views/rooms/RoomHeader.js +++ b/src/components/views/rooms/RoomHeader.js @@ -312,14 +312,14 @@ module.exports = React.createClass({
    - {_t("Remove - + ; } @@ -353,7 +353,7 @@ module.exports = React.createClass({ { pinsIndicator } - + ; } @@ -361,7 +361,7 @@ module.exports = React.createClass({ // if (this.props.onLeaveClick) { // leave_button = //
    -// +// //
    ; // } @@ -369,7 +369,7 @@ module.exports = React.createClass({ if (this.props.onForgetClick) { forgetButton = - + ; } @@ -377,7 +377,7 @@ module.exports = React.createClass({ if (this.props.onSearchClick && this.props.inRoom) { searchButton = - + ; } @@ -385,7 +385,7 @@ module.exports = React.createClass({ if (this.props.inRoom) { shareRoomButton = - + ; } diff --git a/src/components/views/rooms/RoomPreviewBar.js b/src/components/views/rooms/RoomPreviewBar.js index 3c767b726a..dbe409d6d7 100644 --- a/src/components/views/rooms/RoomPreviewBar.js +++ b/src/components/views/rooms/RoomPreviewBar.js @@ -124,7 +124,7 @@ module.exports = React.createClass({ emailMatchBlock =
    - /!\\ + /!\\
    { _t("This invitation was sent to an email address which is not associated with this account:") } diff --git a/src/components/views/rooms/RoomSettings.js b/src/components/views/rooms/RoomSettings.js index 8cd559f2ea..9287eb3fae 100644 --- a/src/components/views/rooms/RoomSettings.js +++ b/src/components/views/rooms/RoomSettings.js @@ -616,7 +616,7 @@ module.exports = React.createClass({
    { settings } @@ -627,8 +627,8 @@ module.exports = React.createClass({
    diff --git a/src/components/views/rooms/RoomTile.js b/src/components/views/rooms/RoomTile.js index 1a17fcf5ea..ed214812b5 100644 --- a/src/components/views/rooms/RoomTile.js +++ b/src/components/views/rooms/RoomTile.js @@ -392,7 +392,13 @@ module.exports = React.createClass({ let dmIndicator; if (this._isDirectMessageRoom(this.props.room.roomId)) { - dmIndicator = dm; + dmIndicator = dm; } return + } name={text} presenceState="online" suppressOnHover={true} onClick={this._showAll} /> ); diff --git a/src/components/views/rooms/SimpleRoomHeader.js b/src/components/views/rooms/SimpleRoomHeader.js index 249ba8b93a..4ced9fb351 100644 --- a/src/components/views/rooms/SimpleRoomHeader.js +++ b/src/components/views/rooms/SimpleRoomHeader.js @@ -26,7 +26,7 @@ export function CancelButton(props) { return ( - {_t("Cancel")} ); diff --git a/src/components/views/rooms/Stickerpicker.js b/src/components/views/rooms/Stickerpicker.js index c7d9f890a7..b8fe3afb97 100644 --- a/src/components/views/rooms/Stickerpicker.js +++ b/src/components/views/rooms/Stickerpicker.js @@ -152,7 +152,7 @@ export default class Stickerpicker extends React.Component { className='mx_Stickers_contentPlaceholder'>

    { _t("You don't currently have any stickerpacks enabled") }

    { _t("Add some now") }

    - +     ); } @@ -351,7 +351,7 @@ export default class Stickerpicker extends React.Component { onClick={this._onHideStickersClick} ref='target' title={_t("Hide Stickers")}> - + ; } else { // Show show-stickers button @@ -362,7 +362,7 @@ export default class Stickerpicker extends React.Component { className="mx_MessageComposer_stickers" onClick={this._onShowStickersClick} title={_t("Show Stickers")}> - + ; } return
    diff --git a/src/components/views/settings/AddPhoneNumber.js b/src/components/views/settings/AddPhoneNumber.js index 64822ace5f..82169c9868 100644 --- a/src/components/views/settings/AddPhoneNumber.js +++ b/src/components/views/settings/AddPhoneNumber.js @@ -166,7 +166,7 @@ export default withMatrixClient(React.createClass({
    - +
    ); diff --git a/src/components/views/voip/IncomingCallBox.js b/src/components/views/voip/IncomingCallBox.js index 6cbaabe602..43c339d182 100644 --- a/src/components/views/voip/IncomingCallBox.js +++ b/src/components/views/voip/IncomingCallBox.js @@ -66,7 +66,7 @@ module.exports = React.createClass({ const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); return (
    - +
    { incomingCallText }