matrix-react-sdk/lib/components/views/audio_messages/AudioPlayer.js

SDK for matrix.org using React

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _PlayPauseButton = _interopRequireDefault(require("./PlayPauseButton"));
var _FormattingUtils = require("../../../utils/FormattingUtils");
var _DurationClock = _interopRequireDefault(require("./DurationClock"));
var _languageHandler = require("../../../languageHandler");
var _SeekBar = _interopRequireDefault(require("./SeekBar"));
var _PlaybackClock = _interopRequireDefault(require("./PlaybackClock"));
var _AudioPlayerBase = _interopRequireDefault(require("./AudioPlayerBase"));
var _Playback = require("../../../audio/Playback");
/*
Copyright 2024 New Vector Ltd.
Copyright 2021-2023 The Matrix.org Foundation C.I.C.

SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details.
*/

class AudioPlayer extends _AudioPlayerBase.default {
  renderFileSize() {
    const bytes = this.props.playback.sizeBytes;
    if (!bytes) return null;

    // Not translated here - we're just presenting the data which should already
    // be translated if needed.
    return `(${(0, _FormattingUtils.formatBytes)(bytes)})`;
  }
  renderComponent() {
    // tabIndex=0 to ensure that the whole component becomes a tab stop, where we handle keyboard
    // events for accessibility
    return /*#__PURE__*/_react.default.createElement("div", {
      className: "mx_MediaBody mx_AudioPlayer_container",
      tabIndex: 0,
      onKeyDown: this.onKeyDown
    }, /*#__PURE__*/_react.default.createElement("div", {
      className: "mx_AudioPlayer_primaryContainer"
    }, /*#__PURE__*/_react.default.createElement(_PlayPauseButton.default, {
      playback: this.props.playback,
      playbackPhase: this.state.playbackPhase,
      tabIndex: -1 // prevent tabbing into the button
      ,
      ref: this.playPauseRef
    }), /*#__PURE__*/_react.default.createElement("div", {
      className: "mx_AudioPlayer_mediaInfo"
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "mx_AudioPlayer_mediaName"
    }, this.props.mediaName || (0, _languageHandler._t)("timeline|m.audio|unnamed_audio")), /*#__PURE__*/_react.default.createElement("div", {
      className: "mx_AudioPlayer_byline"
    }, /*#__PURE__*/_react.default.createElement(_DurationClock.default, {
      playback: this.props.playback
    }), "\xA0 ", this.renderFileSize()))), /*#__PURE__*/_react.default.createElement("div", {
      className: "mx_AudioPlayer_seek"
    }, /*#__PURE__*/_react.default.createElement(_SeekBar.default, {
      playback: this.props.playback,
      tabIndex: -1 // prevent tabbing into the bar
      ,
      disabled: this.state.playbackPhase === _Playback.PlaybackState.Decoding,
      ref: this.seekRef
    }), /*#__PURE__*/_react.default.createElement(_PlaybackClock.default, {
      playback: this.props.playback,
      defaultDisplaySeconds: 0
    })));
  }
}
exports.default = AudioPlayer;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfcmVhY3QiLCJfaW50ZXJvcFJlcXVpcmVEZWZhdWx0IiwicmVxdWlyZSIsIl9QbGF5UGF1c2VCdXR0b24iLCJfRm9ybWF0dGluZ1V0aWxzIiwiX0R1cmF0aW9uQ2xvY2siLCJfbGFuZ3VhZ2VIYW5kbGVyIiwiX1NlZWtCYXIiLCJfUGxheWJhY2tDbG9jayIsIl9BdWRpb1BsYXllckJhc2UiLCJfUGxheWJhY2siLCJBdWRpb1BsYXllciIsIkF1ZGlvUGxheWVyQmFzZSIsInJlbmRlckZpbGVTaXplIiwiYnl0ZXMiLCJwcm9wcyIsInBsYXliYWNrIiwic2l6ZUJ5dGVzIiwiZm9ybWF0Qnl0ZXMiLCJyZW5kZXJDb21wb25lbnQiLCJkZWZhdWx0IiwiY3JlYXRlRWxlbWVudCIsImNsYXNzTmFtZSIsInRhYkluZGV4Iiwib25LZXlEb3duIiwicGxheWJhY2tQaGFzZSIsInN0YXRlIiwicmVmIiwicGxheVBhdXNlUmVmIiwibWVkaWFOYW1lIiwiX3QiLCJkaXNhYmxlZCIsIlBsYXliYWNrU3RhdGUiLCJEZWNvZGluZyIsInNlZWtSZWYiLCJkZWZhdWx0RGlzcGxheVNlY29uZHMiLCJleHBvcnRzIl0sInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdmlld3MvYXVkaW9fbWVzc2FnZXMvQXVkaW9QbGF5ZXIudHN4Il0sInNvdXJjZXNDb250ZW50IjpbIi8qXG5Db3B5cmlnaHQgMjAyNCBOZXcgVmVjdG9yIEx0ZC5cbkNvcHlyaWdodCAyMDIxLTIwMjMgVGhlIE1hdHJpeC5vcmcgRm91bmRhdGlvbiBDLkkuQy5cblxuU1BEWC1MaWNlbnNlLUlkZW50aWZpZXI6IEFHUEwtMy4wLW9ubHkgT1IgR1BMLTMuMC1vbmx5XG5QbGVhc2Ugc2VlIExJQ0VOU0UgZmlsZXMgaW4gdGhlIHJlcG9zaXRvcnkgcm9vdCBmb3IgZnVsbCBkZXRhaWxzLlxuKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gXCJyZWFjdFwiO1xuXG5pbXBvcnQgUGxheVBhdXNlQnV0dG9uIGZyb20gXCIuL1BsYXlQYXVzZUJ1dHRvblwiO1xuaW1wb3J0IHsgZm9ybWF0Qnl0ZXMgfSBmcm9tIFwiLi4vLi4vLi4vdXRpbHMvRm9ybWF0dGluZ1V0aWxzXCI7XG5pbXBvcnQgRHVyYXRpb25DbG9jayBmcm9tIFwiLi9EdXJhdGlvbkNsb2NrXCI7XG5pbXBvcnQgeyBfdCB9IGZyb20gXCIuLi8uLi8uLi9sYW5ndWFnZUhhbmRsZXJcIjtcbmltcG9ydCBTZWVrQmFyIGZyb20gXCIuL1NlZWtCYXJcIjtcbmltcG9ydCBQbGF5YmFja0Nsb2NrIGZyb20gXCIuL1BsYXliYWNrQ2xvY2tcIjtcbmltcG9ydCBBdWRpb1BsYXllckJhc2UgZnJvbSBcIi4vQXVkaW9QbGF5ZXJCYXNlXCI7XG5pbXBvcnQgeyBQbGF5YmFja1N0YXRlIH0gZnJvbSBcIi4uLy4uLy4uL2F1ZGlvL1BsYXliYWNrXCI7XG5cbmV4cG9ydCBkZWZhdWx0IGNsYXNzIEF1ZGlvUGxheWVyIGV4dGVuZHMgQXVkaW9QbGF5ZXJCYXNlIHtcbiAgICBwcm90ZWN0ZWQgcmVuZGVyRmlsZVNpemUoKTogc3RyaW5nIHwgbnVsbCB7XG4gICAgICAgIGNvbnN0IGJ5dGVzID0gdGhpcy5wcm9wcy5wbGF5YmFjay5zaXplQnl0ZXM7XG4gICAgICAgIGlmICghYnl0ZXMpIHJldHVybiBudWxsO1xuXG4gICAgICAgIC8vIE5vdCB0cmFuc2xhdGVkIGhlcmUgLSB3ZSdyZSBqdXN0IHByZXNlbnRpbmcgdGhlIGRhdGEgd2hpY2ggc2hvdWxkIGFscmVhZHlcbiAgICAgICAgLy8gYmUgdHJhbnNsYXRlZCBpZiBuZWVkZWQuXG4gICAgICAgIHJldHVybiBgKCR7Zm9ybWF0Qnl0ZXMoYnl0ZXMpfSlgO1xuICAgIH1cblxuICAgIHByb3RlY3RlZCByZW5kZXJDb21wb25lbnQoKTogUmVhY3ROb2RlIHtcbiAgICAgICAgLy8gdGFiSW5kZXg9MCB0byBlbnN1cmUgdGhhdCB0aGUgd2hvbGUgY29tcG9uZW50IGJlY29tZXMgYSB0YWIgc3RvcCwgd2hlcmUgd2UgaGFuZGxlIGtleWJvYXJkXG4gICAgICAgIC8vIGV2ZW50cyBmb3IgYWNjZXNzaWJpbGl0eVxuICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJteF9NZWRpYUJvZHkgbXhfQXVkaW9QbGF5ZXJfY29udGFpbmVyXCIgdGFiSW5kZXg9ezB9IG9uS2V5RG93bj17dGhpcy5vbktleURvd259PlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPVwibXhfQXVkaW9QbGF5ZXJfcHJpbWFyeUNvbnRhaW5lclwiPlxuICAgICAgICAgICAgICAgICAgICA8UGxheVBhdXNlQnV0dG9uXG4gICAgICAgICAgICAgICAgICAgICAgICBwbGF5YmFjaz17dGhpcy5wcm9wcy5wbGF5YmFja31cbiAgICAgICAgICAgICAgICAgICAgICAgIHBsYXliYWNrUGhhc2U9e3RoaXMuc3RhdGUucGxheWJhY2tQaGFzZX1cbiAgICAgICAgICAgICAgICAgICAgICAgIHRhYkluZGV4PXstMX0gLy8gcHJldmVudCB0YWJiaW5nIGludG8gdGhlIGJ1dHRvblxuICAgICAgICAgICAgICAgICAgICAgICAgcmVmPXt0aGlzLnBsYXlQYXVzZVJlZn1cbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJteF9BdWRpb1BsYXllcl9tZWRpYUluZm9cIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxzcGFuIGNsYXNzTmFtZT1cIm14X0F1ZGlvUGxheWVyX21lZGlhTmFtZVwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHt0aGlzLnByb3BzLm1lZGlhTmFtZSB8fCBfdChcInRpbWVsaW5lfG0uYXVkaW98dW5uYW1lZF9hdWRpb1wiKX1cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvc3Bhbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPVwibXhfQXVkaW9QbGF5ZXJfYnlsaW5lXCI+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPER1cmF0aW9uQ2xvY2sgcGxheWJhY2s9e3RoaXMucHJvcHMucGxheWJhY2t9IC8+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgJm5ic3A7IHsvKiBlYXNpZXN0IHdheSB0byBpbnRyb2R1Y2UgYSBnYXAgYmV0d2VlbiB0aGUgY29tcG9uZW50cyAqL31cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB7dGhpcy5yZW5kZXJGaWxlU2l6ZSgpfVxuICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPVwibXhfQXVkaW9QbGF5ZXJfc2Vla1wiPlxuICAgICAgICAgICAgICAgICAgICA8U2Vla0JhclxuICAgICAgICAgICAgICAgICAgICAgICAgcGxheWJhY2s9e3RoaXMucHJvcHMucGxheWJhY2t9XG4gICAgICAgICAgICAgICAgICAgICAgICB0YWJJbmRleD17LTF9IC8vIHByZXZlbnQgdGFiYmluZyBpbnRvIHRoZSBiYXJcbiAgICAgICAgICAgICAgICAgICAgICAgIGRpc2FibGVkPXt0aGlzLnN0YXRlLnBsYXliYWNrUGhhc2UgPT09IFBsYXliYWNrU3RhdGUuRGVjb2Rpbmd9XG4gICAgICAgICAgICAgICAgICAgICAgICByZWY9e3RoaXMuc2Vla1JlZn1cbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgICAgPFBsYXliYWNrQ2xvY2sgcGxheWJhY2s9e3RoaXMucHJvcHMucGxheWJhY2t9IGRlZmF1bHREaXNwbGF5U2Vjb25kcz17MH0gLz5cbiAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICApO1xuICAgIH1cbn1cbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQVFBLElBQUFBLE1BQUEsR0FBQUMsc0JBQUEsQ0FBQUMs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