This show has been flagged as Clean by the host.
Episode 4 - Embed Mastodon
Threads
This is Episode 4 of the Plain Text Programs Podcast hosted at Hacker
Public Radio. As always I will include links with the show notes rather
than reading them on the podcast except there will be one exception to
that today, the link to my Plain Text Blog, home.gamerplus.org.
My blog and this podcast were my inspiration for writing the Embed
Mastodon Threads program. Besides posting the show notes at Hacker
Public Radio where they have a comments section I also post them at my
blog. Then I make a Mastodon post that includes a link to the show notes
on my blog and designate it as being the comment thread for that episode
of the podcast. I also post a link to the comment thread on Mastodon in
my show notes. Or at least I did in the past.
It came to mind that it would be nice to be able to display the
comment thread at the bottom of the blog post. So I made a Mastodon post
about this, and I quote.
So here's my idea.
I want to use mastodon toots as a comment thread for my blog
posts.
At the bottom of the blog post I want to embed the toot and the
replies.
I can pull the toot id from the embed code.
Then I want to make a database query to get all the replies to that
toot.
Then I can generate the embed codes needed to show the toot and all
the replies.
I'm a mysql guy, not postgres. Also a Mastodon newb.
I want to know how to get the reply ids for a toot.
Any help, links, etc?
End quote.
I immediately got responses from some programmers expressing interest
in the idea and giving good advice.
I did some research based on their suggestions. I had a good night's
sleep. And then I made another post in the morning. And I quote.
Mastodon is so great.
I had this idea last night and fiddled around with it long enough to
realize I was doing it wrong.
So I made a post on Mastodon and almost immediately got help.
I found some good info on the Mastodon API.
I wake up this morning to more help and I found out about using curl
in php to make https requests.
Then a musician friend of mine who I've been following since before
Mastodon sends a working example, with code, in a javascript
environment.
And I've got a plan.
End quote.
So credit where credit is due.
The programmers, gamers, and musicians helping me were:
Jeff the GenX Alien
@
[email protected]
EcksDy
@
[email protected]
Malin
@
[email protected]
and
Wayne Myers
@
[email protected]
Now, I've known Wayne Myers since before I was ever on Mastodon. We
share an interest in free culture music and I have played his songs on
my radio show, Something Blue, recorded by his band, Fit and the
Conniptions.
He sent some links in a couple of comments to other blogs that were
embedding Mastodon threads which confirmed that my idea could work.
Jeff the GenX Alien gave me some significant technical help. And I
quote.
Use tootcli to learn everything you need to know about the inner
workings of Mastodon.
https://github.com/ihabunek/toot
Whatever the API supports so does toot.
End quote.
So I looked into tootcli and the Mastodon API and I realized that I
didn't need to access the database for my program, I could just use the
API.
So, thanks Jeff.
My second clue came from EcksDy. And I quote.
I've got some help too. Using the Mastodon API and curl in php it
should be doable.
End quote.
So then I started to research using curl in PHP to retrieve json data
from the Mastodon API and that's what I went with.
I set up a testbed and Malin chimed in with test results. He
continued to help with testing and ideas throughout the rest of the
project.
That's why Mastodon is so great! Way better than consulting an AI
bot.
So I had my work cut out for me. Here is where this program is like
my Plain Text Programs. I work hard, up front, until I am convinced that
I have an idea that will be easy to implement. This is much easier than
doing it the hard way first and then rewriting the program later after
it becomes difficult to maintain.
I said I had a plan. This was my plan.
Write a PHP program that will generate a webpage that can be embedded
in an iframe. This program will take a link as a parameter included in
the url.
Get that link from the Mastodon embed code for the parent post.
Use the API to retrieve the data associated with the parent post
including the replies.
Then generate the page by inserting the appropriate data into
Mastodon's existing embed structure.
That's kind of a broad framework but it certainly seemed doable. And
it was.
So first I wanted to make the API call so I could look at the
data.
I found this video by Alejandro AO.
How to easily create cURL API requests in PHP (Wordpress, Laravel,
Symfony) https://www.youtube.com/watch?v=iRLgEWMNA6w&t=602s
He recommended that you use curl in the terminal to test your API
call. Then you use a web app called Curl-to-PHP to generate your PHP
code to make the same API call from your program.
My first time consuming stumbling block was what I call the problem
with the colon.
There are some great documents detailing the syntax for API calls
which I will link to in the show notes.
And where you are supposed to insert an id they show that as :id.
Like an idiot I thought the colon was part of the syntax, not as they
intended, a marker to indicate insert your id here. This is why I like
to see actual code examples in syntax documents.
Anyway I couldn't get it to work so I searched around until I found
some code examples and that turned on the lightbulb in my head.
Now I was able to make API calls using curl in the terminal. I copied
the working curl command and pasted it into the Curl-to-PHP website and
it output some code. And it worked! Which I was very glad about because
previous research into how to make API calls with PHP was confusing to
say the least. Sometimes PHP gifts you with and abundance of riches
which doesn't always make life easier.
So I made my API call from my program. The Curl-to-PHP code returned
$result. And then I used the json_decode command to turn the result
string into an array of Mastodon data.
$obj = json_decode($result, true);
And I could use the print_r command to look at that data.
print_r($obj);
I immediately put the print_r command at the bottom of my program
where it resides today as commented out debug code. This way while I was
looking at my program output I could just scroll down or search to find
what the actual data looked like.
So I fumbled around for a while before I figured out that I would
need the id and the url to make my idea work.
Accessing json data is reading an array. So easy peasy or maybe not.
This code returns the id of the reply from inside a while loop where $i
is the index.
$id = $obj['descendants'][$i]['id'];
Like I said, it looks easy now. Needless to say it took some head
scratching to figure out the exact syntax.
I used to be a mason and people would always ask me how I learned
masonry. I'd look them in the eye and say, "Trowel and error". There
was, in fact, a lot of trowel and error going on.
So then I generated the embed code to display each post and it
worked. For all of my posts. Not for replies from other servers.
So I scrolled down and examined the json data and I found the url
field that had all the info about the replies, server, username, and id.
So I picked up the url field the same way I picked up the id field and
updated my code with the url server and name.
This still didn't work. After staring at the json data for a while
the light finally dawned. The id I was using was the gamerplus id from
my server. The id I needed to use was in the url field from their
server.
Now that I had become enlightened it was easy to notice that the url
field contained the exact info that I needed to use in the embed.
Remember what I said about doing it the hard way before you replaced
that code with the easy way. That can happen even when you have a
plan.
So by using the url data in the embed I have less string handling and
fewer lines of code.
I went to bed and in the morning I made this post. And I quote. >
> I am able to pull the urls from the json call so that should solve
the missing comments issue. > > And then it comes down to the
issue of data structures. > > KISS > > I have decided, for
now, to display the comments in chronological order without concern for
whether a comment is a reply to the post or a reply to another comment.
> > A chronological list rather than a tree. > > Easy to
implement (kind of/relatively) and easy to understand. Also no indents.
> > This project will be licensed GPL so I am certainly open to
others applying other data structures to the data display. Everything
you need to display a tree is in the json. > > End quote.
So the data structure I needed is called a multidimensional array or
an array of arrays.
In terms of a database table it is two columns and a bunch of
rows.
In terms of PHP arrays it's an array where each element is an array
with two values in it, the id and the url. Now, in my case, the id is
from the gamerplus server. The url is from whatever server the replyer
calls home.
I initialize the array with the parent post.
$ids = array(array($id,$url));
You can see the nested arrays in the code.
Then I add items to the array like this.
$ids[] = array($id,$url);
I access an array item like this.
foreach($ids as $id) {
$url = $id[1];
The 1 refers to the second element of the array because programmers
start counting at 0.
Then using the url and the domain that I captured from the GET
parameter that passes the parent url into the program I build the iframe
embed for that post using the Mastodon embed as a template.
Which worked but the posts weren't displayed in chronological order.
Because the json data isn't necessarily in chronological order.
So I had to sort the multidimensional array on the id. Which isn't as
straight forward as the sort() command.
So I found this article on stackoverflow called
How do I sort a multidimensional array by one of the fields of
the inner array in PHP?
It had a two line solution that I modified to work with my array.
And now all my posts were in chronological order.
Stack Overflow code is licensed CC BY which is one way compatible
with the GPL. Just include the attribution in a comment.
My first post quoted above was posted on Friday, October 25, at 8:40
PM.
On Monday, October 28 at 8:52 PM I wrote, "Here's the blog post proof
of concept/working code."
Three days from "I have an idea" to "working code". That wasn't all I
did in those three days. Saturday I had a repertoire session with my
band, Jazz Buskers. Sunday I produced my radio show, Something Blue. But
when I'm in the middle of a programming project I get hyper focused.
Sometimes I have to force myself to step away.
And I have worked on the code a little bit today. And I will in the
future too. I did a lot of testing today and some Mastodon servers
and/or accounts just don't support embeds. But if you want to use Embed
Mastodon Threads on your blog or website your toot will probably be the
parent and if it works on your account, you're good.
Also posts from different servers look different. Sometimes the
background color is different. Sometimes the links look different.
Sometimes the whole post is a link to that post on Mastodon.
I decided to embrace that as a feature rather than a bug with the
different look making it easier to distinguish posts made on Gamer+ from
posts made on other servers.
I have uploaded Embed Mastodon Threads to home.gamerplus.org. At my
blog I have a post called Embed Mastodon Threads Hosted On Gamerplus
where I say, "The program is licensed GPL and I will put up a codeberg
repository so you can download it and install it wherever you want. But
feel free to use my server." And then I go into detail about just how to
do that in the embedded comments thread.
The program is 46 lines of code with 11 lines of comments including
attribution comments and debug code that is commented out. So 35 lines
of code. Over three days that's 12 lines of code a day. About double
normal expectations for a programmer.
This has been a long podcast, certainly longer than most of my
podcasts will be. But I wrote it right after I did the project and it
gave me an opportunity to discuss the development process. There were
many issues I had that I didn't mention but I think I hit the high
points.
Throughout the whole project I was posting to my threads on Mastodon
so that also helped me check back on the development history of this
three day project. The stream of boosts and replies from my compatriots
helped keep me going too.
It was a rush!
So this is not exactly a plain text program because it uses a
database accessed through the Mastodon API. Still, I do not have to
maintain that database, it's just there on every Mastodon instance,
ready to use.
Most of my plain text programs are web apps or web pages. This one is
a web service.
And it is simple to use. All you have to be able to do is copy the
embed code from Mastodon, extract the link, and paste the link into the
url that calls the web service. Then you put that url into an iframe on
your blog or web page.
I have a help page for using Embed Mastodon Threads in the same
directory as the thread.php program where you can generate and copy your
iframe code. In fact the help page is also a Plain Text Program which I
may talk about in a future podcast. On the help page are instructions on
how to get a link from the Mastodon embed code. Then you paste the link
into a form and hit submit. The page generates your iframe embed code
that you can use in your blog or web page. The page also displays what
the embedded thread will look like.
If you would rather download the code and install your own instance
of Embed Mastodon Threads I have a codeberg repository. Again all the
links are in the show notes at Hacker Public Radio and at my blog at
home.gamerplus.org.
If you have questions you can reply to a thread on Mastodon or email
me at
[email protected]. If you don't have a mastodon account
you can get one at gamerplus.org.
Links
My Plain Text Blog
https://home.gamerplus.org/
Embed Mastodon Threads Help Page
https://home.gamerplus.org/Embed_Mastodon_Threads/
Codeberg Repository
https://codeberg.org/hairylarry/EmbedMastodonThreads
From Jeff the GenX Alien
Use tootcli to learn everything you need to know about the inner
workings of Mastodon.
https://github.com/ihabunek/toot
Whatever the API supports so does toot.
How to easily create cURL API requests in PHP (Wordpress,
Laravel, Symfony)
https://www.youtube.com/watch?v=iRLgEWMNA6w&t=602s
Curl-to-PHP
https://incarnate.github.io/curl-to-php/
Playing with public data - Mastodon documentation
https://docs.joinmastodon.org/client/public/
Status - Mastodon documentation
https://docs.joinmastodon.org/entities/Status/
Context - Mastodon documentation
https://docs.joinmastodon.org/entities/Context/
How do I sort a multidimensional array by one of the fields of
the inner array in PHP?
https://stackoverflow.com/questions/2426917/how-do-i-sort-a-multidimensional-array-by-one-of-the-fields-of-the-inner-array-i
Embed Mastodon Threads Hosted On Gamerplus
https://home.gamerplus.org/permalink.php?fname=Embed_Mastodon_Threads_Hosted_On_Gamerplus.txt
Gamer+DBN Mastodon server
https://gamerplus.org
Provide feedback on this episode.
Netherlands