changer pages embed, ajout définitions culture g

frontend/src/app/pages/embed/embed.html

@@ -1,35 +1,51 @@
 <div class="embed-page">
   <div class="layout">
-    <div class="aside">
-      <app-menu></app-menu>
-    </div>
-    
+<div class="aside">
+  <header class="page-header">
+    <h1>Intégration OEDB</h1>
+    <p>Générez un code d'intégration pour afficher les événements OEDB sur votre site web</p>
+  </header>
+  <h2>Comment utiliser</h2>
+  <ol>
+    <li>Configurez les paramètres ci-dessus selon vos besoins</li>
+    <li>Copiez le code généré</li>
+    <li>Collez-le dans votre page HTML</li>
+    <li>Le script chargera automatiquement les événements depuis l'API OEDB</li>
+  </ol>
+
+  <div class="features">
+    <h3>Fonctionnalités</h3>
+    <ul>
+      <li>✅ Affichage responsive des événements</li>
+      <li>✅ Filtrage par type et dates</li>
+      <li>✅ Thèmes clair et sombre</li>
+      <li>✅ Mise à jour automatique</li>
+      <li>✅ Compatible avec tous les navigateurs</li>
+    </ul>
+  </div>
+</div>
     <div class="main">
       <div class="container">
-    <header class="page-header">
-      <h1>Intégration OEDB</h1>
-      <p>Générez un code d'intégration pour afficher les événements OEDB sur votre site web</p>
-    </header>
 
     <div class="embed-config">
       <div class="config-form">
         <h2>Configuration</h2>
-        
+
         <div class="form-group">
           <label for="apiUrl">URL de l'API :</label>
-          <input 
+          <input
             id="apiUrl"
-            type="url" 
-            [(ngModel)]="config().apiUrl" 
+            type="url"
+            [(ngModel)]="config().apiUrl"
             (ngModelChange)="updateConfig()"
-            placeholder="https://api.oedb.fr">
+            placeholder="https://api.openenventdatabase.org">
         </div>
 
         <div class="form-group">
           <label for="what">Type d'événements :</label>
-          <select 
+          <select
             id="what"
-            [(ngModel)]="config().what" 
+            [(ngModel)]="config().what"
             (ngModelChange)="updateConfig()">
             <option value="culture">Culture</option>
             <option value="traffic">Trafic</option>
@@ -42,49 +58,49 @@
         <div class="form-row">
           <div class="form-group">
             <label for="start">Date de début :</label>
-            <input 
+            <input
               id="start"
-              type="date" 
-              [(ngModel)]="config().start" 
+              type="date"
+              [(ngModel)]="config().start"
               (ngModelChange)="updateConfig()">
           </div>
           <div class="form-group">
             <label for="end">Date de fin :</label>
-            <input 
+            <input
               id="end"
-              type="date" 
-              [(ngModel)]="config().end" 
+              type="date"
+              [(ngModel)]="config().end"
               (ngModelChange)="updateConfig()">
           </div>
         </div>
 
         <div class="form-group">
           <label for="limit">Nombre d'événements :</label>
-          <input 
+          <input
             id="limit"
-            type="number" 
-            [(ngModel)]="config().limit" 
+            type="number"
+            [(ngModel)]="config().limit"
             (ngModelChange)="updateConfig()"
-            min="1" 
+            min="1"
             max="1000">
         </div>
 
         <div class="form-row">
           <div class="form-group">
             <label for="width">Largeur :</label>
-            <input 
+            <input
               id="width"
-              type="text" 
-              [(ngModel)]="config().width" 
+              type="text"
+              [(ngModel)]="config().width"
               (ngModelChange)="updateConfig()"
               placeholder="100%">
           </div>
           <div class="form-group">
             <label for="height">Hauteur :</label>
-            <input 
+            <input
               id="height"
-              type="text" 
-              [(ngModel)]="config().height" 
+              type="text"
+              [(ngModel)]="config().height"
               (ngModelChange)="updateConfig()"
               placeholder="400px">
           </div>
@@ -92,9 +108,9 @@
 
         <div class="form-group">
           <label for="theme">Thème :</label>
-          <select 
+          <select
             id="theme"
-            [(ngModel)]="config().theme" 
+            [(ngModel)]="config().theme"
             (ngModelChange)="updateConfig()">
             <option value="light">Clair</option>
             <option value="dark">Sombre</option>
@@ -110,7 +126,7 @@
             <button class="btn btn-primary" (click)="copyToClipboard()">Copier</button>
           </div>
         </div>
-        
+
         <div class="code-container">
           <pre><code>{{generatedCode()}}</code></pre>
         </div>
@@ -118,24 +134,7 @@
     </div>
 
     <div class="usage-info">
-      <h2>Comment utiliser</h2>
-      <ol>
-        <li>Configurez les paramètres ci-dessus selon vos besoins</li>
-        <li>Copiez le code généré</li>
-        <li>Collez-le dans votre page HTML</li>
-        <li>Le script chargera automatiquement les événements depuis l'API OEDB</li>
-      </ol>
-      
-      <div class="features">
-        <h3>Fonctionnalités</h3>
-        <ul>
-          <li>✅ Affichage responsive des événements</li>
-          <li>✅ Filtrage par type et dates</li>
-          <li>✅ Thèmes clair et sombre</li>
-          <li>✅ Mise à jour automatique</li>
-          <li>✅ Compatible avec tous les navigateurs</li>
-        </ul>
-      </div>
+
     </div>
     </div>
   </div>

frontend/src/app/pages/embed/embed.scss

@@ -2,6 +2,9 @@
   min-height: 100vh;
   background: #f8f9fa;
   padding: 2rem 0;
+  .aside {
+    padding: 1rem;
+  }
 }
 
 .layout {
@@ -10,7 +13,7 @@
   grid-template-rows: minmax(100vh, auto);
   gap: 0;
   min-height: 100vh;
-  
+
   &.is-small {
     grid-template-columns: 100px 1fr;
   }

frontend/src/app/pages/embed/embed.ts

@@ -23,7 +23,7 @@ interface EmbedConfig {
 })
 export class Embed {
   config = signal<EmbedConfig>({
-    apiUrl: 'https://api.oedb.fr',
+    apiUrl: 'https://api.openenventdatabase.org',
     what: 'culture',
     start: '',
     end: '',
@@ -35,6 +35,9 @@ export class Embed {
 
   generatedCode = signal<string>('');
 
+  constructor() {
+    this.updateConfig();
+  }
   updateConfig() {
     const config = this.config();
     const code = this.generateEmbedCode(config);
@@ -50,8 +53,8 @@ export class Embed {
 
     const queryString = params.toString();
     const scriptUrl = `${window.location.origin}/embed.js`;
-    
-    return `<!-- Intégration OEDB Embed -->
+
+    return `<!-- OpenEventDatabase Embed start-->
 <div id="oedb-events" style="width: ${config.width}; height: ${config.height}; border: 1px solid #ddd; border-radius: 8px; overflow: hidden;"></div>
 <script src="${scriptUrl}"></script>
 <script>
@@ -63,7 +66,12 @@ export class Embed {
     },
     theme: '${config.theme}'
   });
-</script>`;
+</script>
+
+<!--OpenEventDatabase Embed end-->
+`;
+
+
   }
 
   copyToClipboard() {