import React from 'react'
import { connect } from 'react-redux'
import actions from 'app/actions'
import { 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(setVolume ? 0.0 : 1.0)}>
))
// play / pause button
export const PlayIcon = (
)
export const PauseIcon = (
)
export const PlayButton = ({ playing }) => {
return (
playing ? actions.audio.pause() : actions.audio.play()}
>
{playing ? PauseIcon : PlayIcon}
)
}
// player current time
export const PlayerTime = ({ play_ts, duration }) => (
{timestamp(play_ts)}
{' / '}
{timestamp(duration)}
)
// zoom button
export const ZoomPlus = (
)