73 lines
No EOL
1.6 KiB
JavaScript
73 lines
No EOL
1.6 KiB
JavaScript
`use strict`
|
|
import { Component } from 'inferno'
|
|
import { connect } from 'inferno-redux'
|
|
|
|
import { fetchBlogList, fetchBlogEntry } from './actions'
|
|
|
|
import './blog_entry.scss'
|
|
|
|
|
|
class BlogEntryComponent extends Component
|
|
{
|
|
constructor(props) {
|
|
super(props)
|
|
this.entry_date = this.props.match.params.entry_date
|
|
this.entry_name = this.props.match.params.entry_name
|
|
}
|
|
|
|
componentDidMount()
|
|
{
|
|
if(this.props.blog_list.length === 0)
|
|
{
|
|
this.props.fetchBlogList()
|
|
}
|
|
if(this.props.blog_entry_name !== this.entry_name)
|
|
{
|
|
this.props.fetchBlogEntry(this.entry_date, this.entry_name)
|
|
}
|
|
}
|
|
|
|
render()
|
|
{
|
|
return [
|
|
<div className="blog-entry"
|
|
dangerouslySetInnerHTML={this.props.blog_entry_name === this.entry_name ?
|
|
{__html: this.props.blog_entry} : null}>
|
|
</div>,
|
|
<div id="image-container" onclick={() => close_image()}>
|
|
<img id="image-view"/>
|
|
</div>,
|
|
<script>
|
|
{`
|
|
function open_image(src)
|
|
{
|
|
document.getElementById("image-view").src = src
|
|
document.getElementById("image-container").style.display = 'flex'
|
|
}
|
|
|
|
function close_image()
|
|
{
|
|
document.getElementById("image-container").style.display = 'none'
|
|
}`}
|
|
</script>
|
|
]
|
|
}
|
|
}
|
|
|
|
|
|
const mapStateToProps = state => ({
|
|
strings: state.lang.strings,
|
|
blog_list: state.blog.list,
|
|
blog_entry: state.blog.entry,
|
|
blog_entry_name: state.blog.entry_name
|
|
})
|
|
|
|
const mapDispatchToProps = dispatch => ({
|
|
fetchBlogList: () => dispatch(fetchBlogList()),
|
|
fetchBlogEntry: (entry_date, entry_name) => dispatch(fetchBlogEntry(entry_date, entry_name))
|
|
})
|
|
|
|
export default connect(
|
|
mapStateToProps,
|
|
mapDispatchToProps
|
|
)(BlogEntryComponent) |