Plots2: Adding images and decription to tweets

[sagarpreet-chadha]

Hi, this is a first-timers-only issue. This means we've worked to make it more legible to folks who either haven't contributed to our codebase before, or even folks who haven't contributed to open source before.

If that's you, we're interested in helping you take the first step and can answer questions and help you out as you do. Note that we're especially interested in contributions from people from groups underrepresented in free and open source software!

If you have contributed before, consider leaving this one for someone new, and looking through our general help wanted issues. Thanks!

The Problem

Currently the tweets on PublicLab account have format :

The problem is that the image is not shown on tweets and the description of the shared article is not shown .

Example : For research note , https://publiclab.org/notes/cutlan/01-09-2018/kilimanjaro-citizen-science-1 , the tweet is this .

Solution

We need to change the tweets to this format :

The tweets are generated from the recipe (Learn more about recipes from here) https://ifttt.com/applets/66362400d-rss-feed-to-post-a-tweet-with-image-and-url , which tweets whenever there is change in the RSS feed of Publiclab.com site https://publiclab.org/feed.rss .

We need to change the format of our RSS Builder , https://github.com/publiclab/plots2/blob/master/app/views/notes/rss.rss.builder to produce correct RSS Feeds .

The correct RSS feed has format similar to this , https://sagarpreet-chadha.github.io/feed.rss (this is a static feed only for testing).

Also , you can verify that the generated xml is of correct format from this site , https://validator.w3.org/feed/check.cgi .

1.) Basically to add images and description , we need to add this :
<![CDATA[ <img src="http://img02.mini.abroad.imgcdc.com/english/photos/fun/90/20170711/1017495_339353.jpg.680x425.jpg" alt="Smiley face"> ]]>
inside the <description> tag , https://github.com/publiclab/plots2/blob/76da53269e42da218178d3697e11b50bfacf42dc/app/views/notes/rss.rss.builder#L20

2.)We need to remove the image tag inside <item> tag as <image> tag is not valid inside <item> tag .
Remove : https://github.com/publiclab/plots2/blob/76da53269e42da218178d3697e11b50bfacf42dc/app/views/notes/rss.rss.builder#L19

3.) Format of <author> tag is incorrect currently . The correct format is
<author> email-id (User-name) </author> .
https://github.com/publiclab/plots2/blob/76da53269e42da218178d3697e11b50bfacf42dc/app/views/notes/rss.rss.builder#L15

Feel free to ask any doubt regarding the issue ! Thank you !

Steps to Fix

• [ ] claim this issue with a comment here, below, and ask any clarifying questions you need
• [ ] set up a repository locally following the README instructions, and make sure that all tests pass
  
  
  
  • [ ] try to fix the issue following the steps above, but even before you're done, you can:
    
    commit your changes and start a pull request (see contributing to Public Lab software) but mark it as "in progress" if you have questions or if you haven't finished
  
  
• [ ] alert someone via the developers list (see below) to have your pull request merged. This may take a few extra steps depending on when you do it, but we'll help you out!

Please email the developers list (see https://publiclab.org/wiki/developers) or go to the chatroom if you have questions, and take a look at our first-timers landing page for more information!

[jywarren]

This is a multi-step issue, but we're here to help! Please open a pull request with your initial code and feel free to ask for help - we can look it over and provide support.

[Mujadded]

Can i claim it 😀 ?

[sagarpreet-chadha]

Yes @Mujadded , go for it ! Feel free to ask any doubt regarding the issue .

[sagarpreet-chadha]

@jywarren , is it live ?

[jywarren]

Not yet - it didn't quite make it by the Friday night update. I'll probably
run an update today too, though! Let's check back in!

On Sun, Jan 14, 2018 at 12:25 AM, Sagarpreet Chadha <
[email protected]> wrote:

@jywarren https://github.com/jywarren , is it live ?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/publiclab/plots2/issues/1958#issuecomment-357489693,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AABfJ2wDLBOTQwHteXFoa9SbpagOEImZks5tKY_ZgaJpZM4Ra1ti
.

[jywarren]

It'll shortly go up on staging.publiclab.org -- check it out there to see
if the RSS feed looks correct! Then we'll publish later in the day. Thanks!!

On Tue, Jan 16, 2018 at 12:53 PM, Jeffrey Warren [e-mail] wrote:

Not yet - it didn't quite make it by the Friday night update. I'll
probably run an update today too, though! Let's check back in!

On Sun, Jan 14, 2018 at 12:25 AM, Sagarpreet Chadha <
[email protected]> wrote:

@jywarren https://github.com/jywarren , is it live ?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/publiclab/plots2/issues/1958#issuecomment-357489693,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AABfJ2wDLBOTQwHteXFoa9SbpagOEImZks5tKY_ZgaJpZM4Ra1ti
.

[jywarren]

OK, it's live now!

[sagarpreet-chadha]

https://publiclab.org/feed.rss seems to be not working . Looking into it .

[jywarren]

server log:

Completed 500 Internal Server Error in 58ms (ActiveRecord: 10.5ms)

ActionView::Template::Error (undefined method `main_images' for #<Node:0x007f6eb3869240>
Did you mean?  main_image
               main_image_id):
     8:    @notes.each do |node|
     9: 
    10:      body = node.latest.render_body
    11:      body = "<p><![CDATA[ <img src='"+node.main_images.path(:default)+"' alt='"+node.main_image.title+"' > ]]></p> " + node.body if node.main_image
    12: 
    13:      xml.item do
    14:        xml.title       node.title
  app/views/notes/rss.rss.builder:11:in `block (3 levels) in _app_views_notes_rss_rss_builder__1936050186063288318_50813960'
  app/views/notes/rss.rss.builder:8:in `block (2 levels) in _app_views_notes_rss_rss_builder__1936050186063288318_50813960'
  app/views/notes/rss.rss.builder:3:in `block in _app_views_notes_rss_rss_builder__1936050186063288318_50813960'
  app/views/notes/rss.rss.builder:2:in `_app_views_notes_rss_rss_builder__1936050186063288318_50813960'
  app/controllers/notes_controller.rb:309:in `block (2 levels) in rss'
  app/controllers/notes_controller.rb:307:in `rss'

[jywarren]

easy fix! and we should make a functional test for this :-)

[jywarren]

Sorry, TravisCI is stalled for some hours ... waiting for that to come back before publishing!

[jywarren]

The feed is now working: https://publiclab.org/feed/liked.rss

I just enabled the IFTTT recipe too. Fingers X!

[jywarren]

And i posted a photo and liked it -- this should trigger the script! https://publiclab.org/notes/warren/01-18-2018/pre-order-the-community-written-pocket-guide-to-grassroots-mapping

[jywarren]

It didn't work! Not sure why:

[jywarren]

Error:

EntryAuthor
warren
EntryContent
<p><![CDATA[ <img src='https://publiclab.org/system/images/photos/000/023/198/medium/26068242_2000536900161090_8104197322948214784_n.jpg' alt='' > ]]></p>This 3.5 x 5.5 inch illustrated booklet was printed at the AS220 community print shop by Jacque Bidon, and includes 64 pages of illustrated community-developed guidance and tips on balloon and kite mapping. It was [collaboratively written](<a href="https://publiclab.org/notes/warren/07-01-2017/collaboratively-write-the-new-pocket-guide-to-grassroots-mapping">https://publiclab.org/notes/warren/07-01-2017/collaboratively-write-the-new-pocket-guide-to-grassroots-mapping</a>) by dozens of Public Lab community members. Shown is the final mockup -- the final print will be in red ink. Available for pre-order now at $10 each! We expect to ship in February 2018: <a href="https://store.publiclab.org/products/pocket-guide-to-grassroots-mapping">https://store.publiclab.org/products/pocket-guide-to-grassroots-mapping</a> ![image description](<a href="https://publiclab.org/system/images/photos/000/023/199/large/download.jpg">https://publiclab.org/system/images/photos/000/023/199/large/download.jpg</a> "download.jpg")
EntryImageUrl
http://ifttt.com/images/no_image_card.png
EntryPublished
January 17, 2018 at 08:13PM
EntryTitle
Pre-order the community-written Pocket Guide to Grassroots Mapping
EntryUrl
https://publiclab.org/notes/warren/01-18-2018/pre-order-the-community-written-pocket-guide-to-grassroots-mapping
FeedTitle
Recent research notes on PublicLab.org
FeedUrl
https://publiclab.org/feed.rss

[jywarren]

I've turned the IFTTT script off for now! I wonder what happened?

[jywarren]

Ooh, do we need an "enclosure" line? As per https://sagarpreet-chadha.github.io/feed.rss

<enclosure url="http://www.publiclab.org/system/images/photos/000/023/122/medium/PIC2.jpg" length="78645" type="image/jpeg" />

[jywarren]

This looks right, but I'm not sure how to add an <enclosure> tag to rss.builder

[jywarren]

OK i got url= but not sure if we need type or length -- ? Can we test in your test setup, @sagarpreet-chadha ?

[jywarren]

I'll be able to re-activate using this: https://ifttt.com/applets/70744657d-rss-feed-to-post-a-tweet-with-image-and-url

[sagarpreet-chadha]

Oh so sorry , i had an exam in college , couldn't respond earlier .

[sagarpreet-chadha]

The latest feed seems to work fine on my test setup :
https://github.com/sagarpreet-chadha/sagarpreet-chadha.github.io/blob/c3bcddea127ce0449d960da45c764d0b9b61c78d/feed.rss#L136

here is the image :

[sagarpreet-chadha]

The image is shown due to <![CDATA[ <img src=' and not <enclosure> tag !
We may remove that enclosure tag .

Tested this here : https://github.com/sagarpreet-chadha/sagarpreet-chadha.github.io/blob/d044a8c9a7124909dba78e0e2570b65a35f6d96a/feed.rss#L154

[sagarpreet-chadha]

@jywarren , you were right it gets auto-truncated 😄 !!

[jywarren]

Reopening -- one more thing, it tries to post an image even if there isn't an enclosure tag... Not sure how to stop this!

We may need to use a default image? But that's not a great solution.

@ebarry @steviepubliclab could we use someone's profile picture?

[jywarren]

Are you totally sure about enclosure? I think we have to do more testing. And to figure out how to not post an image if there isn't one.

[jywarren]

This is a tough one! I disabled the ifttt script for now. Thanks for working on it!

[sagarpreet-chadha]

I agree this is indeed a tricky one , learned a lot though . Thank you !

[jywarren]

OK, i've hooked it up to https://twitter.com/pl_testing and
https://gist.github.com/jywarren/055bf4471dbdfff6a1ebd21bf15c3c8f; will add
a new item soon and see if it works.

On Thu, Jan 18, 2018 at 12:04 PM, Sagarpreet Chadha <
[email protected]> wrote:

I agree this is indeed a tricky one , learned a lot though . Thank you !

—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
https://github.com/publiclab/plots2/issues/1958#issuecomment-358712896,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AABfJ_yWoPuqd1PmDZ0JLEojW2Ef3OlWks5tL3mtgaJpZM4Ra1ti
.

[jywarren]

Hmm, i can't seem to get this working effectively. Can you double check that enclosure is definitely not it?

[sagarpreet-chadha]

Yes , i am pretty sure , also do try Mozilla Firefox to open your .rss file , it shows the rss feed with image and title .
Like this :

[sagarpreet-chadha]

Also , https://gist.github.com/jywarren/055bf4471dbdfff6a1ebd21bf15c3c8f file shows following errors according to https://validator.w3.org/feed/check.cgi .

I think resolving these and removing enclosure tag may do the job .

[sagarpreet-chadha]

Also @jywarren , i was thinking of not using the IFTTT recipes as these are not very flexible . I was thinking of using twitter gem , it has a very easy function client.update() to post on twitter . And we can post on twitter almost instantly (at the same time when the author post on publiclab.org site) and hence not waiting for IFTTT recipe to to run . However it might be a big project .
What do you think ? 😄

[jywarren]

Hi, you know, I think that the twitter gem may be a way forward. But it does sound like a big project, and after all we have an API and RSS feeds specifically for integration -- i don't (architecturally) much like the idea of baking additional channels of publication into the core code.

I'd like to give this another attempt. Let's, for now, assume we can fall back to a profile picture if that exists, and the Public Lab logo (publiclab.org/logo) if /that/ doesn't exist.

So the remaining problem is how to get the image to appear in Twitter.

Actually while I see your test looks good, it only demonstrates that the image makes it into the RSS feed and is RSS compliant. We also need to know that the IFTTT feed is reading either the image from the item content, OR from the <enclosure> tag.

One clue, however, is that your original demonstration that got all the way to Twitter, included <enclosure> WITH a length attribute, which my test lacked. We could think about attaching file size but it's complicated.

Let's see if we can narrow down the problem using your original demo. Can you do your original test (https://sagarpreet-chadha.github.io/feed.rss) using <enclosure> without length, and if that breaks the system, we know that's the problem?

Thanks -- this is complex and I appreciate your time on it!

[jywarren]

It could also be the type="image/jpeg" part of <enclosure> -- testing this idea here: https://publiclab.org/feed-tmp.rss + https://twitter.com/pl_testing

[sagarpreet-chadha]

Hi , working on it .

Also @jywarren , i was thinking of an alternative and thought of this :

1.) Use this recipe to post on FB page :

2.)And then using this recipe , to post on Twitter (image is handled automatically and also description comes automatically) :

What do you think ?

[jywarren]

hmm, it's not type -- i checked that using the feed-tmp.rss feed and pl_testing account. Testing length now.

[jywarren]

Oh, cool -- maybe that can work! Does the Facebook/Twitter hybrid handle when only some posts have images?

[jywarren]

yeah, nope -- length didn't help. I'm going to try both at once, but yeah... https://twitter.com/pl_testing

[jywarren]

OK, for reference, none of the last ~8 items in this feed work: https://publiclab.org/feed-tmp.rss

[sagarpreet-chadha]

Yes @jywarren , Unfortunately when the FB post does not has image then this recipe is working https://ifttt.com/applets/10891p-share-facebook-page-updates-on-twitter and when FB post has an image then this https://ifttt.com/applets/263954p-autopost-from-facebook-page-to-twitter is working fine .

Also in FB post , if we give only the link of node in the RSS , then the FB automatically fetches the image (if any) .

[sagarpreet-chadha]

I think this combination of recipes may work ! What do you think ?

Also mine RSS Feed to Twitter is not working , so i am not able to test the RSS feed . Trying to resolve this ! Thanks 👍