diff --git a/app/assets/javascripts/app/helpers/open_graph.js b/app/assets/javascripts/app/helpers/open_graph.js index bc821e320..f106b681f 100644 --- a/app/assets/javascripts/app/helpers/open_graph.js +++ b/app/assets/javascripts/app/helpers/open_graph.js @@ -3,10 +3,10 @@ (function(){ app.helpers.openGraph = { html : function (open_graph_cache) { - if (!open_graph_cache) { return "" } - return '' - } - } + if (!open_graph_cache) { return ""; } + return ''; + }, + }; })(); // @license-end diff --git a/app/assets/javascripts/app/helpers/truncate.js b/app/assets/javascripts/app/helpers/truncate.js new file mode 100644 index 000000000..4e72b5c56 --- /dev/null +++ b/app/assets/javascripts/app/helpers/truncate.js @@ -0,0 +1,10 @@ +(function() { + app.helpers.truncate = function(passedString, length) { + if (passedString.length > length) { + var lastBlank = passedString.lastIndexOf(' ', length); + var trimstring = passedString.substring(0, Math.min(length, lastBlank)); + return new Handlebars.SafeString(trimstring + " ..."); + } + return new Handlebars.SafeString(passedString); + }; +})(); diff --git a/app/assets/javascripts/app/views/content_view.js b/app/assets/javascripts/app/views/content_view.js index 7c829c74b..01226fdab 100644 --- a/app/assets/javascripts/app/views/content_view.js +++ b/app/assets/javascripts/app/views/content_view.js @@ -116,7 +116,25 @@ app.views.OEmbed = app.views.Base.extend({ }); app.views.OpenGraph = app.views.Base.extend({ - templateName : "opengraph" + templateName : "opengraph", + + initialize: function() { + this.truncateDescription(); + }, + + truncateDescription: function() { + // truncate opengraph description to 250 for stream view + if(this.model.has('open_graph_cache')) { + var ogdesc = this.model.get('open_graph_cache'); + ogdesc.description = app.helpers.truncate(ogdesc.description, 250); + } + } +}); + +app.views.SPVOpenGraph = app.views.OpenGraph.extend({ + truncateDescription: function () { + // override with nothing + } }); // @license-end diff --git a/app/assets/javascripts/app/views/single-post-viewer/single_post_content_view.js b/app/assets/javascripts/app/views/single-post-viewer/single_post_content_view.js index 439237ec4..87d81d5a5 100644 --- a/app/assets/javascripts/app/views/single-post-viewer/single_post_content_view.js +++ b/app/assets/javascripts/app/views/single-post-viewer/single_post_content_view.js @@ -16,7 +16,7 @@ app.views.SinglePostContent = app.views.Base.extend({ initialize : function() { this.singlePostActionsView = new app.views.SinglePostActions({model: this.model}); this.oEmbedView = new app.views.OEmbed({model : this.model}); - this.openGraphView = new app.views.OpenGraph({model : this.model}); + this.openGraphView = new app.views.SPVOpenGraph({model : this.model}); this.postContentView = new app.views.ExpandedStatusMessage({model: this.model}); this.pollView = new app.views.Poll({ model: this.model }); }, diff --git a/app/helpers/open_graph_helper.rb b/app/helpers/open_graph_helper.rb index 4ee10a7a0..f587bc69d 100644 --- a/app/helpers/open_graph_helper.rb +++ b/app/helpers/open_graph_helper.rb @@ -45,7 +45,7 @@ module OpenGraphHelper "
" + " " + " #{cache.title}" + - "

#{cache.description}

" + + "

#{truncate(cache.description, length: 250, separator: ' ')}

" + "
" + "" end diff --git a/spec/javascripts/app/views/stream_post_spec.js b/spec/javascripts/app/views/stream_post_spec.js index 319b09871..b997902fe 100644 --- a/spec/javascripts/app/views/stream_post_spec.js +++ b/spec/javascripts/app/views/stream_post_spec.js @@ -42,6 +42,14 @@ describe("app.views.StreamPost", function(){ "ob_type": "article" }; + var open_graph_cache_extralong = { + "url": "http://example.com/articles/123", + "title": "Example title", + "description": Array(62).join("Test description"), // 992 chars + "image": "http://example.com/thumb.jpg", + "ob_type": "article" + }; + beforeEach(function(){ loginAs({name: "alice", avatar : {small : "http://avatar.com/photo.jpg"}}); @@ -114,6 +122,12 @@ describe("app.views.StreamPost", function(){ var view = new app.views.StreamPost({model : this.statusMessage}).render(); expect(view.$el.html()).not.toContain(open_graph_cache.title) }) + it("truncates long opengraph descriptions in stream view to be 250 chars or less", function() { + this.statusMessage.set({"open_graph_cache" : open_graph_cache_extralong}); + + var view = new app.views.StreamPost({model : this.statusMessage}).render(); + expect(view.$el.find('.og-description').html().length).toBeLessThan(251); + }); }) context("user not signed in", function(){