#fixatocodes — Public Fediverse posts on home.social

FiXato @[email protected] · 2023-01-26 · 02:47 UTC

Here's a bit of #CSS you can use (at least on #GlitchSoc #Mastodon) if you want to display the contents of the #ARIA label attribute (which includes the image descriptions as well as the post's body text) instead of the post body.

I was hoping to do this on the img tag, so I could always display the image alts while retaining the post body with its original formatting, but apparently because the img tag is a 'replaced element', and thus the :after approach doesn't work: https://stackoverflow.com/questions/5843035/does-before-not-work-on-img-elements

I'm aware I can achieve this with a browser extension or some other way to insert javascript to manipulate the DOM instead, but I was just trying to see if I could achieve it with just CSS.

Anyway, here's the CSS, even though to me it ended up not being that useful as I prefer to retain the original formatting of the post body without basically duplicating its text:

/* Add the contents of aria-label after the status */
.status:after {
    display: block;
    content: attr(aria-label);
    white-space: pre-wrap;
    word-break: normal;
}
/* Hide the original post body*/
.status__content__text { display: none }

#FiXatoCodes

#fixatocodes #css #glitchsoc #mastodon #aria

FiXato @[email protected] · 2022-12-28 · 01:09 UTC

Hmm, idea for a #BrowserExtension: a simple side panel that lists the current page's media grouped by type and sorted by filesize, perhaps with complete URLs and download buttons. I know the media can usually also be found through a developer tools view, but I kinda find that one too clunky for my needs.

onto the #FiXatoCodes #ToDo list it goes.

#browserextension #fixatocodes #todo

FiXato @[email protected] · 2022-11-23 · 14:23 UTC

Top 20 instances where my followers and people I am following come from:

mastodon.social (79 total / 39 following / 51 followed)
fosstodon.org (33 total / 17 following / 22 followed)
mastodon.art (27 total / 19 following / 11 followed)
mstdn.social (13 total / 4 following / 11 followed)
hackers.town (12 total / 9 following / 9 followed)
mastodon.online (11 total / 0 following / 11 followed)
mas.to (10 total / 1 following / 9 followed)
mastodon.technology (10 total / 2 following / 9 followed)
icosahedron.website (9 total / 8 following / 5 followed)
tilde.zone (9 total / 5 following / 7 followed)
octodon.social (9 total / 7 following / 5 followed)
tenforward.social (8 total / 7 following / 3 followed)
mastodon.sdf.org (7 total / 5 following / 6 followed)
linuxrocks.online (7 total / 3 following / 4 followed)
toot.cat (6 total / 3 following / 4 followed)
mastodon.xyz (6 total / 3 following / 3 followed)
merveilles.town (6 total / 6 following / 0 followed)
nerdculture.de (5 total / 1 following / 4 followed)
chinwag.org (5 total / 4 following / 1 followed)
chaos.social (5 total / 2 following / 4 followed)

(Taken from the output of a little tool I am currently working on. Note to self, I should add percentages.)

#MastodonStats #FediConnections #FiXatoCodes

#mastodonstats #fediconnections #fixatocodes

FiXato @[email protected] · 2022-08-06 · 13:41 UTC

Updated my Mastodon (glitch-soc) tweaks user-script (which is currently just CSS tweaks) a bit to have a different fallback font as Verdana was causing issues with combining glyph composition. (See this thread for some debugging of that.)

Tweaks included:

Increase the width of the first and last column so there's more space for the text and media of your home timeline, and the expanded posts
Increase size of emoji / emotes when you hover over them, making it easier to see what they are supposed to represent
Change the font to Optima Nova LT Pro, Atkinson Hyperlegible, Roboto, Arial, or a sans-serif font.
Add a small purple bar above images that come without status content text, so you have some easy-to-click-on area to expand the post.

#Mastodon #GlitchSoc #MastoDev #userStyles #userScripts #FiXatoCodes #coding #CSS #stylesheets #Unicode #FontComposition

#mastodon #glitchsoc #mastodev #userstyles #userscripts #fixatocodes

FiXato @[email protected] · 2022-05-23 · 11:40 UTC

This image has also made me realise that my game 'engine' does not currently handle objects that have 'moved' very well; it only assumes things can disappear, or change in-place... in the case of the arm in the drawing in the previous toot, the clickable area would only be in one relative location; i.e. if I make the clickable region closely around the arm on the left one, you'd have to click on the empty air on the right one. So I'd either have to put a bounding box over the shared area (the arm and the empty air), which is my current approach, or I'd have to add a second region and some how link both together.

#FiXatoCodes #FiXatoCreative #FindTheDifferences #coding

#coding #findthedifferences #fixatocreative #fixatocodes

FiXato @[email protected] · 2022-05-23 · 11:08 UTC

Hmm, since the image similarity comparison is done via Structural Similarity Index on greyscale versions of the images, it unfortunately also means that sometimes changes aren't picked up because the changed object actually already blends into the background when their saturation (I think?) is similar to that of the background...

Maybe I can get around this by doing the contour extraction on the individual colour channels, and then merging the contours?

SVG image from https://freesvg.org/find-10-differences-vector-drawing, with minor adjustments.

#coding #opencv2 #Python #FiXatoCodes #FiXatoCreative #SVG

#svg #fixatocreative #fixatocodes #python #opencv2 #coding

FiXato @[email protected] · 2022-05-23 · 07:52 UTC

Yay, I think I've made some significant progress on detecting the differences between two images with #opencv2, and extracting the contours to #SVG paths. :D

Now all that would be left is to merge the paths and the (bitmap) images into the template SVG I got. :)

#coding #FiXatoCodes #FiXatoCreative #cv2 #openCV #contourDetection #FindTheDifferences #Python

#python #findthedifferences #contourdetection #opencv #cv2 #fixatocreative

FiXato @[email protected] · 2022-05-23 · 07:52 UTC

Yay, I think I've made some significant progress on detecting the differences between two images with #opencv2, and extracting the contours to #SVG paths. :D

Now all that would be left is to merge the paths and the (bitmap) images into the template SVG I got. :)

#coding #FiXatoCodes #FiXatoCreative #cv2 #openCV #contourDetection #FindTheDifferences #Python

#opencv2 #svg #coding #fixatocodes #fixatocreative #cv2

FiXato @[email protected] · 2022-05-23 · 02:58 UTC

#NoteToSelf: see if I can use https://pyimagesearch.com/2017/06/19/image-difference-with-opencv-and-python/ to find the bounding boxes of the differences between left and right images, and generate the SVG from that automatically.

#coding #python #svg #FiXatoCodes

#fixatocodes #svg #python #coding #notetoself

FiXato @[email protected] · 2022-05-23 · 01:24 UTC

This evening I started #coding on my "Find it" or "Spot the differences" kind of game, after seeing #BeardGrabber get rather excited over playing a similar thing with me through a YouTube video we came across, and not being able to find decent free alternatives.

Several hours later I think I have something quite presentable already. So, here is my Secret of Mana-inspired find-the-differences game which runs in your browser.

No third party resources; just some javascript for detecting clicks and toggling visibility of markers indicating successful guesses and updating the counters, and an SVG that contains the two pictures and the difference markers.

Can you find all 12 differences?

(It definitely could still use some improvements, such as maybe have an option of putting the images below each other instead of side-by-side, and looking into accessibility improvements, and making it easier to add your own images, but this #toy will primarily be for me and kiddo to enjoy.)

#FiXatoCodes #FiXatoCreative #SecretOfMana #FindIt #FindTheDifferences #SpotTheDifferences #game #games #gaming #GratisGames #IMadeAThing #browserGames #HTML #JavaScript

#javascript #html #browsergames #imadeathing #gratisgames #gaming

FiXato @[email protected] · 2022-05-22 · 22:33 UTC

@grumpy I couldn't quickly find something I liked, so I threw together a proof of concept myself: https://fixato.org/temp/FindIt/

The process still is a bit more involved than I'd like, as I need to create an SVG file myself in which I mark the regions that are different, but that's something I can probably automate further down the line.
I'll first probably want to add a counter that indicates how many differences are still to be found, and to show an animation and/or sound when all have been found. :)

(As well as a loader for different source images, which I also need to find and/or create. ;))

But for an evening's #coding in between family things, I'm satisfied with the result. :)
(And little #BeardGrabber was already pointing at the differences while building it).

#FiXatoCodes #FiXatoCreative #parenting #dadsOfMastodon #parentsOfMastodon

#parentsofmastodon #dadsofmastodon #parenting #fixatocreative #fixatocodes #beardgrabber

FiXato @[email protected] · 2022-05-19 · 16:15 UTC

#hashtags I regularly use:

#FiXatoCreative a collection of all my creative outlets. I usually combine these with one of the following:
#FiXatoPaints for my physical media paintings and #FiXatoPaintsDigitally for my digital ones.
#FiXatoDraws drawings made with other materials than paint. Distinction is not always very clear cut, and I may use them interchangeably.
#FiXatoWrites for my writing activities
#FiXatoFoto as well as #photography and #dailyPhoto for photographs I've taken.

Then there's also these other topics that interest me:

#FiXatoCodes and #coding (which is perhaps better used as a profile filter: FiXato's #coding posts)
#FiXatoStreams for my posts about my #livestreaming activities.
#FiXatoBlog for posts I would like to expand to full blog posts at a later point, or for posts about the development of said blog.
#MSX and #MSX2 for posts about the MSX #homecomputer from the 80s.
#FiXatoFood for food I eat and/or make
#pun and #puns for the puns I make

#WhoAmI #MyProfile #MyHashtags

#myhashtags #myprofile #whoami #puns #pun #fixatofood

FiXato @[email protected] · 2022-05-19 · 16:15 UTC

#hashtags I regularly use:

#FiXatoCreative a collection of all my creative outlets. I usually combine these with one of the following:
#FiXatoPaints for my physical media paintings and #FiXatoPaintsDigitally for my digital ones.
#FiXatoDraws drawings made with other materials than paint. Distinction is not always very clear cut, and I may use them interchangeably.
#FiXatoWrites for my writing activities
#FiXatoFoto as well as #photography and #dailyPhoto for photographs I've taken.

Then there's also these other topics that interest me:

#FiXatoCodes and #coding (which is perhaps better used as a profile filter: FiXato's #coding posts)
#FiXatoStreams for my posts about my #livestreaming activities.
#FiXatoBlog for posts I would like to expand to full blog posts at a later point, or for posts about the development of said blog.
#MSX and #MSX2 for posts about the MSX #homecomputer from the 80s.
#FiXatoFood for food I eat and/or make
#pun and #puns for the puns I make

#WhoAmI #MyProfile #MyHashtags

#hashtags #fixatocreative #fixatopaints #fixatopaintsdigitally #fixatodraws #fixatowrites

FiXato @[email protected] · 2022-05-19 · 16:15 UTC

#hashtags I regularly use:

#FiXatoCreative a collection of all my creative outlets. I usually combine these with one of the following:
#FiXatoPaints for my physical media paintings and #FiXatoPaintsDigitally for my digital ones.
#FiXatoDraws drawings made with other materials than paint. Distinction is not always very clear cut, and I may use them interchangeably.
#FiXatoWrites for my writing activities
#FiXatoFoto as well as #photography and #dailyPhoto for photographs I've taken.

Then there's also these other topics that interest me:

#FiXatoCodes and #coding (which is perhaps better used as a profile filter: FiXato's #coding posts)
#FiXatoStreams for my posts about my #livestreaming activities.
#FiXatoBlog for posts I would like to expand to full blog posts at a later point, or for posts about the development of said blog.
#MSX and #MSX2 for posts about the MSX #homecomputer from the 80s.
#FiXatoFood for food I eat and/or make
#pun and #puns for the puns I make

#WhoAmI #MyProfile #MyHashtags

#hashtags #fixatocreative #fixatopaints #fixatopaintsdigitally #fixatodraws #fixatowrites

FiXato @[email protected] · 2022-05-19 · 16:15 UTC

#hashtags I regularly use:

#FiXatoCreative a collection of all my creative outlets. I usually combine these with one of the following:
#FiXatoPaints for my physical media paintings and #FiXatoPaintsDigitally for my digital ones.
#FiXatoDraws drawings made with other materials than paint. Distinction is not always very clear cut, and I may use them interchangeably.
#FiXatoWrites for my writing activities
#FiXatoFoto as well as #photography and #dailyPhoto for photographs I've taken.

Then there's also these other topics that interest me:

#FiXatoCodes and #coding (which is perhaps better used as a profile filter: FiXato's #coding posts)
#FiXatoStreams for my posts about my #livestreaming activities.
#FiXatoBlog for posts I would like to expand to full blog posts at a later point, or for posts about the development of said blog.
#MSX and #MSX2 for posts about the MSX #homecomputer from the 80s.
#FiXatoFood for food I eat and/or make
#pun and #puns for the puns I make

#WhoAmI #MyProfile #MyHashtags

#hashtags #fixatocreative #fixatopaints #fixatopaintsdigitally #fixatodraws #fixatowrites

FiXato @[email protected] · 2022-05-19 · 16:15 UTC

#hashtags I regularly use:

#FiXatoCreative a collection of all my creative outlets. I usually combine these with one of the following:
#FiXatoPaints for my physical media paintings and #FiXatoPaintsDigitally for my digital ones.
#FiXatoDraws drawings made with other materials than paint. Distinction is not always very clear cut, and I may use them interchangeably.
#FiXatoWrites for my writing activities
#FiXatoFoto as well as #photography and #dailyPhoto for photographs I've taken.

Then there's also these other topics that interest me:

#FiXatoCodes and #coding (which is perhaps better used as a profile filter: FiXato's #coding posts)
#FiXatoStreams for my posts about my #livestreaming activities.
#FiXatoBlog for posts I would like to expand to full blog posts at a later point, or for posts about the development of said blog.
#MSX and #MSX2 for posts about the MSX #homecomputer from the 80s.
#FiXatoFood for food I eat and/or make
#pun and #puns for the puns I make

#WhoAmI #MyProfile #MyHashtags

#hashtags #fixatocreative #fixatopaints #fixatopaintsdigitally #fixatodraws #fixatowrites

FiXato @[email protected] · 2021-06-01 · 23:57 UTC

Today I learnt a bit more about #VRAM pages and palettes on the #MSX2, especially addressed from within the #MSX #BASIC language.

As a result I made some more progress on my fork of Zett Darkstone's tile-drawing editor programme and released build 24, which can now properly save your drawing (and progress) to disk.
(Actually importing it again is future exercise.)

If you want to play around with it, you can load the dsk via WebMSX

#ZettDarkstone #Darkstone #FiXatoCodes #coding #retrocomputers #emulation #WebMSX