diff --git a/public/images/video-overlay.png b/public/images/video-overlay.png
new file mode 100644
index 000000000..dbeee2bb7
Binary files /dev/null and b/public/images/video-overlay.png differ
diff --git a/public/javascripts/app/templates/status-message.handlebars b/public/javascripts/app/templates/status-message.handlebars
index 32a128f5f..a20dfac00 100644
--- a/public/javascripts/app/templates/status-message.handlebars
+++ b/public/javascripts/app/templates/status-message.handlebars
@@ -19,9 +19,13 @@
{{#if o_embed_cache}}
{{#if o_embed_cache.data.thumbnail_url}}
-

- {{/if}}
+
+

+
+
+ {{else}}
{{{o_embed_html}}}
+ {{/if}}
{{/if}}
diff --git a/public/javascripts/app/views/content_view.js b/public/javascripts/app/views/content_view.js
index fe2b20a0d..12ae5e374 100644
--- a/public/javascripts/app/views/content_view.js
+++ b/public/javascripts/app/views/content_view.js
@@ -1,20 +1,25 @@
app.views.Content = app.views.StreamObject.extend({
+
+ events: {
+ "click .oembed .thumb": "showOembedContent"
+ },
+
presenter : function(){
return _.extend(this.defaultPresenter(), {
text : app.helpers.textFormatter(this.model),
- o_embed_html : embedHTML(this.model),
+ o_embed_html : this.embedHTML(),
largePhoto : this.largePhoto(),
smallPhotos : this.smallPhotos()
- })
+ });
+ },
- function embedHTML(model){
- if(!model.get("o_embed_cache")) { return ""; }
- var data = model.get("o_embed_cache").data;
- if(data.type == "photo") {
- return '
';
- } else {
- return data.html || ""
- }
+ embedHTML: function(){
+ if(!this.model.get("o_embed_cache")) { return ""; }
+ var data = this.model.get("o_embed_cache").data;
+ if(data.type == "photo") {
+ return '
';
+ } else {
+ return data.html || ""
}
},
@@ -28,6 +33,14 @@ app.views.Content = app.views.StreamObject.extend({
var photos = this.model.get("photos")
if(!photos || photos.length < 2) { return }
return photos.slice(1,8)
+ },
+
+ showOembedContent: function() {
+ var oembed = $(this.el).find(".oembed");
+ var embedHTML = $( this.embedHTML() );
+ var paramSeparator = ( /\\?/.test(embedHTML.attr("href")) ) ? "&" : "?";
+ embedHTML.attr("src", embedHTML.attr("src") + paramSeparator + "autoplay=1");
+ oembed.html( embedHTML );
}
})
diff --git a/public/javascripts/app/views/stream_view.js b/public/javascripts/app/views/stream_view.js
index 5b13acd59..7f456a274 100644
--- a/public/javascripts/app/views/stream_view.js
+++ b/public/javascripts/app/views/stream_view.js
@@ -61,13 +61,9 @@ app.views.Stream = Backbone.View.extend({
oembed = elem.find('.oembed'),
thumb = oembed.find('.thumb');
- if( thumb.length > 0 && oembed.is(':visible') ) {
- thumb.click(function(){
- oembed.find('*').toggle();
- $(this).hide();
- });
- oembed.find('*').toggle();
- }
+ if( thumb.length > 0 /*&& oembed.is(':visible')*/ ) {
+ thumb.show();
+ }
});
},
diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass
index 89627f61d..b35cc7e87 100644
--- a/public/stylesheets/sass/application.sass
+++ b/public/stylesheets/sass/application.sass
@@ -1828,9 +1828,21 @@ ul#press_logos
:color #777
.collapsible
- .oembed .thumb
- :display none
- :cursor pointer
+ .oembed
+ :background url('/images/ajax-loader2.gif') no-repeat center center
+
+ .thumb
+ :position relative
+ :display none
+ :cursor pointer
+
+ .video-overlay
+ :background url('/images/video-overlay.png') no-repeat center center
+ :position absolute
+ :top 0
+ :left 0
+ :right 0
+ :bottom 0
.conversation_participants
:z-index 3