-
Notifications
You must be signed in to change notification settings - Fork 14
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: adding rewind control button (#128)
- Loading branch information
Dvir Hazout
committed
Nov 7, 2017
1 parent
4468e7c
commit 1bef5d6
Showing
7 changed files
with
100 additions
and
10 deletions.
There are no files selected for viewing
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 @@ | ||
export default from './rewind'; |
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,74 @@ | ||
//@flow | ||
import style from '../../styles/style.scss'; | ||
import { h } from 'preact'; | ||
import { Localizer, Text } from 'preact-i18n'; | ||
import BaseComponent from '../base'; | ||
import { default as Icon, IconType } from '../icon'; | ||
|
||
/** | ||
* Default rewind step | ||
* @type {number} number of seconds | ||
* @const | ||
*/ | ||
const DEFAULT_STEP = 10; | ||
|
||
/** | ||
* RewindControl component | ||
* | ||
* @class RewindControl | ||
* @example <RewindControl player={this.player} step={5} /> | ||
* @extends {BaseComponent} | ||
*/ | ||
class RewindControl extends BaseComponent { | ||
|
||
/** | ||
* Creates an instance of RewindControl. | ||
* @param {Object} obj obj | ||
* @memberof RewindControl | ||
*/ | ||
constructor(obj: Object) { | ||
super({name: 'Rewind', player: obj.player}); | ||
} | ||
|
||
/** | ||
* rewind click handler | ||
* | ||
* @returns {void} | ||
* @memberof RewindControl | ||
*/ | ||
onClick(): void { | ||
let step = this.props.step || DEFAULT_STEP; | ||
|
||
if (this.player.currentTime - step < 0) { | ||
this.player.currentTime = 0; | ||
} | ||
else { | ||
this.player.currentTime = this.player.currentTime - step; | ||
} | ||
} | ||
|
||
/** | ||
* render component | ||
* | ||
* @param {*} props - component props | ||
* @returns {React$Element} - component element | ||
* @memberof RewindControl | ||
*/ | ||
render(props: any): React$Element<any> | void { | ||
return ( | ||
<div className={[style.controlButtonContainer, style.controlRewind].join(' ')}> | ||
<Localizer> | ||
<button | ||
aria-label={<Text id={'controls.rewind'} />} | ||
className={style.controlButton} | ||
onClick={() => this.onClick()} | ||
> | ||
<Icon type={(!props.step || props.step === 10) ? IconType.Rewind10 : IconType.Rewind} /> | ||
</button> | ||
</Localizer> | ||
</div> | ||
) | ||
} | ||
} | ||
|
||
export default RewindControl; |
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