diff --git a/res/css/views/settings/_Notifications.scss b/res/css/views/settings/_Notifications.scss index b21e7a5113..773ea055df 100644 --- a/res/css/views/settings/_Notifications.scss +++ b/res/css/views/settings/_Notifications.scss @@ -76,6 +76,21 @@ limitations under the License. display: none; } -.mx_NotificationSound_resetSound { +.mx_NotificationSound_browse { + color: $accent-color; + border: 1px solid $accent-color; + background-color: transparent; +} + +.mx_NotificationSound_save { margin-left: 5px; + color: white; + background-color: $accent-color; +} + +.mx_NotificationSound_resetSound { + margin-top: 5px; + color: white; + border: $warning-color; + background-color: $warning-color; } \ No newline at end of file diff --git a/src/components/views/settings/tabs/room/NotificationSettingsTab.js b/src/components/views/settings/tabs/room/NotificationSettingsTab.js index 9d0848baf4..6df5b2e469 100644 --- a/src/components/views/settings/tabs/room/NotificationSettingsTab.js +++ b/src/components/views/settings/tabs/room/NotificationSettingsTab.js @@ -20,7 +20,7 @@ import {_t} from "../../../../../languageHandler"; import MatrixClientPeg from "../../../../../MatrixClientPeg"; import AccessibleButton from "../../../elements/AccessibleButton"; import Notifier from "../../../../../Notifier"; -import SettingsStore from '../../../../../settings/SettingsStore'; +import SettingsStore from '../../../../../settings/SettingsStore'; import { SettingLevel } from '../../../../../settings/SettingsStore'; export default class NotificationsSettingsTab extends React.Component { @@ -65,14 +65,19 @@ export default class NotificationsSettingsTab extends React.Component { this.setState({ uploadedFile: file, }); + } + + async _onClickSaveSound(e) { + e.stopPropagation(); + e.preventDefault(); try { await this._saveSound(); } catch (ex) { console.error( `Unable to save notification sound for ${this.props.roomId}`, - ex, ); + console.error(ex); } } @@ -80,6 +85,7 @@ export default class NotificationsSettingsTab extends React.Component { if (!this.state.uploadedFile) { return; } + let type = this.state.uploadedFile.type; if (type === "video/ogg") { // XXX: I've observed browsers allowing users to pick a audio/ogg files, @@ -87,6 +93,7 @@ export default class NotificationsSettingsTab extends React.Component { // suck at detecting mimetypes. type = "audio/ogg"; } + const url = await MatrixClientPeg.get().uploadContent( this.state.uploadedFile, { type, @@ -96,7 +103,6 @@ export default class NotificationsSettingsTab extends React.Component { await SettingsStore.setValue( "notificationSound", this.props.roomId, - SettingsStore. SettingLevel.ROOM_ACCOUNT, { name: this.state.uploadedFile.name, @@ -108,7 +114,6 @@ export default class NotificationsSettingsTab extends React.Component { this.setState({ uploadedFile: null, - uploadedFileUrl: null, currentSound: this.state.uploadedFile.name, }); } @@ -129,13 +134,25 @@ export default class NotificationsSettingsTab extends React.Component { } render() { + let currentUploadedFile = null; + if (this.state.uploadedFile) { + currentUploadedFile = ( +
+ {_t("Uploaded sound")}: {this.state.uploadedFile.name} +
+ ); + } + return (
{_t("Notifications")}
{_t("Sounds")}
- {_t("Custom Notification Sounds")}: {this.state.currentSound} + {_t("Notification sound")}: {this.state.currentSound}
+ + {_t("Reset")} +

{_t("Set a new custom sound")}

@@ -143,13 +160,16 @@ export default class NotificationsSettingsTab extends React.Component { - + {currentUploadedFile} + + {_t("Browse")} - - {_t("Reset")} + + {_t("Save")} +
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 70128c4f8b..91829a80b4 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -617,10 +617,12 @@ "Room Addresses": "Room Addresses", "Publish this room to the public in %(domain)s's room directory?": "Publish this room to the public in %(domain)s's room directory?", "URL Previews": "URL Previews", + "Uploaded sound": "Uploaded sound", "Sounds": "Sounds", + "Notification sound": "Notification sound", + "Reset": "Reset", "Set a new custom sound": "Set a new custom sound", "Browse": "Browse", - "Reset": "Reset", "Change room avatar": "Change room avatar", "Change room name": "Change room name", "Change main address for the room": "Change main address for the room",