diff --git a/src/components/Audioplayer/Segments/index.js b/src/components/Audioplayer/Segments/index.js
index 90b210a48..80a4c0139 100644
--- a/src/components/Audioplayer/Segments/index.js
+++ b/src/components/Audioplayer/Segments/index.js
@@ -4,7 +4,6 @@ import Helmet from 'react-helmet';
import debug from 'helpers/debug';
class Segments extends Component {
-
shouldComponentUpdate(nextProps) {
return [
this.props.currentVerse !== nextProps.currentVerse,
diff --git a/src/components/Audioplayer/index.js b/src/components/Audioplayer/index.js
index a12dccf51..cfac5abd2 100644
--- a/src/components/Audioplayer/index.js
+++ b/src/components/Audioplayer/index.js
@@ -52,8 +52,8 @@ export class Audioplayer extends Component {
return false;
}
- // When you go directly to the chapter page, /2, the files are not loaded yet
- if (this.props.isLoadedOnClient !== nextProps.isLoadedOnClient) {
+ // First load
+ if (this.props.currentFile !== nextProps.currentFile) {
return this.handleAddFileListeners(nextProps.currentFile);
}
@@ -384,7 +384,6 @@ export class Audioplayer extends Component {
duration,
chapter,
isPlaying,
- isLoadedOnClient,
repeat, // eslint-disable-line no-shadow
shouldScroll, // eslint-disable-line no-shadow
setRepeat // eslint-disable-line no-shadow
@@ -406,15 +405,15 @@ export class Audioplayer extends Component {
return (
- {isLoadedOnClient ?
+ {
+ currentFile &&
: null}
+ />
+ }
{
- isLoadedOnClient &&
segments &&
- segments[currentVerse] &&
segments[currentVerse] &&
this.handleOptionSelected(translation.id)}
>
- {render(translation)}
+ {render(translation)}
);
diff --git a/src/components/ReciterDropdown/index.js b/src/components/ReciterDropdown/index.js
index 31cd3163a..b6e407407 100644
--- a/src/components/ReciterDropdown/index.js
+++ b/src/components/ReciterDropdown/index.js
@@ -27,11 +27,13 @@ class ReciterDropdown extends Component {
>
onOptionChange({ audio: slug.id })}
>
- {slug.reciterNameEng} {slug.style ? `(${slug.style})` : ''}
+
+ {slug.reciterNameEng} {slug.style ? `(${slug.style})` : ''}
+
));
diff --git a/src/components/Verse/index.js b/src/components/Verse/index.js
index 7a6a004e5..d68af8483 100644
--- a/src/components/Verse/index.js
+++ b/src/components/Verse/index.js
@@ -24,7 +24,6 @@ const Share = Loadable({
});
class Verse extends Component {
-
// TODO: Should this belong here?
componentDidMount() {
const { verse, audio } = this.props;
@@ -145,7 +144,7 @@ class Verse extends Component {
tooltip={tooltip}
isPlaying={isPlaying}
audioActions={audioActions}
- audioPosition={word.wordId ? wordAudioPosition += 1 : null}
+ audioPosition={word.charType === 'word' ? wordAudioPosition += 1 : null}
isSearched={isSearched}
useTextFont={renderText}
/>
@@ -316,7 +315,7 @@ Verse.propTypes = {
currentWord: PropTypes.number, // gets passed in an integer, null by default
iscurrentVerse: PropTypes.bool,
currentVerse: PropTypes.string,
- userAgent: PropTypes.func,
+ userAgent: PropTypes.object, // eslint-disable-line
audio: PropTypes.number.isRequired,
loadAudio: PropTypes.func.isRequired
};
diff --git a/src/components/Verse/style.scss b/src/components/Verse/style.scss
index 1db6feccd..46fcad6c4 100644
--- a/src/components/Verse/style.scss
+++ b/src/components/Verse/style.scss
@@ -29,9 +29,10 @@
display: block;
text-decoration: none;
font-size: 12px;
+ cursor: pointer;
- &:hover{
- cursor: pointer;
+ &:focus{
+ color: $text-muted;
}
}
.label{
@@ -142,4 +143,3 @@
width: 100%;
margin: 0px auto;
}
-
diff --git a/src/components/Word/index.js b/src/components/Word/index.js
index 2c496209f..3d501631d 100644
--- a/src/components/Word/index.js
+++ b/src/components/Word/index.js
@@ -10,7 +10,6 @@ const CHAR_TYPE_RUB = 'rub';
const CHAR_TYPE_SAJDAH = 'sajdah';
class Word extends Component {
-
buildTooltip = (word, tooltip) => {
let title;
@@ -57,7 +56,7 @@ class Word extends Component {
let spacer;
const highlight = currentVerse === word.verseKey && isPlaying ? 'highlight' : '';
const className = `${useTextFont ? 'text-' : ''}${word.charType === CHAR_TYPE_WORD ? word.className : 'p0'} ${word.charType} ${highlight} ${word.highlight ? word.highlight : ''}`;
- const id = `word-${word.verseKey.replace(/:/, '-')}-${audioPosition || word.position}`;
+ const id = `word-${word.verseKey.replace(/:/, '-')}-${audioPosition}`;
if (word.charType === CHAR_TYPE_END) {
text = zeroPad(word.verseKey.split(':')[1], 3, 0);
@@ -94,7 +93,7 @@ Word.propTypes = {
tooltip: PropTypes.string,
audioActions: PropTypes.object.isRequired, // eslint-disable-line
audioPosition: PropTypes.number,
- currentVerse: PropTypes.string.isRequired,
+ currentVerse: PropTypes.string,
isPlaying: PropTypes.bool,
isSearched: PropTypes.bool,
useTextFont: PropTypes.bool // tmp change to compare text and code based rendering
diff --git a/src/containers/Search/index.js b/src/containers/Search/index.js
index c83efa6a7..16ce18edb 100644
--- a/src/containers/Search/index.js
+++ b/src/containers/Search/index.js
@@ -130,6 +130,7 @@ class Search extends Component {
match={entities[result].match}
key={entities[result].verseKey}
tooltip={options.tooltip}
+ userAgent={options.userAgent}
isSearched
/>
));