#dailybloggingchallenge — Public Fediverse posts

While writing up a reflection of completing the #DailyBloggingChallenge for a year, I realized that my #Hugo based website is missing #SEO data in its head.

The hugo clarity theme comes with SEO though it is not activated by default and one would only realize it when going through the layouts/partials/opengraph.html code. There is the mention of the site param blogDir that is not implemented anywhere else within the code.

Thus to activate the SEO over #SchemaOrg and #JsonLd one needs to add the param blogDir and point it to the designated section. Using the exampleSite as a reference it would be blogDir = "post" in the config/_default/params.toml file.

#DailyBloggingChallenge (365/365)

The only caveat of the #Whisper project is that it only works on 16-bit #WAV files.

There is a #FFMPEG script on how to do it via the #terminal

ffmpeg -i input.mp3 -ar 16000 -ac 1 -c:a pcm_s16le output.wav

#DailyBloggingChallenge (364/365)

The ‘Quick Start’ section in the Readme sufficed for setting up.

The only thing that I had to change in the ./models/download-ggml-model.sh script (1) is remove the option --show-progress on line 105. Seems like GNU Wget2 2.1.0 doesn’t have that option.

Alternatively one can replace the option with

--progress=bar --force-progress

• 1: https://github.com/ggerganov/whisper.cpp/blob/master/models/download-ggml-model.sh

#wget #bash

#DailyBloggingChallenge (363/365)

Instead opted in to using #Whisper which also works with #KdenLive.

Although Whisper is originally written in #Python there is a #CPP project that makes transcribing very fast. It took less than 2min to transcribe the 26 min audio clip.

https://github.com/ggerganov/whisper.cpp

#DailyBloggingChallenge (362/365)

Originally wanted to use #VOSK to transcribe the #SpeechToText. Initially tried it out over #KdenLive and its ‘Speech Recognition’ tool.

This took quite awhile to setup, since it is not concrete what kind file format, if any, the VOSK model should have. Additionally, the recommendation of setting up a virtual #Python environment didn’t work as expect and went with the global approach.

And finally scratched the whole approach, once realizing that transcribing 26 min audio clip is taking longer than 10min.

#DailyBloggingChallenge (361/365)

Further options exist like #YouTubeDL (1) or stream via #VLC.

Sometimes I wished that creators would mirror their channels on more permissive sites like #PeerTube or #Odysee that don’t hard-lock into watching ads.

• 1: https://github.com/ytdl-org/youtube-dl

#DailyBloggingChallenge (360/365)

Alternatively one could also use #FFMPEG to combine the files together via the #Terminal like

ffmpeg -i video.mp4 -i audio.wav -c:v copy -c:a aac output.mp4

Source: https://superuser.com/a/277667

#DailyBloggingChallenge (359/365)

Most of the time, I try to watch videos on #Invidious with lower resolution to speed up loading time, especially since I watch by default at twice the playback rate.

Today I realized that some instances permit the downloading of content. And even if one has to download audio and video separate, one can easily merge them together temporarily in one’s favorite #VideoEditor without the need to render the end product.

#DailyBloggingChallenge (358/365)

For a long time #BraveBrowser was the trick to mitigate #YouTube ads.

Seems like YouTube has finally caught on and now going back to #Invidious.

#DailyBloggingChallenge (357/365)

This concludes the explanation behind the process of creating a #Paypal partial for #Hugo using #GoLang tricks combined with #HTML, #CSS, and #JavaScript

The #TLDR can be read at https://bf5.eu/post/guide/hugo-how-to-create-paypal-partial/

#blog #writing

#DailyBloggingChallenge (356/365)

Now one shall add the missing checks and default cases. Further one shall add the CSS classes mentioned in 353.

The result is seen in the image.

• 353: https://qoto.org/@barefootstache/112915941194079675

#DailyBloggingChallenge (355/365)

Now that the partial is complete, look back at its parent. Combining the code from 345 and 348 one gets this image.

The problem of this code so far is that it doesn’t check if the $itemsOutput exists. Further there are no checks that the array .Params.paypalItems has any items and there is no default case.

• 345: https://qoto.org/@barefootstache/112786991862960301
• 348: https://qoto.org/@barefootstache/112915551078887830

#DailyBloggingChallenge (354/365)

The whole code of the partial looks like in the image.

A lot of this code can be squashed to save space for the cost of readability.

#DailyBloggingChallenge (353/365)

Looking at the #JavaScript code in the image that will be parsed over #GoLang using the printf function.

First one creates a change event listener function that is bound to the id of item-select-$uniqueID. The <select>-tag shall be added the id attribute in line 13 (351).

Additionally a custom attribute data-image shall be created and placed on the <option>-tag in line 15 (351). This holds the path to the image value within the paypalItems element.

Outside of the partial the #CSS classes selected-value and selected-image need to be defined. They present the respective values from paypalItems element.

In the initial case, lines 10-11 will be called that take the value from the first element in the paypalItems array. Defined from {{ $selectedValue := index .items 0 }} which shall be prepended before the JavaScript code.

• 351: https://qoto.org/@barefootstache/112915802181947117

#DailyBloggingChallenge (352/365)

This code will generate dynamically based off of the length of the paypalItem or .items variable and use the first element of it as the default value (line 9).

Next one will extend the code with more CSS classes to ease the referencing of the JavaScript actions.

#DailyBloggingChallenge (351/365)

Now that the #PseudoCode exists, it shall be converted into #Hugo syntax as described in 349. As in the image, some #GoLang functions are used like printf and other Hugo functions to loop over the variables that are saved as an array type.

• 349: https://qoto.org/@barefootstache/112915585198772399

#DailyBloggingChallenge (350/365)

Now wrap the #HTML code (338) with a <div> and a #CSS class that extends the uniqueID (345) in its name. The pseudo code looks like the image.

• 338: https://qoto.org/@barefootstache/112786449265511946
• 345: https://qoto.org/@barefootstache/112786991862960301

#DailyBloggingChallenge (349/365)

Further within the partial, since safeHTML will be used one can parse string using #HTML and #JavaScript syntax within #GoLang. As an example

{{ $output := "" }}

{{ $output = print $output "<span>Example</span>" }}

{{ return $output }}

This creates a <span>-tag with the text Example after safeHTML pipe is applied.

#DailyBloggingChallenge (348/365)

In 342 the first mention of using a callback function is used without any concrete description of how it shall be built. From the last image one needs to change the partial reference to be saved as a variable which is then piped with safeHTML, so

{{ $itemsOutput := partial "paypal-button" (dict "paypal" .Params.paypal "items" .Params.paypalItems "headName" .Params.paypalHeadName "headValue" .Params.paypalHeadValue "uniqueID" $uniqueID) }}

and the rendering is done via

{{ $itemsOutput | safeHTML }}

• 342: https://qoto.org/@barefootstache/112786710916723982

#DailyBloggingChallenge (347/365)

Hypothesis: This current epidemic of social media use in childhood and adolescents and its impact of their developing brain has probably been seen before.

About 150a ago the alcohol laws on minimum drinking age has been established to minimize the effects on the developing brain. Back then medical advances in the scientific method just started advancing, thus it took so long to establish such an age. Additionally the age of adulthood has been pushed back by many years, where lots of regions had the ruling that one can drink with marriage, which could start as early as the beginning of teenage years.

Fast forward to today where we already know the adverse effects of social media on the molding minds and are taking little action to prohibit and/or minimize its use. Corporations have tried to install a minimum age requirement and this can be very easily lied on.

I doubt that ID checks will be established on such platforms any time soon, because of the current ecosystem of data value and angst of where such data will land.

It seems like the only place where ID checks were successfully applied are on services where can earn money. And these were first implemented once governments started stepping in to learn where the user is gaining the influx of money.

tl;dr As long as government doesn’t intervene, we won’t see any positive change towards child brain development.

#DailyBloggingChallenge (346/365)

The trickiness of #teaching is taking a multidimensional concept and presenting it in a linear fashion.

The trickiness of #studying is taking the linear concept and transforming it into a multidimensional pattern that one’s mind can understand.

Transpiling these ideas to the #TypeScript language would be:

In the ideal case the teacher can just JSON.stringify(<concept>) and the student just reverts the function with JSON.parse(JSON.stringify(<concept>)) and learning would be done. People aren’t basic #JavaScript objects and have a schema tied to their minds, thus they need additional parsing to comprehend the concept.

#DailyBloggingChallenge (345/365)

The next step is to create an unique value. Luckily #Hugo has a built in command via

{{ $uniqueID := .File.UniqueID }}

which needs to be placed within a range tag meaning within

{{ range .Pages }}

So the whole list.html file would look like the image. We are also passing in the "uniqueID" $uniqueID as the last parameter in the dict for the partial "paypal-button".

#DailyBloggingChallenge (344/365)

Let’s say we would implement this pseudo code for the subdirectory content/post/store. It would work fine for one product in the subdirectory store.

Now let’s add a second product that also has the same form (339) with different values.

If one would change either drop-down, both would update. The reason is that the #JavaScript callback is only checking for the #CSS class change and not for an unique class.

References

• 339: https://qoto.org/@barefootstache/112786502951083139

#DailyBloggingChallenge (343/365)

Time to make an overview of what we have so far:

(image Initial)

Since we are already using the callback approach, it would be better to move out everything that is not viable to the #paypal form. Thus making the overview more like

(image Reformed)

#Hugo #HTML #XML

#DailyBloggingChallenge (342/365)

First we want to resolve the UX nightmare issue by designing the UI usable.

Let’s go with this arrangement of items:

• title of item
• image of item
• drop-down to choose the item

This means we want to create some kind of callback that updates the prior two components that are dependent on the selection within the drop-down. Thus, we will need to extend #Hugo with #JavaScript while using #golang.

#DailyBloggingChallenge (341/365)

The question now is how to build the partial. Since #Hugo is a static site generator that focuses on using static elements like raw #HTML and #CSS, one quickly realizes the options to continue further are not many.

One could try to use the CSS option:checked property and other pseudo classes within the <option> HTML tag to turn on and off the various choices within the array. Though this becomes quite difficult to reference items outside of the <option> tag and can make the whole thing an UX nightmare.

#DailyBloggingChallenge (340/365)

Now we will create a partial called paypal-button.html within the layouts/partials/ directory. We want to call this partial like

{{ partial "paypal-button" (dict "paypal" .Params.paypal "items" .Params.paypalItems "headName" .Params.paypalHeadName "headValue" .Params.paypalHeadValue) }}

within a list template (either the default or another partial).

#Hugo

#DailyBloggingChallenge (339/365)

Through the abstraction of these variables and using the power of an array in the meta of #Hugo as #toml, one can create an item like in the image.

The array in this example is called paypalItems and each element has the properties: name, value, image. Further properties of the meta are paypal as the <PAYPAL_TOKEN>, price should align with the price within the #paypal cart, paypalHeadName as <PAYPAL_INIT_REFERENCE>
paypalHeadValue as <PAYPAL_INIT_VALUE>.

Of course one could optimize the code somewhat by removing the variables that have INIT_(VALUE|NAME) within them and replacing them by the first item 1_(VALUE|NAME). And replacing <PAYPAL_INIT_REFERENCE> with on0.

#DailyBloggingChallenge (338/365)

The #HTML code from #PayPal looks like the image with these variables:

• <PAYPAL_TOKEN> is the main PayPal hook, so it knows how to update the store relative to all further actions taken within the form
• <PAYPAL_INIT_REFERENCE> usually as on0
• <PAYPAL_INIT_VALUE> is usually equivalent to <PAYPAL_ITEM_1_VALUE>
• <PAYPAL_INIT_NAME> is usually equivalent to <PAYPAL_ITEM_1_NAME>
• <PAYPAL_ITEM_1_NAME> is usually equal to <PAYPAL_ITEM_1_VALUE>
• <PAYPAL_ITEM_2_NAME> is usually equal to <PAYPAL_ITEM_2_VALUE>

#DailyBloggingChallenge (337/365)

Another example is the genre of memes.

Most individuals just consume memes. Some individuals send memes to their peers, thus making them dealers. Some further individuals harvest memes or other funny texts from one platform like the Fediverse and share them to another platform like Signal, thus making them harvesters. And the least, actually create a new meme, either an original or a remix, thus making them producers.

#DailyBloggingChallenge (332/365)

The main way that I evaluate #books specifically #AudioBooks is by taking a #VoiceRecording after each chapter, section, or idea.

I have noticed that with #NonFiction books, I can easily listen to them at twice the speed. On the other hand, #fiction books need to be listened to at normal speed.

#DailyBloggingChallenge (325/365)

The other day, I did a round of white #DressShirt #washing using the soak method and #detergent with #Oxi. These were soaked in a separate basin not to waste water in filling up a bathtub. To help sink the clothing, a 5lbs #FreeWeight was used.

After letting it soak for 6h, I realized that I made an irreversible mistake. The water plus detergent solution was so strong that it dissolved the coating of the free weights and created #rust spots throughout the clothing.

The only good thing is that it messed up the lesser important of the two shirts.

#CautionalTale #laundry

#DailyBloggingChallenge (325/365)

The other day, I did a round of white #DressShirt #washing using the soak method and #detergent with #Oxi. These were soaked in a separate basin not to waste water in filling up a bathtub. To help sink the clothing, a 5lbs #FreeWeight was used.

After letting it soak for 6h, I realized that I made an irreversible mistake. The water plus detergent solution was so strong that it dissolved the coating of the free weights and created #rust spots throughout the clothing.

The only good thing is that it messed up the lesser important of the two shirts.

#CautionalTale #laundry

#DailyBloggingChallenge (325/365)

The other day, I did a round of white #DressShirt #washing using the soak method and #detergent with #Oxi. These were soaked in a separate basin not to waste water in filling up a bathtub. To help sink the clothing, a 5lbs #FreeWeight was used.

After letting it soak for 6h, I realized that I made an irreversible mistake. The water plus detergent solution was so strong that it dissolved the coating of the free weights and created #rust spots throughout the clothing.

The only good thing is that it messed up the lesser important of the two shirts.

#CautionalTale #laundry

#DailyBloggingChallenge (321/365)

When comparing the scraping method between Goruck’s and Sandlot’s page they differ quite significant.

On #Goruck one can use a simple #HTML parser and extract the data from a reusable #CSS class name.

On #Sandlot one has access to the response data as #JSON and needs to create a pattern/dictionary matcher.

#DailyBloggingChallenge (320/365)

Implementing ICS was quite easy after finding a functional library on #npmjs.

The difficulty was creating a parsing function that takes the already existing data format and put it into the #ical one. This means the new property duration was introduced using the same schema as provided from the ics library.

#DailyBloggingChallenge (309/365)

Another aspect is seeing a cherry tree in the wild.

One can understand not knowing the typical rind pattern or the leaf shape, but not being able to identify the fruit on the tree is mind boggling. It should be mentioned that many of them are not fully ripe and the shades range from green/white to red, there are some that are deep cherry red moving more towards the brown spectrum.

Also understand the hesitancy of trying them, which I would haven’t done also in their shoes if one is not familiar with the vegetation.

In general, only eating a small dose of an unknown plant usually doesn’t have an adverse effect.

#wildcrafting #CherryTree

#DailyBloggingChallenge (275/300)

Let’s we want to create a shortcut to #Odysee using #Firefox and #Alacarte. Then the command is

firefox https://odysee.com/

The icon can either be found on the web or directly extracted from their website.

#DailyBloggingChallenge (274/300)

Due to the execution via the #terminal one can directly use #Alacarte to make shortcuts to web applications.

All one needs is the execution code for the browser like firefox for #Firefox and the location of the #WebApp.

firefox <location>

#DailyBloggingChallenge (273/300)

Do you know of #Alacarte the menu editor for #GNOME?

It is practical in renaming and/or hiding/adding new items to the menu.

One thing one will notice when making such an item is that the execution is done via the #terminal.

#DailyBloggingChallenge (258/300)

The parent category has stronger restrictions.

1. #MobileGaming is only permitted from 12:00 - 22:00.
2. During those times, the total gaming time permits only 2h.
3. There is the option to earn 5min extra time if one does 5min #PhysicalTraining session.

These general restrictions were also put on other engineered binging technology like mainstream #SocialMedia.

#TimeLimit

#DailyBloggingChallenge (257/300)

#TimeLimit has the option to have parent categories. This eases the behavior over multiple child categories.

If we continue from the #MobileGaming example, they all have the same parent.

#DailyBloggingChallenge (245/250)

This note taking schema is mentioned in this diary entry:

https://www.openstreetmap.org/user/barefootstache/diary/403828

The diary talks about #OpenStreetMap exploration in #Croatia. The author has to tackle three water crossings while carrying their 45 lbs #ruck and deal with prickly scrub without a machete. See if you would also be up for the challenge!

More photos: https://pixelfed.de/i/web/post/680766546871375419

#WeHackHealth #OptOutside #rucking #brooking

@barefootstache
@rucking

#DailyBloggingChallenge (235/250)

One of my #OpenStreetMap #MicroMapping areas is waterway=ditch mapping. In this realm one mainly needs to know the possible crossings, the water flow direction, and on which side of the highway it exists.

The flow direction is the trickiest of the three, since with the tag intermittent=yes one cannot depict directly the flow direction. The tag is used when the ditch is either dry or has little water across the year. This tag is optional, though since it exists, expect the outcome to meet such instances in the wild.

#DailyBloggingChallenge (227/250)

Onto the in person mappers comes the goal factor. This means is the goal just to map or is the goal to get to a specific destination.

If it’s the latter then one needs to manage between achieving the goal while mapping on the fly. For such cases there are many apps that can achieve the updater aspect without losing too much time mapping. To name a few #StreetComplete or #EveryDoor.

In the manager aspect the mentioned apps can help or #SCEE or #OsmAnd or #Vespucci.

Though many times one doesn’t have enough time to navigate through the apps to accomplish the desired outcome. Thus jotting a note down or taking a photo can quickly save the details and later when more allotted time exists they can be updated.

#OpenStreetMap

#DailyBloggingChallenge (205/250)

There is one game that one surface is an #IdleGame, but in a more active way. Meaning one has missions where the units cannot be engaged with while en route. These missions last from anywhere of 30 s to 1 h. Thus the #TimeLimit app is adjusted to these properties and set as 15 min active followed by 1 h break.

This game is basically a time management game and it is #TrainStation2.

#DailyBloggingChallenge (204/250)

Currently there are two kinds of games that I fancy #IdleGame and #TowerDefence games.

The way that they differ in regards to the #TimeLimit app is that the idle games get small play time of 10 min followed by 4 h break, where as the tower defence games get longer play time of 30 min followed by even longer break of 8 h.

This is tailored such that one can quickly progress in the idle games and gets more enjoyment when one actually has the resources. Where as by tower defence games, one is actively playing thus more leeway is given in the moment, but frequency is not required throughout the day, since there is little benefit in the idle time.

#MobileGaming

#DailyBloggingChallenge (203/250)

Have played with two time formats so far and need to probably adjust it a third time.

My findings so far:

• 20 min per gaming session is way too long
• 5 min per gaming session is way too short and almost always extended by another 10 min
• the break between each gaming session is currently at 2 h, which is too long for some games

Thus will need to adjust the #TimeLimit app on the various games instead of grouping them altogether.

#DailyBloggingChallenge (202/250)

In the past the app #TimeLimit has helped to stop social media binging, though with gaming the same cannot be said.

The main difference is the task that has been cut short might be (subjectively) mission critical in a game. Thus one gets the feeling of incompleteness and almost automatically extends one’s permitted timer.

#SocialMedia

#DailyBloggingChallenge (199/200)

The hand release pushups are easier to count over normal pushups, because the bottom position is better defined than the parallel position of the upper arms.

The only question is if on the bottom position if it suffices for the palms to leave the ground or do the fingers also have to. This puts a bit more strain on the fingers if the latter.

Not to talk about the inconveniences of being tall. The journey travelling between the top and bottom position just increased. The only thing that could reduce the distance is having a larger wasteline. Though this might not be convenient in the long run, since one will be moving more weight.

#fitness #PhysicalTraining #fitodon #WeHackHealth