fix event embed filters + new clipboard mixin

webcomponents/src/GancioEvent.svelte

@@ -49,7 +49,7 @@
 {#if event}
 <a href='{baseurl}/event/{event.slug || event.id}' class="card">
   {#if event.media.length}
-  <img src="{thumbnail(event)}" alt="{event.media[0].name}" style="background-position: {position(event)}; aspect-ratio=1.7778;">
+  <img src="{thumbnail(event)}" alt="{event.media[0].name}" style="object-position: {position(event)}; aspect-ratio=1.7778;">
   {/if}
   <div class="container">
     <strong>{event.title}</strong>
@@ -75,7 +75,6 @@
 /* Add rounded corners to the top left and the top right corner of the image */
 img {
   border-radius: 5px 5px 0 0;
-  max-height: 250px;
   min-height: 160px;
   width: 100%;
   object-fit: cover;

webcomponents/src/GancioEvents.svelte

@@ -1,27 +1,35 @@
 <script>
-  export let baseurl = 'https://dev.gancio.org'
+  import { onMount } from 'svelte'
+  export let baseurl = ''
   export let title = 'Gancio events'
   export let maxlength = false
-  export let tags = false 
+  export let tags = ''
+  export let places = ''
 
   let events = []
-  function update (v) {
 
+  function update (v) {
     const params = []
     if (maxlength) {
       params.push(`max=${maxlength}`)
     }
 
     if(tags) {
-      params.push(`tags="${tags}"`)
+      params.push(`tags=${tags}`)
     }
 
+    if (places) {
+      params.push(`places=${places}`)
+    }
     
-    fetch(`${baseurl}/api/events${maxlength ? '?max=' + maxlength : '' }`)
+    fetch(`${baseurl}/api/events?${params.join('&')}`)
     .then(res => res.json())
-    .then(e => events = e)
+    .then(e => {
+      events = e
+    })
   }
 
+  
   function when (timestamp) {
     return new Date(timestamp*1000)
             .toLocaleDateString(undefined,
@@ -33,8 +41,7 @@
                 minute: '2-digit'
               })
   }
-  // update()
-  $: update(maxlength && title)
+  $: update(maxlength && title && places && tags)
 
 </script>
 <svelte:options tag="gancio-events"/>