Widget Showing Stock From Website

Scriptable
,
1

I want to display the stock of items in a video game, from either of two websites, https://growagarden.gg/stocks or https://vulcanvalues.com/grow-a-garden/stock (whichever is more convenient) but I need help…
I want it to be sort of in the formation of
“Gear Stock:
Watering Can x2
Favorite Tool x1” (etc.) for the categories gear stock, egg stock, and seed stock, but I can’t figure out how to get the data from the website into my widget. I also need it to refresh every 5 minutes (10:00, 10:05, 10:10, etc.) and I also have no clue how to get that done.
Sorry for talking so much, but to wrap it up, I’m on Scriptable on iOS, I have a PC but I don’t have Scriptable on it. I alsos have iOS Shortcuts, if that is also something I could use, but any help would be appreciated.
P.S: I tried asking AI to make something for Scriptable, and it gave me the following stuff, but the widget says “not found” for all the items.

// Define the URL of the new stock page
let url = "https://growagardenvalues.com/stock/stocks.php";
let req = new Request(url);
let html = await req.loadString();

// Function to extract stock information for a given category
function extractStock(category) {
  let pattern = new RegExp(`<h2>${category}</h2>[\\s\\S]*?<ul>([\\s\\S]*?)</ul>`, "i");
  let match = html.match(pattern);
  if (!match) return `${category}: Not found`;

  let listHTML = match[1];
  let listItems = listHTML.match(/<li>(.*?)<\/li>/g);

  let cleanedList = listItems
    ? listItems.map(i => i.replace(/<[^>]+>/g, '')).join(', ')
    : 'No data';

  return `${category}:\n${cleanedList}`;
}

// Extract stock information for each category
let seeds = extractStock("Seeds");
let gear = extractStock("Gear");
let eggs = extractStock("Eggs");

// Create the widget
let widget = new ListWidget();
widget.addText("🌱 Grow a Garden Stock").font = Font.boldSystemFont(14);
widget.addSpacer(6);

let font = Font.systemFont(10);
widget.addText(seeds).font = font;
widget.addSpacer(4);
widget.addText(gear).font = font;
widget.addSpacer(4);
widget.addText(eggs).font = font;

// Set the widget's refresh interval to every 5 minutes
if (config.runsInWidget) {
  let now = new Date();
  let refreshDate = new Date(now.getTime() + 5 * 60000); // 5 minutes later
  widget.refreshAfterDate = refreshDate;
  Script.setWidget(widget);
} else {
  widget.presentMedium();
}

Script.complete();

Please help, I’m lost :frowning: (@sylumer if you’re reading this PLEASE HELP MEEEEE)

2

@sylumer do you think this is possible? I need your help. PLEASE.

3

Thanks for the tag, but you really don’t need to tag me in new posts. I read everything that is posted (eventually - I do sleep, work, have a life outside this forum), and if I think I can help or add any additional advice I will always try to do so when I get time. But also keep in mind I do not have all the answers and the best answers come when lots of people add to the conversation sharing ideas, perspectives and solutions.

First of all the refresh of widgets is controlled by the OS. You don’t get to dictate the frequency of the update. but you can affect the refresh rate.

Next, scraping this sort of thing from a website can be done, but is not always reliable. In fact if I use the URL in your script and reach out for the page content it has a message overlaid on the page.

image
image1290×2796 244 KB

Scraping the page should be a last resort, but using regular expressions to try and match content is a good approach.

A better option would be to connect to an API to get the raw data, but I assume you don’t have access to such an API.

The issue with the widget not being found, well, I would suggest rather than using the AI generated code that you start with a simple widget that is known to work.

There is a gargantuan thread of widgets that could be examples:

But I would ensure something simpler, so perhaps the one from this post?

Or to get more explanation on putting together a widget, this guide.

https://www.reddit.com/r/Scriptable/s/wlkeIffipL

Once you have the widget start by say grabbing the page title and displaying that. After that parse the page and pull in the elements you are searching for.

Just keep in mind the refresh rate is something you can affect but not control, and scraping from a web page rather than getting data via an API will lead to errors as the page formats/layout can change due to website updates, redesigns, and addition of dynamic content like that sjown above.

Hope that helps.

1 Like
4

Thanks for replying!!! I’m just not sure about what parsing a page is, I’ll try figuring it out, but I might… need more help… Thanks you this helps so much!!

5

Parsing is where you process something and break it into its components, often with the aim of just taking the pieces of relevance.

Parsing the web page in this instance is reading it all and pulling out all the pieces of information you want to use.This is where the AI had generated some regular expression to use to try and use pattern matching to pull out the relevant information from the page.

For completeness, scraping is an overarching term that is often used for where you grab the page content and parse it.

2 Likes