-
Notifications
You must be signed in to change notification settings - Fork 20
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #541 from cedardevs/445-granule-list-view
445 granule list view
- Loading branch information
Showing
75 changed files
with
6,432 additions
and
3,109 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
import React from 'react' | ||
|
||
export default class Video extends React.Component { | ||
componentDidMount() { | ||
// need to set dimensions intially before resize events | ||
this.debounceResize() | ||
// subsequent resize event will retrigger our calculation | ||
window.addEventListener('resize', this.debounceResize) | ||
} | ||
|
||
componentWillUnmount() { | ||
// remember to remove custom listeners before unmounting | ||
window.removeEventListener('resize', this.debounceResize) | ||
} | ||
|
||
debounceResize = () => { | ||
// prevent resize work unless threshold is reached | ||
// this helps ensure the new width doesn't stick on a transient value | ||
const resizeThreshold = 250 // ms | ||
clearTimeout(this.resizeId) | ||
this.resizeId = setTimeout(this.resize, resizeThreshold) | ||
} | ||
|
||
resize = () => { | ||
// do work only if iframe exists | ||
if (this.iframeRef) { | ||
// recall our aspect ratio from props | ||
const {aspectRatio} = this.props | ||
// get new width dynamically | ||
const iframeRect = this.iframeRef.getBoundingClientRect() | ||
const newWidth = iframeRect.width | ||
// maintain aspect ratio when setting height | ||
this.iframeRef.style.height = newWidth * aspectRatio + 'px' | ||
} | ||
} | ||
|
||
render() { | ||
const {link} = this.props | ||
return ( | ||
<iframe | ||
ref={iframeRef => { | ||
this.iframeRef = iframeRef | ||
}} | ||
src={link} | ||
frameBorder={0} | ||
allowFullScreen={true} | ||
style={{width: '100%'}} | ||
/> | ||
) | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -21,6 +21,13 @@ const styleH2 = { | |
margin: '0 0 0.618em 0', | ||
} | ||
|
||
const styleAccessibilityStatement = { | ||
marginTop: '1.618em', | ||
border: 'gray solid', | ||
padding: '1em', | ||
background: '#F9F9F9', | ||
} | ||
|
||
export default class Help extends React.Component { | ||
render() { | ||
return ( | ||
|
@@ -38,6 +45,28 @@ export default class Help extends React.Component { | |
and vast scale of NOAA's data. | ||
</p> | ||
<h2 style={styleH2}>{this.buildCountString()}</h2> | ||
<div style={styleAccessibilityStatement}> | ||
<h2 style={styleH2}>Accessibility Statement</h2> | ||
<p> | ||
NOAA OneStop is committed to providing access to all individuals | ||
who are seeking information from our website. We strive to meet or | ||
exceed requirements of Section 508 of the Rehabilitation Act, as | ||
amended in 1998. | ||
</p> | ||
<p> | ||
We recognize not all pages on our site are fully accessible at | ||
this time, however, we aim to meet Level AA accessibility for all | ||
of our features. We will continue to make improvements across our | ||
entire site until all pages are fully compliant. | ||
</p> | ||
<p> | ||
If you experience any challenges while accessing parts of our | ||
site, please contact{' '} | ||
<a href={'mailto:[email protected]'} style={{color: '#55ace4'}}> | ||
[email protected] | ||
</a> | ||
</p> | ||
</div> | ||
</section> | ||
</div> | ||
) | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.