Added the current time and total time labels

src/js/sass/multimedia.scss

@@ -63,11 +63,11 @@ $progress-color: #000;
 		}
 	}
 
-	.wet-boew-multimedia-controls-start {
+	.wet-boew-multimedia-controls-start, .wet-boew-multimedia-timeline-current {
 		float:left;
 	}
 
-	.wet-boew-multimedia-controls-end {
+	.wet-boew-multimedia-controls-end, .wet-boew-multimedia-timeline-total {
 		float:right;
 	}
 
@@ -80,6 +80,10 @@ $progress-color: #000;
 		padding: 2px 4px;
 	}
 
+	.wet-boew-multimedia-timeline-inner {
+		margin:0 70px;
+	}
+
 	progress {
 		@include border;
 		color:$progress-color;
@@ -88,6 +92,7 @@ $progress-color: #000;
 		margin:2px 0;
 		&::-moz-progress-bar {
 			background: $progress-color;
+			display:block;
 		}
 		&::-webkit-progress-value {
 			background: $progress-color;

src/js/sass/mutlimedia-ie7.scss

@@ -11,5 +11,9 @@
 				height:18px;
 			}
 		}
+
+		.wet-boew-multimedia-timeline-inner progress {
+			margin-top:-22px;
+		}
 	}
 }

src/js/workers/multimedia.js

@@ -195,7 +195,7 @@
 				});
 
 				//Map media events (For flash, must use other element than object because it doesn't trigger or receive events)
-				evtmgr.on('loadeddata progress timeupdate seeked canplay play volumechange pause ended captionsloaded captionsloadfailed captionsvisiblechange', $.proxy(function (e) {
+				evtmgr.on('timeupdate seeked canplay play volumechange pause ended captionsloaded captionsloadfailed captionsvisiblechange', $.proxy(function (e) {
 					var $w = $(this),
 						b,
 						p,
@@ -235,17 +235,18 @@
 						}
 						break;
 					case 'timeupdate':
-						p = Math.round(this.getCurrentTime() / this.getDuration() * 1000)/10;
+						p = Math.round(this.getCurrentTime() / this.getDuration() * 1000) / 10;
 						timeline = $w.find('.wet-boew-multimedia-timeline progress');
 						timeline.attr('value', p);
+
+						$w.find('.wet-boew-multimedia-timeline-current').text(_pe.fn.multimedia._format_time(this.getCurrentTime()));
+						$w.find('.wet-boew-multimedia-timeline-total').text(_pe.fn.multimedia._format_time(this.getDuration()));
+
 						//Update captions
 						if ($.data(e.target, 'captions') !== undefined) {
 							_pe.fn.multimedia._update_captions($w.find('.wet-boew-multimedia-captionsarea'), this.getCurrentTime(), $.data(e.target, 'captions'));
 						}
 						break;
-					case 'progress':
-						/*if (this.getBuffered() > 1) {console.log(Math.round(this.getBuffered()/ this.getDuration() * 1000)/10);}*/
-						break;
 					case 'captionsloaded':
 						//Store the captions
 						$.data(e.target, 'captions', e.captions);
@@ -268,7 +269,7 @@
 		_get_ui : function (id) {
 			var ui = $('<div class="wet-boew-multimedia-controls">'),
 				ui_start = $('<div class="wet-boew-multimedia-controls-start">'),
-				ui_timeline = $('<div class="wet-boew-multimedia-timeline" tabindex="0"><progress value="0" max="100"/>'),
+				ui_timeline = $('<div class="wet-boew-multimedia-timeline" tabindex="0"><div class="wet-boew-multimedia-timeline-current">00:00:00</div><div class="wet-boew-multimedia-timeline-total">--:--:--</div><div class="wet-boew-multimedia-timeline-inner"><progress value="0" max="100" /></div>'),
 				ui_end = $('<div class="wet-boew-multimedia-controls-end">');
 
 			ui_start.append(
@@ -394,6 +395,24 @@
 			}
 		},
 
+		_format_time : function (current) {
+			var t = "",
+				i,
+				c,
+				p;
+			current = Math.floor(current);
+
+			for (i = 2; i >= 0; i -= 1) {
+				p = Math.pow(60, i);
+				c = Math.floor(current / p);
+				if (t !== "") { t += ":"; }
+				t += _pe.string.pad(c, 2);
+				current -= p * c;
+			}
+
+			return t;
+		},
+
 		_load_captions : function (evtmgr, src) {
 			var parse_time,
 				parse_html,