davidbgk
/
larlet-fr-david


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486
							<!DOCTYPE html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
  <!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  <meta charset="utf-8">
  <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  <!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <!-- Required to make a valid HTML5 document. -->
  <title>
    Étiquette #enthousiasme
  — David Larlet</title>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-03-09.css">
  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <meta name="description" content="Publications relatives au tag #enthousiasme">
  <!-- That good ol' feed, subscribe :). -->
  <link rel="alternate"
        type="application/atom+xml"
        title="Feed"
        href="/david/log/">
  <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  <link rel="apple-touch-icon"
        sizes="180x180"
        href="/static/david/icons2/apple-touch-icon.png">
  <link rel="icon"
        type="image/png"
        sizes="32x32"
        href="/static/david/icons2/favicon-32x32.png">
  <link rel="icon"
        type="image/png"
        sizes="16x16"
        href="/static/david/icons2/favicon-16x16.png">
  <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  <link rel="mask-icon"
        href="/static/david/icons2/safari-pinned-tab.svg"
        color="#07486c">
  <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  <meta name="msapplication-TileColor" content="#f7f7f7">
  <meta name="msapplication-config"
        content="/static/david/icons2/browserconfig.xml">
  <meta name="theme-color"
        content="#f7f7f7"
        media="(prefers-color-scheme: light)">
  <meta name="theme-color"
        content="#272727"
        media="(prefers-color-scheme: dark)">
  <!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  <meta name="robots" content="noai, noimageai">
  
  <style type="text/css">
    details[open] summary {
      display: none;
    }
  </style>

  <body data-instant-intensity="viewport-all">
    <article>
      
  <header>
    <hgroup>
      <h1>#enthousiasme</h1>
      <p>Publications relatives à cette étiquette</p>
    </hgroup>
  </header>
  <nav>
    <p>
      <a href="/david/" title="Aller à l’accueil">
        Accueil</a>
      •
      <a rel="tags"
        href="/david/2024/#tags"
        title="Liste de toutes les étiquettes">
        Étiquettes</a>
      •
      <a href="/david/recherche/" title="Aller à la page de recherche" rel="search" data-no-instant>Recherche</a>
      •
      <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/04/14/" title="Lien permanent vers cet article">Apex 2</a> <time datetime="2024-04-14">14 avril 2024</time>
    </h2>
    
<p><em>Bon allez, retour <a href="/david/2024/03/14/" title="Montre 2">après un mois</a>, autant dire que je manque de&nbsp;recul.</em></p>
<p>Je l’ai porté tous les jours, et même la nuit, ce qui ne m’était jamais arrivé auparavant. C’est à la fois la légèreté (42&nbsp;grammes&#8239;!) et le bracelet très confortable (et qui sèche vite) qui permettent cela. La possibilité d’inverser le cadran de la montre pour avoir les boutons à l’opposé du poignet me correspond bien dans mes peurs à ce niveau là aussi. Côté ergonomie, j’adore qu’il n’y ait que 3&nbsp;boutons, la roulette est un peu lente à mon goût par&nbsp;contre.</p>
<p>Niveau motivation, je m’y attendais mais pas dans cette proportion là, j’ai fait énormément de sport(s) ce dernier mois. J’ai enregistré une cinquantaine d’activités mais je consigne aussi les aller-retours à l’école en vélo car je voulais vraiment identifier les moments de «&nbsp;récupération active&nbsp;». Il y en a d’autres que j’ai loupé donc ça compense. J’ai redécouvert ma <em>pain cave</em> à cette occasion mais ça fera l’objet d’un billet distinct. J’ai redécouvert mes douleurs d’usure&nbsp;aussi…</p>
<p>Je suis surpris qu’il n’y ait pas un mode pour générer des activités <em>a posteriori</em> vu que tout est consigné au quotidien, même avec une fréquence de rafraichissement moindre qu’en effort explicite ça serait intéressant pour éviter d’avoir à y penser. Encore plus surprenant&nbsp;: il n’est pas possible de changer un type d’activité après coup, ce qui me serait très utile quand je suis avec l’enfant car je ne sais jamais quand une marche va se transformer en course (et <em>vice versa</em>).</p>
<p>Le GPS est suffisamment précis pour mon usage (vs. double fréquence), ce qui m’avait beaucoup fait hésité avec la version Pro. Je suis très content d’avoir parié sur des taille / poids qui me conviennent davantage. En contrepartie, la batterie tient pour 2 <a href="/david/2024/03/29/" title="Jour 1">longs</a> <a href="/david/2024/03/30/" title="Jour 2">jours</a> de randonnée, pas beaucoup plus. Un câble de plus à transporter, c’est acceptable. Niveau orientation, c’est pas mal fait, chaque déviation émet un son+vibration avec la distance et le chemin / direction pour rattraper. Je n’ai pas trouvé / cherché s’il était possible de lui dire que la déviation était intentionnelle en cours d’exercice. J’ai la crainte que ça sonne à un moment où je suis un animal selon le contexte… probablement un paramètre à&nbsp;trouver.</p>
<p>J’ai redécouvert les zones d’effort, le seuil, la VMA, la charge d’entrainement et toutes ces choses là. C’était geekement plaisant de jouer avec ces données. Il y aussi celles relatives au sommeil qui me font réfléchir (pendant les insomnies par&nbsp;exemple&nbsp;🙃).</p>

<blockquote>
<p>Il faut que j’apprenne à ne pas courir <em>contre</em> mais <em>avec</em> la montre. <mark>J’ai trop tendance à pousser</mark> alors qu’elle sait bien à mon poignet que mon cœur ne va pas&nbsp;suivre.</p>
<p>Il y a du travail à faire pour transformer un jugement en&nbsp;allié.</p>
<p><cite><a href="/david/2024/03/14/" title="Montre 2">Auto-citation</a></cite></p>
</blockquote>
<p>Bon sur ce plan là, je n’ai pas été très bon. J’ai l’impression de ne pas attendre suffisamment entre deux efforts <em>et</em> en même temps il y a un autre panneau qui donne le moment optimal pour retourner s’entrainer et qui contredit celui-ci. Il faut que je prenne le temps de mieux me réécouter à ce&nbsp;niveau.</p>
<figure>
    <a href="/static/david/2024/2024-04-14-recuperation.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-04-14-recuperation.jpg"
            width="960" height="2079"
            srcset="/static/david/2024/2024-04-14-recuperation.jpg 960w, /static/david/2024/2024-04-14-recuperation_660x440.jpg 660w, /static/david/2024/2024-04-14-recuperation_990x660.jpg 990w, /static/david/2024/2024-04-14-recuperation_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 960 / 2079))"
            loading="lazy"
            decoding="async"
            alt="Panneau de Récupération de l’application COROS.">
    </a>
    <figcaption>Suis-je vraiment en situation de fatigue / à 50% de mes capacités sur la majorité de mes sessions&nbsp;?!</figcaption>
</figure>
<p>Je suis frustré par les capacités limitées de récupération des données (automatisée). J’ai le sentiment qu’il faut passer par une autre plateforme tierce, ou synchroniser à des «&nbsp;services&nbsp;» comme Strava, pour y avoir accès et ça me frustre. Je <a href="/david/2024/03/19/#hr-124">l’évoquais par ici</a>. Sur des données de santé, ça me fait bien suer de sortir des serveurs de collecte que je tolère déjà à moitié. Autre déception&nbsp;: ces outils sont vraiment faits pour être personnels et il n’y a pas de mode «&nbsp;prêt&nbsp;» pour une activité. La seule option trouvée pour ne pas fausser les statistiques personnelles semble être de supprimer l’activité après avoir récupéré les&nbsp;données.</p>
<p>Le prédic(a)teur de course qui m’annonçait initialement un marathon à 5h, j’avoue, ça pique un peu. Et peut-être que ça a participé à ma motivation aussi&nbsp;🤷. On apprend à mutuellement se connaître, on verra dans six mois une fois les courbes&nbsp;stabilisées.</p>
<p>Niveau montre connectée, je pensais désactiver les notifications dès le premier jour et en fait c’est assez pratique pour trier ce qui est de l’information et ce qui demande une interaction. C’est sûr que je pourrais mieux filtrer à la base mais la plupart des outils ne permettent pas d’avoir une telle granularité. Cela m’a d’une certaine manière éloigné de mon temps d’écran de téléphone (un peu moins) indispensable. J’apprécie de pouvoir mettre des alarmes qui vibrent et qui ne dérangent vraiment que moi, surtout pour les&nbsp;réveils.</p>
<p>J’ai fait trois <a href="/david/2024/04/07/" title="Piscine">séances</a> de <a href="/david/2024/04/10/#hr-146">piscine</a> pour l’instant et c’est vraiment chouette d’avoir des chiffres à ce sujet, je pense que ça peut m’aider à progresser dans ce domaine. Je n’ai pas suffisamment repris le vélo pour voir si c’est pertinent dans ce contexte aussi. C’est une montre qui est quand même très orientée course dans l’ensemble, le couplage avec un <a data-link-domain="coros.ca" href="https://coros.ca/coros-pod2">Pod 2</a> est probablement un moyen d’aller plus loin dans l’amélioration de la foulée notamment. À voir si je creuse cet aspect, j’ai déjà de quoi&nbsp;faire.</p>
<p>Je ne sais toujours pas à quoi cela sert de connaître le nombre de ses pas <em>estimés</em> par jour. Encore moins le nombre d’étages… les <em>watchfaces</em> par contre c’est marrant (au début&#8239;?). Dans l’ensemble ça dépasse mes attentes qui étaient assez élevée, c’est rare. N’hésitez pas si vous avez des questions spécifiques auxquelles je peux&nbsp;répondre.</p>

<blockquote>
<p><em>[Aujourd’hui, en allant à la piscine en courant]</em><br />
— Pfiou, j’ai pas encore bien récupéré depuis vendredi…<br />
— Ah je me disais bien que tu étais à la traîne, je pensais que c’était juste la vieillesse.<br />
—&nbsp;🫠</p>
</blockquote>
<p>Difficile de vivre avec un <del>athlète élite</del> enfant de 10&nbsp;ans&nbsp;parfois.</p>

    
      <nav>
        <p>
          
            <a href="/david/2024/enthousiasme/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#enthousiasme</a>
          
            <a href="/david/2024/laboratoire/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#laboratoire</a>
          
            <a href="/david/2024/sport/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#sport</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/04/08/" title="Lien permanent vers cet article">Éclipse</a> <time datetime="2024-04-08">8 avril 2024</time>
    </h2>
    
<p>Il y a l’éclipse et puis il y a toute l’ambiance autour. Je crois que c’est ce qui m’a le plus marqué, cet émerveillement doublé d’un enthousiasme collectif. Lorsque tout le monde retire les lunettes ou même un peu avant lorsque la lumière change et que l’on voit un coucher (??) de soleil en version accéléré qui s’avance vers nous en pleine&nbsp;après-midi.</p>
<p>L’éclipse totale était censée être de 1&#8239;min 45&#8239;sec à ma position mais alors en ressenti derrière l’objectif c’était du 20&nbsp;secondes&#8239;! À peine le temps de réduire au maximum l’exposition et de déclencher. J’avais fait une mise au point sur un avion au préalable et j’étais passé en manuel mais c’était stupide et ça a rendu floues toutes les photos… jusqu’aux deux dernières. Coup de bol d’avoir pris le temps de tester l’autofocus en sentant venir la&nbsp;fin.</p>
<figure>
    <a href="/static/david/2024/2024-04-08-eclipse-1.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-04-08-eclipse-1.jpg"
            width="2000" height="2000"
            srcset="/static/david/2024/2024-04-08-eclipse-1.jpg 2000w, /static/david/2024/2024-04-08-eclipse-1_660x440.jpg 660w, /static/david/2024/2024-04-08-eclipse-1_990x660.jpg 990w, /static/david/2024/2024-04-08-eclipse-1_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 2000 / 2000))"
            loading="lazy"
            decoding="async"
            alt="Le moment de l’éclipse où la lune passe totalement devant le soleil.">
    </a>
    <figcaption>J’étais tellement content de découvrir des éruptions solaires au développement&nbsp;!</figcaption>
</figure>
<p>En étant sur la fin, cela permet d’être vraiment à la limite de la couronne solaire et de photographier un phénomène que je ne pensait pas possible avec mon&nbsp;matériel.</p>
<p>Et puis, il y a ce moment où l’hystérie collective redevient sérieuse car il faut remettre les lunettes et prendre le temps de se demander ce qu’il vient de se&nbsp;passer.</p>
<figure>
    <a href="/static/david/2024/2024-04-08-eclipse-2.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-04-08-eclipse-2.jpg"
            width="3840" height="2560"
            srcset="/static/david/2024/2024-04-08-eclipse-2.jpg 3840w, /static/david/2024/2024-04-08-eclipse-2_660x440.jpg 660w, /static/david/2024/2024-04-08-eclipse-2_990x660.jpg 990w, /static/david/2024/2024-04-08-eclipse-2_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3840 / 2560))"
            loading="lazy"
            decoding="async"
            alt="Le moment de l’éclipse où la lune va découvrir le soleil.">
    </a>
    <figcaption>En mode halo au développement car c’est quand même&nbsp;sympa.</figcaption>
</figure>
<p>Fait étonnant, quelques petites minutes après l’apogée, on voyait un avion et surtout son ombre projetée de manière inhabituelle. J’ai l’intuition qu’il était dans une zone qui n’arrive jamais en temps normal car cet angle lumineux n’est pas possible. J’aurais dû prendre une photo pour pouvoir faire des calculs à ce&nbsp;sujet.</p>
<a href="#hr-145" title="Lien vers cette section de la page"><hr id="hr-145" /></a>
<p>Aussi, je suis en train de regarder <a data-link-domain="en.wikipedia.org" href="https://en.wikipedia.org/wiki/3_Body_Problem_(TV_series">3&nbsp;Body Problem</a>).</p>

    
      <nav>
        <p>
          
            <a href="/david/2024/enthousiasme/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#enthousiasme</a>
          
            <a href="/david/2024/experience/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#expérience</a>
          
            <a href="/david/2024/photographie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#photographie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/03/19/" title="Lien permanent vers cet article">Excitation</a> <time datetime="2024-03-19">19 mars 2024</time>
    </h2>
    
<p>Il y a cette petite étincelle qui s’allume lorsque j’entrevois la possibilité de démarrer un petit bout de code qui pourrait changer mon/le monde (en toute&nbsp;modestie).</p>
<p>Idée du jour&nbsp;: faire un <em>web component</em> qui s’intitulerait <code>&lt;page-crypt&gt;</code> en s’inspirant grandement de <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/">PageCrypt</a> (et de sa <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">version à jour</a>). La génération de la page chiffrée pourrait <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">se faire en Python</a>.</p>
<p>Cela essayerait de résoudre une problématique d’accès à du contenu privé sur des pages pré-générées de manière statique. Il est probable que j’en ai besoin sous peu afin d’afficher une progression personnalisée d’informations sensibles dans un contexte pro, ce qui me motive d’autant&nbsp;plus.</p>
<p>Je découvre au passage qu’il n’est pas trivial de <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Glossary/Base64#the_unicode_problem">convertir de l’unicode en base64 via JS</a>.</p>
<p>Note&nbsp;: il existe aussi <a data-link-domain="github.com" href="https://github.com/robinmoisson/staticrypt">StatiCrypt</a>.</p>
<a href="#hr-123" title="Lien vers cette section de la page"><hr id="hr-123" /></a>

<blockquote lang="en">
<p>If majority is always right – let’s eat shit… millions of flies can’t be&nbsp;wrong.</p>
<p><cite><em>Statek</em>, Waldemar Łysiak, 1994</cite></p>
</blockquote>
<p>Cette citation aura fait ma&nbsp;journée.</p>
<a href="#hr-124" title="Lien vers cette section de la page"><hr id="hr-124" /></a>
<p>Je suis frustré par les capacités d’export des données de <a href="/david/2024/03/14/" title="Montre 2">la montre</a>. En inspectant, je pourrais récupérer les JSON qui passent avec Playwright mais c’est un peu la face nord. <em>Ça me fait glousser qu’un tel site utilise&nbsp;Vite.</em></p>
<p>Il faut que je teste <a data-link-domain="github.com" href="https://github.com/xballoy/coros-api">coros-api</a> (TypeScript) et/ou <a data-link-domain="github.com" href="https://github.com/futoshita/Coros-Training-Hub-Exporter">Coros-Training-Hub-Exporter</a> (Java), je ne suis pas le seul à vouloir récupérer ces&nbsp;données.</p>
<p>Aussi, il y a des données qui ne sont pas exposées par le TrainingHub mais auxquelles on semble avoir accès <a data-link-domain="tryterra.co" href="https://tryterra.co/integrations/coros">via une API tierce</a> (et très dispendieuse&#8239;!). Étrange et&nbsp;décevant…</p>

    
      <nav>
        <p>
          
            <a href="/david/2024/apprentissage/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#apprentissage</a>
          
            <a href="/david/2024/enthousiasme/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#enthousiasme</a>
          
            <a href="/david/2024/technique/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#technique</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/03/14/" title="Lien permanent vers cet article">Montre 2</a> <time datetime="2024-03-14">14 mars 2024</time>
    </h2>
    
<p>J’ai reçu un <a href="/david/2024/03/02/" title="Montre">nouveau jouet</a> aujourd’hui. Alors je me suis amusé. Il me reste beaucoup de données et fonctionnalités à&nbsp;explorer.</p>
<p>J’ai finalement opté pour la version non-Pro afin de privilégier un format qui me convient mieux (taille / poids), j’ai pu tester en magasin les deux&nbsp;auparavant.</p>
<p>Il faut que j’apprenne à ne pas courir <em>contre</em> mais <em>avec</em> la montre. J’ai trop tendance à pousser alors qu’elle sait bien à mon poignet que mon cœur ne va pas&nbsp;suivre.</p>
<p>Il y a du travail à faire pour transformer un jugement en&nbsp;allié.</p>

<blockquote>
<p>Tu peux parler fort, exhiber ton savoir, assener tes arguments, brandir ta culture…<br />
… mais la conversation est à sens unique et totalement stérile.<br />
Au terme de l’échange tu demeures exactement le même, tu n’as pas évolué d’un&nbsp;pouce.</p>
<p>La rencontre n’a pas eu&nbsp;lieu.</p>
<p>Ou bien, tu peux laisser l’autre s’exprimer, l’écouter. Et alors te hisser sur la marche qu’il érige puis en poser une à ton tour.<br />
Vois ta balle de tennis comme le lien qui te rattache aux autres. Cultive-le tant que tu peux.<br />
Ne cherche plus à lutter contre les autres pour être meilleur, Max, mais deviens meilleur grâce à&nbsp;eux.</p>
<p>Le tennis est un art. L’art de&nbsp;l’échange.</p>
<p><cite><em>Max Winson</em>, Jérémie&nbsp;Moreau</cite></p>
</blockquote>

    
      <nav>
        <p>
          
            <a href="/david/2024/deception/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#déception</a>
          
            <a href="/david/2024/enthousiasme/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#enthousiasme</a>
          
            <a href="/david/2024/sport/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#sport</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  

      
        <form action="/david/recherche/" method="get">
          <fieldset>
            <legend>Recherche</legend>
            <label for="input-search">Termes de votre recherche :</label>
            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
            <input type="submit" value="Chercher">
            <p id="indexation-infos">
              <small>
                Seuls les contenus de ces 8 dernières années sont indexés.
              </small>
            </p>
          </fieldset>
        </form>
      
      <aside>
        <theme-toggle></theme-toggle>
      </aside>
    </article>
    <hr>
    <footer>
      <p>
        <a href="/david/" title="Aller à l’accueil">Accueil</a>
        •
        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
        •
        <a href="http://larlet.com"
           title="Go to my English profile"
           data-instant>Pro</a>
        •
        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
        •
        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
      </p>
      <template id="theme-selector">
        <form>
          <style type="text/css">
            fieldset div {
              text-align: center;
            }
          </style>
          <fieldset>
            <legend>Thème</legend>
            <div>
              <label>
                <input type="radio" value="auto" name="chosen-color-scheme" checked>
                Auto
              </label>
              <label>
                <input type="radio" value="dark" name="chosen-color-scheme">
                Foncé
              </label>
              <label>
                <input type="radio" value="light" name="chosen-color-scheme">
                Clair
              </label>
            </div>
          </fieldset>
        </form>
      </template>
    </footer>
    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
    <script>
      class ThemeToggle extends HTMLElement {
        constructor() {
          super()
          const themeSelectorTemplate = document.querySelector('#theme-selector')
          const form = themeSelectorTemplate.content.firstElementChild
          this.attachShadow({ mode: 'open' })
          this.shadowRoot.appendChild(form.cloneNode(true))
        }

        connectedCallback() {
          const form = this.shadowRoot.querySelector('form')
          form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
          })

          const selectedTheme = localStorage.getItem('theme')
          if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
          }
        }
      }

      const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
      window.addEventListener('load', () => {
        let colorsLayer = undefined
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
          let mediaRules = []
          for (const layerRule of styleSheet.cssRules) {
            if (!(layerRule instanceof CSSLayerBlockRule)) {
              continue
            }
            if (layerRule.name === 'colors') {
              colorsLayer = layerRule
            }
            for (const cssRule of layerRule.cssRules) {
              if (cssRule.type !== CSSRule.MEDIA_RULE) {
                continue
              }
              // WARNING: Safari does not have/supports `conditionText`.
              if (cssRule.conditionText) {
                if (cssRule.conditionText !== prefersColorSchemeDark) {
                  continue
                }
              } else {
                if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                  continue
                }
              }
              mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }
          }

          // WARNING: do not try to insert a Rule to a styleSheet you are
          // currently iterating on, otherwise the browser will be stuck
          // in a infinite loop…
          for (const mediaRule of mediaRules) {
            // Safari requires the `0` second parameter (even if default).
            colorsLayer.insertRule(mediaRule.cssText, 0)
            hasDarkRules = true
          }
        }

        if (hasDarkRules) {
          if ('customElements' in window && !customElements.get('theme-toggle')) {
            customElements.define('theme-toggle', ThemeToggle)
          }
        }
      })
    </script>
    
  </body>
</html>