Lewis Nakao lewdev

💻 Address Bar Code Editor Bookmarklet Part 2 (876b) - Keeping It Dark

Part 1: 💻 Address Bar Code Editor Bookmarklet (841b)

I just learned about an easy way to enable "Dark Mode" on any web page with:

:root { color-scheme:dark; }

🧪 JEX Part 3: Two-Color Pixel Editor Exports to JEX Data (each byte stores 3 values) in Sharable URL

JEX is a URL friendly Base 69 data storage method I created. JEX is a name that combines the names JavaScript and Hexidecimal.

All JEX characters: ()*+,-.0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz~

NOTE: I was about to publish the format before realizing that twitter hates single quotes because they force it to be encoded. I really wanted to keep it at 70, I SWEAR!

These characters are all in order by charCodeAt and skips URL unsafe characters: &/:;=? @#<>[]{}|\^%\

`highlightDiff` compares two strings and

adds a strikethrough attribute to text that was removed and
adds a green highlight over the text that was added.

It's very simple solution that works for most situations.

<pre id=o></pre>

📄 Load Local Text File to HTML Page in JavaScript (+bookmarklet 🔖)

I wanted to be able to load a text file on a page; specifically, a CSV file for my purposes.

The idea is to load a text file and do some data analysis.

The code uses a built-in browser object FileReader and displays the result. Here's a simple implementation:

🔼 Turn a webpage into a detab window (no tabs, buttons, bars) as a #bookmarklet

Save this in a bookmark URL and click on it when you land on the page you want to turn into a clean window.

javascript:window.open(location.href,"detab","toolbar=0");window.close()

🎮 Download CSV of Steam Purchases (473b)

Much like my script to Download Steam Library List, I created a similar script to download your list of Steam Purchases as a CSV file.

It's not perfect because you'll have to filter out the refunds and other types of transactions. Someone on reddit requested me to make it and I figured it was something I wanted to do myself so I did.

🏪 Visit Purchase History Page

Your Purchase History

My JS1024 Annual JavaScript Golfing Competition Submission

I'm happy to have something to submit to the JS1024 2024 competition. I just found out about the competition and realized that I have something to submit even if it's not aligned with the theme. I'm pretty sure I started and finished the project during the competition. See my submission here.

Title: 🏗 Stacking Game

Short Description: Press Space or tap on mobile! See how high you can go in this stacking game!

	<script>
	const showCoord = (eventName, pos, e) => {
	o.innerHTML = `${eventName} "${pos}" at x: ${e.x}, y: ${e.y}`;
	e.preventDefault()
	};

	const onMouseEvent = eventName => e => [
	e => showCoord(eventName, "Left", e),
	e => showCoord(eventName, "Middle", e),
	e => showCoord(eventName, "Right", e),

	<canvas id=c><script>c.width=c.height=1080;x=c.getContext`2d`,F=M=0,onload=U=e=>{requestAnimationFrame(U);if(F&&e<M-2)return;M=Math.max(M+1e3/60,e);T=F/60;if(T*60\|0!=F++)T+=1e-6;E(T)};E=t=>{

	S=Math.sin;

	//Inside a cylinder trick
	//https://youtu.be/6XtrgFPoZ2E?si=ucjJgzsH8UVdsH11&t=64

	c.width\|=0;x.font="2cm'"
	x.fillText('⚽',0,70)
	for(i=70;i--;)for(j=2;j--;)x.drawImage(c,

	<table><tbody><tr id=o></tr></tbody></table>
	<script>
	o.innerHTML = [window, Set, Array, Math, Number, RegExp, Date]
	.map(M=>`<td><h3>${M.name \|\| M}</h3><br>${Reflect.ownKeys(M).map(a=>JSON.stringify(a)).join`<br>`}</td>`).join``;
	</script>
	<style>*{vertical-align:top}