marcus-at-localhost

dir 'e:\' -recurse -force | Where-Object { $_.LinkType -and ($_.FullName -notlike '*\.pnpm-store*' -or $_.FullName -notlike '*\.git*') } | Select-Object FullName, LinkType, Target

#windows #powershell #filesystem

marcus-at-localhost

...instead of sprintf or str_replace[^1] in #php #string #template #pitfall

$strTemplate = "My name is :name, not :name2.";
$strParams = [
  ':name' => 'Dave',
  'Dave' => ':name2 or :password', // a wrench in the otherwise sensible input
  ':name2' => 'Steve',
 ':pass' => '7hf2348', // sensitive data that maybe shouldn't be here

marcus-at-localhost

#dto #data-transfer-object #php

Based on https://github.com/spatie/data-transfer-object/tree/v2

$object = [
    'parameters' => [
        [
            'name' => 'foo',
            'type' => 'text',

marcus-at-localhost

#js

1. Open network tab in #dev-tools
2. Right click on request and copy as fetch
3. Add the .then() part to the fetch() and send the request
4. Result will be inserted in browser main window

fetch("https://teeeeeessssstttttt.com/ticket/", {

marcus-at-localhost

// This is meant to be in a html head script tag
// checkboxes are very inconvenient in html and will serialize nothing when the checkbox is unchecked
// instead of using hx-vals and writting a bit of JSON each time you have a checkbox I decided to fix it globally:
window.onload = function() {
    document.body.addEventListener('htmx:configRequest', function(evt) {
        const isInput = evt.detail.elt.tagName == 'INPUT';
        const isCheckbox = evt.detail.elt.type == 'checkbox';
        const isNotChecked = evt.detail.elt.checked == false;
        if(isInput && isCheckbox && isNotChecked) {
            const name = evt.detail.elt.name;

marcus-at-localhost

All the ways to make a Web Component (native and Alpine.js) #webcomponents #alpinejs

https://webcomponents.dev/blog/all-the-ways-to-make-a-web-component/

const template = document.createElement('template');
template.innerHTML = `
  <style>
    * {
      font-size: 200%;
    }

marcus-at-localhost

HTMX and Bootstrap Toasts

Just a little demo how to use bootstraps toasts component with HTMX and custom triggers. Toasts are stackable and grouped by message (so the same message doesn't pop up several times, when already open.

A Pen by Marcus at Localhost on CodePen.

License.

marcus-at-localhost

V1

This listens for a HX-Trigger moGetBookmarkButton_ID event on the #bookmark_item_* element to trigger hx-get

kirby()->response()->header('HX-Trigger','moGetBookmarkButton_' . $product->id())
//kirby()->response()->header('HX-Trigger','moGetBookmarkButton_b2')

marcus-at-localhost

Just things I find, but not need right now #htmx

Trigger Third Party Behavior

bigskysoftware/htmx#1158 (comment)

htmx.onLoad(function (content) {
	content.querySelectorAll('[data-dismiss-target]').forEach(triggerEl => {
		const targetEl = document.querySelector(triggerEl.getAttribute('data-dismiss-target'))

marcus-at-localhost

#kirby #php

<?php

return function ($page, $pages, $kirby, $site) {
	/**
	 * Don't show old applications
	 */
	if ( $page-&gt;dateFrom()-&gt;toDate() &gt; time() || $page-&gt;dateTo()-&gt;toDate() &lt; time()) {