Scriptable - Daring Fireball Feed Widget

scriptable_df-feed-widget.js

/*
Created by: Smalls
Date Created: 2020-10-05
Last Updated: 2020-10-06

https://github.com/smalls1652
*/

async function getDfJsonFeed() {
    //Get data from the DF JSON feed using 'Request'.
	let dfJsonFeed = "https://daringfireball.net/feeds/json";

	let httpRequest = new Request(dfJsonFeed);
	httpRequest.method = "GET";

    let jsonData = httpRequest.loadJSON()
		.then(
		r => {
			return r;
		}
	);
    
    return jsonData;
}

//Start the main execution of the script

//Get the data from the DF JSON feed
let feedData = await getDfJsonFeed()
    .then(feed => feed.items);

//Create the widget itself
let widget = new ListWidget();

//Load a bookmarked image from iCloud files for the Daring Fireball logo
//This won't load unless you have the image downloaded and have a bookmark of it in Scriptable called 'df-logo'.
//Might want to make this error-handle and show 'Daring Fireball' as text if the logo doesn't exist.
let logoImage = Image.fromFile(FileManager.iCloud().bookmarkedPath("df-logo"));


/*
Whenever the widget is added to the homescreen, you can supply a parameter to it. This will:

1. Reduce the size of the image to fit onto the widget.
2. Reduce the total amount of items to show on the widget.

At the moment there isn't a way to determine which size of the widget is being used unless it is explicity told so, so either supply:

- small
    - For the small widget.
- large
    - For the large widget.
- medium (or no paramter passed)
    - For the medium widget.
    
I originally created this with the medium widget in mind.
*/
let widgetLogoSize, widgetMaxItems;
switch (args.widgetParameter) {
    case "small":
        widgetLogoSize = new Size((logoImage.size.width / 6), (logoImage.size.height / 6));
        widgetMaxItems = 2;
        break;
        
    case "large":
        widgetLogoSize = new Size((logoImage.size.width / 4), (logoImage.size.height / 4));
        widgetMaxItems = 4;
        break;
        
    default:
        widgetLogoSize = new Size((logoImage.size.width / 4), (logoImage.size.height / 4));
        widgetMaxItems = 3;
        break;
}

//Create a simple gradient for the widget to look similar to DF's design.
let widgetGradient = new LinearGradient();
widgetGradient.colors = [ 
        new Color("#858585"), 
        new Color("#737070")
    ];
widgetGradient.locations = [ 0, 1 ];

widget.backgroundGradient = widgetGradient; //Apply the gradient to the widget.

//Add the DF logo to the widget.
let widgetLogo = widget.addImage(logoImage);
widgetLogo.imageSize = widgetLogoSize;
widgetLogo.applyFittingContentMode();
widgetLogo.url = "https://daringfireball.net";

widget.addSpacer(2);

//Loop through the items in the feed and create a WidgetStack for each item to be added.
let i = 0;
while (i <= (widgetMaxItems - 1)) {
    let widgetStack = widget.addStack();
    widgetStack.layoutVertically();
    widgetStack.url = feedData[i].id; //Add the URL for the post to allow for direct click-through to the article.
    
    let widgetItem = widgetStack.addText(`* ${feedData[i].title}`); //Add the title of the article.
    widgetItem.font = Font.systemFont(14);
    widgetItem.textColor = new Color("#FFF");
    widgetItem.minimumScaleFactor = .8; //This may cause some issues with the text looking cramped.
    
    let widgetItemDate = widgetStack.addDate(new Date(feedData[i].date_published)); //Add the date of the article.
    widgetItemDate.applyOffsetStyle(); //Set the date to render as an offset of when it was posted (ex. +1 hour ago, +1 day ago, etc)
    widgetItemDate.font = Font.systemFont(10);
    widgetItemDate.textColor = new Color("#aebbd1");
    widgetItemDate.minimumScaleFactor = .8; //This may cause some issues with the text looking cramped.
    
    widget.addSpacer(null);
    
    i++; //Increment the while loop.
}

//Add the completed widget to the script.
Script.setWidget(widget);

//Tell Scriptable the script has completed running.
Script.complete();