barefootstache @barefootstache@qoto.org

Today's yield adds quite nicely to this year's total.

They are currently being dried on a metal tray.

#foraging #hazelnuts

Another fruitful yield from #foraging #hazelnuts.

Amazed that after sharing this image with friends who claimed that they are into foraging, that none of them knew what it is.

Taking upon the challenge of making this #NodeJs project more user friendly that non-tech users can also use the tool.

Gotten to the point that one can run the code locally and receive the POIs. The image shows a preliminary mask of how the website might look like.

The trickiness of the task is that the tool uses the `fs` package which doesn't directly have a similar package for the web. One can compress a lot of the code with #webpack while using plugins like #pollyfill and #babel. These resolve all the issues other than I/O of files.

It seems like a possible solution to deal with the `fs` issue is to use the various database and storage solutions of a browser.

@marquisdegeek

#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 (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 (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 (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 (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 (311/365)

The #OpenStreetMap data varies in #Wien with some sectors quite well detailed and other sector lacking in information.

One thing that jumps out, at least in sector 13, is that there is no real system how sidewalks should be mapped. Some highways are so bad that they use both systems. Meaning putting the sidewalk details onto the highway and mapping it separately.

#DailyBloggingChallenge (244/250)

Here is an example of the note `other pc` in the wild.

The red route is the planed route, where as the dark blue one is the one that was tracked.

#DailyBloggingChallenge (198/200)

This test has a better alignment with the activities one will be doing.

Although they are all tests of endurance over various body regions, they give a pretty good baseline #fitness.

#fitodon #PhysicalTraining #GORUCK @rucking

#DailyBloggingChallenge (110/200)

Today I cleaned up my apothecary somewhat. Quite shocked that I had a tincture since 2016 and most of the tinctures that were disposed haven't been used at least once in the past two years.

Although most of the tinctures are alcohol based and probably would have still been fine, didn't want to risk it. The others were either glycerin or vinegar based.

#wildcrafting

#DailyBloggingChallenge (99/100)

The typical person would have stayed home, since it was cold and raining, nonetheless the #MunichRuckingCrew did today a 12 miler. Everyone was fully soak by the end of the event.

I had the opportunity to try out #rucking with an umbrella. This did ease up the navigation experience and kept the upper body dry. The down side was that it was a night ruck and my umbrella is white, so if I dipped the umbrella down while having my headlamp on, I blinded myself.

The pace wasn't too shabby for a six person crew and one mate twisted their ankle about an hour in. This made us to drop the pace from 6.6 kmh to 6.0 kmh.

#muenchen #NightRuck #12miler #FitoTrack @rucking