Adding a Dolly Zoom to Your Map / / No Comments This week, Andrew Sepic of Mapbox published a fascinating article on Unlocking Mapbox GL JS’s Hidden Field of View Control – a technique that can dramatically change how a map feels without moving the camera at all.By manipulating the camera’s internal FOV parameter, developers can:Create a telephoto effect (narrow FOV) for architectural visualizationProduce a dramatic wide-angle Maps Mania… more → Posted in: Interactive Maps Tagged with: Adding, Dolly, Zoom
Adding Hardcover.app Data to Eleventy / / No Comments It’s been far too long since I shared an Eleventy tip, and to be fair what I’m showing today can be used anywhere, but hopefully this will be useful to someone else out there. I enjoy tracking my media consumption, specifically movies and books. For movies I’ve been real happy with Letterboxd (you can see my profile if you wish). For books, I used Goodreads for a very long time, but have wanted to migrate off the platform and switch to something else. There’s alternatives, but none really worked well for me. Earlier this week, an old friend of mine (hi Jason!) suggested Hardcover. This is a Goodreads competitor built, in their own words, out of spite, and I can totally... more → Posted in: JavaScript Tagged with: Adding, data, Eleventy, Hardcover.app
Adding Generative Summaries with Chrome AI / / No Comments Earlier this year (sigh, when I had a job), I built a demo using Chrome’s built-in AI support to do something I thought was really interesting – progressively enhance product reviews to make it easier to see which were trending negative versus positive. It was a great example (imo!) of how AI support could enhance the experience in supported browsers without impacting the experience for others. That demo was on my mind this week, and it occurred to me that it would also be a great place to add summarization. The Summarizer API is now fully released, for Chrome that is, and does not need a flag enabled or anything like that. I’ve blogged about this API a few times already, most... more → Posted in: JavaScript Tagged with: Adding, Chrome, Generative, Summaries
Adding a Web Debugger to BoxLang (First Version) / / No Comments This one’s been sitting in my "to do" blog queue for sometime now and I figured the beginning of spooky season (September 1 – don’t we all start celebrating Halloween then?) was a good excuse to finally kick this out the door. Many, many years ago I learned to love one of the simpler features of ColdFusion, the debugging output. This is a feature ColdFusion has probably had for near twenty or so plus years and while it’s not the same as a "full" debugging service (which also exists), or the powerhouse Fusion Reactor, it’s an incredibly simple way to look at what’s going on in your web application. It works by first enabling it (something... more → Posted in: JavaScript Tagged with: Adding, BoxLang, Debugger, first, version
Adding Programming Language Detection with Built-in Chrome AI / / No Comments As I’ve been playing, and thinking, more and more about how to best add Chrome AI support to web apps, I came across an interesting use-case that I think could be helpful, and like in my previous examples, be completely ok if it didn’t actually work. When I write on the developer blog at Foxit, I make use of WordPress plugin for code samples. This editor has a place for you to both paste in your code, and select the language so the proper highlighter is used: This works well enough, but it gets a bit annoying to have to constantly keep selecting Python in the dropdown. Ideally the form would use the last language (simple enough via LocalStorage), but I was curious how well Chrome’s... more → Posted in: JavaScript Tagged with: Adding, Builtin, Chrome, Detection, Language, programming
Adding CORS to Your BoxLang APIs / / No Comments CORS, or Cross-Origin Resource Sharing, has been the bane of my existence at times. Don’t get me wrong, I get the idea behind it. I get why it’s necessary. That being said, I tend to forget about it until I write some client-side JavaScript code that gets hit by it. With that in mind, I thought I’d quickly demonstrate how to build CORS-enabled APIs with BoxLang. It’s incredibly simple, which is good, but you’ll want to keep it in mind when building out your own APIs. What and Why? I’m not going to repeat the full description of CORS available from MDN, but it basically boils down to a security feature in browsers. When executing code on your domain that makes... more → Posted in: JavaScript Tagged with: Adding, APIs, BoxLang, CORS
Adding PDFs to Your Webpage without JavaScript / / No Comments Edited at 4:03PM to add a small note to the end. In my time at Adobe, one of the products I evangelized was the PDF Embed API, a JavaScript library for adding PDFs to a web page. I still recommend this library of course, but I was thinking this morning about how you could get similar results without JavaScript. Remember, you are allowed to build a web page and not ship any JavaScript. It’s ok, I won’t tell. Before looking at what I built, some context to why someone would use a library like Adobe’s PDF Embed: Browser’s have great built-in PDF support, natively, but the display is typically the entire page, which means you lose the context of the rest of your site. There’s... more → Posted in: JavaScript Tagged with: Adding, JavaScript, PDFs, Webpage, without
Adding Translation with a Web Component and Chrome AI / / No Comments A few days ago, I blogged about using Chrome’s built-in generative AI features (which are still super duper too early to even consider for production) to add on-device translation capabilities to a web app. It got me thinking, what if we could do translation automatically via a web component? If for some reason it failed, that would be fine as the original text would still be there, but in cases where it could work, it would be automatic. Here’s what I built. First, I whipped up a quick HTML demo of the text I’d like translated: <translate-text>Congress shall make no law respecting an establishment of religion, or prohibiting the free exercise thereof; or abridging the... more → Posted in: JavaScript Tagged with: Adding, Chrome, Component, Translation