A place to cache linked articles (think custom and personal wayback machine)
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

index.html 27KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the <title>
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Le nouveau monde (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f0f0ea">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f0f0ea">
  26. <!-- Documented, feel free to shoot an email. -->
  27. <link rel="stylesheet" href="/static/david/css/style_2020-06-19.css">
  28. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  29. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <script type="text/javascript">
  36. function toggleTheme(themeName) {
  37. document.documentElement.classList.toggle(
  38. 'forced-dark',
  39. themeName === 'dark'
  40. )
  41. document.documentElement.classList.toggle(
  42. 'forced-light',
  43. themeName === 'light'
  44. )
  45. }
  46. const selectedTheme = localStorage.getItem('theme')
  47. if (selectedTheme !== 'undefined') {
  48. toggleTheme(selectedTheme)
  49. }
  50. </script>
  51. <meta name="robots" content="noindex, nofollow">
  52. <meta content="origin-when-cross-origin" name="referrer">
  53. <!-- Canonical URL for SEO purposes -->
  54. <link rel="canonical" href="http://www.lisez-veloce.fr/tracts-2020/le-nouveau-monde/">
  55. <body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick">
  56. <article>
  57. <header>
  58. <h1>Le nouveau monde</h1>
  59. </header>
  60. <nav>
  61. <p class="center">
  62. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  63. <a href="http://www.lisez-veloce.fr/tracts-2020/le-nouveau-monde/" title="Lien vers le contenu original">Source originale</a>
  64. </p>
  65. </nav>
  66. <hr>
  67. <main>
  68. <h3>I</h3>
  69. <p>Avec la pandémie chacun vit, dans son propre corps, ce qu’il coûte à l’humanité d’être dépossédée de son destin. La majorité de la population s’imagine depuis le confinement que le virus est la cause de sa dépossession, la source du mal qui l’empêche de vivre. C’est en réalité tout l’inverse. La maladie nouvelle est la plus impressionnante conséquence organique de l’ordre social. Elle est le reflet fidèle, à la fois microscopique et mondial, de la domination du capital sur l’existence ; le prix de l’abandon de notre force. Au 19e siècle déjà, les bourgeois de Londres redoutaient les épidémies qui provenaient des usines et de leur chair à canon. Depuis que la Terre est devenue un <em><em>company store</em></em> et la Chine l’usine du monde, le capitalisme renoue avec les plaies de sa jeunesse, à une tout autre échelle.</p>
  70. <p>La chose est devenue si banale que même les <em><em>gouvernants</em></em> avouent tranquillement que l’humanité est en péril. Le renversement de la société ayant été empêché, sans cesse repoussé, les désastres se sont accumulés jusque-là. Plus cette négation sociale tarde à venir, plus la négation organique devient forte et visible, jusqu’à produire cette pandémie qui lie l’individu au monde dans une formidable démonstration de la solidarité du vivant. Partant de forêts dévastées, passant des animaux aux humains, la maladie révèle le lien que le capital s’acharne à rompre.</p>
  71. <p>Ce n’est pas un hasard si l’informatisation étendue du capitalisme et la pollution planétaire apparaissent au même moment dans l’histoire, vers 1970. C’est à cette époque que la marchandise en est est venue à produire artificiellement <em><em>l’entropie</em></em>. Pour les cybernéticiens, ce mot désigne la tendance des ensembles, vivants ou non, à se désagréger au cours du temps. C’est l’inévitable désorganisation de la matière, envisagée pour elle-même. C’est la mort au travail, la mort en mouvement, mais perçue seule, et non comme un effet de la vie. L’entropie est la pensée de cette mort se mouvant d’elle-même, que la marchandise accomplit. La marchandise est un cœur mort, et chaque battement nous rapproche de la fin.</p>
  72. <p>Cette entropie artificielle forme le terrain nécessaire à la métamorphose cybernétique. Le mode de production fabrique lui-même et simultanément, dans la technique qu’il produit aussi bien que dans la nature qu’il détruit, les conditions d’une nouvelle société. Ce n’est pas la nature qui meurt. C’est l’ancienne société qui meurt et entraîne la nature avec elle. Sa structure et ses relations dépérissent, cèdent la place à d’autres. Voilà pourquoi la cybernétique progresse autant pendant cette pandémie, qui marque un nouveau seuil dans le cataclysme. Les champignons cybernétiques poussent sur le fumier du monde.</p>
  73. <p><img src="http://www.lisez-veloce.fr/wp-content/uploads/2020/07/LNM_2.jpg" alt="" width="640" height="390" class="alignright size-medium wp-image-583" /></p>
  74. <h3>II</h3>
  75. <p>Du côté policier, l’épidémie précipite en Europe l’éclosion de la reconnaissance faciale, du traçage des données téléphoniques et médicales, au prétexte de remonter la chaîne des contaminations, comme cela se fait en Chine. Dans les gares de Pékin, les caméras thermiques prennent la température des passants&nbsp;: toute personne au-dessus de 37,3° déclenche une alarme et est interpellée. D’effrayants chiens robots rôdent dans les parcs de Singapour&nbsp;; ils y font respecter la&nbsp;« distanciation sociale&nbsp;». En France, ce sont des drones qui diffusaient des messages de la préfecture à Paris ou à Nantes. Du côté de l’économie, c’est la généralisation du télé-travail pour les emplois de bureau, et les visioconférences qui se substituent aux réunions&nbsp;– dont <em><em>Uber</em></em> s’est servi pour licencier à distance des milliers d’employés. Avec la fermeture des magasins, des cafés, des musées, etc., le recours au réseau est devenu obligatoire pour commander sa dose de marchandises et s’abreuver de divertissements.</p>
  76. <p>Avant la pandémie, la vie quotidienne et le réseau étaient en bons termes dans leur aliénation réciproque. Les moments vécus trouvaient leur justification et leur prolongement sur internet, tandis que la production de souvenirs en ligne modifiait les comportements réels et leur décor. Lors du confinement, la vie quotidienne et le réseau ont presque fait chambre à part. L’espace hors du foyer, le terrain de la vie réelle s’est réduit à celui du travail pour la fraction essentielle des employés&nbsp;; il est devenu un désert pour tous les autres. Surtout dans les villes, le capitalisme est allé jusqu’à faire de l’espace concret un lieu de mort.</p>
  77. <p>Une fois ce terrain devenu une zone de contamination, il a été prohibé par l’État et, à de rares exceptions près, docilement déserté. Au plus fort de la crise, 3,9 milliards de personnes ont été sommées de rester chez elles. Le travail, la famille, l’approvisionnement, l’exercice physique et le divertissement dans l’intimité du foyer étaient les seules choses permises. L’existence capitaliste a concrétisé <em><em>la vie privée</em></em>. Le tout que formait cette existence s’est brisé en ses parties, chacune perdant le soutien de l’autre, montrant sa vérité nue&nbsp;: d’un coté, la réalité misérable, sans fard, d’une vie entièrement soumise à la reproduction matérielle ; et de l’autre le monde virtuel du réseau comme lieu de toutes les compensations.</p>
  78. <p>Le confinement a été décidé pour la survie de l’ordre social davantage que pour la survie collective. Loin d’être mis en cause, la domination de classe et son pouvoir d’État – pourtant responsables de la pandémie – se sont durcis pour tenir le choc. Ce n’est pas un hasard si, en France, le gouvernement a distribué davantage d’amendes que de masques. La société a montré sur quoi elle tenait : les <em><em>rapports sociaux</em></em> sont apparus dans une lumière crue. Les exploités dont le travail était jugé utile étaient dehors, tous les autres dedans. La passivité forcée du confinement a été l’aboutissement logique de notre mode de vie. L’impuissance qui lui sert de base, face à un destin décidé d’en haut, est parue au grand jour.</p>
  79. <p>La vie interdite a été déportée sur internet. Si la prohibition s’est étendue à tout, c’est la vie sociale qui a été le plus touchée, le moindre contact humain étant un risque de contracter le mal. Déjà omniprésente, l’interface est devenu un intermédiaire obligatoire dans l’isolement imposé à tous. Les transmissions à distance ont achevé de remplacer le peu de communication directe qui restait. Voilà la Terre vidée de force et le ciel informatique surpeuplé, dans un parfait tableau de l’aliénation. Le monde matériel a été renié au point de devenir parfaitement hostile, et la rupture du lien à la nature a entraîné une rupture sans précédent du lien entre les gens.</p>
  80. <p>Si l’on comprend la prolétarisation comme une séparation des conditions de travail et du travailleur, accomplie en vue de produire la dépendance de l’ouvrier, sa soumission au bourgeois et à son capital auquel il est désormais contraint de se vendre, on voit les mesures sanitaires et leurs conséquences d’un autre œil. Leur&nbsp;« nouveau monde&nbsp;» s’emploie à chasser les êtres de la réalité, comme les paysans anglais du 16e siècle ont été chassés de leurs terres. L’épidémie agit comme une force d’occupation&nbsp;: elle supprime physiquement la possibilité d’un espace commun pour mieux vouer les échanges humains à la cybernétique.</p>
  81. <p>Il faut bien un monde empoisonné pour réaliser ce nouveau rapport social. Pour qu’existe la monade cybernétique, il faut que chaque individu ne soit plus qu’un point de passage ou de retransmission de l’information centralisée. Ainsi la société devient cet ensemble de points qui ne communiquent pas, séparés par un environnement inhabitable mais tenus entre eux par l’informatique.</p>
  82. <p><img src="http://www.lisez-veloce.fr/wp-content/uploads/2020/07/LNM_1.jpg" alt="" width="640" height="390" class="alignright size-medium wp-image-583" /></p>
  83. <h3>III</h3>
  84. <p>La marche incontrôlée du capitalisme est la mère de la nouvelle société, la pollution la chimie qui la déclenche&nbsp;; mais engendrer un nouvel ordre n’est pas sans douleur, et la structure économique du vieux monde subit les spasmes de son accouchement. La crise qui la saisit s’annonce comme la plus grave de l’histoire. La production et la consommation ont régressé ensemble et comme jamais à cause du confinement. Pendant trois mois, l’économie mondiale a été prise en tenaille. Mais cette récession, aussi violente soit-elle, n’entraînera pas toute seule l’effondrement de la société comme le pensent des marxistes trop optimistes. Elle presse l’économie à se reconstruire autour de l’infrastructure informatique. En mettant à mal aussi bien la finance que l’industrie, la crise précipite un transfert de richesse et de pouvoir au sein de la classe dominante. Ce sont les propriétaires d’interfaces, du commerce en ligne, de la récolte et du contrôle de l’information qui en sortent vainqueurs. C’est le triomphe de la frange cybernéticienne de la bourgeoisie, dont Jeff Bezos est le porte-drapeau.</p>
  85. <p>Du côté des choses, la restructuration de la production comme de l’échange autour des outils informatiques se poursuit, ainsi que la fermeture des magasins au profit de leurs versions virtuelles, et une réorganisation des espaces toujours plus concentrationnaire&nbsp; – pour raisons sanitaires cette fois. La réalité se vide et se réaménage. Du côté des gens, les licenciements massifs ont déjà commencé. Mais l’intensité inédite des échanges sur le réseau renouvelle la production massive de données, renforce le <em><em>salariat permanent</em></em>, décuple le travail gratuit des <em><em>employés universels</em></em> dont le moindre souffle, le moindre battement de cœur peut être transcrit en information, collecté ou vendu.</p>
  86. <p>L’État, de son côté, joue les sages-femmes. Il renfloue certaines entreprises, garantit des prêts colossaux, prend à sa charge une part du salaire, s’endette autant que possible. Il lui faut pallier l’effondrement des marchés financiers et le chaos de la concurrence, relancer à tout prix l’appareil productif plus fort et plus vite qu’avant, pour compenser son geste de survie qui ne représente pour ses maîtres qu’un manque à gagner.</p>
  87. <p>L’intervention bureaucratique de l’État s’impose aux capitalistes les plus récalcitrants, démunis face à l’ampleur des événements. Des démonstrations de force comme celle du confinement préfigurent le centralisme totalitaire de la cybernétique, distribuant et gérant les flux de l’activité selon les exigences de la fourmilière. Cette implacable hiérarchie sociale et l’administration bureaucratique de la vie quotidienne, gérée selon les intérêts d’un pouvoir omniscient, existent déjà en Chine avec son système de&nbsp;« crédit social&nbsp;».</p>
  88. <p>La Chine est à la pointe de la métamorphose cybernétique, parce que son mélange de stalinisme et de libre-marché est déjà la synthèse la plus aboutie des deux formes du capitalisme du siècle dernier. Les deux pôles de la contradiction y sont également développés&nbsp;: la chrysalide est prête pour sa mue. Les vieilles démocraties bourgeoises, au contraire, ont un retard politique qui les empêche d’exploiter toutes les possibilités de l’informatique, à cause de leur respect formel de l’individu et de la propriété. Le gouvernement français essaie depuis des années de rattraper ce retard, et sa législation montre bien que la tendance est au contrôle social et à la surveillance générale. Il n’y aura pas toujours un Conseil d’État pour interdire les drones de la police. Les institutions bourgeoises finiront bien par céder. L’instabilité de l’économie associée à la destruction de l’environnement les y contraindront. Toutes les régressions politiques ne sont que l’écume de cette lame de fond.</p>
  89. <p><img src="http://www.lisez-veloce.fr/wp-content/uploads/2020/07/LNM_4.jpg" alt="" width="640" height="390" class="alignright size-medium wp-image-583" /></p>
  90. <h3>IV</h3>
  91. <p>La pandémie condense les éléments de la tragédie du siècle. Les événements vont aller en s’aggravant, mais leur enchaînement est voué à se répéter. La destruction du milieu vivant recommence déjà, pressée par un capital soucieux de retrouver sa cadence. Ce qui ne manquera pas de causer une autre catastrophe, laquelle engendrera à son tour une instabilité économique et sociale toujours plus grande. Et la société répondra à ce danger par de nouveaux progrès cybernétiques. Le cycle reprendra autant de fois que nécessaire, jusqu’à ce que la nature, la révolution ou la cybernétique ait le dernier mot.</p>
  92. <p>La contre-révolution prétendra se faire au nom de la sauvegarde de l’humanité. Présentée comme une solution technique aux problèmes de la planète, la cybernétique est le seul moyen de préserver la&nbsp;« civilisation&nbsp;» à un stade supérieur. Selon ses partisans, le monde est devenu trop complexe pour être confié aux humains. Les ramifications du commerce mondial, la production et la consommation, l’organisation du territoire, les&nbsp;« facteurs écologiques&nbsp;» seraient mieux gérés par une intelligence artificielle. Cet argument ne manquera pas de s’appuyer sur les désastres qui s’accumulent.</p>
  93. <p>Ce mythe de la complexité ne traduit qu’une chose&nbsp;: le chaos de la concurrence ne permet pas au capitalisme de résoudre les graves problèmes d’ensemble que posent sa croissance incontrôlée, et l’unification du monde qui l’accompagne. C’est l’aveu qu’aucune direction ne peut être prise, qu’aucune réponse aux besoins réels de la société ne peut être apportée tant que tout effort est soumis à un accroissement économique se développant pour lui-même. Ce n’est pas l’humanité qui est incompétente, c’est sa capitulation à la marchandise qui l’empêche de conduire son histoire. Et plutôt que de la voir reprendre son sort en main, les cybernéticiens proposent de pousser plus loin l’abdication, pour préserver et approfondir cette logique de calcul abstraite. Ils veulent automatiser l’histoire que la bourgeoisie pensait avoir supprimée.</p>
  94. <p>Les cybernéticiens sont des contre-révolutionnaires paradoxaux. Ils ne luttent pas pour contrôler eux-mêmes la société, mais pour déléguer ce contrôle à l’intelligence artificielle, avec laquelle, dans leur délire transhumaniste, ils essaieront de fusionner. Les partisans de la cybernétique s’échinent à construire le&nbsp;« sujet automate&nbsp;» de l’histoire, qui n’était jusqu’à présent qu’un effet inconscient de la vie sociale de l’humanité. Ils s’attellent à réaliser un cosmos de l’aliénation, partant des molécules avec la <em><em>matière programmable</em></em>, jusqu’aux corps célestes avec la <em><em>conquête de l’espace</em></em>. Ils voudraient émanciper l’espèce humaine de son&nbsp;« corps général&nbsp;» qu’est la nature. Notre solidarité avec la matière vivante serait abolie, au profit d’une fusion générale avec la machine.</p>
  95. <p>L’idéologie ne discute que des modalités de la contre-révolution, pour ne pas parler de son principe. Optera-t-on pour davantage&nbsp;« d’austérité » ou un revenu universel ? Des bracelets électroniques ou le traçage des téléphones ? Un crédit social d’État ou des <em><em>Data Unions</em></em>, réclamant un salaire proportionnel aux données produites par le travail pour l’instant gratuit des <em><em>employés universels</em></em> ? Ou alors un salaire à vie octroyé par l’État ? La tendance stalinienne et libérale de la cybernétique seront servis : nous subirons probablement tout en même temps.</p>
  96. <p>La menace est d’autant plus réelle que, comme la bourgeoisie en son temps, les cybernéticiens sont au pouvoir dans le secteur le plus stratégique de la société : la production et le contrôle des données massivement produites, et la propriété des infrastructures gigantesques qui soutiennent ce trafic. Le terrain crucial n’est plus la production industrielle de marchandises ou la finance, l’emploi archaïque de la force de travail, mais celui de la quantification de tout effort humain. Sa transcription en information permet sa surveillance, son estimation et son contrôle.</p>
  97. <p>L’exploitation du sur-travail est donc une constante que la cybernétique prépare sous une forme nouvelle : une captation généralisée du travail humain, émancipée de la production matérielle, obéissant à la logique d’accumulation inaugurée par le capitalisme. Le travail de production n’étant plus qu’une parcelle du travail capté, la fabrication des objets pourrait être laissée aux machines. Ce serait le contrepoint parfait aux problèmes que pose l’automation à l’économie, qui diminue sans cesse la participation humaine au processus de travail, et avec elle la production de valeur.</p>
  98. <p><img src="http://www.lisez-veloce.fr/wp-content/uploads/2020/07/LNM_5.jpg" alt="" width="640" height="390" class="alignright size-medium wp-image-583" /></p>
  99. <h3>V</h3>
  100. <p>Rien ne dit que les cybernéticiens parviennent à leurs fins. La nature est dans un tel état que la société capitaliste peut très bien accoucher d’un enfant mort-né. Ce n’est pas encore le résultat qui compte, mais le processus : la cybernétique est indéniablement la direction que le monde <em><em>a déjà prise</em></em>. Les réalisations partielles de son programme s’accumulent de jour en jour, tandis que la révolution accuse un immense retard. Depuis Marx, les révolutionnaires précédaient leurs ennemis sur la route des découvertes modernes. Ils avaient une meilleure vision de leurs possibilités. Cet avantage stratégique, conservé jusqu’au 20e siècle, a finalement été perdu.</p>
  101. <p>Mais la pandémie a mis le monde entier face à quelques vérités essentielles, d’une façon violente et concrète. La première est que notre société est parfaitement suicidaire. Désormais, <em><em>tout le monde a intérêt à faire la révolution</em></em>. Il en va de la survie de l’espèce. Mais même face à cette extrémité, les classes et leurs luttes perdurent. La bourgeoisie mène le monde à la ruine. Les cybernéticiens préparent la bureaucratie totale. La logique marchande conduira l’humanité à sa perte si elle n’est pas arrêtée par un nouveau prolétariat. Durant la pandémie, nous avons vécu un aperçu de ce que sera notre avenir, si l’ordre social n’est pas aboli.</p>
  102. <p>Le confinement aura au moins fait la preuve, et à l’échelle du monde, que <em><em>la vitalité de la nature et de l’économie sont en raison inverse</em></em>. Il a suffit de trois mois d’un capitalisme ralenti pour que la couche d’ozone se referme, que les insectes renaissent, que l’air et l’eau s’assainissent. Cela donne une idée de ce que pourrait un effort collectif et concerté, libéré de la propriété comme de l’exploitation. On a vu que travail nécessaire tient à peu de choses, et peut encore se réduire s’il est réparti au mieux. Le nouveau monde est pris entre un cataclysme présent et un futur cauchemar. Il faut lui frayer un chemin.</p>
  103. <p>— 21.07.2020</p>
  104. </main>
  105. </article>
  106. <hr>
  107. <footer>
  108. <p>
  109. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  110. <a href="/david/log/" title="Accès au flux RSS">🤖</a> •
  111. <a href="http://larlet.com" title="Go to my English profile" data-instant>🇨🇦</a> •
  112. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">📮</a> •
  113. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">🧚</abbr>
  114. </p>
  115. <template id="theme-selector">
  116. <form>
  117. <fieldset>
  118. <legend>Thème</legend>
  119. <label>
  120. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  121. </label>
  122. <label>
  123. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  124. </label>
  125. <label>
  126. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  127. </label>
  128. </fieldset>
  129. </form>
  130. </template>
  131. </footer>
  132. <script type="text/javascript">
  133. function loadThemeForm(templateName) {
  134. const themeSelectorTemplate = document.querySelector(templateName)
  135. const form = themeSelectorTemplate.content.firstElementChild
  136. themeSelectorTemplate.replaceWith(form)
  137. form.addEventListener('change', (e) => {
  138. const chosenColorScheme = e.target.value
  139. localStorage.setItem('theme', chosenColorScheme)
  140. toggleTheme(chosenColorScheme)
  141. })
  142. const selectedTheme = localStorage.getItem('theme')
  143. if (selectedTheme && selectedTheme !== 'undefined') {
  144. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  145. }
  146. }
  147. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  148. window.addEventListener('load', () => {
  149. let hasDarkRules = false
  150. for (const styleSheet of Array.from(document.styleSheets)) {
  151. let mediaRules = []
  152. for (const cssRule of styleSheet.cssRules) {
  153. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  154. continue
  155. }
  156. // WARNING: Safari does not have/supports `conditionText`.
  157. if (cssRule.conditionText) {
  158. if (cssRule.conditionText !== prefersColorSchemeDark) {
  159. continue
  160. }
  161. } else {
  162. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  163. continue
  164. }
  165. }
  166. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  167. }
  168. // WARNING: do not try to insert a Rule to a styleSheet you are
  169. // currently iterating on, otherwise the browser will be stuck
  170. // in a infinite loop…
  171. for (const mediaRule of mediaRules) {
  172. styleSheet.insertRule(mediaRule.cssText)
  173. hasDarkRules = true
  174. }
  175. }
  176. if (hasDarkRules) {
  177. loadThemeForm('#theme-selector')
  178. }
  179. })
  180. </script>
  181. </body>
  182. </html>