While I was building FemtoCRM , I needed a dynamic form for entering sale line items. I could build some basic JS to add and remove rows from a table, but each row’s inputs needed to have the row index in its name (i.e. line_items[2].quantity ) which seemed like a pain to manage [1] . I reached for one of those “reactive” frameworks where you define a template and it updates itself in response to…
This script generates a desktop entry that opens a folder, with the same icon and all. #!/usr/bin/env python3 import sys, textwrap from pathlib import Path import gi gi.require_version('Gtk', '4.0') from gi.repository import Gio, GLib, Gtk def get_icon_name(path: Path): """Get the icon associated with a file.""" file = Gio.File.new_for_path(path.as_posix()) info = file.query_info('standard::icon',…
data factual information (such as measurements or statistics) used as a basis for reasoning, discussion, or calculation — Merriam Webster, “data” Is a poem factual information? Do not go gentle into that good night, Old age should burn and rave at close of day; Rage, rage against the dying of the light. — Dylan Thomas, Do Not Go Gentle into That Good Night . TODO: replace with a more topical poem.…
GNOME OS, to be specific. There is no package manager here, and I don’t understand how to build sysexts, so this is my solution. You can install Tailscale without touching any files outside your home directory. This is how I did it, and it’s been serving me well for a few months. (Instructions for systemd.) Create systemd unit We’re going to run tailscaled as a user service , so create a file…
Introducing the <zoop> element — Chrozilla Dev Blog How to magically improve every aspect of your website using <zoop> — Warm Color Site Is <zoop> the next big thing in web development? — XSLT-Tricks How to integrate <zoop> with Nẅxt.js — Vorcel <zoop> still not supported in iOS Safari — May I Use doop.js: a <zoop> polyfill — GitCub New <zoop> element causes some screen readers to shout slurs at…
IN CASE OF CONFLICT, consider users over authors over implementors over specifiers over theoretical purity. Retrofuture sample. Quote: W3C, HTML Design Principles § 3.2 Priority of Constituencies Download Retrofuture Another pixel font I made. This was supposed to be a vector font. The idea was to interpret blackletter forms with no stroke variation and a limited number of angles. Sadly, I still…
Hypertexts: new forms of writing, appearing on computer screens, that will branch or perform at the reader’s command. A hypertext is a non-sequential piece of writing; only the computer display makes it practical. Download Hypersystem Hypersystem is a new font I designed for the web version of Hypermedia Systems. Recently, I reworked the web page of our book Hypermedia Systems (…
The title is wrong. It should be more like "versioning scheme for software that suffers from the spacebar heating problem, i.e. software for which a “breaking change” cannot reasonably be distinguished from a non-breaking one. Background (feel free to skip) I was planning on publishing the first ever alpha release of Denizen. I typed git tag into my terminal and paused. I get these long pauses a…
Background Denizen is a CMS for personal websites. I want to work on multi-language support – people should be able to make websites and posts in any language they want. (My own blog is in English, Turkish, and Toki Pona – so this is a blocker for eating my dog food). Every aspect of this feels like something other people must have already solved, so I wanted to publicly ask if anyone has the…
I recently published the first pre-release version of Fruit Credits on Flathub. (I then immediately published two more because the reviewer discovered a bug). why: boring life stuff After quitting my job and realizing it would be a while before I found a new one [1] , I realized I might need to be a bit more responsible with money. Naturally, I downloaded hledger . I’d tried to use hledger before…
Clickbait title: Can you write a bestselling book in Typst? A shiny new edition of Hypermedia Systems is out! Apart from incorporating typo and grammar fixes sent in by readers, the book was completely redesigned inside with a new layout. To achieve a much higher fidelity of design, we ported the book to Typst — the hot new LaTeX replacement. Why change what works? The first print release of HS…
I’ve been using a Nothing Phone (2a) for a while now. I love the built in widgets, but there’s not enough of them, and most third-party widgets stick out like a sore thumb. Not even any of the Nothing-themed KWGT packs on the Play Store match. So I tried my own hand at it, and with not much effort, I was able to make these two: To my eyes, that’s an exact match! The date and next event widgets are…
We went on a walk in the woods today, and Biber came with us. We came across a cat that looks just like her. He was a male cat. Biber soon caught up and they started to interact: I’m not an animal behaviorist and I couldn’t tell you if they were flirting or getting ready to fight.
so insane to me that people advocate for distro packaging over flatpak hmm yes i love being unable to use up-and-coming software thet nobody packages yet and making it harder for new distros to get off the ground vertical monopolies are good when open source i guess the concept of software package management existing is a failure one (1) software should be expressible as one thing
Bamboo Paper is an app released by Wacom in 2014, presumably to promote their Bamboo series of capacitive pens. It features 6 pens, 3 of which need to be unlocked via in-app purchases. Notes are stored in the proprietary WILL format, and can only be synced to Wacom’s own Inkspace cloud service. Otherwise, backing up notes involves exporting each notebook manually to PDF. Due to these restrictions,…
I’m building Denizen ( https://denizen.dz4k.com/ ), a personal website system that is IndieWeb and Fediverse compatible. Source code: https://codeberg.org/dz4k/denizen
In the latest release of htmx , you can add event listeners to elements with hx-on : <form hx-on::beforeRequest="addCsrfToken(event);"> For all the other hx- attributes, we use CSS attribute selectors. However, with hx-on , the attribute name is not fixed as it contains the event. CSS attribute selectors support wildcards on the value of attributes, but not the name: [hx-trigger] /* common and…
I recently purchased a Samsung Galaxy Tab S7 FE. I wasn’t planning on making it a laptop replacement, but I had some experience with Android’s capabilities for development (from when I only had a phone) and the possibility was irresistible. SSH into my laptop was a no-go. I have no idea how to expose my laptop to the internet in a way that works, let alone is safe. Besides, my model didn’t have…
<%~ await includeFile(“embed.eta”, { filters, url: “ https://lobste.rs/s/22yudo/kindelia_kind_next_gen_functional ” }) %> this is a new programming language, right? and the people who made it are also making a blockchain thing for it to run on. which made some people, including me, sad. so someone laments this, and someone else comes in: The author writes in the Kindelia Readme: There is no native…
/fileshare/2022-09-30 a hypermedia canvas 2022-10-25.pdf
Java and JavaScript are a lot more similar than we give them credit for. A much-maligned language. Old, crufty APIs. Nicer today than many people remember. Complex build tools. Frameworks and metaframeworks galore. So, so much reflection. A vast universe of libraries for everything. Runs on very cursed places. (Java on SIM cards, JavaScript on spacecrafts) How do I make this an executable?…
One area where htmx apps lag behind SPAs is interaction delay. While htmx apps usually have a much improved initial load time, the need for a server roundtrip for most interactions is a disadvantage. For most apps, this doesn’t matter, as they are all frontends to databases anyway. Thus, there is always a request to the server; the difference is whether the response is HTML or a proprietary…
Resource Expansion < GET https://example.com/users/john_doe > { "name": "John Doe", "friends": "/users/john_doe/friends" } < GET https://example.com/users/john_doe?expand=friends > { "name": "John Doe", "friends": { "joe_bloggs": "/users/joe_bloggs" } } Substitute the link named friends with the resource at that link. Resource Traversal < DELETE…
the Ideal Self looks on in and says: pakala There are a few intersecting online communities I lurk around that revolve around writing things down: notebook fans, r/notebooks (“I can stop buying them whenever I want.”) plain text enjoyers (“Clearly the solution is to write a parser.”) “productivity” communities (“look at my Notion/Org Mode/Obsidian/… setup!” / unixporn for people with jobs) the…
I want to add a dark theme to missing.css out of the box using the prefers-color-scheme media query. This is a pretty straightforward thing to do, but it causes a problem when you add your own styles on top of missing.css (the expected main usage). Consider: You install missing.css You override the --accent variable If the user has dark theme enabled system-wide, two things might happen depending…
Event listeners Syntax Meaning on add event listener every do not queue events mousemove event name (clientX, clientY) expose the event’s properties [clientX > 100] filter events 3 only respond to 3rd click or 3 to 10 respond to 3rd, 4th … 10th click or 3 and on respond to all clicks except 1st and 2nd from #my-form element to attach listeners to, (?? me) debounced at 200ms trailing debounce…
Thanks to Phrogz comment for comments. line line comments, we specialize further so that the type of comment start character(s) can be extracted from the scope. double-slash // comment double-dash -- comment number-sign # comment percentage % comment character other types of line comments. block multi-line comments like /* … */ and <!-- … --> . documentation embedded documentation. constant…
I deploy my website on Cloudflare Pages (at time of writing). My builds were failing with the error message: 17:24:49.795 Deploying your site to Cloudflare's global network... 17:24:50.632 Failed: an internal error occurred No other information. Googling yields that many things can cause this issue. In my case, it was a directory called _redirects/ in the output folder . Cloudflare expects…
_hyperscript is intentionally unscalable. We make decisions that would be obviously inadvisable to anyone looking to make scalable software, and dismiss features like reactivity that seem to have proven themselves in this regard. To understand why, I examine and critique the concept of “scalable”. Scalability refers to the ability of a system to handle more work given more resources. This…
tawa kama lon e ni, o sitelen insa e ijo jasima: nanpa pi ken ala kipisi mute pini li lon. o nimi e kulupu pi nanpa ni kepeken sitelen P . ni la o mute e nanpa ale pi kulupu P , o namako e wan. (ni li ken tan ni: kulupu P li suli pini). o nimi e nanpa sin ni kepeken sitelen N . nanpa N la ken tu li lon: ona li nanpa pi ken ala kipisi, anu ona li ijo tan mute pi nanpa ante pi ken ala kipisi. ken…
A GUI script to run VSCode in a toolbox container. Recently, I switched to [Fedora Silverblue] as my desktop operating system. To give a basic summary, Silverblue is an operating system where the system files are immutable, and can be restored to a previous state at any time. This version of Fedora does not ship the package manager dnf . Instead, you are expected to install applications in one of…
When people talk about code sharing between server and client, the usual suspects are Node.js and sharing model classes. However, there's often good reason to duplicate these. A far more interesting type of code sharing to me is eliminating this duplication: When you are writing a server-driven web app with "sprinkles" of JS, you want to have interactive components, but also deliver usable HTML to…
2021-09-08 : Kırmızı kazandı! (twitter) Ankara Büyükşehir Belediyesi sokak tabelalarının yenilenmesi için yarışma düzenledi. Halk oylamasına sunulmak üzere üç tasarım seçildi. Siz de Başkent Mobil uygulamasının Söz Hakkı bölümünden oy verebilirsiniz. Ben oyumu çoktan Eser A için kullandım. Büyük yazı kullanılmasını, metro, otobüs durağı gibi yerlerin gösterilmesini ve mimari eser künyelerinin…
tenpo ni la pilin li telo: jan ni li kama tan ma anpa: sewi li lawa e ona pakala. sewi o pona e ona. jan Jesu wawa o pana e lape tawa ona.
TL;DR This is how you do it: on click tell the closest <li/> to the target remove yourself -- do more stuff... -- "you" refers to the clicked list item Or more concisely: on click tell closest <li/> to target remove yourself I’ve seen some people use a pattern like this: <ul> {% for item in items %} <li _="on click remove me">{{ item }}</li> {% endfor %} </ul> This is convenient to write if you…
I made a tool to make bookmarklets in _hyperscript . You just write some code in the box and drag the bookmarklet into your bookmarks toolbar. Hypelet injects glue code to load hyperscript dynamically and run your code. You can get a permalink to share your bookmarklet. Here’s Hypelet: Hypelet Here’s the code for a bookmarklet to get the RSS feed of a page: Get RSS – Hypelet
Update 2021-09-02 : HDB has evolved since this post was written. Though it works mostly the same way, there have been fixes and a UI redesign. Check the _hyperscript repo for the up-to-date Code: The 0.0.6 release of the _hyperscript hypertext UI scripting language introduces HDB, an interactive debugging environment. In this article I discuss how the hyper-flexible hyperscript runtime allowed me…
hyperscript 0.0.4 beta is going to be out soon a sneak peek: the wait command can now pause evaluation until an event is received here a class is added, hyperscript waits for the transition to end, then the element is removed feature suggested by @DenizAksimsek <div _="on click add .fade then wait for transitionend then remove"> This is a notice. Click to dismiss. </div>
Transcript Server-Side App Full-page reloads HTML only has GET and POST methods …and only link clicks & form submissions Single-Page App Reinvent the accessible web Need big frameworks or complex code Probably need a server anyway for SSR The client is untrueted Progressively Enhanced App Tight coupling between server & client code Behavior is scattered htmx Completing HTML with arbitrary events,…
( Skip to code ) Enums in Javascript Currently, the ways we create enums include String literals (see addEventListener ), which can be typed with TypeScript, but look a bit ugly type Direction = 'north' | 'east' | 'south' | 'west' TypeScript enums enum Direction { north, east, south, west } Integer constants, IMO your best option if you’re not using TypeScript const Directions = { north: 0, east:…
I’ve started using CoffeeScript instead of YAML for frontmatter, and it works like a dream. Endorsed by Zach Leatherman . Markdown with Frontmatter As far as I know, Jekyll is the origin of using a YAML block at the top of a Markdown file for metadata. It’s not hard to imagine why this became popular — associating prose with data is a common use case, and though they have their issues, both…
Ordu’daki tabelanın olduğu yazıda İstanbul’a yolum düşerse oradakilerin resmini paylaşırım diye yazmıştım. Başka bir şey dileseymişim. Pandemi yüzünden İstanbul’da gezemedim ama bu tabelaları gerçekte görme fırsatım oldu. Özel tasarım Kent yazıtipi ve ilçe renk kodlarını biliyordum ama tabelaların kabartmalı olduğu fotoğraflarda belli olmuyor. Bu tabelalar direk üzerinde ama bir çoğu bina…
I mentioned these signs in my post about the ones in Ordu and said I’d post a picture if I ever went to İstanbul. I think I just wasted my wish. While I didn’t get to explore İstanbul due to the pandemic, I had an opportunity to see one of these for myself, with the custom-made Kent typeface and the district color codes (as you can see, I was in the lime green Çekmeköy district). When I saw one…
I recently started using the RSS publishing option to syndicate posts from my personal site to DEV. This allows people to post comments under my posts, many of which might contain useful info. To allow any readers to easily discover and participate in these discussions, I’ve added links to the dev.to copies under my posts. ( Skip to code ) I could, of course, add these links manually whenever I…
Nothing gets me quite like city lights reflecting off water. Though it’s usually rainwater on asphalt.
Street sign in Ordu. The layout seems inspired by street signs in İstanbul, but those are red and lack a garish logo at the bottom, instead featuring the names and color codes of the districts of İstanbul. I should post a photo if I end up going there for some reason. Update 06/01/2021: I did!
A few pics from there.
When you want to add a box shadow to an element, but don’t want to override any it might already have. ( Jump to code ) Less-than-amazing solutions We could copy the box-shadow property from the element in question, paste it and append our additional shadow at the end. Of course, this requires us to know the box-shadow on the target element, which might not always be possible (say, making a…