diff --git a/source/Ox.UI/js/Video/VideoPreview.js b/source/Ox.UI/js/Video/VideoPreview.js
index 41f7ed0f..d99e8cd6 100644
--- a/source/Ox.UI/js/Video/VideoPreview.js
+++ b/source/Ox.UI/js/Video/VideoPreview.js
@@ -35,7 +35,7 @@ Ox.VideoPreview = function(options, self) {
stopLoading();
self.$frame.attr({src: self.options.getFrame()})
.css(getFrameCSS());
- self.$timeline.css({width: self.options.width + 'px'});
+ self.$timeline && self.$timeline.css({width: self.options.width + 'px'});
}
})
.addClass('OxVideoPreview')
@@ -56,11 +56,13 @@ Ox.VideoPreview = function(options, self) {
.css(getFrameCSS())
.appendTo(self.$frameElement);
- self.$timeline = $('')
- .addClass('OxTimeline')
- .attr({src: self.options.timeline})
- .css({width: self.options.width + 'px'})
- .appendTo(that.$element);
+ if(self.options.timeline) {
+ self.$timeline = $('')
+ .addClass('OxTimeline')
+ .attr({src: self.options.timeline})
+ .css({width: self.options.width + 'px'})
+ .appendTo(that.$element);
+ }
self.$interface = Ox.Element({
tooltip: function(event) {
@@ -103,7 +105,7 @@ Ox.VideoPreview = function(options, self) {
function getFrameCSS() {
var css = {},
elementWidth = self.options.width,
- elementHeight = self.options.height - 16,
+ elementHeight = self.options.height - (self.options.timeline ? 16 : 0),
elementRatio = elementWidth / elementHeight,
frameRatio = self.options.frameRatio,
frameIsWider = frameRatio > elementRatio;
@@ -115,8 +117,8 @@ Ox.VideoPreview = function(options, self) {
} else {
css.width = frameIsWider ? elementWidth : elementHeight * frameRatio;
css.height = frameIsWider ? elementWidth / frameRatio : elementHeight;
- css.marginLeft = frameIsWider ? 0 : (css.width - elementWidth) / 2;
- css.marginTop = frameIsWider ? (css.height - elementHeight) / 2 : 0;
+ css.marginLeft = frameIsWider ? 0 : (elementWidth - css.width) / 2;
+ css.marginTop = frameIsWider ? (elementHeight - css.height) / 2 : 0;
}
return Ox.map(css, function(value) {
return Math.round(value) + 'px';