Raymond Camden

Testing Diffbot's Web Search API

2026-06-11T18:00:00+00:00

It's hard to believe I first experimented with Diffbot nearly five years ago. You can see that first post up on the Adobe Medium account - Natural Language Processing, Adobe PDF Extract, and Deep PDF Intelligence. Since then I've tested out various APIs and features from them and was lucky enough to connect with them recently about a new initiative, a web search API.

There's multiple examples of this out in the wild already, but most just scrape/hack against Google. Google had an API, the Custom Search JSON API (I even covered it back when folks still talked about the JAMStack) but the API is now deprecated and officially turning off January 1, 2027.

Diffbot's API (which quietly launched about two weeks ago) is against their own crawled index. Why does this matter? Honestly the docs do a damn good job of explaining why you should care (emphasis mine):

"Candidates are retrieved and reranked with a cross encoder model trained to rank factual relevance over popularity, primary sources over domain monopolies, and organic page rank over paid spend.

The net effect is search results that assume the user is not an idiot. A search for "hypothyroidism" returns relevant research study papers alongside content from publicly administered websites and reputable non-profit institutions."

Assuming users aren't idiots?!?!

Alright, so what's the API actually like? Cribbing from the docs, you make a GET to https://llm.diffbot.com/api/v1/web_search/ with:

Your search term as text in a query param
A max number of results via size that defaults to 10
An optional maxTokens value related to processing of the results
Lastly, a Diffbot key passed via an Authorization header

As of today, the API itself has no limits:

"Usage is currently unmetered while we open Web Search API up for public testing. Don't be the person to screw this up for everyone."

I'd expect in the future this will change and I'd check their main rate limits doc for the latest info.

As for actually using it, they've got a great Python SDK which makes this incredibly simple:

from diffbot import Diffbot

db = Diffbot(token="YOUR_TOKEN")
results = db.web_search("diffbot knowledge graph")
for r in results["search_results"]:
    print(r["score"], r["title"], r["pageUrl"])
    print(r["content"])

But with the REST API being so simple, I thought I'd build a quick demo in JavaScript and use my new favorite home for stuff like this, val.town.

Building a Web Search Alert

So this is probably the simplest implementation (and in the last hour the Diffbot team literally added new stuff to the docs, which means more content, woot) but I built a simple system that:

Once a week, hits the Diffbot Web Search API looking for a term
Filters the results based on the score value to only consider higher quality results
Emails it to me

You, my highly intelligent reader, are probably already thinking of ways to tweak that, and as I said, I plan to follow up on this (tomorrow probably), but here's the entirety of the system in one file:

I've got my key in an environment variable I snag first, and then define some core values:

My search term (and yes, you can craft more complex queries than just my name)
A max number of results
A filter to apply on the results

Then it's just a matter of hitting the endpoint. I take the results and filter based on my minimum desired value (scores go from 0 to 1 and in my testing, 0.5 helped).

Each result contains the URL of the result, the title, the score, and a portion of the content. For my email, I show each of the values, but I was a bit torn on how to handle the content value. It's markdown and I can easily turn Markdown into HTML, but it's a part of a web page and greatly screws up an HTML email.

So how does it look?

Ok, that's not terribly exciting, but you get the idea. I think where this starts to get cool is in combination with other tools as well. You will probably not be surprised to know this is covered in their AI skills as well, and I'm going to demonstrate that soon as well. Check it out for yourself and let me know what you think!

Can GenAI help you win in Vegas? (2026)

2026-06-07T18:00:00+00:00

No! Thanks for reading. Still here? Cool. So way back in 2023, I built a little demo that I thought was kinda cool. Early in 2023 I had used Alpine.js and the excellent Deck API to build a simple web-based Blackjack game: Creating a Blackjack Game with Alpine.js and the Deck of Cards API. I then took that demo and connected to Google's GenAI API, which back then was named Palm: Can GenAI help you win in Vegas?. It's been a few years and I thought I'd take a stab at it again, this time making use of Chrome's Prompt API. Technically I'd have much better luck using a bleeding edge Gemini model via a serverless function, and I may still take a stab at that later, but I thought I'd see how well the Prompt API worked.

I won't go into all the details on how the game is built, for that, check out the original post. Also, I won't go over again the UI/UX of AI prompting, which I covered in the last post. All I did was add a button: "Ask for Help!", which kicks off the process and then uses a JavaScript alert to provide feedback. That's not awesome but I'm fine with that. Ok, I lie, it's Sunday, I've got nothing but laundry to do - so I'll replace it with a native <dialog> instead!

To enable this new version, I made a couple of changes. First, I've got a new Alpine method to create the AI session. This is responsible for setting up the system instruction for the model as well:

async createSession() {
	console.log('createSession running');
	this.session = await LanguageModel.create({
		expectedOutputs: [
			{ type:'text', languages: ['en'] }
		],
		initialPrompts: [
			{
				role: 'system',
				content:
							`
You are an expert Blackjack advisor helping a player make decisions in a simplified game (no splitting, no doubling down, no surrender). Your goal is to advise the player whether to 'Hit' or 'Stand' based on standard basic Blackjack strategy.

CRITICAL GAME RULES:
- Goal: Beat the dealer's hand value without exceeding 21 (busting).
- Card Values: Cards 2-10 are face value. Jack, Queen, and King are worth 10. Aces are worth either 1 or 11, whichever is more beneficial without busting.
- Blackjack: A "Blackjack" is strictly a 2-card hand consisting of an Ace and a 10-value card (10, J, Q, K). An Ace and an 8 is just 19, not a Blackjack.
- Soft vs. Hard: A hand with an Ace counted as 11 is a "soft" hand (e.g., Ace + 6 = soft 17). Otherwise, it is a "hard" hand.

INSTRUCTIONS:
You will be provided with the player's current hand and the dealer's visible card.
Respond strictly in the following format:
ACTION: [Choose ONLY "Hit" or "Stand"]
REASON: [A brief, one-sentence logical explanation based on standard Blackjack probabilities and the dealer's visible card]
`,
		},
	],
	monitor(m) {
		m.addEventListener('downloadprogress', (e) => {
			if (e.loaded === 0) return;
			const pct = Math.floor(e.loaded * 100);
			if(pct !== 0 && pct !== 100) this.aiHelp = `Downloading model… ${pct}%`;
		});
	},
});

Note the level of detail in the system instruction. Initially I had just the initial paragraph and a bit about how to return the results. I took this to the Gemini desktop app and asked this:

I’ve built a web based Blackjack game. It’s a simplified version that doesn’t 
include splitting or doubling down. As part of the game, I used Chrome’s 
built-in Prompt API to offer advice to the player on whether to hit or stand. 
This works *mostly* ok, but I see mistakes, for example, Chrome’s Prompt API 
once said an Ace + 8 is a blackjack, when it has to be a face card or 10 as 
far as I know. To help me improve the prompt, can you give me a good system 
prompt that briefly, but completely, covers the rules, again though ignoring 
doubling down/splitting/etc. This is the current system instruction:

(I pasted the first version here)

I then took its improved prompt and added it to my code.

Next I had to wire this up to the AI advice button. This is the askForHelp method and the referenced schema:

const adviceSchema = {
  type: 'object',
  properties: {
    action: { type: 'string', enum:['HIT','STAND'] },
    reason: { type: 'string' }
  },
  required: ['action', 'reason']
};

async askForHelp() {
	console.log('lets call an (AI) friend');
	if(!this.session) {
		console.log('generating a session');
		this.aiHelp = '<i>Creating the AI session.</i>';
		await this.createSession();
	}
	this.aiHelp = '<i>Asking our AI friend...</i>';

	let totalOb = this.getCount(this.playerCards);

	// string to represent my hand, could be 2-5 cards
	let playerStr = 'My hand consists of:\n ';
	// this could be reduce(), im being lazy
	this.playerCards.forEach(p => {
		playerStr += `${p.value} of ${p.suit.toLowerCase()}\n`;
	});
	
	// string to set the total value for the prompt, helps it
	let totalStr = 'My hand has a total of ';
	if(totalOb.lowCount === totalOb.highCount) {
		totalStr += totalOb.lowCount;
	} else {
		totalStr += `${totalOb.lowCount} or ${totalOb.highCount}`;
	}
	
	let content = `
I'm playing blackjack and the dealer currently has ${this.pcCards[1].value} of ${this.pcCards[1].suit.toLowerCase()}.

${playerStr}

${totalStr} 

Should I hit or should I stay?
	`;
	console.log('content', content);
	let result = JSON.parse(await this.session.prompt(
		[{ role: 'user', content }], 
		{ responseConstraint: adviceSchema }
));
	console.log(result);
	
	let resultMsg = `
You should ${result.action}. Why?
${result.reason}
`;

	this.aiHelp = '';
	this.advice = resultMsg;
	this.$refs.adviceDialog.showModal();
}

Ok, there's a few things of note going on here. As with the previous version, I take the current game state and turn it into a prompt where I describe my hand. While working on this version I discovered a pretty big flaw from the previous game. When asking AI for advice, I only described two cards max. Now I ensure I describe my entire hand.

Now you may be wondering, why do I get the total value of my hand - shouldn't the model know how to calculate that? As before, at least in the Prompt API, the answer is no. Initially I removed that bit thinking the system instruction would be enough. But even though my system prompt describes how to get the total of a hand, I still found the model calculating the total wrong. Not all the time, but at least once. So the little helper string went back in.

The other change in this version is a proper schema to shape the response - give me an action (hit or stay) and a reason. This gets turned into a string and passed to my HTML dialog element. Here's how it looks in action:

In case that's hard to read, the dialog says:

"You should HIT. Why? With a hard 16, you need to improve your hand to stand a chance against the dealer's strong 10."

If I remember right, this advice makes sense, but I find it difficult personally to hit on anything 15 and higher. For that particular round I stayed and the dealer won with Blackjack, so I had no chance.

In my next test, the dealer was showing a King of Clubs and I had two Aces and the advice was:

"You should STAND. Why? You have a soft 2 or 12 which is a strong hand, and the dealer has a King, making it unlikely they will have a high hand."

That seems crazy, so I went ahead and got a new card which ended up being a seven. At that point the AI suggested staying, which I did, and I still lost as the dealer's other card was a 10.

In my next round, the dealer was showing a queen and I had a 5 and a 9. The AI suggested hitting which I completely agreed with and of course - I busted.

I played a few more times, and generally the model's suggestions seemed ok. I could see it being useful if I was a complete novice at the game, but I don't see whipping out my phone and asking AI for help any time soon. (I don't really game myself, but I assume most casinos have rules against this now. Anyone know offhand?)

What do you think? If you've got an up to date Chrome, you can test it here: https://codepen.io/cfjedimaster/full/KwNbvPq/afbf4079fe199863f11f75957817fcc8. Note that the first time you download the model it may take 5 to 10 minutes, but that applies across your device as a whole. If you run across another demo using the API you won't need to download it again.

If you want to take a look at the code, I've embedded it below. The dialog I added could really use some styles so if anyone wants to fork and share, let me know!

See the Pen Blackjack (Chrone AI) by Raymond Camden (@cfjedimaster) on CodePen.

AI versus a Grue

2026-06-02T18:00:00+00:00

"It is pitch dark. You are likely to be eaten by a grue." If you recognize that quote, congrats, you probably need to see your doctor about pain in your back. (Ok, pain everywhere.) For those of us of a certain age, or folks who like classic games, the Infocom series was a tremendous source of entertainment. Using plain text commands to navigate your environment, players had to use their minds to figure out puzzles and mazes in order to win the game. The IF (Interactive Fiction) community is still strong and of course, I've spoken before about my time playing and coding on MUDs, so with that in mind, I thought I'd try tackling something that I assumed probably wouldn't work well - seeing if Chrome's built-in AI could handle playing Zork 1, the most famous of Infocom's library. The short answer is... not so well. But honestly, it was kind of fun to try so I figured I'd share the results.

Getting Zork

Before I could even begin trying to test AI's ability to play a 50 year old game (almost 50, Zork 1 launched in 1977), I first needed to find a JavaScript implementation. This turned out to be a bit tricky.

I quickly found ifvms.js, an interactive fiction virtual machine library, but it was tailored to running at the command line. Also, there was little to no documentation on how to make use of the library. The repo mentions another repo, parchment which lets you play games on the web, but I struggled to find documentation there as well, or documentation specific to my use case.

To help, I went to Claude, and had it load ifvms.js and create a 'stubbed' version that I could use via calls like so:

// all of this loads Zork 1...
const res = await fetch('zork1.b64.txt');
const b64 = await res.text();

const binary = atob(b64.trim());
const arrayBuffer = new ArrayBuffer(binary.length);
const view = new Uint8Array(arrayBuffer);
for (let i = 0; i < binary.length; i++) {
    view[i] = binary.charCodeAt(i);
}

engine = new ZorkEngine();
engine.load(arrayBuffer);

// and then later:
let gameResponse = engine.getOutput(); // last thing the game did

// send a command
let lastResponse = engine.send(command);

That source file above mentioned in the first line comes from an online source. Zork itself is open source (https://github.com/historicalsource/zork1), but I forget where I got my copy of the source. It's not a text file, I renamed it to that when initially attempting to build my demo on CodePen. I believe it was pure binary I converted to base64 and then renamed.

Building the Game

So with Claude helping me build the version of ifvms I could use interactively, I then had to whip up a quick UI and point Chrome's Prompt API, which as of Chrome 148 is GA to everyone. (Well, everyone on Chrome.)

My UI was just a giant text area where I'd stream the output from the game and Chrome's inputs. All of that code is kinda basic, so I'll focus on the prompt aspect. Here's how I create my session:

$session = await LanguageModel.create({
    initialPrompts:[
        { 
            role: 'system', 
            content: 
                    `
You are playing the classic text adventure game Zork. You will be given the current game output, and you will 
respond with a single command to play the game. You will not explain your command, just give the command. 

Remember to keep your commands concise and to the point, as if you were playing the game yourself. Do not include 
any extra text or explanations.

Zork is a text-based adventure game where you explore a mysterious underground world filled with treasures, puzzles, 
and dangers. Your goal is to navigate through the various locations, solve puzzles, and collect treasures 
while avoiding traps and monsters.

Here are some examples of commands you might use in Zork:
- "go north"
- "take lamp"
- "open mailbox"
- "look around"
- "inventory"

Do your best to play the game effectively and efficiently, making smart choices based on the current game output.

Try not to keep returning to the same location repeatedly, as that can lead to getting stuck in loops. Instead, 
explore new areas and try different actions to progress through the game. Remember that you can travel in all directions.
                    `
        }
    ],		
    monitor(m) {
            m.addEventListener("downloadprogress", e => {
                console.log(`Downloaded ${e.loaded * 100}%`);
                if(e.loaded === 0 || e.loaded === 1) {
                    $output.innerHTML = '';
                    return;
                }
                $output.innerHTML = `Downloading AI model, currently at ${Math.floor(e.loaded * 100)}%`;
            });
        }		
});

As you can see, a majority of this is the big prompt. I iterated over this multiple times to help guide Chrome to effectively solve the game. (Which to be clear, it never did.)

Outside of that, the main loop of the game is this heartbeat function:

async function gameHeartBeat() {

    console.log('in hb');
    let gameResponse = engine.getOutput();
    if(!gameResponse) gameResponse = lastResponse;

    if(gameResponse) {
        $gameoutput.value += gameResponse + '\n';
        $gameoutput.scrollTop = $gameoutput.scrollHeight;

        let command = await $session.prompt(gameResponse);
        lastResponse = engine.send(command);

        $gameoutput.value += `> ${command}\n`;
        $gameoutput.scrollTop = $gameoutput.scrollHeight;

        console.log('Resp',command);
        setTimeout(gameHeartBeat, 1000 * 2);
    }
 
}

The variable $gameoutput is just a DOM pointer to the textarea used to render the game.

Before going any further, I'll note a huge issue with my code and that's the lack of session management. Chrome absolutely provides you a way to monitor that usage and re-init the session when it is nearly filled. I didn't bother with that because I was being lazy when I built this.

I'd also argue that we could help Chrome's model quite a bit by keeping track of a list of rooms it has already visited to help it remember and not loop over the same place. My prompt tries to do that, but I could also help it out myself.

All in all - this was a quick implementation and the results were... well what you would expect with a lightweight model and me just hacking quickly on it. ;)

Here's a transcript from a test I just did.

ZORK I: The Great Underground Empire
Infocom interactive fiction - a fantasy story
Copyright (c) 1981, 1982, 1983, 1984, 1985, 1986 Infocom, Inc. All rights reserved.
ZORK is a registered trademark of Infocom, Inc.
Release 119 / Serial number 880429

West of House
You are standing in an open field west of a white house, with a boarded front door.
There is a small mailbox here.

>                                                                                 West of HouseScore: 0  Turns: 0
> examine mailbox
The small mailbox is closed.

>                                                                                 West of HouseScore: 0  Turns: 1
> open mailbox
Opening the small mailbox reveals a leaflet.

>                                                                                 West of HouseScore: 0  Turns: 2
> read leaflet
(Taken)
"WELCOME TO ZORK!

ZORK is a game of adventure, danger, and low cunning. In it you will explore some of the most amazing territory ever seen by mortals. No computer should be without one!"

>                                                                                 West of HouseScore: 0  Turns: 3
> look around
West of House
You are standing in an open field west of a white house, with a boarded front door.
There is a small mailbox here.

>                                                                                 West of HouseScore: 0  Turns: 4
> go north
North of House
You are facing the north side of a white house. There is no door here, and all the windows are boarded up. To the north a narrow path winds through the trees.

>                                                                                 North of HouseScore: 0  Turns: 5
> go north
Forest Path
This is a path winding through a dimly lit forest. The path heads north-south here. One particularly large tree with some low branches stands at the edge of the path.

>                                                                                 Forest PathScore: 0  Turns: 6
> examine tree
There's nothing special about the tree.

>                                                                                 Forest PathScore: 0  Turns: 7
> go north
Clearing
You are in a clearing, with a forest surrounding you on all sides. A path leads south.
On the ground is a pile of leaves.

>                                                                                 ClearingScore: 0  Turns: 8
> take leaves
In disturbing the pile of leaves, a grating is revealed.
Taken.

>                                                                                 ClearingScore: 0  Turns: 9
> open grating
The grating is locked.

>                                                                                 ClearingScore: 0  Turns: 10
> look around
Clearing
You are in a clearing, with a forest surrounding you on all sides. A path leads south.
There is a grating securely fastened into the ground.

>                                                                                 ClearingScore: 0  Turns: 11
> go south
Forest Path

>                                                                                 Forest PathScore: 0  Turns: 12
> go north
Clearing

>                                                                                 ClearingScore: 0  Turns: 13
> examine leaves
There's nothing special about the pile of leaves.

>                                                                                 ClearingScore: 0  Turns: 14
> go south

In my tests, it never seems to get much further in the game than the outer area, but certainly tries hard, so I guess I'll give it a gold star for that.

If you want to try this yourself, you can point Chrome at https://cfjedimaster.github.io/webdemos/chrome_zork/.

If you want to peruse the code yourself, you can check it out here: https://github.com/cfjedimaster/webdemos/tree/master/chrome_zork

Now that I've got a bit more time on my hands (ahem), I may try hacking on this a bit more, but it was certainly fun to see it in action.

Photo by Joshua Sortino on Unsplash

Creating a Heavy Rain Alert with RainDrop and Val Town

2026-06-01T18:00:00+00:00

One of the "joys" of living in Louisiana is the rainy season, which is heavier in spring but honestly, feels like it lasts all year long. I can still remember being on a business trip in 2016, about to fly home, and hearing about some sort of 'rain event' back in Louisiana. This surprised me as there wasn't a hurricane involved, just an incredible amount of rain (up to 2-3 inches per hour). You can read more about it on the Wikipedia page about the event, but it goes without saying - rain is a big deal down here.

A while back I discovered RainDrop, which is an app and a web site that lets you check on rainfall totals. You can see my zipcode here, https://www.raindrop.farm/rainfall-totals/zipcode/70508#map, and while we aren't having any rain this second, we've got some forecast for today.

When I discovered the site, I did some digging and discovered they had an API: https://api.raindrop.farm/docs. This API gives you incredibly detailed information about rainfall (and snow) and can even return historical data.

Given an API key passed in an Authorization header, this gets the current precipitation for my location:

https://api.raindrop.farm/v1/precipitation/current?lat=30.216667&lon=-92.033333

Which returns (as of 11:34 AM, and I just heard thunder):

{
    "lat": 30.216667,
    "lon": -92.033333,
    "timestamp": "2026-06-01T16:30:00Z",
    "precipitationIntensity": 0.0
}

Ok - slight delay here - I just got out of a meeting, and the rain is here:

{
    "lat": 30.216667,
    "lon": -92.033333,
    "timestamp": "2026-06-01T17:06:00Z",
    "precipitationIntensity": 1.2999999523162842
}

That value is in millimeters per hour so it looks like just a trickle, so nothing to worry about. Of course, what if it was something to worry about? I thought - why not automate checking for this using my go to platform lately, Val Town.

The App

Alright, so the app I had in mind was fairly simple:

Every X minutes, use the RainDrop API to check the rain intensity and if it is over a certain threshold, send an alert my way.

My RainDrop API access had pretty high usage limits (120 a minute) that were above what made sense to realistically check. On the other hand, my free tier level at Val Town capped me at one execution per fifteen minutes.

To be honest, once every fifteen minutes seemed perfectly reasonable, but keep in mind that both RainDrop and Val Town would support much higher frequencies if necessary.

Given the above, I created a new val and set the trigger to Cron, set to every 15 minutes:

I then created an environment variable for my RainDrop key. With that in place, the entire "early warning flood system" (that's what I'll call it when doing interviews for my next job) is one file:

import { email } from "https://esm.town/v/std/email";

/**
 * Converts speed from millimeters per hour to inches per hour.
 * @param {number} mmPerHour - Speed in millimeters per hour.
 * @returns {number} Speed in inches per hour.
 */
function mmPerHourToInchesPerHour(mmPerHour) {
  return mmPerHour / 25.4;
}

function dtFormat(timestamp) {
  const date = new Date(timestamp);

  const options = {
    weekday: "long",
    year: "numeric",
    month: "long",
    day: "numeric",
    hour: "2-digit",
    minute: "2-digit",
    timeZoneName: "short",
  };

  // Create the formatter (e.g., for US English)
  const formatter = new Intl.DateTimeFormat("en-US", options);

  return formatter.format(date);
}

export default async function (interval: Interval) {
  // Lafayette, LA
  const lat = "30.216667";
  const lng = "-92.033333";

  // The threshold value is inches of rain per hour - any value >= will trigger a warning
  const threshold = 0.5;

  let key = Deno.env.get("API_KEY");
  let precipReq = await fetch(
    `https://api.raindrop.farm/v1/precipitation/current?lat=${lat}&lon=${lng}`,
    {
      headers: {
        "Authorization": key,
      },
    },
  );

  let precip = await precipReq.json();
  let rainInches = mmPerHourToInchesPerHour(precip.precipitationIntensity);
  console.log("rainInches", rainInches);
  console.log(precip);

  if (rainInches >= threshold) {
    let html = `
<h2>Heavy Rain Alert</h2>

<p>
As of ${
      dtFormat(precip.timestamp)
    }, we have detected ${rainInches.toFixed(2)} inches of rain per hour.
</p>
    `;

    await email({
      subject: "Rain Alert",
      html,
    });
  }
}

On top of my script are two utility functions with the interesting one being the simple wrapper to convert RainDrop's values to inches.

After that, I hit the API, check against a threshold (currently set to half an inch), and if it matches, I fire off an email. As a reminder, I'm using Val Town's built in "mail the owner" feature. I could also use a proper email API to have more control over the delivery, but this works well for now.

And of course, as soon as I built this there were no events, which is good I suppose, but I did a quick tweak to force it to email and here's an example. Not terribly thrilling with 0 inches:

If you want to play with this, you can fork the val here: https://www.val.town/x/raymondcamden/raindropAlert. And of course if you do, let me know!

Photo by reza shayestehpour on Unsplash

Looking for My Next Role - Hire Me

2026-05-27T18:00:00+00:00

Yep, I get to write this post again...

Well, today I find myself in the same position I've been a few times over the past few years. Webflow went through a company-wide restructuring today and as part of that re-org, my role (and many others) were eliminated. So once again - I'm asking my faithful readers to help me find my next role. You can find my resume if you need the latest edition and feel free to contact me with any opportunities you may have!

Dang good Office parsing on the web with officeParser

2026-05-20T18:00:00+00:00

A few weeks ago I wrote about using Chrome's built-in AI support to summarize documents - "Summarizing Docs with Built-in AI". This was a followup on an earlier post that was PDF only and made use of an excellent library, officeParser, to work with Microsoft Office files. This library worked well, but had one issue that made it a bit harder to use.

Parsing a doc itself was super easy:

const getAST = async (file, config) => (await OfficeParser.parseOffice(file, config));

But the issue I ran into was taking that result and turning it into something meaningful for Chrome's model to analyze. PDFs supported a toText() method but for other formats I had to do a bit of work to get a text value. For example, here's the code I used to turn an Excel file into CSV:

let arrayBuffer = await file.arrayBuffer();
let data = await getAST(arrayBuffer, {});

const getCSV = s => {
    let result = '';
    let rows = s.children.filter(c => c.type === 'row');
    console.log(rows[0]);
    rows.forEach(r => {
        let data = [];
        let cells = r.children.filter(c => c.type === 'cell');
        cells.forEach(c => data.push(c.text));
        result += data.join(', ') + '\n';

    });
    return result;
};

Yeah that's not bad, but it did mean a bit of work for each of the different Office types.

Well, the good news is Harsh Ankur (the author of this awesome library) released a v7 that added a to method that supports converting files to CSV, Markdown, RTF, PDF, Text, and HTML. Even better, his HTML support isn't just "convert to Markdown then render the Markdown to html", but proper support straight from the parsed doc to create a richer result.

I went ahead and built a demo you can use to test right now (and this demo doesn't use any of the Chrome AI stuff). I created a simple HTML file with a file field and 4 tabs: Text, Markdown, HTML, CSV. You can select a PDF or Office file and it will render into each of the tabs (well, only Excel will use CSV). The HTML isn't interesting, but here's the JavaScript:

import { OfficeParser } from 'https://esm.sh/officeparser';

let $sourceFile;
let $textResult, $mdResult, $htmlResult, $csvResult;

const supportedFiles = ['pdf','xlsx','docx','pptx'];

document.addEventListener('DOMContentLoaded', init, false);
async function init() {
	console.log('lets go');
	$sourceFile = document.querySelector('#sourceFile');
	$textResult = document.querySelector('#textResult');
	$mdResult = document.querySelector('#mdResult');
	$htmlResult = document.querySelector('#htmlResult');
	$csvResult = document.querySelector('#csvResult');

	$sourceFile.addEventListener('change', filePreview, false);
}

async function filePreview(e) {
	const file = e.target.files[0];
	if (!file) return;
	let ext = file.name.split('.').pop();
	if(!supportedFiles.includes(ext)) return;
	let arrayBuffer = await file.arrayBuffer();
	let data = await getAST(arrayBuffer, {});
	
	let text = await data.to('text');
	$textResult.innerText = text.value;
	
	let md = await data.to('md');
	$mdResult.innerText = md.value;
	
	let html = await data.to('html');
	$htmlResult.contentDocument.open();
	$htmlResult.contentDocument.write(html.value);
	$htmlResult.contentDocument.close();

	if(ext === 'xlsx') {
		$csvResult.innerText = (await data.to('csv')).value;
	} else $csvResult.innerText = 'Only used for Excel files.';
}

const getAST = async (file, config) => (await OfficeParser.parseOffice(file, config));

You can play with this below:

See the Pen officeParser demo by Raymond Camden (@cfjedimaster) on CodePen.

So - given that - I took a look at my previous demo and modified the code to make use of these new features. Here's the new code that gets the text version of a document and passes it to the AI model:

document.querySelector('#upload').addEventListener('change', async (e) => {
    $output.innerHTML = '';
    const file = e.target.files[0];
    if (!file) return;
    
    let ast = await getAST(await file.arrayBuffer());

    let summary = {
        title: ast.metadata?.title ?? 'No Title',
        text: (await ast.to('md')).value
    }

    doSummary(summary);

});

Compared to the previous version, this one is over a hundred lines shorter. As I said... ddddaaaaannnnnngggg. You can try out this version below, but note that it is Chrome only. (If folks ask, or heck, even if you don't ask, I may build a Transformer.js version.)

See the Pen Chrome AI, Doc Summaries (V3) by Raymond Camden (@cfjedimaster) on CodePen.

My First AI Skill for My Blog

2026-05-19T18:00:00+00:00

I've been a professional writer now for thirty plus years, and honestly, it's one of the things I'm most proud about. When generative AI first exploded on the scene, a lot of people used it to help them write, and frankly, that wasn't for me. I'm not the best writer, but I damn well know how to write and damn well know my own voice. That being said, I've been really interested in how GenAI can help with the process.

I first wrote about this over two years ago: Using Generative AI as Your Content Assistant. In that post I talked about using GenAI for two very specific tasks:

Helping with my titles
Writing the description (which is part of the metadata for a post)

Honestly, I built those tools as proof of concept implementations and don't think I used them ever again. But lately it's been on my mind that I should think about those tools and see if there would possibly be an easier way to use GenAI to help me with my content. Specifically I'm looking for two things:

Spelling and grammar. I've got a Visual Studio Code extension for that but it's not perfect and I also just miss it sometimes.
And here's the big one. Sometimes I'll write about a topic and simply forget to cover something. I'd love to use my AI tool to try to find those missing aspects and let me know. Maybe I won't care. Maybe I intentionally skipped something. That being said, I'd still like to know.

You'll notice that none of the above involves AI actually writing for me. Outside of correcting spelling mistakes I made, I don't want to use my tool for that. But both of these could really help me catch things before I publish and just make the final result a little bit better.

The Skill

To build this, I made use of Claude Skills. Skills are persistent instructions that can be used across your entire environment or per project. They're written in simple Markdown and are stored in a particular folder depending on your use. I actually cheated a bit and used Claude itself to help me create the skill.

I knew about skills, knew they needed to be in a particular folder, but rather than looking it up I simply asked Claude to help me create a skill based on the needs above. It did an admirable job but I took over and tweaked things a bit.

The directory is in my repository now, at .claude/skills/prepublish. Here's what it looks like now (I say 'now' as I expect to be tweaking this over time - you can also check out the repo to see the latest!):

---
name: prepublish
description: Review a new blog post before publishing. Finds the latest post by its dated path under `src/posts/`, then spell-checks and offers content suggestions — without touching tone.
---

# Prepublish blog post review

Run this right before pushing a new post. Blog posts live in `src/posts/YYYY/MM/DD/` as `.md` files.

## Step 1 — Find the post

Do NOT use git to figure out which post is newest. Use the dated path under `src/posts/` — sort highest year → month → day and pick the most recent `.md` file.

A reliable command: `find src/posts -type f -name '*.md' | sort -r | head -5`. The first entry is the latest post; the rest are there in case there's a tie or the user wants to pick another.

If multiple `.md` files share the newest date directory, ask the user which one. Otherwise, confirm in one line ("Reviewing `path/to/post.md` — sound right?") before proceeding.

## Step 2 — Spell check

Read the post and surface misspellings. Ignore code blocks, fenced code, inline `code`, URLs, and proper nouns the user clearly intended (product names, people, libraries).

Present findings as a short list: `word → suggestion (line N)`. Don't auto-edit. Ask which corrections to apply, then apply them with Edit.

## Step 3 — Content review

Read the post end-to-end and give feedback focused on substance, not tone:

- **Things that sound stupid or unclear** — sentences that don't land, claims that need backing, awkward logic jumps.
- **Gaps worth filling** — missing context a reader would want, an example that would help, a link the user usually includes (docs, repo, related post).
- **Factual / technical accuracy** — flag anything that looks wrong or outdated. If the post references code, check it makes sense.
- **Loose ends** — TODO markers, "fill this in", broken-looking links, placeholder text.

**Do NOT** comment on tone, voice, snark level, casual phrasing, or stylistic choices. The user likes their voice; leave it alone.

Present feedback as a numbered list grouped by category. Keep each item to one or two sentences. Don't rewrite paragraphs — point at the issue and let the user decide.

## Step 4 — Apply changes

Ask which suggestions to act on. Apply only what's confirmed. Then stop — the user handles the actual publish/push.

An Example in Action

To test, I'm going to run this right now on this post, which means it may get a bit confused as the post isn't actually done, but let's just see what happens:

Hopefully that image is readable, let me know if not. But it did a great job of finding multiple grammar issues. My VS Code extension doesn't handle that (obviously).

I disagreed/didn't care about the awkward comment. I did care about linking to Claude Skills so I added a link. Gap 3 was incorrect. I do talk about how I 'cheated' (to be clear, it isn't cheating) in the following paragraph. And of course, issue 5 is simply because I ran this before I was done. Item 8 is the same.

You'll notice it also offered to correct those mistakes, but I did them myself and I imagine I'll do so usually.

In the end, these are all things a good editor would handle, but this is my personal blog and unfortunately I don't have an editor on call. (And even so, I'd want to do this kind of check beforehand anyway.)

What next?

Looking at the skill I wrote, and recognizing my own weaknesses (grammar, forgetting to cover things I should), I may actually move this skill into my global directory so I can use it for my non-blog writing as well. Anybody want to chime in and share if they've done something similar?

p.s. I ran the skill one more time - here's the latest:

Photo by 宁宁 on Unsplash

Links For You (5/17/26)

2026-05-17T18:00:00+00:00

Happy Sunday, and I hope your Sunday is going better than mine. One of my kids just went to use the dryer and sparks flew. I don't mean metaphorically. Nothing like the thought of replacing another major appliance to brighten up your day, amiright?!?!

Find Your (Tech) Community

First up is a new endeavour by Brian Rinaldi to help fill the gap left behind by Meetup.com (which is still a thing just not a good thing lately) and the lack of smaller and more affordable community conferences. DevRel(ish) is a community site supporting tech groups of all sizes and nature who need help organizing IRL meetups. According to the launch announcement, this is not meant to be a replacement for larger event apps, but hopefully something more suitable for smaller groups.

Check it out at https://devrelish.tech/.

Blame the Ox

Ok, this isn't tech related at all, but, "The Ox That's Breaking Your Fantasy Map" is one of the most fascinating videos I've seen in a while. And yes, it is about oxen - and fantasy maps. Even if you don't like fantasy (or oxen), it's a great watch and reminder of just how the economy affects organization and government.

AI and Goblins

Last up is a good look into why goblins started appearing in OpenAI models. The post details how initial reports of the behavior led to investigations that ultimately led to the smoking ~~goblin~~ gun.

Just For Fun

Speaking of fantasy, I recently remembered that my young kids still have yet to see the Never Ending Story. One of them really loves horses too. This is going to be great!

Is it hotter or colder this year?

2026-05-15T18:00:00+00:00

Where I live could generously be called "warm", but is usually closer to the surface of the sun, especially in late summer. That's why when the weather is not oppressively hot, I try my best to enjoy it. We're mid-May now and honestly, this spring has been... pleasant. Suspiciously pleasant but I'll take what I can get.

The last few weeks I've been telling myself that the weather must be a good bit cooler than last year, and I finally decided to do something about it. I worked with Claude and created a little web app that:

Lets you enter a free form address and then use Geocoding to convert it to a proper longitude and latitude. This is a super simple geocoding API with a generous free tier. Do note though it's North America only.
Uses the Pirate Weather API to get historical weather information. Date wise, I'm using this week, and then the same days over the previous four days.

As I mentioned, I worked with Claude on this and let it design the layout and write the code initially. I was kinda impressed by one part - the mapWithConcurrency function that lets you pass an array of async function with a desired max number to run at once. It handles doing the batching and returning the final result. That makes the calls for the weather data a bit more gentle on the provider.

However - I noticed it was taking a long time to finish. In theory, I'm doing 7 times 5 (this week plus four previous years) of calls which is 35 which doesn't seem like a lot, but I did some digging. Claude had used an endpoint that was a bit old. Doing some more research I switched to the proper endpoint... which didn't support CORS.

Oh no!

Oh - actually - I just moved to this to val.town and built a quick server side proxy. It takes in the same arguments that's send to my client side code (lat, lng, and a timestamp), and passes it to the historical Pirate Weather endpoint. So here's the frontend code - again - this is being driven by a concurrency function:

async function fetchDayTemperatures(lat, lng, unixSeconds) {
  let req = await fetch(PIRATE_WEATHER_API_BASE, {
    method: "POST",
    body: JSON.stringify({
      lat,
      lng,
      unixSeconds,
    }),
  });
  return await req.json();
}

And here's the backend code:

export default async function (req: Request): Promise<Response> {
  const body = await req.json();
  const key = Deno.env.get("PIRATE");

  const url = new URL(
    `https://timemachine.pirateweather.net/forecast/${key}/${body.lat},${body.lng},${body.unixSeconds}`,
  );
  url.searchParams.set("units", "us");
  url.searchParams.set("exclude", "minutely,hourly,alerts,flags");

  const response = await fetch(url);
  const payload = await response.json();

  if (!response.ok) {
    throw new Error(payload.error || "Weather lookup failed.");
  }

  const day = payload.daily?.data?.[0];
  if (!day) {
    throw new Error("Weather data did not include a daily summary.");
  }

  return Response.json({
    timezone: payload.timezone,
    high: day.temperatureMax,
    low: day.temperatureMin,
  });
}

I barely modified this from the original client side code - only switching to an environment variable for the API (their API is free, but I might as well) and returning a proper Response object.

Here's a screenshot of it in action:

You can try this yourself here: https://weathercomparison.val.run/. If you want to see the code, and possibly fork the val, you can do so here: https://www.val.town/x/raymondcamden/weather-comparison

So, was it cooler?

No. I was wrong. Last year was cooler than this year, but the three years before that were all higher, with 2022 being pure hell. I remember that year seeing the city working on a road that had literally buckled because of heat.

Photo by Peter Albanese on Unsplash

Send me a message in a panel...

2026-05-14T18:00:00+00:00

On my birthday a few weeks ago, one of things I got was something I've wanted to play with for a while, the Divoom Pixoo64 pixel frame. This is pixel art frame you can hang on your wall and with an app, select art, clock faces, and more. It's fun, although the app itself isn't my favorite. But - what excites me is that it has an API you can use to change what's shown on the frame. I actually built a demo of this with Webflow you can see below:

I was thinking about how else I could play with the API and decided to do something a bit risky - build a tool that lets you (yes, you!) send me a message right to my device. How did I do it? Let me describe the process from the bottom up.

The Python Server

At the lowest level is a Python server running on my machine. Yes, this isn't persistent and not stable, but who cares. The server handles accepting a string to display and rendering it on the Pixoo:

from http.server import ThreadingHTTPServer, BaseHTTPRequestHandler
from urllib.parse import urlparse, parse_qs
from pixoo_ng import Pixoo, Channel
from pixoo_ng.config import PixooConfig
import time

def split_string(text: str, max_chars: int) -> list[str]:
    """Split a string into chunks of up to max_chars characters, without breaking words."""
    words = text.split()
    chunks = []
    current = ""

    for word in words:
        if not current:
            current = word
        elif len(current) + 1 + len(word) <= max_chars:
            current += " " + word
        else:
            chunks.append(current)
            current = word

    if current:
        chunks.append(current)

    return chunks

class Handler(BaseHTTPRequestHandler):
    def do_GET(self):
        if self.path == '/favicon.ico':
            self.send_response(404)
            self.end_headers()
            return

        query = parse_qs(urlparse(self.path).query)
        input_text = (query.get('input', [''])[0]).strip()

        if not input_text:
            self.send_response(400)
            self.end_headers()
            self.wfile.write(b"Missing 'input' query parameter")
            return

        pix = Pixoo(PixooConfig(address='192.168.0.191'))

        startY = 5
        strings = split_string(input_text, 15)

        for line in strings[:8]:
            print(line, startY)
            pix.draw_text(line, (2, startY), (0, 255, 0))
            startY += 5

        pix.push()

        self.send_response(204)
        self.end_headers()
        self.wfile.flush()

        # Show it for 10 seconds...
        time.sleep(10)

        # Then go back to my regular face
        pix.set_channel(Channel.FACES)
        pix.set_face(0)

    def log_message(self, format, *args):
        print(f"{self.address_string()} - {format % args}")


if __name__ == "__main__":
    server = ThreadingHTTPServer(("", 8099), Handler)
    print("Listening on port 8099")
    server.serve_forever()

The important bits is how it handles dynamic strings. When you send text to the Pixoo, you have to handle ensuring it actually fits, so to do that, I used a function, split_string, which wraps text on words into an array. I then take that array (up to 7 lines) and send each line progressively lower on the panel.

Here's an example:

To make this little server "live", I simply used ngrok to expose it.

Calling the Server

To call the server, I set up an API route on https://val.town that does the minimal work of proxying a front end call:

export default async function (req: Request): Promise<Response> {
  const body = await req.json();

  //trim message to 80
  let msg = body.message.substring(0, 80);
  let API = Deno.env.get("API");
  console.log(`Sending ${msg}`);
  await fetch(API + `?input=${msg}`);

  return Response.json({ ok: true });
}

The ngrok URL is an environment variable and as I don't care about the response, I return a basic boolean value back.

The Front End

And lastly, I used Claude to build a simple front end. It's just a form with a field and button:

The JavaScript literally just takes the field and sends it to the server code above, but if you want to see the complete project, you can check it out on val.town: https://www.val.town/x/raymondcamden/send-me-a-message

Want to try it? I'll share the URL, but first...

Privilege

I feel safe sharing this demo as my device is in my office, a room my kids don't go into, and I can shut it down in seconds. Heck, I'll probably forget it's running and next time I boot this machine, it won't run anyway. So yeah, no big deal.

But also - I'm a guy. Probably the worst thing I'll get is someone calling me foul names.

I can't imagine there is any world where a woman would feel safe with this kind of connection to random people on the internet.

Try It

Ready to try it? I make no guarantees it will work, but then again, you'll never know. ;) Hit the form here: https://raymondcamden--45cb2f404fa111f1b5dcee650bb23af1.web.val.run/

Photo by Jayne Harris on Unsplash