up edit menu

frontend/src/app/pages/home/home.html

@@ -1,8 +1,7 @@
 <p>home works!</p>
 <div class="aside">
-  OpenEventDatabase
-  <a href="/demo/stats">stats</a>
-  <a href="https://source.cipherbliss.com/tykayn/oedb-backend">sources</a>
+
+  <app-menu></app-menu>
 </div>
 <div class="main">
   main part

frontend/src/app/pages/home/home.ts

@@ -1,11 +1,13 @@
 import { Component } from '@angular/core';
+import {Menu} from './menu/menu';
 
 @Component({
   selector: 'app-home',
-  imports: [],
+  imports: [
+    Menu
+  ],
   templateUrl: './home.html',
   styleUrl: './home.scss'
 })
 export class Home {
-
 }

frontend/src/app/pages/home/menu/menu.html

@@ -1 +1,70 @@
-<p>menu works!</p>
+<menu>
+  OpenEventDatabase
+  <a href="/demo/stats">stats</a>
+  <a href="https://source.cipherbliss.com/tykayn/oedb-backend">sources</a>
+
+  (editor
+  <div id="editor_form">
+    <div id="search_input">
+      <input type="text" value="" placeholder="Rechercher une catégorie d'évènement">
+    </div>
+    <div id="what_categories">
+
+
+      @for (oedbc of oedb_what_categories; track $index) {
+        <div class="category">
+          <div class="emoji">
+            {{ oedbc.emoji }}
+          </div>
+
+          <div class="label">
+
+            {{ oedbc.label }}
+          </div>
+        </div>
+      }
+    </div>
+
+    <hr>
+    (bouton de template pour ne pas remplir le formulaire)
+    <hr>
+
+    (reste optionnel du formulaire)
+    <label for="where">Nom</label>
+    <input type="text" name="name">
+
+    <label for="where">Description</label>
+    <input type="text" name="description">
+
+    <hr>
+    <label for="where">Where</label>
+    <input type="text" name="where">
+    <label for="what:series">What série</label>
+    <input type="text" name="what:series">
+    <label for="what:series">Wikidata</label>
+    <input type="text" name="wikidata">
+    <hr>
+    <label for="lat">Latitude</label>
+    <input type="text" name="lat">
+    <label for="lat">Longitude</label>
+    <input type="text" name="lon">
+
+    <select name="featureType" id="featureType">
+      <option value="point"></option>
+      <option value="polyline"></option>
+      <option value="bbox"></option>
+    </select>
+
+  </div>
+
+  <div id="found_list">
+    <h2>données</h2>
+    (liste des éléments trouvés)
+    <ul>
+      <li></li>
+    </ul>
+    (bouton pour exporter)
+    <button class="button">exporter</button>
+  </div>
+
+</menu>

frontend/src/app/pages/home/menu/menu.scss

@@ -0,0 +1,15 @@
+:host {
+
+  #what_categories{
+
+  .cateogry {
+    background: #f8f8f8;
+    border-radius: 4px;
+    padding: 10px;
+    margin-bottom: 10px;
+    width: 300px;
+    display: block;
+    border: 1px solid #ddd;
+  }
+  }
+}

frontend/src/app/pages/home/menu/menu.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import oedb_what_categories from '../../../../oedb-types';
 
 @Component({
   selector: 'app-menu',
@@ -8,4 +9,17 @@ import { Component } from '@angular/core';
 })
 export class Menu {
 
+  public oedb_what_categories: Array<any> = [];
+
+  constructor() {
+    let keys = Object.keys(oedb_what_categories.presets.what);
+
+    this.oedb_what_categories = [];
+
+    keys.forEach((key) => {
+      this.oedb_what_categories.push(
+        oedb_what_categories.presets.what[key as keyof typeof oedb_what_categories.presets.what]
+      );
+    })
+  }
 }