stephane-vanraes

<script context="module" lang="ts">
  import { get, writable } from 'svelte/store';
  import { onDestroy } from 'svelte';
  import type { ComponentProps, ComponentType, SvelteComponent } from 'svelte';

  type DrawerStoreItem = {
    component: ComponentType;
    props: Record<string, unknown>;
  };

stephane-vanraes

### The Dual Number Class
# 
# A dual number is a number of the format "x + ε" where ε**2 = 0 but ε!= 0
# Given a function F it can be proven that
#    F(x + ε) = F(x) + F'(x)
# This allows us to quickly calculate the value of a function and it's first derivative in one go, without having to construct the derivative function first.
# https://en.wikipedia.org/wiki/Dual_number
##
# INCOMPLETE IMPLEMENTATION
#   - not possible to divide

stephane-vanraes

<script lang="ts">
	import { beforeNavigate } from '$app/navigation';
	import { page } from '$app/stores';
	import type { PageData } from './$types';
	export let data: PageData;
	let dialog: HTMLDialogElement;
	let image_id: number;
	beforeNavigate(({ to, cancel }) => {
		dialog?.close();
		if (to?.route.id == '/images/[...id]') {

stephane-vanraes

export default (button : HTMLButtonElement, key: string)=> {
    function fn(ev: KeyboardEvent) {
      if (ev.key == key && (ev.metaKey || ev.ctrlKey)) {
        ev.preventDefault();
        button.click();
      }
    }
    window.addEventListener('keydown', fn)
    return {
      destroy() { window.removeEventListener('keydown', fn) }

stephane-vanraes

export const actions = {
  first: async ({ request }) => {
    const data = Object.fromEntries(await request.formData());
    console.log('first', data);
    return {
      data,
      step: 2
    };
  },
  second: async ({ request }) => {

stephane-vanraes

function defHash(options, def) {
  return new Proxy(options, {
    get(target, prop) {
      if (prop == 'has') return val => {
        if (val === null) val = 'null'
        if (val === undefined) val = 'undefined'
        return target.hasOwnProperty(v.toString())
      }
      else return target[prop] ?? def;
    }

stephane-vanraes

/*
  name: 123
  name: 456
  name2: 'abc'
*/

const formData = await request.formData();

// Basic, does not allow multiples, in case of multiples takes last
// { name: 456, name2: 'abc' }

stephane-vanraes

/**
  See https://wicg.github.io/user-preference-media-features-headers/ for more info on the Client Hint
  
  This code will inform the server which color scheme the user prefers.
  It can be used to apply to correct classes and prevent a flash of the wrong scheme during load.
*/
export async function handle({ event, resolve }) {
  // Read the Color Scheme Client Hint
  const colorScheme = event.request.headers.get('Sec-CH-Prefers-Color-Scheme')