blob: 957aee41f3f8caaf9f4f94373676283aac86e96c (
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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
|
import React, { Component } from 'react'
import actions from 'app/actions'
import { writeToClipboard } from 'app/utils'
import { Arrow } from '../nav/viewer.icons'
import { URLS } from 'app/constants'
export default class ViewerSectionsShare extends Component {
state = {
copied: false,
}
constructor(props){
super(props)
this.copyToClipboard = this.copyToClipboard.bind(this)
}
copyToClipboard() {
const url = URLS.share_url
writeToClipboard(url).then(() =>{
clearTimeout(this.timeout)
this.setState({ copying: true, copied: false, })
this.timeout = setTimeout(() => {
this.setState({ copying: true, copied: true })
this.timeout = setTimeout(() => this.setState({ copied: false, copying: false, }), 2200)
}, 50)
})
}
render() {
const { viewer } = this.props
let className = "nav-share"
if (this.state.copying) className += " copying"
if (this.state.copied) className += " copied"
const title = "Animism: Episode 1"
const url = URLS.share_url
const mailtoURL = (
"mailto:?subject=" + encodeURIComponent(title) +
"&body=" + encodeURIComponent("I want to share this post on e-flux: " + url + "\n\n\n")
)
const facebookURL = (
"https://www.facebook.com/sharer.php" +
"?u=" + encodeURIComponent(url) +
"&t=" + encodeURIComponent(title)
)
const twitterURL = (
"https://twitter.com/intent/tweet" +
"?url=" + encodeURIComponent(url) +
"&text=" + encodeURIComponent(title)
)
return (
<div className={className}>
<div>
<div className="share-option">
<a href={mailtoURL}>Email</a>
</div>
<div className="share-option">
<a href={facebookURL}>Facebook</a>
</div>
<div className="share-option">
<a href={twitterURL}>Twitter</a>
</div>
<div className="share-option">
<div className="share-copy" onClick={this.copyToClipboard}>
Copy Link
<span className="share-success">success</span>
</div>
</div>
</div>
<ShareLink type={'down'} />
</div>
)
}
}
const ShareLink = ({ type }) => (
<div className="nav-return" onClick={() => actions.viewer.hideNavComponent('share')}>
<Arrow type={type} />
{'Share'}
</div>
)
|
