import React from 'react'
import { connect } from 'react-redux'
import actions from 'app/actions'
import { clamp, timestamp } from 'app/utils'
// arrows
const arrows = {
down: (
),
up: (
),
right: (
),
left: (
),
}
export const Arrow = React.memo(({ type }) => (
{arrows[type]}
))
// volume toggle
export const VolumeControl = React.memo(({ volume }) => (
actions.audio.setVolume(volume ? 0.0 : 1.0)}>
playing ? actions.audio.pause() : actions.audio.play()}
>
{playing ? PauseIcon : PlayIcon}
)
}
// player current time
export const PlayerTime = ({ play_ts, duration }) => (
{timestamp(clamp(play_ts, 0, duration))}
{' / '}
{timestamp(clamp(duration, 0, duration))}
)
// zoom button
export const ZoomPlus = (
)
export const SpeakerIcon = (
)