Merge pull request #16 from CodersTV/video-time

Add duration of video on video listing

client/views/channels/channel.less

@@ -11,9 +11,31 @@
 }
 
 .image {
+  position: relative;
   .img-responsive {
     min-width: 100%;
   }
+  .duration {
+    padding: 3px;
+    position: absolute;
+    right: 7px;
+    bottom: 7px;
+    background-color: #5C4F4F;
+    color: #C0C0C0;
+    font-size: 16px;
+    -webkit-border-radius: 4px;
+    border-radius: 4px;
+
+    @media (min-width: 768px) {
+      bottom: 120px;
+    }
+    @media (min-width: 992px) {
+      bottom: 60px;
+    }
+    @media (min-width: 1200px) {
+      bottom: 7px;
+    }
+  }
 }
 
 .video-list {

client/views/channels/channels.html

@@ -40,6 +40,11 @@ <h1 class="oswald text-muted">Browse <em class="text-color">videos</em></h1>
           <img src="http://img.youtube.com/vi/{{URL}}/hqdefault.jpg" class="img-responsive" alt="{{title}}" title="{{title}}">
         </a>
         {{/if}}
+        {{#if duration}}
+        <div class="duration">
+          {{duration.minutes}}:{{duration.seconds}}
+        </div>
+        {{/if}}
       </div>
       <div class="caption">
         <h4 class="truncate text-color" title="{{title}}" alt="{{title}}">{{title}}</h4>

client/views/index/index.html

@@ -86,11 +86,9 @@ <h2 class="oswald text-center">Recent Videos</h2>
         </div>
       </div>
       <div class="container">
-        <div class="row row col-md-12 col-sm-12 col-md-offset-0 col-sm-offset-0">
           {{#each pastList}}
           {{> video_thumb}}
           {{/each}}
-        </div>
       </div>
     </div>
     <!-- // Recent Videos -->

lib/both/collections/channels.js

@@ -11,6 +11,21 @@ Channels.allowTags(function (userId) {
  *    return Channels.find({is_public: true});
  *  }
  */
+
+Channels.updateProcessed = function (_id, duration) {
+  var parsedDuration = Utils.parseVideoDuration(duration);
+
+  return Channels.update({
+    _id: _id
+  }, {
+    $set: {
+      isLive: false,
+      duration: parsedDuration      
+    }
+  });
+};
+
+// TODO: refactor into Channels
 Channel = (function () {
   function _validate (doc) {
     if ( !doc.title )

lib/utils.js

@@ -0,0 +1,29 @@
+Utils = {};
+
+Utils.parseVideoDuration = function (duration) {
+  if (! duration) {
+    return {};
+  }
+  var matches = duration.match(/[0-9]+[HMS]/g);
+  var parsed = {
+    hours: '00',
+    minutes: '00',
+    seconds: '00'
+  };
+
+  _.each(matches, function (part) {
+    var unit = part.charAt(part.length-1);
+    var amount = parseInt(part.slice(0, -1));
+    amount = ('0' + amount).slice(-2);
+
+    if (unit === 'H') {
+      parsed.hours = amount;
+    } else if (unit === 'M') {
+      parsed.minutes = amount;
+    } else {
+      parsed.seconds = amount;
+    }
+  });
+
+  return parsed;
+};

server/cleanup.js

@@ -28,9 +28,10 @@ Meteor.setInterval(function () {
 
     var status = video.status;
     var tags = video.snippet.tags;
+    var duration = video.contentDetails.duration;
 
     if (status.uploadStatus === 'processed') {
-      Channel.unset(channel._id);
+      Channels.updateProcessed(channel._id, duration);
     }
   });
 }, CLEANUP_INTERVAL);

server/lib/google.js

@@ -87,7 +87,7 @@ GPlus = {};
     var client = Youtube.getClient();
     var oauth2Client = Google.getOAuth2Client(user);
     var video = Async.runSync(function (done) {
-      var params = { id: videoID, part: 'snippet,status' };
+      var params = { id: videoID, part: 'snippet,status,contentDetails' };
 
       client.youtube.videos
         .list(params)