private » Programming Hacks Used In This Site
Algorithms & Old Lace: LLM Poisoning For Personal Websites

Rage Against The Machine: Algorithms & Old Lace: LLM Poisoning For Personal Websites

Private AIs: They're Watching You

Last year my friends in an Indieweb meetup began to notice that information about them was turning up in LLMs... some comically inaccurate, some uncannily personal. As a group of personal website developers, we knew that much of the information must've been scraped of our website.

It might not be apparent reading my site, but I've always been a little careful about what information I allow about myself on the web. It's near impossible to prevent personal information from leaking out, and my name is unique enough that I'm not hard to find. I had an unfortunate incident with an online stalker a number years ago and since then have always been careful. I also once had a real-life harasser who broke into my home, although that was a much different and more complex situation. But together these made me aware that…

Code & Algorithms » Web
Tech note: How To Export or Import Notes from the “Webstickies” Extension In Firefox

Free Your Mind, And Your Sticky Notes Will Follow: Tech note: How To Export or Import Notes from the “Webstickies” Extension In Firefox

Amongst my most-used browser extensions is Webstickies by Lawrence Hook, which allows you to leave a permanent "sticky note" on any web page. It's available for both Firefox and (yuck, ptui) Chrome, although I only use it in Firefox.

However, the one thing it lacks is an import/export functionality. For $10, you can get access to "Cloud Sync" for your notes—yes, another unneeded "cloud integration" where local functionality would have been superior.

Consider this side-by-side feature comparison:

Local Import/Export Cloud Sync Transfer notes between browsers or computers ✔ ✔ Allows the plugin developer to make some money selling the use of infrastructure that shouldn't strictly be needed ❌ ✔ Need to literally copy down every single note by hand, one by one, to get them out of the extension ❌ ✔ Email yourself a full copy of your notes for safekeeping ✔ ❌…
Code & Algorithms » Web
A Technological Solution to Disincentivize a Web Development “Concern Troll”

Fun With A Purpose: A Technological Solution to Disincentivize a Web Development “Concern Troll”

I had an interesting thing happen a few months ago where a troll in a chat room decided for some reason to run my site through the W3C's Nu HTML Validator and apparently was grievously wounded by the validation errors it had—and furthermore, had a big concern with the overall bandwidth consumption of the site, with all its images and heavy pages.

Rather than simply solving the problem by not visiting my site, this person apparently felt some sort of imperative to berate me over these things and not. let. it. drop, making the chat room difficult to be in and necessitating action on my part.

So, rather than try to verbally wrangle with a troll, I whipped up a technological solution. And, of course, the monkey in my soul decided to have a little fun with it.

I. Lassoing the HTML Validator

Nowadays, if…

Code & Algorithms » Demo & Live Tool Playground
Web Demo: CSS Dynamic Point Light Source & Parallax Shadows

Let There Be More Light: Web Demo: CSS Dynamic Point Light Source & Parallax Shadows

Click here to view this in a separate tab.

This demonstrates a high-performance method of rendering dynamic CSS drop shadows from a simulated point light source.

The note and sun light source elements have been made interactively user-draggable by the inclusion of an external draggability package.

Until I have this documented, you can see the code on Codepen at https://codepen.io/kupietz/pen/LEpzJgL.

Update, Feb 2026:

This is not my work but it deserves a mention here. I've been completely outdone. Check this demo out. This guy designed an entire css system around physical lighting: https://ambientcss.vercel.app/ Github: https://github.com/kikkupico/ambientcss

Workshop » Works In Progress » Code & Algo Works In Progress

Software Index Placeholder

This is a placeholder page left here to remind me to set up a single-page index of links to all my various software projects.

Workshop » Works In Progress » Code & Algo Works In Progress
Draggable Elements WordPress Plugin

Nothin' But A Drag: Draggable Elements WordPress Plugin

First, the demo

This is a brief demo page for my KupieTools Draggable Elements WordPress plugin, which dynamically adds interactive draggability to any page element, based on CSS class names (or, really, any CSS selector).

Here's some boxes:

Drag Me Horizontally Drag Me Vertically Drag Me Anywhere Drag Me To Corners

If you select "View Page Source" on this page in your browser, you will see that the above four DIV elements, as defined in the page HTML, are just ordinary DIV elements with a single classname, an ID, and some visual styling. The KupieTools Draggable Elements plugin adds draggability to any arbitrary page element, by simply specifying a class name or other CSS selector for it in the plugin. (If you use your browser's Inspector instead of View Page Source, you'll see the current state of those elements, with any changes or additions the plugin created…

Workshop » Works In Progress » Code & Algo Works In Progress

Customization Is King: KupieTools Custom WordPress Plugins Overview

Pardon My Placeholder!

This page is a placeholder listing my various Github repos containing my custom WordPress plugin work, loosely branded as "KupieTools", as I work on more detailed pages documenting them.

kupietools/ktwp-wp-plugin-caching-toolkit A plugin providing functions for WordPress developers to implement PHP function caching for performance. kupietools/ktwp-wp-plugin-cli-mode WordPress plugin supplementing my CLI.html text-based web browsing front end. Adds a little icon on wordpress pages to allow users to switch to a javascript-based terminal emulator providing web page browsing commands via the keyboard. kupietools/ktwp-wp-plugin-debuggery-toolkit WordPress plugin providing handy debugging functions particular to the author's needs. /kupietools/ktwp-wp-plugin-draggable-elements WordPress Plugins allowing developers to make any previously existing page element draggable freely, vertically, horzontally, or constrained to corners, by adding the element's CSS selector to the plugin code. kupietools/ktwp-wp-plugin-editor-codefolding WordPress plugin adding code folding (disclosure triangles) to the built-in editors on WP's admin…
Code & Algorithms » Demo & Live Tool Playground
Pure CSS interactive web holiday lights (updated for 2025)

season's geekings: Pure CSS interactive web holiday lights (updated for 2025)

/* xmas lights */ #lightrope { text-align: center; white-space: nowrap; overflow: hidden; position: fixed; z-index: 1000; margin: -15px 0 0 0; padding: 0; pointer-events: none; width: 100%;left: 0;top: var(--wp-admin--admin-bar--height); } #lightrope > li { position: relative; display: inline-block; list-style: none; margin: 20px 20px 20px 22px; } #lightrope > li > div { position: relative; border-left: 2px solid rgba(0,0,0,.05); border-right: 2px solid rgba(255,255,255,.5); margin: 2px 0 0 -3px; padding: 0; display: block; width: 8px; height: 18px; border-radius: 50%; transform-origin: top center; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; pointer-events: auto; } /* Colors for different bulbs */ #lightrope > li:nth-child(5n+0) > div { -webkit-animation-duration: 0.8s, 4.1s, 3s; animation-duration: 0.8s, 4.1s, 3s; } #lightrope > li:nth-child(5n+1) > div { -webkit-animation-duration: .9s, 4.3s, 3s; animation-duration: .9s, 4.3s, 3s; } #lightrope > li:nth-child(5n+2) > div { -webkit-animation-duration: 1s, 4.5s, 3s; animation-duration: 1s, 4.5s, 3s; } #lightrope > li:nth-child(5n+3) > div { -webkit-animation-duration: 1.1s, 4.7s, 3s; animation-duration: 1.1s,…
Code & Algorithms » Web
Web Design—Adding Text Previews To HTML Details Disclosure Elements

god is in the details: Web Design—Adding Text Previews To HTML Details Disclosure Elements

Looking around the site, you might get the hint that I'm a big fan of <details class="detailsClassName"><summary>blah blah blah</summary> even more blah blah blah</details> disclosure elements.

For those unfamiliar, that's this:

Here's a title of a section

Here's where a bunch of information goes. Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah

It's true. I am.

But, I have one issue with them: sometimes I feel like they're a little nonintuitive. It's easy to miss them in certain circumstances, or maybe even not to realize they're clickable.

So, I came up with a way to make them show a preview of the contents.
First, you need the following…

Code & Algorithms » Web
Scripts to Analyze CSS from Firefox’s Javascript console.

For Web Devs and Other Tool-Using Animals: Scripts to Analyze CSS from Firefox’s Javascript console.

When, in the course of human events, it becomes necessary to understand why your wordpress site's freaking menus display fine when you're logged in as administrator but are completely broken when you're logged out, it may be useful to be able to easily compile all the CSS for the affected page elements for both the working and nonworking versions, and compare them to see what might be different.

Let me back up. I had a problem the other day where my Wordpress site's caching plugin, which performs various optimizations on my site's code for non-logged-in users, was adding some sort of broken CSS. When I was logged in, everything worked fine, but when not logged in, something changed somewhere in the CSS that caused some of my menus not to display. I had a rough idea of where the changed code must be, but no more than that, and…

Code & Algorithms » Web
Resurrecting the HTML <BLINK> tag

In With The Old: Resurrecting the HTML <BLINK> tag

Back in the bad old days, there was an HTML tag called [code][/code]. It did this, which everybody hated because it was annoying, and everybody's web pages looked like this:

.blink { display: inline-block; animation: blink 1s step-end infinite;} .oldschool, .oldschool * {font-family:times,'times new roman',serif !important;} .oldschool:not(a), .oldschool *:not(a) {color:#000;} .oldschool a, .oldschool a blink {color:blue !important;text-decoration:underline !important;} .oldschool a:visited blink {color:purple !important;}

Hello! Welcome to Kupietz Arts+Code This is the homepage of Mike Kupietz where you can see all his art, music, writing, and code!

BEST VIEWED WITH

An interesting bit of history, courtesy of Lou Montulli, early Mozilla engineer and author of…

Code & Algorithms » Finance
Excel-based Motley Fool Premium Investment Service Performance Analyzer

Don't Believe The Hype: Excel-based Motley Fool Premium Investment Service Performance Analyzer

Back before I first became the global success I am today, I began looking into investing. Among the things you can't miss when you enter that world looking to learn is the endless promotions from a company called The Motley Fool, advertising their subscription service, in which they give you a stock pick or two a month, and which they trumpet as having a stellar average return, far in excess of the market average and most common benchmarks like the S&P.

Welllllll there's just one thing. I noticed one word...

'Average'

A lot of dishonest people try to slide things by others, in life in general, by showing great "averages", because "averages" are easily inflated by rare outliers.

For instance, consider this series of stock returns of hypothetical investments:

Investment 1: -2% return
Investment 2: -1.1% return
Investment 3: 0.7% return
Investment 4: 58% return

private » Programming Hacks Used In This Site
Non-render-blocking YouTube embeds in WordPress

Video Killed The Pagespeed Score: Non-render-blocking YouTube embeds in WordPress

On this site's Music Reviews page (itself built on-the-fly by a shortcode that sorts and displays posts from a "Music Review" custom post type), most of the reviews are accompanied by YouTube video embeds from the album in question.

What I didn't realize in setting that up is that YouTube embeds use [code][/code] tags to embed videos, and [code][/code] tags block page rendering—the page's onload property, which signals that the page is fully ready to display to the viewer and to remove the spinning "page loader" image I use on this site as pages load—does not fire until every iframe on the page has fully loaded its contents. This caused that page, which currently only has a handful of videos on it, to load very slowly. What's worse, this site's custom menus parse all page contents every time the site is updated to display for word counts,…

private » Programming Hacks Used In This Site
WordPress Shortcode & Function Performance Optimization with Transients

Optimization-A-Go-Go: WordPress Shortcode & Function Performance Optimization with Transients

I suffer from that paradoxical form of laziness peculiar to computer geeks where I will save myself save myself 15 minutes of work on something by spending 4 hours creating a shortcut. As such, the menus on this site are dynamically generated by traversing the category tree in PHP and laying out menus and submenus from categories and subcategories, sparing me the trouble of updating them manually as I add new content. This took some effort.

I created a shortcode that does this (well, modified a shortcode, originally from the Hierarchical HTML Sitemap plugin, by Alexandra Vovk & WP Puzzle) and soon my site was happily generating dynamic menus on the fly and keeping up with my work as I added pages, edited titles, and rearranged categories.

And, along the way, getting slower.

And slower. And slower.

Finally the other night, due to a confluence of circumstance,…

Code & Algorithms » Finance
TradingView Pine Script Indicators, Algos & Experiments

Trading Tools: TradingView Pine Script Indicators, Algos & Experiments

Here's a collection of trading tools I wrote & shared on TradingView, a finance markets charting site, in their native Pine script. These were originally published on my old crypto trading site, ApopheniaPays.com.

These will only be of use to traders who have an account (free or paid) on TradingView.com.

Code & Algorithms » Finance
An Excel-based DeFi Uniswap Liquidity Pool/Automated Market Maker Simulator

Untangling Uniswap? Demystifying DeFi? You Tell Me: An Excel-based DeFi Uniswap Liquidity Pool/Automated Market Maker Simulator

For a few years I was in cryptocurrency trading. Eventually, this led me to the wild west of decentralized finance tokens ("DeFi"), an exciting area that I feel has strong potential to be on the cutting edge of technology's potential to fundamentally reshape our society.

Decentralized Finance concept: The "Automated Market Maker"

Among the odd beasts you'll encounter on the frontiers of DeFi is the "Automated Market Maker" (AMM) managing a "liquidity pool", of which the most prominent current example is Uniswap. This is a decentralized algorithm running on the Etheruem network that serves the same purpose in DeFi markets as the large "market makers" and financial houses that retail traders are buying and selling from in the traditional stock market. In DeFi, instead of being privately run, these are open and communal, and operate by strict rules set up in "smart contracts" on the…

Code & Algorithms » Web
How to make a completely unusable homepage in CSS3 and <strike>jQuery</strike>Javascript

Usability Hell: How to make a completely unusable homepage in CSS3 and jQueryJavascript

One of my favorite bits of code I've ever written is on the front page of my jiggy, ancient, perpetually-under-construction, virtually-never-viewed old personal website, Life In A Mikeycosm. Eager to make my front page "pop" a little more back in days gone by, I came up with a clever CSS3/javascript hack that caused the page text and logo to slip and slide in three dimensions in response to your mouse movements, rendering the page somewhere between difficult and totally unusable for actually navigating the content of the site. I've always been inordinately fond of this.

I've embedded it below so you can experience the source of my amusement. Actually, if you click through the above link to the real site, at the bottom left there's a "Stop this crazy thing" link that stops the animation and moves the links into rows so they're readable and clickable. I…

Code & Algorithms » MacOS & Desktop

Thunderbird Customization: a FiltaQuilla “open mail folder on receiving mail” Javascript Action script

Among the many things the late, lamented Eudora email client spoiled me for was, when I checked my mail, opening all the mailboxes that had received mail in new windows. That way I could click through, looking at each mail window and closing it when I was done, and be sure I had seen all my new mail.

This is a javascript you can paste into the FiltaQuilla addon's "Javascript Action" filter action which brings this behavior to Thunderbird.

Following are the explanatory README, the script code, and license, embedded from my repo on Github at https://github.com/kupietools/filtaquilla-open-mail-folder-on-receiving-mail.

.emgithub-file pre {white-space:normal !important;} .emgithub-file tr, .emgithub-file td, .emgithub-file th, .emgithub-file span {min-width:32px !important;text-align: left !important; margin:2px 4px 0 0 !important;padding:2px !important;line-height:1.5em !important;}

Code & Algorithms » Web

Take The Edge Off Your Web Browsing: WebCooler userscript

If you're like me, you care passionately about certain subjects; the natural flip side of this is being viscerally revulsed by certain things. As a matter of mental hygiene I'm fairly picky as to who and what I let into my world, but unfortunately, on the world wide web, it can be tough to avoid being forced to give some of your mindshare to things that are just plain not productive to pay attention to.

With this in mind, I created a browser userscript I call the "WebCooler". WebCooler sits in your browser, hosted by a free userscript manager plugin like GreaseMonkey or TamperMonkey. You supply it with lists of words and topics you don't care to see, and it cleanly and invisibly removes those matching terms from the web, not by erasing just those words, but by silently and invisibly…

Code & Algorithms » MacOS & Desktop
Terminal-Notifier Bridge For Thunderbird Email Client

Thunderbird Customization: Terminal-Notifier Bridge For Thunderbird Email Client

Hot off the presses. Direct from my Github, a MacOS BASH script to allow customized per-mailbox notifications in the Mozilla Thunderbird email client. Following is the README containing full information and instructions, and then the code and license, embedded live from my
terminal-notifier-bridge-for-thunderbird repo on GitHub.

.emgithub-file pre {white-space:normal !important;} .emgithub-file tr, .emgithub-file td, .emgithub-file th, .emgithub-file span {min-width:32px !important;text-align: left !important; margin:2px 4px 0 0 !important;padding:2px !important;line-height:1.5em !important;}

private » Programming Hacks Used In This Site
Adding A Default Featured Image Or Thumbnail In WordPress

All Thumbs: Adding A Default Featured Image Or Thumbnail In WordPress

What's a featured image in WordPress?

WordPress, the software this site runs on, works by allowing authors to enter web page content (sometimes officially called 'posts', as in a blog post, and which I often colloquially on this site refer to as an 'article') which it then formats nicely to display in web viewers. When you enter a post, it lets you specify a bunch of other information pertaining to it: category, some additional tags, a custom summary to show search engines, etc. Among the things it allows you to specify is a 'featured image', or 'thumbnail', an image representing that post.

You see featured images all over the site: in the backgrounds of individual pages, as tiny squares next to the menu entry for a page in the menus up top, on the "Related Posts" entries at the bottom of a lot of pages, or in…

private » Programming Hacks Used In This Site
WordPress Custom “Hero Header” Modifications

Used on this site: WordPress Custom “Hero Header” Modifications

This site uses the "Sinatra" free Wordpress theme as its base. Sinatra includes a single "Hero Header" the row of 3 animated featured posts on the home page which changes background images as you mouse over post titles within it.

I wanted this to be multi-row, a grid instead of just one row. The code natively contained an option to include up to 12 featured posts, which could easily be made to wrap around to new rows, but the problem was, the background of the entire section containing all rows changed when you moused over a post, not just the single row, and I wanted not just a row-by-row background, but I wanted potentially unlimited rows.

I moved the code that generates the rows into a function, and then called it repeatedly, once for each row I want. At some point I may make it automatically add as many rows…

Code & Algorithms » Demo & Live Tool Playground
The Internet Bad Statements (“BS”) Detector

Online Fact-Checking Tool: The Internet Bad Statements (“BS”) Detector

Here's a fairly old repost from my consulting site, where it got no traction whatsoever.

The Bad Statements Detector is a specialized search tool designed to aid in online research and to help prevent people from passing along nonsense on the internet, by making it easier to look stuff up on fact-checking websites like Snopes.com, Politifact, FactCheck.org, and other myth-busting websites all at once.

It works very simply: drag a “Detect BS” button to your bookmarks bar to create a "bookmarklet", a javascript bookmark that opens a tool when clicked. Then, while you surf the web, you can drag your mouse to select text on any web page and click your “Detect BS” bookmark link. This will return no-nonsense links from a multitude of reputable fact-checking and science websites that tell you if the statement you selected is well-known BS (plus offer you some sharing options right from the popup.)

Code & Algorithms » WordPress Plugins & Mods
Generating On-The-Fly Email Addresses as an Anti-Spam Measure in WordPress

Generating On-The-Fly Email Addresses as an Anti-Spam Measure in WordPress

On my IT consulting business site, I'm using a php script I've written to generate on-the-fly random email addresses specific to the browsing session looking at the site. So, I can include email addresses in plain text on the site, but if a spammer harvests one, I can block it, and other people legitimately browsing the site will still get individualized working addresses they can contact me with.

It generates a log as email are generated, so you know who got what email. You'll want to watch the log size yourself so you don't fill your disk space.

Obviously it's more complicated than just this, there's whitelisting involved as well as some other behind-the-scenes trickery, such as double-checking emails against the log as they arrive, that I can't reveal publicly for opsec reasons.

But, I can reveal the basic php script that coughs up a random email address specific…