Skip to content

Commit 83d7126

Browse files
eplebeleplebel
authored
Merge pull request #147 from ScienceCommons/staging
merge Staging into production
2 parents 9f2cee6 + 79b842b commit 83d7126

File tree

4 files changed

+773
-675
lines changed

4 files changed

+773
-675
lines changed

‎dist/js/bundle.js‎

Lines changed: 682 additions & 604 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/EmbeddedViewer.jsx‎

Lines changed: 1 addition & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { createContainer } from 'unstated-next'
44

55
import { concat } from 'lodash'
66
import { makeStyles } from '@material-ui/styles';
7-
import { Button, Icon, IconButton } from '@material-ui/core'
7+
import { Button, Icon } from '@material-ui/core'
88

99
import { TOPBAR_HEIGHT } from './TopBar.jsx';
1010

@@ -14,11 +14,6 @@ const useStyles = makeStyles(theme => ({
1414
display: 'none',
1515
}
1616
},
17-
viewerTopBar: {
18-
background: '#333',
19-
width: '100%',
20-
textAlign: 'right',
21-
},
2217
}))
2318

2419

@@ -90,27 +85,8 @@ export default withRouter(function EmbeddedViewer({ history }) {
9085
closeViewer()
9186
}, [history.location.pathname])
9287

93-
// Close viewer on ESC
94-
useEffect(() => {
95-
if (viewer_visible) {
96-
function close_on_escape(event) {
97-
if (event.key === 'Escape') {
98-
closeViewer()
99-
}
100-
}
101-
102-
window.addEventListener('keyup', close_on_escape);
103-
return () => window.removeEventListener('keyup', close_on_escape);
104-
}
105-
}, [viewer_visible]);
106-
10788
return (
10889
<div className={classes.viewer} style={style}>
109-
<div className={classes.viewerTopBar}>
110-
<IconButton onClick={closeViewer} title="Close embedded viewer" style={{ color: '#999' }}>
111-
<Icon>close</Icon>
112-
</IconButton>
113-
</div>
11490
<iframe style={{height: '100%', width: '100%', border: 'solid 1px', flex: 1}} src={view_url.url}></iframe>
11591
</div>
11692
)

‎src/components/ViewEmbeddedContentButton.jsx‎

Lines changed: 44 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -16,66 +16,67 @@ const useStyles = makeStyles(theme => ({
1616
}))
1717

1818

19-
20-
function url_contains(url, strings) {
21-
return some(strings, (string) => includes(url, string))
22-
}
19+
export function is_url_valid(url, mediaType) {
20+
function url_contains(url, strings) {
21+
return some(strings, (string) => includes(url, string))
22+
}
2323

2424

25-
function pdf_url_is_valid(url) {
26-
const valid_urls = ['open.lnu.se/index.php', 'readcube.com/articles']
27-
const denied_urls = [
28-
'academia.edu.documents',
29-
'core.ac.uk',
30-
'github.com',
31-
'psycnet.apa.org/fulltext',
32-
'researchgate.net',
33-
]
25+
function pdf_url_is_valid(url) {
26+
const valid_urls = ['open.lnu.se/index.php', 'readcube.com/articles']
27+
const denied_urls = [
28+
'academia.edu.documents',
29+
'core.ac.uk',
30+
'github.com',
31+
'psycnet.apa.org/fulltext',
32+
'researchgate.net',
33+
]
3434

35-
if (url_contains(url, denied_urls)) return false
36-
if (url_contains(url, valid_urls)) return true
35+
if (url_contains(url, denied_urls)) return false
36+
if (url_contains(url, valid_urls)) return true
3737

38-
return endsWith(url, '.pdf')
39-
}
38+
return endsWith(url, '.pdf')
39+
}
4040

4141

42-
function html_url_is_valid(url) {
43-
const valid_urls = ['github.io', 'distill.pub']
44-
if (includes(url, 'frontiersin.org/articles') && endsWith(url, 'full')) return true
45-
if (url_contains(url, valid_urls)) return true
46-
return endsWith(url, '.html')
47-
}
42+
function html_url_is_valid(url) {
43+
const valid_urls = ['github.io', 'distill.pub']
44+
if (includes(url, 'frontiersin.org/articles') && endsWith(url, 'full')) return true
45+
if (url_contains(url, valid_urls)) return true
46+
return endsWith(url, '.html')
47+
}
4848

4949

50-
function preprint_url_is_valid(url) {
51-
const denied_urls = ['github.com', 'psycnet.apa.org/fulltext', 'academia.edu.documents']
52-
if (url_contains(url, denied_urls)) return false
50+
function preprint_url_is_valid(url) {
51+
const denied_urls = ['github.com', 'psycnet.apa.org/fulltext', 'academia.edu.documents']
52+
if (url_contains(url, denied_urls)) return false
5353

54-
return endsWith(url, '.pdf')
55-
}
54+
return endsWith(url, '.pdf')
55+
}
5656

5757

58-
function url_is_valid(url, mediaType) {
59-
// We can only embed content from https URLs
60-
if (!startsWith(url, 'https')) return false
58+
function url_is_valid(url, mediaType) {
59+
// We can only embed content from https URLs
60+
if (!startsWith(url, 'https')) return false
6161

62-
switch(mediaType) {
63-
case 'pdf':
64-
return pdf_url_is_valid(url)
62+
switch(mediaType) {
63+
case 'pdf':
64+
return pdf_url_is_valid(url)
6565

66-
case 'html':
67-
return html_url_is_valid(url)
66+
case 'html':
67+
return html_url_is_valid(url)
6868

69-
case 'preprint':
70-
return preprint_url_is_valid(url)
69+
case 'preprint':
70+
return preprint_url_is_valid(url)
7171

72-
default:
73-
return false
72+
default:
73+
return false
7474

75+
}
7576
}
77+
return url_is_valid(url, mediaType)
7678
}
7779

78-
7980
export default function ViewEmbeddedContentButton({ iconStyle, mediaType, style, url }) {
8081
const classes = useStyles()
8182
let view_url
@@ -91,13 +92,14 @@ export default function ViewEmbeddedContentButton({ iconStyle, mediaType, style,
9192
const lessThanXl = useMediaQuery('(max-width:1499px)')
9293
if (lessThanXl) return null
9394

94-
if (!url_is_valid(url, mediaType)) return null
95+
if (!is_url_valid(url, mediaType)) return null
9596

9697
if (mediaType === 'pdf') {
9798
url += '#view=FitH'
9899
}
99100

100101
function toggle_viewer(url) {
102+
mediaType === 'pdf' ? url = url.replace('#view=FitH', '') : null
101103
if (view_url.url === url) {
102104
view_url.clear_url()
103105
} else {

‎src/pages/ArticlePage.jsx‎

Lines changed: 46 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import ArticleActions from '../components/ArticleActions.jsx';
66
import ArticleEditor from '../components/ArticleEditor.jsx';
77
import ArticleContent from '../components/ArticleContent.jsx';
88
import Loader from '../components/shared/Loader.jsx';
9+
import { is_url_valid } from '../components/ViewEmbeddedContentButton.jsx'
10+
import { ViewURL } from '../components/EmbeddedViewer.jsx';
911

1012
import C from '../constants/constants';
1113

@@ -14,8 +16,7 @@ import { json_api_req, simple_api_req } from '../util/util.jsx'
1416
import Card from '@material-ui/core/Card';
1517
import CardContent from '@material-ui/core/CardContent';
1618
import { withStyles } from '@material-ui/core/styles';
17-
18-
19+
import useMediaQuery from '@material-ui/core/useMediaQuery';
1920
const styles = theme => ({
2021
root: {
2122
paddingTop: 20,
@@ -30,6 +31,19 @@ const styles = theme => ({
3031
},
3132
})
3233

34+
// prepare HOC to apply ViewURL hook in the class component
35+
const withViewURL = (Component) => {
36+
function WrappedComponent(props) {
37+
let view_url = ViewURL.useContainer()
38+
return <Component view_url={view_url} {...props} />
39+
}
40+
return WrappedComponent
41+
}
42+
43+
const withMediaQuery = (...args) => Component => props => {
44+
const mediaQuery = useMediaQuery(...args);
45+
return <Component media_query={mediaQuery} {...props} />;
46+
}
3347

3448
class ArticlePage extends React.PureComponent {
3549
constructor(props) {
@@ -70,6 +84,7 @@ class ArticlePage extends React.PureComponent {
7084
this.setState({loading: true}, () => {
7185
json_api_req('GET', `/api/articles/${article_id}/`, {}, null, (res) => {
7286
this.setState({ article: res, loading: false })
87+
this.load_viewer()
7388
}, (err) => {
7489
this.setState({loading: false})
7590
})
@@ -96,6 +111,34 @@ class ArticlePage extends React.PureComponent {
96111
}
97112
}
98113

114+
load_viewer() {
115+
const view_url = this.props.view_url
116+
const pdf_url = this.state.article.pdf_url
117+
const html_url = this.state.article.html_url
118+
const preprint_url = this.state.article.preprint_url
119+
if (!this.props.media_query) {
120+
if (is_url_valid(html_url, 'html')) {
121+
view_url.update_url(html_url)
122+
}
123+
124+
else if (is_url_valid(pdf_url, 'pdf') && !is_url_valid(html_url)) {
125+
view_url.update_url(pdf_url)
126+
}
127+
128+
else if (is_url_valid(preprint_url, 'preprint') && !is_url_valid(html_url, 'html') && !is_url_valid(pdf_url, 'pdf')) {
129+
view_url.update_url(preprint_url)
130+
}
131+
132+
else {
133+
return null
134+
}
135+
}
136+
137+
else {
138+
return null
139+
}
140+
}
141+
99142
render() {
100143
const { classes, show_date, user_session} = this.props
101144
const {
@@ -112,7 +155,6 @@ class ArticlePage extends React.PureComponent {
112155
:
113156
<div className="ArticleWithActions">
114157
<div className="Article">
115-
116158
<Card className={classes.card}>
117159
<CardContent className={classes.cardContent}>
118160
<ArticleContent
@@ -141,4 +183,4 @@ class ArticlePage extends React.PureComponent {
141183
}
142184
}
143185

144-
export default withRouter(withCookies(withStyles(styles)(ArticlePage)))
186+
export default withMediaQuery('(max-width:1499px)')(withViewURL(withRouter(withCookies(withStyles(styles)(ArticlePage)))))

0 commit comments

Comments
 (0)