identosphere.net v 1.0 [pluto feedreader]

[infominer]

Yay! My very first planet!

https://identosphere.net/

Still have some work to go... 

I'd like to include images on the 'full-vew'.. and probably I need to go through and make a list of which feeds aren't loading.

For now I'm super happy. It's been a labor of love over the past month. Looking forward to shifting focus for a bit, but it might be difficult to pull myself away from endlessly tweaking my template.

-infominer

[Gerald Bauer]

Hello,

    Thanks for sharing the planet news. And thanks for adding Identosphere to the planets [1] page.  Keep it up. Cheers. Prost.

[1] https://github.com/feedreader/planets

[infominer]

Another milestone was grabbing images from the content\summary and then displaying them with reasonable css max-width, and only over https

<% if item.content %>

<%= sanitize( item.content ) %>

<%

doc = Nokogiri::HTML(item.content)

src = doc.css("img").attribute('src').to_s

%>

<% if src.include? "http:" %>

<% src.sub!(/http:/,'https:') %>

<% end %>

<% if src.nil? %>

<% elsif src.include? "stat?event=post.clientViewed" %>

<% elsif src.include? "profile.jpg" %>

<% else %>

<div class="photo">

<%= image_tag("#{ src }") %>

</div>

<% end %>

<% elsif item.summary %>

<%= sanitize( item.summary ) %>

<%

doc = Nokogiri::HTML(item.summary)

src = doc.css("img").attribute('src').to_s

%>

<% if src.include? "http:" %>

<% src.sub!(/http:/,'https:') %>

<% end %>

<% if src.nil? %>

<% elsif src.include? "stat?event=post.clientViewed" %>

<% elsif src.include? "profile.jpg" %>

<% else %>

<div class="photo">

<%= image_tag("#{ src }") %>

</div>

<% end %>

<% else %>

-/-

<% end %>

All I need now is some overflow protection... now testing...

overflow-wrap: break-word;

the problem is on mobile some long strings overflow... but I think I'll wrangle it

[infominer]

ok... that was a bit premature, but now I'm getting somewhere

, pre, .wrap {

white-space: -moz-pre-wrap; /* Mozilla, since 1999 */

white-space: -pre-wrap; /* Opera 4-6 */

white-space: -o-pre-wrap; /* Opera 7 */

word-wrap: break-word; /* Internet Explorer 5.5+ */

word-break: break-all;

}

Some css to catch all the unwrapping lines of text

Also trying out this sanitize gem... Idk if I really need it... but it's quite configurable.. and I was really struggling with how to catch all the overflowy \ not wrapping segments... but it was too much trouble to try and use images with it, much easier to just pull out an image and have control on how to display it.

<div class='wrap'>

<% if item.content %>

<%= Sanitize.fragment(item.content,

:elements => ['a','blockquote','code','br','p'],

:attributes => {

'a' => ['href', 'title'],

'blockquote' => ['cite'],

},

:protocols => {

'a' => {'href' => ['http', 'https', 'mailto']}

}) %>

<%

doc = Nokogiri::HTML(item.content)

src = doc.css("img").attribute('src').to_s

%>

<% if src.include? "http:" %>

<% src.sub!(/http:/,'https:') %>

<% end %>

<% if src.nil? %>

<% elsif src.include? "stat?event=post.clientViewed" %>

<% elsif src.include? "profile.jpg" %>

<% else %>

<div class="photo">

<%= image_tag("#{ src }") %>

</div>

<% end %>

<% elsif item.summary %>

<%= Sanitize.fragment(item.summary,

:elements => ['a','blockquote','code','br','p'],

:attributes => {

'a' => ['href', 'title'],

'blockquote' => ['cite'],

},

:protocols => {

'a' => {'href' => ['http', 'https', 'mailto']}

}) %>

<%

doc = Nokogiri::HTML(item.content)

src = doc.css("img").attribute('src').to_s

%>

<% if src.include? "http:" %>

<% src.sub!(/http:/,'https:') %>

<% end %>

<% if src.nil? %>

<% elsif src.include? "stat?event=post.clientViewed" %>

<% elsif src.include? "profile.jpg" %>

<% else %>

<div class="photo">

<%= image_tag("#{ src }") %>

</div>

<% end %>

<% else %>

-/-

<% end %>

</div>

</div>

So now I have full-text image and a snippet preview image for all posts supporting that (except for some relative url I haven't quite figured yet).

[Gerald Bauer]

Hello,

   Fantastic. Thanks for sharing your tips and code on how to better display the article (html) source.  Yeah, the current sanitize helper is way too simple (it strips out all images).

  Great to see better alternatives. Keep it up. Cheers. Prost.