Merge pull request #3880 from Ruxton/feature/oembed_providers

Oembed Update - Added instagram, better display for rich/photo

Changelog.md

@@ -17,6 +17,7 @@
 
 ## Features
 
+* Updates to oEmbed, added new providers and fixed photo display. [#3880](https://github.com/diaspora/diaspora/pull/3880)
 * Add 'screenshot tool' for taking before/after images of stylesheet changes. [#3797](https://github.com/diaspora/diaspora/pull/3797)
 * Add possibility to contact the administrator. [#3792](https://github.com/diaspora/diaspora/pull/3792)
 * Add simple background for unread messages/conversations mobile. [#3724](https://github.com/diaspora/diaspora/pull/3724)

app/assets/javascripts/app/views/content_view.js

@@ -82,8 +82,14 @@ app.views.OEmbed = app.views.Base.extend({
   },
 
   presenter:function () {
+    o_embed_cache = this.model.get("o_embed_cache")
+    if(o_embed_cache) {
+      typemodel = { rich: false, photo: false, video: false, link: false }
+      typemodel[o_embed_cache.data.type] = true
+      o_embed_cache.data.types = typemodel
+    }
     return _.extend(this.defaultPresenter(), {
-      o_embed_html : app.helpers.oEmbed.html(this.model.get("o_embed_cache"))
+      o_embed_html : app.helpers.oEmbed.html(o_embed_cache)
     })
   },
 

app/assets/templates/oembed_tpl.jst.hbs

@@ -1,5 +1,5 @@
 {{#if o_embed_cache}}
-    {{#if o_embed_cache.data.thumbnail_url}}
+    {{#if o_embed_cache.data.types.video }}
         <div class="thumb">
             <img src="{{o_embed_cache.data.thumbnail_url}}" />
             <div class="video-overlay">
@@ -17,6 +17,6 @@
             </div>
         </div>
     {{else}}
-        {{{o_embed_html}}}
+      {{{o_embed_html}}}
     {{/if}}
 {{/if}}

config/initializers/oembed.rb

@@ -9,12 +9,25 @@ require 'uri'
 
 OEmbedCubbies = OEmbed::Provider.new("http://cubbi.es/oembed")
 
+OEmbedDailyMotion = OEmbed::Provider.new("http://www.dailymotion.com/services/oembed")
+OEmbedDailyMotion << "http://www.dailymotion.com/video/*"
+
+OEmbedTwitter = OEmbed::Provider.new("https://api.twitter.com/1/statuses/oembed.json")
+OEmbedTwitter << "http://twitter.com/*/status/*"
+OEmbedTwitter << "https://twitter.com/*/status/*"
+
+# patch in support for new https soundcloud
+OEmbed::Providers::SoundCloud << "https://*.soundcloud.com/*"
+
 oembed_provider_list = [
   OEmbed::Providers::Youtube,
   OEmbed::Providers::Vimeo,
-  OEmbed::Providers::Flickr,
   OEmbed::Providers::SoundCloud,
-  OEmbedCubbies
+  OEmbed::Providers::Instagram,
+  OEmbed::Providers::Flickr,
+  OEmbedCubbies,
+  OEmbedDailyMotion,
+  OEmbedTwitter
 ]
 
 SECURE_ENDPOINTS = oembed_provider_list.map do |provider|

spec/javascripts/app/views/oembed_view_spec.js

@@ -13,7 +13,23 @@ describe("app.views.OEmbed", function(){
   });
 
   describe("rendering", function(){
-    context("with thumb", function() {
+
+    it("should set types on the data", function() {
+      this.view.render();
+      expect(this.view.model.get("o_embed_cache").data.types).toBeDefined();
+    });
+
+    context("is a video", function() {
+
+      beforeEach(function(){
+        this.statusMessage.set({"o_embed_cache" : {"data": {"html": "some html","thumbnail_url": "//example.com/thumb.jpg","type": "video"}}});
+      });
+
+      it("should set types.video on the data", function() {
+        this.view.render();
+        expect(this.view.model.get("o_embed_cache").data.types.video).toBe(true)
+      });
+
       it("shows the thumb with overlay", function(){
         this.view.render();
 
@@ -31,7 +47,7 @@ describe("app.views.OEmbed", function(){
       });
     });
 
-    context("no thumb", function() {
+    context("is not a video", function() {
       beforeEach(function(){
         this.statusMessage.set({"o_embed_cache" : {"data": {"html": "some html"}}});
       });

spec/javascripts/app/views/stream_faces_view_spec.js

@@ -5,7 +5,7 @@ describe("app.views.StreamFaces", function(){
     this.post2 = factory.post({author : factory.author({name : "John Stamos", id : 1987})})
     this.post3 = factory.post({author : factory.author({name : "Michelle Tanner", id : 1986})})
     this.post4 = factory.post({author : factory.author({name : "Barack Obama", id : 2000})})
-    this.post5 = factory.post({author : factory.author({name : "Obie-won Kenobie", id : 2020})})
+    this.post5 = factory.post({author : factory.author({name : "Obi-wan Kenobi", id : 2020})})
     this.post6 = factory.post({author : rebeccaBlack})
     this.post7 = factory.post({author : rebeccaBlack})