<script lang="ts">
  import { onDestroy, onMount } from 'svelte';

  const principles = [
    'Simple is not the same as shallow.',
    'Controls should survive tired people.',
    'Compliance should clarify work.',
    'Good systems reduce heroics.',
    'No beige unless unavoidable.'
  ];

  let principleIndex = 0;
  let timer: number | undefined;

  $: principle = principles[principleIndex % principles.length];

  onMount(() => {
    timer = window.setInterval(() => {
      principleIndex += 1;
    }, 5200);
  });

  onDestroy(() => {
    if (timer) window.clearInterval(timer);
  });
</script>

<aside class="widgets" aria-label="ianOS status widgets">
  <section class="widget">
    <h2>Current Mission</h2>
    <p>Building useful infrastructure for people doing difficult work: everwished, charIT, River & Bean, Happy Coo, media, training and the apparently sensible idea that escaped containment this week.</p>
  </section>
  <section class="widget">
    <h2>Availability</h2>
    <p>Available for selected consulting, training, advisory, charity/community digital work and interesting problems with honest constraints.</p>
  </section>
  <section class="widget">
    <h2>Principle</h2>
    <p>{principle}</p>
  </section>
  <section class="widget">
    <h2>Build Status</h2>
    <p>public CV: active<br />creative subsystem: admitted<br />beige levels: monitored<br />mission drift: contained, mostly</p>
  </section>
</aside>
