Switch to commento++

src/components/Commento.svelte

@@ -0,0 +1,30 @@
+<script>
+ export let pageId = null;
+
+ $: {
+     if (pageId) {
+         if (typeof window !== 'undefined' && !window.commento) {
+             // init empty object so commento.js script extends this with global functions
+             window.commento = { };
+             const script = document.createElement('script')
+             // Replace this with the url to your commento instance's commento.js script
+             script.src = `https://commento.nemunai.re/js/commento.js`
+             script.defer = true
+             // Set default attributes for first load
+             script.setAttribute('data-auto-init', false)
+             script.setAttribute('data-page-id', pageId)
+             script.onload = () => {
+                 // Tell commento.js to load the widget
+                 window.commento.main()
+             }
+             document.getElementsByTagName('head')[0].appendChild(script)
+         } else if (typeof window !== 'undefined' && window.commento) {
+             window.commento.reInit({
+                 pageId: pageId,
+             })
+         }
+     }
+ }
+</script>
+
+<div id="commento"></div>

src/routes/[vid].svelte

@@ -16,6 +16,7 @@
  } from 'sveltestrap';
 
  import { videos } from '../stores/videos.js';
+ import Commento from '../components/Commento.svelte';
  import VideoThumb from '../components/VideoThumb.svelte';
 
  export let video_id = 0;
@@ -39,8 +40,7 @@
                 {@html $videos.idx_videos[video_id].description}
             </p>
         {/if}
-        <script defer src="https://commento.nemunai.re/js/commento.js"></script>
-        <div id="commento"></div>
+        <Commento pageId={'/videos/' + video_id} />
         </Col>
 
         <Col md="3" lg="4">