blob: f8c289253c6c3e2a9fe5b6207e78a443b5e50bec (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
import React, { Component } from 'react'
import { connect } from 'react-redux'
import {
EfluxLogo, EfluxClose, EfluxMenu
} from './eflux.icons'
import { PlayButton } from './viewer.icons'
import actions from 'app/actions'
const EfluxChrome = React.memo(({ navStyle, playing, transcriptOpen, started, growlOpen, growlMessage }) => (
<div className={"eflux-header " + navStyle + (transcriptOpen ? ' transcript-open' : '')}>
<div className="eflux-logo">
<a href="/">
{EfluxLogo}
</a>
</div>
<div className={growlOpen ? "growl-message open" : "growl-message"}>
{growlMessage}
</div>
<div className="eflux-nav">
<PlayButton playing={playing} />
<div className="transcript-icon" onClick={() => actions.viewer.toggleComponent('transcript')}>
{EfluxMenu}
</div>
</div>
</div>
))
const mapStateToProps = state => ({
navStyle: state.viewer.navStyle,
playing: state.audio.playing,
transcriptOpen: state.viewer.transcript,
growlOpen: state.viewer.growlOpen,
growlMessage: state.viewer.growlMessage,
})
export default connect(mapStateToProps)(EfluxChrome)
|
