More web comics?

Hi all,

I’m new to the forum, the scriptable beta and also JavaScript, so a good mix I’m sure you’ll agree! :grinning:

I’ve just been playing around with some of the example scripts in Scriptable, and came across the comics one. Does anyone have any examples of other web comics you’ve been able to do something similar with?
I’ve had a look at Garfield, Dilbert, ExtraLife / Scott Johnson’s comic and Cyanide and Happiness, but I can’t get anything to work. I’m assuming it’s just the feed URL itself that’s causing the issue (seeing as that’s all I changed). Is there a way to work out / find the JSON field URL for various web comics like those mentioned above?

Not the most useful use for something so powerful, I know, but you’ve got to start somewhere :slight_smile:

Thanks in advance for any thoughts!

1 Like

Hey,

You could always scrape the website for the URL. For example, when looking at the source code for explosm.net you’ll notice that the image for the latest Cyanide and Happiness comic has id=“main-comic”. That should make it pretty easy to extract the image URL.

2 Likes

Hey!

Thanks for getting back to me so quickly. That’s a really good idea, thank you. Let me see if I can do anything with that then :slight_smile:

1 Like

Well, I tried to pretend I knew what you were talking about @simonbs but … I failed miserably haha.
I’ve inspected the code and can indeed see that the daily comic is pulled via the main-comic id, but to be honest I’ve no idea what to do with this information …
I’ve started running through some JS courses, so as and when I work it out I’ll come back and update this thread :slight_smile:

Hey,

So I tried to make a script that shows the latest Cyanide and Happiness comic. It turns out their mobile website looks a little different than their desktop website. Here’s an outline of the flow my script is going through:

  1. Load the frontpage of explosm.net.
  2. Find the URL for the details page for the latest comic.
  3. Load the details page for the latest comic.
  4. Find the URL for the actual image of the comic.
  5. Load the image.
  6. Present it using QuickLook.

I’ll post the script below but I urge you to try to implement it yourself - or some of the steps at least. It’s great for learning :blush:

// Load the frontpage of explosm.net to find the URL for the details page for the latest comic.
let url = "https://explosm.net"
let req = new Request(url)
let html = await req.load()
let regex = /class="preview-thumbnail" href="(.*)"/
let matches = html.match(regex)
url = "https://explosm.net" + matches[1]
// Load the details page for the latest comic to find the URL for the image.
req = new Request(url)
html = await req.load()
regex = /id="main-comic" src="(.*)"/
matches = html.match(regex)
url = "https:" + matches[1]
// Load the image and present it.
req = new Request(url)
img = await req.loadImage()
QuickLook.present(img)
2 Likes

Hey @simonbs,

This is incredible, thank you so much for both putting the script together but also for explaining each of the steps. I’m definitely going to use this as a basis to try and create something similar for another one, now I have a better understanding of it.

Thanks again!

Hey @simonbs,

The code above stopped working, for some reason, so I guess they’ve changed something.
I followed your suggestion and did try to understand what your code was doing, but failed miserably to be honest.

I did, however, look over your code to bring in the latest XKCD strip, provided in your example code. I’ve tried to dig around for online comic strips that provide a JSON feed (because, again, that’s really the only shared code I understood). I couldn’t find one for any of the bigger ones like Dilbert and Garfield etc. but I did find a random one for Browserling which is, in their words A weekly comic for programmers, web developers and geeks. Seemed apt!

Anywho, it’s a tiny departure from what you’ve already shared but partly because I was pleased with myself for getting it to work and partly because it seemed suitable for this group, I thought I’d share:

// Loads the latest Browserling comic from
// comic.browserling.com/and shows it.
let url = "https://comic.browserling.com/latest.json"
let req = new Request(url)
let json = await req.loadJSON()
let imgURL = json["url"]
alt = json["text"]
req = new Request(imgURL)
let img = await req.loadImage()
// QuickLook then previews the latest comic / image inline
QuickLook.present(img)
if (config.runsWithSiri) {
  Speech.speak(alt)
}

Thanks!

EDIT: If anyone knows of any other web comics that have a JSON feed available, do please share.

1 Like