diff options
| author | Akira Ouchi <akkiesoft@marokun.net> | 2023-01-09 11:52:37 +0900 |
|---|---|---|
| committer | Claire <claire.github-309c@sitedethib.com> | 2023-01-10 09:39:19 +0100 |
| commit | b6a928cd04d5563ee08012b09d9e1c9f9efc9f07 (patch) | |
| tree | 0e28b2b6defb324e8e3378af0a5203a6852bcc2c /app/javascript | |
| parent | 9765d2b3f8192ff8a8c1bc90faf5f87331a26118 (diff) | |
[Glitch] Add variable autoFocus to video
Port 2195f21524270e50c00a6292f77dfe39342ff482 to glitch-soc Signed-off-by: Claire <claire.github-309c@sitedethib.com>
Diffstat (limited to 'app/javascript')
| -rw-r--r-- | app/javascript/flavours/glitch/features/ui/components/video_modal.js | 1 | ||||
| -rw-r--r-- | app/javascript/flavours/glitch/features/video/index.js | 5 |
2 files changed, 4 insertions, 2 deletions
diff --git a/app/javascript/flavours/glitch/features/ui/components/video_modal.js b/app/javascript/flavours/glitch/features/ui/components/video_modal.js index 6b6e615a6..90be11e4b 100644 --- a/app/javascript/flavours/glitch/features/ui/components/video_modal.js +++ b/app/javascript/flavours/glitch/features/ui/components/video_modal.js @@ -50,6 +50,7 @@ export default class VideoModal extends ImmutablePureComponent { autoPlay={options.autoPlay} volume={options.defaultVolume} onCloseVideo={onClose} + autoFocus detailed alt={media.get('description')} /> diff --git a/app/javascript/flavours/glitch/features/video/index.js b/app/javascript/flavours/glitch/features/video/index.js index cb4655f7f..0daab747b 100644 --- a/app/javascript/flavours/glitch/features/video/index.js +++ b/app/javascript/flavours/glitch/features/video/index.js @@ -124,6 +124,7 @@ class Video extends React.PureComponent { volume: PropTypes.number, muted: PropTypes.bool, componentIndex: PropTypes.number, + autoFocus: PropTypes.bool, }; static defaultProps = { @@ -537,7 +538,7 @@ class Video extends React.PureComponent { } render () { - const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, letterbox, fullwidth, detailed, sensitive, editable, blurhash } = this.props; + const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus } = this.props; const { containerWidth, currentTime, duration, volume, buffer, dragging, paused, fullscreen, hovered, muted, revealed } = this.state; const progress = Math.min((currentTime / duration) * 100, 100); const playerStyle = {}; @@ -635,7 +636,7 @@ class Video extends React.PureComponent { <div className='video-player__buttons-bar'> <div className='video-player__buttons left'> - <button type='button' title={intl.formatMessage(paused ? messages.play : messages.pause)} aria-label={intl.formatMessage(paused ? messages.play : messages.pause)} className='player-button' onClick={this.togglePlay} autoFocus={detailed}><Icon id={paused ? 'play' : 'pause'} fixedWidth /></button> + <button type='button' title={intl.formatMessage(paused ? messages.play : messages.pause)} aria-label={intl.formatMessage(paused ? messages.play : messages.pause)} className='player-button' onClick={this.togglePlay} autoFocus={autoFocus}><Icon id={paused ? 'play' : 'pause'} fixedWidth /></button> <button type='button' title={intl.formatMessage(muted ? messages.unmute : messages.mute)} aria-label={intl.formatMessage(muted ? messages.unmute : messages.mute)} className='player-button' onClick={this.toggleMute}><Icon id={muted ? 'volume-off' : 'volume-up'} fixedWidth /></button> <div className={classNames('video-player__volume', { active: this.state.hovered })} onMouseDown={this.handleVolumeMouseDown} ref={this.setVolumeRef}> |