Merge pull request itsnubix#211 from emersonlsg10/feature/negative-co…

…unter Feature/negative counter
Abhishek2250 · May 7, 2021 · 541b6f1 · 541b6f1
2 parents 1acf47c + 4f26a4b
commit 541b6f1
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 3 deletions.
diff --git a/README.md b/README.md
@@ -69,6 +69,12 @@ In addition, the `<VideoPlayer />` also takes these props:
 | style                        | StyleSheet   | null    | React Native StyleSheet object that is appended to the video's parent `<View>`                                                                                   |
 | tapAnywhereToPause           | Boolean      | false   | If true, single tapping anywhere on the video (other than a control) toggles between playing and paused.                                                         |
 
+| showTimeRemaining            | Boolean      | true    | If true, show the time remaing, else show the current time in the Player.
+`<View>`
+
+| showHours                    | Boolean      | false   | If true, convert time to hours in the Player
+`<View>`
+
 ### Events
 
 These are various events that you can hook into and fire functions on in the component:

diff --git a/VideoPlayer.js b/VideoPlayer.js
@@ -31,6 +31,8 @@ export default class VideoPlayer extends Component {
     volume: 1,
     title: '',
     rate: 1,
+    showTimeRemaining: true,
+    showHours: false,
   };
 
   constructor(props) {
@@ -51,7 +53,8 @@ export default class VideoPlayer extends Component {
 
       isFullscreen:
         this.props.isFullScreen || this.props.resizeMode === 'cover' || false,
-      showTimeRemaining: true,
+      showTimeRemaining: this.props.showTimeRemaining,
+      showHours: this.props.showHours,
       volumeTrackWidth: 0,
       volumeFillWidth: 0,
       seekerFillWidth: 0,
@@ -562,10 +565,22 @@ export default class VideoPlayer extends Component {
     const symbol = this.state.showRemainingTime ? '-' : '';
     time = Math.min(Math.max(time, 0), this.state.duration);
 
-    const formattedMinutes = padStart(Math.floor(time / 60).toFixed(0), 2, 0);
+    if (!this.state.showHours) {
+      const formattedMinutes = padStart(Math.floor(time / 60).toFixed(0), 2, 0);
+      const formattedSeconds = padStart(Math.floor(time % 60).toFixed(0), 2, 0);
+
+      return `${symbol}${formattedMinutes}:${formattedSeconds}`;
+    }
+
+    const formattedHours = padStart(Math.floor(time / 3600).toFixed(0), 2, 0);
+    const formattedMinutes = padStart(
+      (Math.floor(time / 60) % 60).toFixed(0),
+      2,
+      0,
+    );
     const formattedSeconds = padStart(Math.floor(time % 60).toFixed(0), 2, 0);
 
-    return `${symbol}${formattedMinutes}:${formattedSeconds}`;
+    return `${symbol}${formattedHours}:${formattedMinutes}:${formattedSeconds}`;
   }
 
   /**