Merge branch 'spielwiese_content_4_customers' of git.wtf-eg.de:ag_kommunikation/webseite into spielwiese_content_4_customers

.drone.yml

@@ -35,10 +35,12 @@ image_pull_secrets:
   - dockerconfig
 
 trigger:
+    branch:
+    - main
     event:
     - pull_request
 ---
 kind: signature
-hmac: 3d449ffbe5bc5b272406e3869524c8642ea7404eb620b8655dc470235fabede8
+hmac: a7c0aeda778717207ec641e7af90a358376eb3bfb22beeb67217b6d201e9e675
 
 ...

.gitignore

@@ -14,6 +14,7 @@ temp/
 .DS_Store
 .AppleDouble
 .LSOverride
+.nova
 
 # Icon must end with two \r
 Icon
@@ -85,3 +86,13 @@ $RECYCLE.BIN/
 
 # Windows shortcuts
 *.lnk
+
+### Python ###
+# Compiled python
+*.pyc
+
+# Virtaul environments
+.env
+.venv
+env
+venv

assets/css/style.css

@@ -31,6 +31,10 @@
      --wtf-light-grey: #edefeb;
      --wtf-lila: #6600ff;
 
+     /* misc colors */
+      --dark-red: #dc0000;
+      --dark-green: #007000;
+
      --column-count: 3;
 }
 
@@ -225,6 +229,12 @@ header {
     grid-row: 1 / span 1;
 }
 
+.header__homelink {
+    display: inline-block;
+    position: relative;
+    z-index: 1;
+}
+
 .header__button,
 .content__button,
 .claim__button,
@@ -876,6 +886,47 @@ hr.-even {
     flex-direction: column;
     justify-content: flex-start;
 }
+
+.contact_form--required,
+.--error {
+    color: var(--dark-red)
+}
+
+.--success {
+   color: var(--dark-green);
+}
+
+.contact_form__textarea,
+.contact_form__text_input,
+.contact_form__captcha {
+    display: flex;
+    flex-direction: column;
+}
+
+.contact_form__message {
+    height: 12em;
+}
+
+.contact_form__subject,
+.contact_form__message,
+.contact_form__name,
+.contact_form__email,
+.contact_form__captcha {
+    font-family: 'Lato', sans-serif;
+    line-height: 1.3rem;
+    font-size: 1rem;
+}
+
+.contact_form__submit_button {
+   font-size: 1rem;
+   padding: 0 0.25rem;
+}
+
+/* Hide captcha field as part of spam protection.
+   We got no real captcha. */
+.contact_form__captcha {
+    display: none;
+}
 /* main - Ende */
 
 /* footer - Start */
@@ -1244,7 +1295,7 @@ footer {
     }
 
     .slim_box__top_bar_left {
-        margin: 1rem 0.5rem 0 0;
+        margin: 0 0.5rem 0 0;
         height: 1.125rem;
         background-image: url("../images/slim_header_top_triangles.svg");
         background-position: right;
@@ -1289,14 +1340,23 @@ footer {
         display: auto;
     }
 
+    .header__primary_nav {
+        height: 2.5rem;
+    }
+
     .secondary_nav__navlist {
         margin-right: 1rem;
     }
 
     .primary_nav__navlist  {
+        display: flex !important;
         margin-right: 1.5rem;
     }
 
+    .primary_nav__navlist > li:hover > .primary_nav__sub_navlist {
+        margin: 2.2rem 0 0 -0.5rem;
+    }
+
     .primary_nav__members, .primary_nav__lang_switch {
         display: none;
     }
@@ -1305,10 +1365,6 @@ footer {
         display: none;
     }
 
-    .primary_nav__navlist {
-        display: flex !important;
-    }
-
     .content__inner_box.-logo_header {
         margin: -0.5rem 1.5rem 0 1.5rem;
     }
@@ -1478,6 +1534,7 @@ footer {
         background-image: none;
         margin: 0;
         padding: 0;
+        z-index: 40;
     }
 
     .slim_box__top_bar_left {
@@ -1517,7 +1574,6 @@ footer {
         position: absolute;
         top: 6.5rem;
         right: 0;
-        z-index: 30;
         border-top: 2px solid var(--wtf-nearly-black);
         border-left: 2px solid var(--wtf-nearly-black);
         border-bottom: 2px solid var(--wtf-nearly-black);

assets/js/contact_form.js

@@ -0,0 +1,95 @@
+const contactFormAjaxUrl = '/php/contact_form.php';
+
+window.addEventListener('DOMContentLoaded', function() {
+    const contact_form = document.getElementsByClassName('content__contact_form')[0];
+    if (contact_form) {
+        contact_form.addEventListener('submit', wtf_submitContactForm, false);
+        wtf_startContactFormSession();
+    }
+});
+
+function wtf_startContactFormSession() {
+    let formData = new FormData();
+    formData.append('action', 'start_session');
+    fetch(contactFormAjaxUrl, {
+        method: 'POST',
+        mode: 'same-origin',
+        body: formData,
+    })
+    .then(response => {
+        if (!response.ok) {
+            throw new Error('Response was not OK');
+        }
+
+        return response.json();
+    })
+    .then(json => {
+        console.log(json);
+    })
+    .catch(error => {
+        console.error('Could not start the session:', error);
+    });
+}
+
+function wtf_submitContactForm(event) {
+    event.preventDefault();
+
+    const subject = document.getElementsByClassName('contact_form__subject')[0];
+    const message = document.getElementsByClassName('contact_form__message')[0];
+    const name = document.getElementsByClassName('contact_form__name')[0];
+    const email = document.getElementsByClassName('contact_form__email')[0];
+    const captcha = document.getElementsByClassName('contact_form__captcha')[0];
+
+    let formData = new FormData();
+    formData.append('action', 'handle_form');
+    formData.append('subject', subject.value);
+    formData.append('message', message.value);
+    formData.append('name', name.value);
+    formData.append('email', email.value);
+
+    // If some bot entered some value, return.
+    if (typeof captcha.value == 'undefined') {
+        formData.append('captcha', 'Nudelsuppe');
+    } else {
+        console.log('bot detected');
+        return;
+    }
+
+    fetch(contactFormAjaxUrl, {
+        method: 'POST',
+        mode: 'same-origin',
+        body: formData,
+    })
+    .then(response => response.json())
+    .then(json => {
+        const feedback = document.getElementsByClassName('contact_form__feedback')[0];
+        console.log(json);
+        if (json.errors) {
+            feedback.classList.remove('--success');
+            feedback.classList.add('--error');
+            // Über errors iterieren und diese ausgeben (evtl. nur ersten Fehler ausgeben?)
+            let error_message = '';
+            json.errors.forEach(function(error){
+                /**
+                 * Nur Zeilenumbrüche wenn mehrer Fehlermeldungen existieren,
+                 * aber bei der letzten nicht.
+                 */
+                if (json.errors.length > 1) {
+                    if (error == json.errors[json.errors.length - 1]) {
+                        error_message = error_message + error;
+                    } else {
+                        error_message = error_message + error + '<br>';
+                    }
+                } else {
+                    error_message = error_message + error;
+                }
+            })
+            feedback.innerHTML = error_message;
+        } else if (json.status == 'ok') {
+            feedback.classList.remove('--error');
+            feedback.classList.add('--success');
+            feedback.textContent = "Ihre Nachricht wurde erfolgreich ans Office geschickt.";
+        }
+    })
+    .catch(error => console.log(error));
+}

assets/js/contact_form_toggle.js

@@ -0,0 +1,7 @@
+/* Unhide contact form if JS is enabled */
+window.addEventListener('DOMContentLoaded', (event) => {
+    const contact_form_wrapper = document.getElementsByClassName('content__contact_form_wrapper')[0];
+    if (contact_form_wrapper) {
+        contact_form_wrapper.style.setProperty('display', 'block');
+    }
+});

assets/manifest.json

@@ -6,6 +6,6 @@
    "sizes": "96x96",
    "type": "image\/png",
    "density": "2.0"
-  },
+  }
  ]
 }

assets/php/contact_form.php

@@ -0,0 +1,139 @@
+<?php
+session_start();
+
+function sanitize_text(string $name, string $type) {
+    $filters = array(
+        'text' => FILTER_SANITIZE_SPECIAL_CHARS,
+        'email' => FILTER_SANITIZE_EMAIL,
+    );
+    $text = filter_var(trim($_POST[$name]), $filters[$type]);
+    $text = stripslashes($text);
+
+    return $text;
+}
+
+function prepare_message_body(string $message, string $name) {
+    // Replace HTML-Entities with actual carriage returns and line feeds
+    $message = str_replace("&#13;", "\r", $message);
+    $message = str_replace("&#10;", "\n", $message);
+
+    // Ensure line breaks via carriage return + line feed
+    $message = str_replace("\r\n", "\n", $message);
+    $message = str_replace("\n", "\r\n", $message);
+
+    $message = "Nachricht von: $name\r\n\r\n" . $message;
+    $message = base64_encode($message);
+
+    return $message;
+}
+
+/**
+ *  Sending email
+ *
+ *  mail(): Braucht auf dem Server einen korrekt konfigurierten Mailserver
+ *  phpmailer: Bibliothek, der per Composer installiert wird. Tut ganz gut mit SMTP.
+ */
+function send_message_to_office(string $subject, string $message, string $name, string $email) {
+    $returnPath = filter_var(getenv('WTF_RETURN_PATH'), FILTER_VALIDATE_EMAIL);
+    $to = filter_var(getenv('WTF_CONTACT_TO'), FILTER_VALIDATE_EMAIL);
+
+    if (!$returnPath || !$to) {
+        error_log('Address for "To" or "Return-Path" is invalid');
+        return false;
+    }
+
+    return mail(
+        $to,
+        "=?UTF-8?B?" . base64_encode($subject) . "?=",
+        prepare_message_body($message, $name),
+        array(
+            "From" => getenv('WTF_CONTACT_FROM'),
+            "Reply-To" => $email,
+            "Content-Type" => "text/plain; charset=utf-8",
+            "Content-Transfer-Encoding" => "base64",
+        ),
+        "-f $returnPath"
+    );
+}
+
+function send_response(array $response_data) {
+    $json = json_encode($response_data);
+    if ($json === false) {
+        // Avoid echo of empty string (which is invalid JSON), and
+        // JSONify the error message instead:
+        $json = json_encode(["jsonError" => json_last_error_msg()]);
+        if ($json === false) {
+            // This should not happen, but …
+            $json = '{"jsonError":"unknown"}';
+        }
+        // Set HTTP response status code to: 500 - Internal Server Error
+        http_response_code(500);
+    }
+    header('Content-type: application/json');
+    echo $json;
+}
+
+function prepare_response() {
+    $response = array();
+
+    if (empty($_POST['message'])) {
+        $response['errors'][] = 'Sieh haben keine Nachricht eingegeben.';
+    }
+    if (empty($_POST['email'])) {
+        $response['errors'][] = 'Sie haben keine E-Mail-Adresse eingegeben.';
+    }
+    if (empty($_POST['name'])) {
+        $response['errors'][] = 'Sie haben keinen Namen eingegeben.';
+    }
+    if (empty($_POST['subject'])) {
+        $response['errors'][] = 'Sie haben keinen Betreff eingegeben.';
+    }
+    /**
+     * Idee zur Bot-Erkennung:
+     * 1. Ein Bot hat das Pseudocaptcha entweder leer abgeschickt, oder sich selbst etwas ausgedacht.
+     * 2. Ein Bot schickt die Daten in unter 5s ab.
+     * 3. Ein Mensch braucht nicht länger als 60min.
+     */
+    if (
+        $_POST['captcha'] != 'Nudelsuppe' or
+        time() - $_SESSION['start_time'] < 5 or
+        time() - $_SESSION['start_time'] > 3600
+    ) {
+        $response['errors'][] = 'Wir glauben Sie sind ein Bot.';
+    }
+    if (!array_key_exists('errors', $response)) {
+        $subject = sanitize_text('subject', 'text');
+        $message = sanitize_text('message', 'text');
+        $name = sanitize_text('name', 'text');
+        $email = sanitize_text('email', 'email');
+
+        if (!send_message_to_office($subject, $message, $name, $email)) {
+            $response['errors'][] = 'Ihre Nachricht konnte nicht übermittelt werden.';
+        } else {
+            $response['status'] = 'ok';
+        }
+    }
+    return $response;
+}
+
+if ($_SERVER["REQUEST_METHOD"] == "POST") {
+    $response = array();
+
+    if (empty($_POST['action'])){
+        $response['errors'][] = 'Kann eigentlich nicht passieren :/';
+    } else {
+        if ($_POST['action'] == 'start_session') {
+            $_SESSION['start_time'] = time();
+            // $response['session_start_time'] = $_SESSION['start_time'];
+            // $response['session_id_before'] = session_id();
+        } elseif ($_POST['action'] == 'handle_form') {
+            $response = prepare_response();
+            session_destroy();
+        } else {
+            $response['errors'][] = 'Kann eigentlich auch nicht passieren :/';
+        }
+    }
+    send_response($response);
+} else {
+    http_response_code(404);
+}

content/blog/Blogversion-des-Newsletters-vom-Juni-2022/contents.lr

@@ -0,0 +1,51 @@
+title: Was geht ab? (Juli 2022)
+---
+author: WTF Vorstand
+---
+body:
+
+Hallo Genoss*in!
+
+Anderthalb Jahre nach Genossenschaftsgründung haben sich am 18.06.2022 unsere Gründungsmitglieder, Vorstand und Aufsichtsrat erstmalig live und in Farbe zur gleichen Zeit am gleichen Ort getroffen – natürlich stilecht in Hamburg!
+
+Dort haben wir den aktuellen Stand der Genossenschaft sowie weitere Zukunftspläne und Ideen für neue Geschäftsfelder besprochen. Ein weiterer, für alle interessierten Mitglieder offener, Hybrid-Workshop soll am 24.-25.09.2022 folgen. Mehr Infos im Forum: https://forum.wtf-eg.de/t/interressiert-an-unserer-zukunft-bitte-den-24-25-september-blocken/716)
+
+### Fazit Generalversammlung
+
+Direkt am Wochenende darauf fand auch unsere Generalversammlung statt, die von unseren Mitgliedern genutzt wurde, sich über den Werdegang der WTF Kooperative eG zu informieren und einige bürokratische To Dos abzuhaken. Das Protokoll zu dieser Veranstaltung ist in Arbeit und wird allen Mitgliedern nach Fertigstellung zur Verfügung gestellt, sodass auch die nicht anwesenden Personen sich informiert halten können.
+
+Es gab berechtigte Anmerkungen, dass die Terminplanung für diese Generalversammlung relativ kurzfristig war, sodass nicht alle, die gerne gewollt hätten, auch teilnehmen konnten. Daher schonmal als Ankündigung: Am 20.11.2022 wird voraussichtlich die nächste Generalversammlung zur (Neu- bzw. Wieder-) Wahl der Vorstände (und ihrer Stellvertreter) stattfinden.
+
+### Kommunikationsgrund-sätze für das Forum
+
+Um die Kommunikation untereinander angenehmer zu gestalten, haben wir eine Nutzungsregelung für das Forum veröffentlicht. Du findest sie hier: https://forum.wtf-eg.de/t/wir-stellen-vor-eine-nutzungsregelung-fuer-dieses-forum/681 und wir würden uns freuen, wenn alle sich Mühe geben, dass das Miteinander in der digitalen Kommunikation konstruktiv und zielführend bleibt.
+
+### AGO-Treffen am 02.08.2022 um 20 Uhr
+
+Auch in Sachen AGO geht es voran. Wir treffen uns am 02.08.2022 um 20 Uhr im Jitsi, um den ersten Entwurf (https://git.wtf-eg.de/wtf-eg/allgemeine_geschaeftsordnung/src/branch/main/AGO.md) weiter zu verfeinern.
+
+Du bist herzlich eingeladen, dich an der Entwicklung unserer AGO zu beteiligen. Das Dokument regelt grundlegende Themen wie: Aufnahmeprozedere der Mitglieder, Überschussverteilung und Mitarbeiterbeteiligung, Übertragungen von Geschäftsanteilen, Grundlagen u.v.m. und kann auch auf Themen wie "Ethische Grundsätze der Genossenschaft" ausgeweitet werden. See you there!
+
+### Barcamp local-it.org
+
+Die Menschen des Local-IT e.V. veranstalten vom 11.-14.08.2022 ein Barcamp in 23909 Mechow (nahe Ratzeburg, ca. 1 h von Hamburg entfernt) und haben uns bzw. unsere Mitglieder zum gemeinsamen Werkeln und Ideen schmieden eingeladen.
+
+Der Verein hat sich “Demokratie stärken, mit digitaler Souveränität und freier Software” auf die Fahne geschrieben. Wenn Du Interesse hast, vorbeizuschauen, findest Du mehr Infos dazu im Forum https://forum.wtf-eg.de/t/hamburg-barcamp-des-local-it-e-v-am-11-14-08-2022-in-mechow-externe-veranstaltung/721 bzw. auf der Website des Vereins https://local-it.org/do-it-local-barcamp/.
+
+### BahnCard 100 zum Aktionspreis für alle unter 27 Jahren
+
+Um die Anreise zu sommerlichen Veranstaltungen noch komfortabler zu gestalten, bietet die Deutsche Bahn für alle Menschen unter 27 Jahren die Möglichkeit, bis zum 30.09.2022 eine BahnCard 100 zu einem reduzierten Preis zu erwerben. Damit zahlst Du für 12 Monate 2.664 € (also 222 € pro Monat) statt 4.144 € und hast den Bahnverkehr innerhalb Deutschlands, sowie ÖPNV in über 130  Städten unkompliziert inclusive.
+
+Eine Bestellung über die Genossenschaft kann nach Absprache erfolgen, Du kannst das Aktionsangebot aber auch unabhängig von der WTF Kooperative eG als Privatperson nutzen. Mehr Infos gibt es hier: https://www.bahn.de/angebot/bahncard/junge-reisende/bahncard100-aktion-u27
+
+Ansonsten bleibt uns nur zu sagen: Genieß' den Sommer, bleib' schön gesund und immer eine kalte Mate bereithalten für die kommende Hitzewelle!
+
+Genossenschaftliche Grüße
+
+Deine WTF Kooperative eG
+
+PS: Wenn Du keine Termine der WTF eG verpassen möchtest, abonniere doch unseren "WTF eG Interne Termine" Kalender https://work.wtf-eg.de/remote.php/dav/calendars/5468a190-1872-103b-8292-73b365a1b398/wtf-interne-termine_shared_by_wtf/
+---
+meta_description: Blogversion des Newsletters vom Juni 2022 mit einem Fazit zur Generalversammlung, Kommunikationsgrundsätze für das Forum, einem AGO-Treffen, einem Hinweis aufs Bar-Camp und ein Angebot für eine BahnCard 100 für Menschen unter 27
+---
+pub_date: 2022-07-19

content/dokumente/contents.lr

@@ -8,9 +8,9 @@ body:
 
 | | | |
 | --: | -- | -- |
-| **Satzung:** |  |  [wtf-satzung.pdf](/dokumente/wtf-satzung.pdf) |
+| **Satzung:** |   |  [wtf-satzung.pdf](/dokumente/wtf-satzung.pdf) |
-| **Beitragsordnung:** |  | [wtf-beitragsordnung.pdf](/dokumente/wtf-beitragsordnung.pdf) |
+| **Beitragsordnung:** |   | [wtf-beitragsordnung.pdf](/dokumente/wtf-beitragsordnung.pdf) |
-| **Beitrittserklärung:**| | [onboarding.wtf-eg.de](https://onboarding.wtf-eg.de) |
+| **Beitrittserklärung:**|   | [onboarding.wtf-eg.de](https://onboarding.wtf-eg.de) |
 
 <br/>
 

content/kontakt/contents.lr

@@ -1,4 +1,4 @@
-_model: page
+_model: contact_page
 ---
 title: Kontakt
 ---

content/mitglieder/satzung/contents.lr

@@ -5,13 +5,13 @@ title: Satzung
 body:
 
 ## WTF Kooperative eG
-05. Dezember 2020
+2022-06-26
 
 ## § 1 Name, Sitz, Zweck, Gegenstand
 (1) Der Name der Genossenschaft lautet: WTF Kooperative eG. Der Sitz der Genossenschaft ist Hamburg.<br>
 (2) Der Zweck der Genossenschaft ist die wirtschaftliche Förderung und Betreuung der Mitglieder.<br>
-(3) Gegenstand des Unternehmens sind Dienstleistungen, Werktätigkeiten und Handel mit Bezug zu Informationstechnologien. Durch deren gemeinsame genossenschaftliche Vermarktung sowie Abwicklung einschlägiger kaufmännischer Dienstleistungen für die Mitglieder wird die Wirtschaft der Mitglieder im Sinne von § 1 Abs. 1 GenG durch Synergieeffekte gefördert.<br>
+(3) Gegenstand des Unternehmens sind Dienstleistungen, Werktätigkeiten und Handel mit Bezug zu Informationstechnologien. Durch deren gemeinsame genossenschaftliche Vermarktung sowie Abwicklung einschlägiger kaufmännischer Dienstleistungen für die Mitglieder wird die Wirtschaft der Mitglieder im Sinne von § 1 Abs. 1 GenG durch Synergieeffekte gefördert.<br>
-(4) Die Genossenschaft ist berechtigt, alle Maßnahmen zu treffen, die geeignet sind den Gesellschaftszweck zu fördern. Sie darf hierzu andere Unternehmen errichten und erwerben sowie sich an anderen Unternehmen beteiligen. Sie ist ferner berechtigt, Zweigniederlassungen zu errichten.<br>
+(4) Die Genossenschaft ist berechtigt, alle Maßnahmen zu treffen, die geeignet sind den Gesellschaftszweck zu fördern. Sie darf hierzu andere Unternehmen errichten und erwerben sowie sich an anderen Unternehmen beteiligen. Sie ist ferner berechtigt, Zweigniederlassungen zu errichten.<br>
 (5) Zur Erfüllung der genossenschaftlichen Aufgaben kann sie sich der Hilfe sachverständiger Dritter bedienen.<br>
 (6) Geschäfte mit Nichtmitgliedern sind zulässig.<br>
 
@@ -19,7 +19,7 @@ body:
 (1) Zum Erwerb der Mitgliedschaft bedarf es einer unbedingten schriftlichen Beitrittserklärung. Die Mitgliedschaft können erwerben:
 - a) natürliche Personen,
 - b) Personengesellschaften,
-- c) juristische Personen des privaten oder öffentlichen Rechts.
+- c) juristische Personen des privaten oder öffentlichen Rechts.
 
 (2) Über die Aufnahme in die Genossenschaft entscheidet der Vorstand.<br>
 (3) Die Mitgliedschaft endet durch
@@ -27,14 +27,14 @@ body:
 - b) Übertragung des gesamten Geschäftsguthabens,
 - c) Tod eines Mitglieds,
 - d) Insolvenz eines Mitglieds,
-- e) Auflösung einer juristischen Person oder einer Personengesellschaft,
+- e) Auflösung einer juristischen Person oder einer Personengesellschaft,
 - f) Ausschluss.
 
 (4) Jedes Mitglied hat die Pflicht, das genossenschaftliche Unternehmen nach Kräften zu
 unterstützen und die Interessen der Genossenschaft zu wahren. Ebenso ist jedes Mitglied
 verpflichtet, Adressenänderungen innerhalb von drei Wochen dem Vorstand mitzuteilen.
 
-## § 3 Geschäftsanteil, Zahlungen, Rücklagen, Nachschusspflicht, Rückvergütung, Verjährung, Mindestkapital
+## § 3 Geschäftsanteil, Zahlungen, Rücklagen, Nachschusspflicht, Rückvergütung, Verjährung, Mindestkapital
 (1) Ein Geschäftsanteil beträgt 100,- €. Er ist unverzüglich in voller Höhe einzuzahlen.<br>
 (2) Ein Mitglied kann mehrere Geschäftsanteile übernehmen. Die Gesamtzahl der Geschäftsanteile je Mitglied soll 100 Anteile nicht überschreiten.<br>
 (3) Mit Beitritt ist ein Eintrittsgeld/Agio zu leisten, welches den Rücklagen zuzuführen ist. Höhe und Fälligkeit beschließt die Generalversammlung.<br>
@@ -53,7 +53,7 @@ verpflichtet, Adressenänderungen innerhalb von drei Wochen dem Vorstand mitzute
 (9) Beschlüsse werden gem. § 47 GenG protokolliert.
 
 ## § 5 Aufsichtsrat
-(1) Sofern ein Aufsichtsrat bestellt wird, besteht dieser aus zumindest drei Mitgliedern; er überwacht die Geschäftsführung des Vorstands und ist verpflichtet, sich zu diesem Zweck über die Angelegenheiten der Genossenschaft zu unterrichten. Er kann jederzeit hierüber Berichterstattung vom Vorstand verlangen. Auch ein einzelnes Mitglied des Aufsichtsrats kann Auskünfte, jedoch nur an den Aufsichtsrat insgesamt, verlangen.<br>
+(1) Sofern ein Aufsichtsrat bestellt wird, besteht dieser aus zumindest drei Mitgliedern; er überwacht die Geschäftsführung des Vorstands und ist verpflichtet, sich zu diesem Zweck über die Angelegenheiten der Genossenschaft zu unterrichten. Er kann jederzeit hierüber Berichterstattung vom Vorstand verlangen. Auch ein einzelnes Mitglied des Aufsichtsrats kann Auskünfte, jedoch nur an den Aufsichtsrat insgesamt, verlangen.<br>
 (2) Der Aufsichtsrat prüft den Jahresabschluss, den Lagebericht, soweit dieser gesetzlich erforderlich ist, und den Vorschlag des Vorstands für die Verwendung eines Jahresüberschusses oder für die Deckung eines Jahresfehlbetrags. Er hat sich darüber zu äußern und der Generalversammlung vor Feststellung des Jahresabschlusses Bericht zu erstatten. Jedes Mitglied des Aufsichtsrates hat den Inhalt des Prüfungsberichts zur Kenntnis zu nehmen.<br>
 (3) Einzelheiten über die Erfüllung der dem Aufsichtsrat obliegenden Pflichten regelt die vom Aufsichtsrat aufzustellende Geschäftsordnung. Ein Exemplar der Geschäftsordnung ist jedem Mitglied des Aufsichtsrats gegen Empfangsbestätigung auszuhändigen.<br>
 (4) Über eine größere Mitgliederzahl des Aufsichtsrats entscheidet die Generalversammlung. Der Aufsichtsrat ist beschlussfähig, wenn die Mehrheit seiner Mitglieder an der Abstimmung teilnimmt. Der Aufsichtsrat kann schriftlich, in Textform, telefonisch und auf elektronischem Wege Beschlüsse fassen.<br>
@@ -61,20 +61,20 @@ verpflichtet, Adressenänderungen innerhalb von drei Wochen dem Vorstand mitzute
 (6) Der Aufsichtsrat kann jederzeit Mitglieder des Vorstandes mit einfacher Mehrheit abwählen.
 
 ## § 6 Vorstand
-(1) Der Vorstand besteht aus mindestens zwei Mitgliedern; er leitet die Genossenschaft in eigener Verantwortung. Der Aufsichtsrat wählt die Mitglieder des Vorstands und gegebenenfalls deren Stellvertreter und bestimmt ihre Amtszeit. Wenn kein Aufsichtsrat bestellt ist, übernimmt die Generalversammlung dies.<br>
+(1) Der Vorstand besteht aus mindestens zwei Mitgliedern. Der Vorstand leitet die Genossenschaft in eigener Verantwortung. Der Aufsichtsrat wählt im Falle des Ausscheidens eines aktiven Vorstandsmitgliedes einen neuen Vorstand aus den von der Generalversammlung gewählten Stellvertretern. Wenn kein Aufsichtsrat bestellt ist, übernimmt die Generalversammlung dies.<br>
 (2) Der Vorstand führt die Geschäfte der Genossenschaft gemäß den Vorschriften der Gesetze, insbesondere des Genossenschaftsgesetzes, der Satzung und der Allgemeinen Geschäftsordnung.<br>
 (3) Der Vorstand vertritt die Genossenschaft gerichtlich und außergerichtlich. Die Mitglieder des Vorstands sind einzeln zur Vertretung berechtigt.
 (4) Der Vorstand kann schriftlich, in Textform, telefonisch und auf elektronischem Wege Beschlüsse fassen.<br>
 (5) Dienstverträge mit Vorstandsmitgliedern werden vom Aufsichtsrat im Rahmen der Richtlinien der Generalversammlung und der Allgemeinen Geschäftsordnung abgeschlossen.<br>
 
-## § 7 Pflichten, Kündigung, Ausschluss, Auseinandersetzung
+## § 7 Pflichten, Kündigung, Ausschluss, Auseinandersetzung
-(1) Die Mitglieder sind verpflichtet, der Genossenschaft ihre Anschrift mitzuteilen.<br>
+(1) Die Mitglieder sind verpflichtet, der Genossenschaft ihre Anschrift mitzuteilen.<br>
 (2) Jedes Mitglied kann seine Mitgliedschaft zum Schluss eines Geschäftsjahres unter Einhaltung einer Frist von drei Monaten schriftlich kündigen.<br>
-(3) Soweit ein Mitglied mit mehreren Geschäftsanteilen beteiligt ist, ohne hierzu durch die Satzung, die Allgemeine Geschäftsordnung oder eine Vereinbarung mit der Genossenschaft verpflichtet zu sein, kann es schriftlich einen oder mehrere Geschäftsanteile seiner zusätzlichen Beteiligung zum Schluss eines Geschäftsjahres unter Einhaltung einer Frist von drei Monaten kündigen.<br>
+(3) Soweit ein Mitglied mit mehreren Geschäftsanteilen beteiligt ist, ohne hierzu durch die Satzung, die Allgemeine Geschäftsordnung oder eine Vereinbarung mit der Genossenschaft verpflichtet zu sein, kann es schriftlich einen oder mehrere Geschäftsanteile seiner zusätzlichen Beteiligung zum Schluss eines Geschäftsjahres unter Einhaltung einer Frist von drei Monaten kündigen.<br>
 (4) Die Übertragung des Geschäftsguthabens bedarf außer in den Fällen § 76 Abs. 2 GenG der Zustimmung des Vorstands.<br>
 (5) Mitglieder, deren Verhalten mit den Belangen oder Interessen der Genossenschaft nicht vereinbar ist, können ausgeschlossen werden. Dies gilt insbesondere, wenn
 - a) das Mitglied durch Nichterfüllung seiner Verpflichtungen gegenüber der Genossenschaft diese schädigt oder geschädigt hat;
-- b) es trotz schriftlicher Aufforderung unter Androhung des Ausschlusses den satzungsmäßigen oder sonstigen der Genossenschaft gegenüber bestehenden Verpfichtungen nicht nachkommt;
+- b) es trotz schriftlicher Aufforderung unter Androhung des Ausschlusses den satzungsmäßigen oder sonstigen der Genossenschaft gegenüber bestehenden Verpflichtungen nicht nachkommt;
 - c) es unrichtige Jahresabschlüsse oder Vermögensübersichten einreicht oder sonst unrichtige oder unvollständige Erklärungen über seine rechtlichen und/oder wirtschaftlichen Verhältnisse abgibt;
 - d) es zahlungsunfähig geworden oder überschuldet ist oder wenn über sein Vermögen ein Antrag auf Eröffnung eines Insolvenzverfahrens gestellt wurde.
 - e) es seinen Geschäftsbetrieb, Sitz oder Wohnsitz verlegt, ohne den Vorstand über die geänderte Anschrift zu informieren, oder wenn sein dauernder Aufenthaltsort unbekannt ist;
@@ -103,4 +103,3 @@ verpflichtet, Adressenänderungen innerhalb von drei Wochen dem Vorstand mitzute
 ## § 10 Bekanntmachungen
 Bekanntmachungen der Genossenschaft erfolgen auf deren Internetseite und in den GenoNachrichten als unabhängiger Informationsplattform für das Genossenschaftswesen.
 
-Hamburg, 05.12.2020

content/podcast/wtf-s02-e06/contents.lr

@@ -10,7 +10,7 @@ season: 2
 ---
 title: WTF eG Podcast S02E06
 ---
-pocastogg: wtf-s02e06.ogg
+podcastogg: wtf-s02e06.ogg
 ---
 mp3leng: 23354534
 ---
@@ -58,5 +58,3 @@ Herzlich Willkommen!
 Achja: Historisches zum Projekt auf media.ccc.de unter dem Stichwort "Hacker eG"
 ---
 authors: ajuvo/fuchsstein/LittleAlex
----
-podcastogg: wtf-s02e06.ogg

content/podcast/wtf-s03-e01/contents.lr

@@ -0,0 +1,48 @@
+authors: Nathan, Vollkorn
+---
+feed_shownotes:
+<h2>S03E01 — Vollkorn über ART OFF Hamburg</h2>
+<p>WTF? Hallo und herzlich willkommen zur dritten Staffel vom WTF-Podcast. Mit der dritten Staffel möchten wir wegkommen vom Rundbrief für Genoss*innen und hin zu einem richtigen Podcast.</p>
+<p>Wir wollen uns nach außen öffnen. Projekte vorstellen. Zeigen, was geht. Und wir wollen uns auch verkaufen. Kund*innen gewinnen. Wie das geht? Keine Ahnung, aber versuchen wir es so: Wir zeigen, was wir können und ihr denkt vor Projekten an uns. Kommt auf uns zu. Sprecht uns an. Gemeinsam finden wir zusammen. Deal?</p>
+<p>In dieser Folge geht es um Vollkorn — so sein Spitzname. Er hat irgendwann mal Informatik studiert, ist beim CCC aktiv und macht auch beruflich irgendwas mit IT. Er wollte aber neben seinem Hauptjob auch mal eine Mark fuffzig nebenbei verdienen. Als <a href="https://art-off-hamburg.de/">ART OFF Hamburg</a>, eine Initiative freier Kunstorte in Hamburg, ihn anfragte, ob er nicht mal eben eine neue, kleine, statische Webseite bauen könnte, hatte er zwar Lust auf das Projekt, aber eben nicht auf den Papierkram.</p>
+<p>Und da kam die WTF ins Spiel: Die Genossenschaft schrieb Angebot und Rechnung, Vollkorn baute die Webseite mit <a href="https://gohugo.io/">Hugo</a>, die Künstler*innen bekamen ihre Webseite. Alle glücklich, alle zufrieden.</p>
+<p>Mitglieder der WTF erreichen Vollkorn über das <a href="https://ki.wtf-eg.de">Kompetenzinventar</a> und das <a href="https://forum.wtf-eg.de">Forum</a>. Er ist als <a href="https://twitter.com/vollkorn1982">@vollkorn1982 auf Twitter</a> und <a href="https://chaos.social/@vollkorn">@vollkorn@chaos.social</a>.</p>
+<p>Vielen Dank für das Interesse und eure Zeit! Für Fragen und Feedback zum Podcast schickt gerne eine E-Mail an <a href="mailto:podcast@wtf-eg.de">podcast@wtf-eg.de</a>. Nathan erreicht ihr als <a href="https://twitter.com/zeitschlag">@zeitschlag auf Twitter</a> oder als <a href="https://chaos.social/@zeitschlag">@zeitschlag@chaos.social auf Mastodon</a> Alle weiteren Informationen zur Genossenschaft gibt es im Internet unter <a href="https://wtf-eg.de">wtf-eg.de</a>. </p>
+
+
+---
+podcast_shownotes:
+
+WTF? Hallo und herzlich willkommen zur dritten Staffel vom WTF-Podcast. Mit der dritten Staffel möchten wir wegkommen vom Rundbrief für Genoss\*innen und hin zu einem richtigen Podcast.
+
+Wir wollen uns nach außen öffnen. Projekte vorstellen. Zeigen, was geht. Und wir wollen uns auch verkaufen. Kund\*innen gewinnen. Wie das geht? Keine Ahnung, aber versuchen wir es so: Wir zeigen, was wir können und ihr denkt vor Projekten an uns. Kommt auf uns zu. Sprecht uns an. Gemeinsam finden wir zusammen. Deal?
+
+In dieser Folge geht es um Vollkorn — so sein Spitzname. Er hat irgendwann mal Informatik studiert, ist beim CCC aktiv und macht auch beruflich irgendwas mit IT. Er wollte aber neben seinem Hauptjob auch mal eine Mark fuffzig nebenbei verdienen. Als [ART OFF Hamburg](https://art-off-hamburg.de/), eine Initiative freier Kunstorte in Hamburg, ihn anfragte, ob er nicht mal eben eine neue, kleine, statische Webseite bauen könnte, hatte er zwar Lust auf das Projekt, aber eben nicht auf den Papierkram.
+
+Und da kam die WTF ins Spiel: Die Genossenschaft schrieb Angebot und Rechnung, Vollkorn baute die Webseite mit [Hugo](https://gohugo.io/), die Künstler\*innen bekamen ihre Webseite. Alle glücklich, alle zufrieden.
+
+Mitglieder der WTF erreichen Vollkorn über das [Kompetenzinventar](https://ki.wtf-eg.de) und das [Forum](https://forum.wtf-eg.de). Er ist als [@vollkorn1982 auf Twitter](https://twitter.com/vollkorn1982) und [@vollkorn@chaos.social](https://chaos.social/@vollkorn).
+
+Vielen Dank für das Interesse und eure Zeit! Für Fragen und Feedback zum Podcast schickt gerne eine E-Mail an [podcast@wtf-eg.de](mailto:podcast@wtf-eg.de). Nathan erreicht ihr als [@zeitschlag auf Twitter](https://twitter.com/zeitschlag) oder als [@zeitschlag@chaos.social auf Mastodon](https://chaos.social/@zeitschlag) Alle weiteren Informationen zur Genossenschaft gibt es im Internet unter [wtf-eg.de](https://wtf-eg.de).
+---
+podcast_teaser: In der ersten Folge der dritten Staffel spricht Nathan mit Vollkorn über die statische Webseite für eine Künstler*innen-Initiative und wie das gelaufen ist.
+---
+pub_date: 2022-08-24
+---
+title: S03E01 — Vollkorn über ART OFF Hamburg
+---
+podcasttitle: S03E01 — Vollkorn über ART OFF Hamburg
+---
+season: 3
+---
+episode: 1
+---
+duration: 1026
+---
+mp3leng: 16456030
+---
+podcastmp3: WTF_S03E01.mp3
+---
+oggleng: 16820322
+---
+podcastogg: WTF_S03E01.ogg

models/contact_page.ini

@@ -0,0 +1,4 @@
+[model]
+name = Contact Page
+label = {{ this.title }}
+inherits = page

templates/aggregator_page.html

@@ -51,7 +51,7 @@
                     </h3>
                     <hr class="-odd">
                     <p class="content__meat">
-                        <i>geschrieben von {{ episode.authors }} am {{ episode.pub_date }}</i>
+                        <i>aufgenommen von {{ episode.authors }}, veröffentlicht am {{ episode.pub_date }}</i>
                     </p>
                     <p>
                         {{ episode.podcast_teaser }}

templates/contact_page.html

@@ -0,0 +1,56 @@
+{% extends "header_slim.html" %}
+{%- block title -%}{{ this.title }}{%- endblock -%}
+{%- block meta_description -%}
+  {%- if this.meta_description is defined and this.meta_description != "" -%}
+    {{ this.meta_description }}
+  {%- else -%}
+    Werkkooperative der Technikfreundinnen eG
+  {%- endif -%}
+{%- endblock -%}
+{% block body %}
+    <div class="content__box">
+        <div class="content__inner_box">
+            <h1>{{ this.title }}</h1>
+        </div>
+    </div>
+    <section class="content -odd">
+        <div class="content__box">
+            <div class="content__inner_box -width_constraint">
+                {{ this.body }}
+            </div>
+            <div class="content__inner_box -width_constraint content__contact_form_wrapper" style="display:none">
+              <h2>Kontaktformular</h2>
+              <form id="contact_form" class="content__contact_form">
+                <p class="contact_form__note">
+                  Deine E-Mail-Adresse wird nicht veröffentlicht.<br>
+                  <span aria-hidden="true">Erforderliche Felder sind gekennzeichnet <span class="contact_form--required" aria-hidden="true">*</span></span>
+                </p>
+                <p class="contact_form__text_input">
+                  <label for="name">Betreff <span class="contact_form--required" aria-hidden="true">*</span></label>
+                  <input id="name" class="contact_form__subject" name="subject" type="text" value="" size="30" maxlength="245" required />
+                </p>
+                <p class="contact_form__textarea">
+                  <label for="message">Nachricht <span class="contact_form--required" aria-hidden="true">*</span></label>
+                  <textarea id="message" class="contact_form__message" aria-label="message" aria-hidden="true" cols="65" rows="7" name="message" required></textarea>
+                </p>
+                <p class="contact_form__text_input">
+                  <label for="name">Name <span class="contact_form--required" aria-hidden="true">*</span></label>
+                  <input id="name" class="contact_form__name" name="name" type="text" value="" size="30" maxlength="245" required />
+                </p>
+                <p class="contact_form__text_input">
+                  <label for="email">E-Mail-Adresse <span class="contact_form--required" aria-hidden="true">*</span></label>
+                  <input id="email" class="contact_form__email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-address" required />
+                </p>
+                <p class="contact_form__captcha">
+                  <label for="captcha">Captcha <span class="contact_form--required" aria-hidden="true">*</span></label>
+                  <input id="captcha" class="contact_form__captcha" name="captcha" type="captcha" value="…" size="30" maxlength="100" required placeholder="Wie viele Ecken hat ein Pentagramm?"/>
+                </p>
+                <p class="contact_form__submit">
+                  <input name="submit" type="submit" id="submit" class="contact_form__submit_button" value="Kommentar abschicken" />
+                  <p class="contact_form__feedback"></p>
+                </p>
+              </form>
+            </div>
+        </div>
+    </section>
+{% endblock %}

templates/layout.html

@@ -63,6 +63,9 @@ __        ____________________
   {% if 'manifest.json'|asseturl is defined -%}
     <link rel="manifest" href="{{ 'manifest.json'|asseturl }}">
   {%- endif %}
+  {% if '/js/contact_form_toggle.js'|asseturl is defined and this.title == 'Kontakt' -%}
+    <script type="text/javascript" src="{{ '/js/contact_form_toggle.js'|asseturl }}"></script>
+  {%- endif %}
 </head>
 <body>
     <header>
@@ -128,4 +131,7 @@ __        ____________________
     {%- if '/js/nav_toggle.js'|asseturl is defined -%}
       <script type="text/javascript" src="{{ '/js/nav_toggle.js'|asseturl }}"></script>
     {%- endif %}
+    {% if '/js/contact_form_toggle.js'|asseturl is defined and this.title == 'Kontakt' -%}
+      <script type="text/javascript" src="{{ '/js/contact_form.js'|asseturl }}"></script>
+    {%- endif %}
 </body>

templates/macros/podcast.html

@@ -1,23 +1,23 @@
-{% macro render_blog_post(post, from_index=false, section_class='-odd') %}
+{% macro render_podcast_episode(episode, from_index=false, section_class='-odd') %}
     <section class="content {{ section_class }}">
         <div class="content__box -heading">
             <div class="content__inner_box">
                 {% if from_index %}
-                    <h2><a class="content__blog_link {{ section_class }}" href="{{ post|url }}">{{ post.title }}</a></h2>
+                    <h2><a class="content__blog_link {{ section_class }}" href="{{ episode|url }}">{{ episode.title }}</a></h2>
                 {% else %}
-                    <h2>{{ post.title }}</h2>
+                    <h2>{{ episode.title }}</h2>
                 {% endif %}
                 <hr class="{{ section_class }}">
                 <p class="content__meta">
-                    <i>geschrieben von {{ post.authors }} am {{ post.pub_date }}</i>
+                    <i>aufgenommen von {{ episode.authors }}, veröffentlicht am {{ episode.pub_date }}</i>
                 </p>
             </div>
         </div>
         <div class="content__half_box">
             <div class="content__inner_half_box">
-              {{ post.podcast_teaser }}
+              {{ episode.podcast_teaser }}
               {% if not from_index %}
-                {{ post.podcast_shownotes }}
+                {{ episode.podcast_shownotes }}
               {% endif %}
             </div>
 
@@ -25,50 +25,51 @@
               <div class="content__inner_half_box">
                 <div class="pod_ctrl_box">
                   <audio controls class="pod_ctrl_box__audio_controls">
-                    {% if post.podcastogg -%}
+                    {% if episode.podcastogg -%}
-                      <source src="{{ post|url(alt='de')}}{{ post.podcastogg }}" type="audio/ogg">
+                      <source src="{{ episode|url(alt='de')}}{{ episode.podcastogg }}" type="audio/ogg">
                     {%- endif %}
-                    {% if post.podcastmp3 -%}
+                    {% if episode.podcastmp3 -%}
-                      <source src="{{  post|url(alt='de') }}{{ post.podcastmp3 }}" type="audio/mpeg">
+                      <source src="{{  episode|url(alt='de') }}{{ episode.podcastmp3 }}" type="audio/mpeg">
                     {%- endif %}
                       Your browser does not support the audio element.
                   </audio>
                   <div class="pod_ctrl_box__button">
-                    <a class="pod_ctrl_box__button_link" href="{{ post|url }}" >Podcastfolge durchst&ouml;bern</a>
+                    <a class="pod_ctrl_box__button_link" href="{{ episode|url }}" >Podcastfolge durchst&ouml;bern</a>
                   </div>
                 </div>
             {% else -%}
               <div class="content__inner_half_box">
                 <audio controls>
-                  {% if post.podcastogg -%}
+                  {% if episode.podcastogg -%}
-                    <source src="{{ post.podcastogg|url(alt='de') }}" type="audio/ogg">
+                    <source src="{{ episode.podcastogg|url(alt='de') }}" type="audio/ogg">
                   {%- endif %}
-                  {% if post.podcastmp3 %}
+                  {% if episode.podcastmp3 %}
-                    <source src="{{ post.podcastmp3|url(alt='de') }}" type="audio/mpeg">
+                    <source src="{{ episode.podcastmp3|url(alt='de') }}" type="audio/mpeg">
                   {%- endif %}
                     Your browser does not support the audio element.
                 </audio>
-                <br/>
+                {% if episode.podcastmp3 -%}
-                {% if post.podcastmp3 -%}
+                  <br/>
-                  <a class="" href="{{ post.podcastmp3|url(alt='de')  }}" download>
+                  <a class="" href="{{ episode.podcastmp3|url(alt='de')  }}" download>
-                    {%- if post.podcasttitle -%}
+                    {%- if episode.podcasttitle -%}
-                      {{ post.podcasttitle }}
+                      {{ episode.podcasttitle }}
                     {%- else -%}
                       Download Folge
                     {%- endif -%}
                     {{ ' als MP3' }}
                   </a>
                 {% endif %}
-                {% if post.podcastogg -%}
+                {% if episode.podcastogg -%}
-                  <a class="" href="{{ post.podcastogg|url(alt='de')  }}" download>
+                  <br/>
-                    {%- if post.podcasttitle -%}
+                  <a class="" href="{{ episode.podcastogg|url(alt='de')  }}" download>
-                      {{ post.podcasttitle }}
+                    {%- if episode.podcasttitle -%}
+                      {{ episode.podcasttitle }}
                     {%- else -%}
                       Download Folge
                     {%- endif -%}
                     {{ ' als OGG' }}
                   </a>
-                {% endif %}<br/>
+                {% endif %}
               </div>
             {% endif %}
           </div>

templates/podcast-post.html

@@ -1,5 +1,5 @@
 {% extends "header_slim.html" %}
-{% from "macros/podcast.html" import render_blog_post %}
+{% from "macros/podcast.html" import render_podcast_episode %}
 {%- block title -%}{{ this.title }}{%- endblock -%}
 {%- block meta_description -%}
   {%- if this.meta_description is defined and this.meta_description != "" -%}
@@ -14,5 +14,5 @@
         <h1>{{ this.title }}</h1>
     </div>
 </div>
-    {{ render_blog_post(this) }}
+    {{ render_podcast_episode(this) }}
 {% endblock %}

templates/podcast.html

@@ -1,5 +1,5 @@
 {% extends "header_slim.html" %}
-{% from "macros/podcast.html" import render_blog_post %}
+{% from "macros/podcast.html" import render_podcast_episode %}
 {% from "macros/pagination.html" import render_pagination %}
 
 {%- block title -%}{{ this.title }}{%- endblock -%}
@@ -45,8 +45,8 @@
         {#-  Die Podcast Folgen werden aus dem blog template importiert :P -#}
 
 
-        {% for blog_post in this.pagination.items %}
+        {% for episode in this.pagination.items %}
-                {{ render_blog_post(blog_post, from_index=true) }}
+                {{ render_podcast_episode(episode, from_index=true) }}
         {% endfor %}
         <section>
             {{ render_pagination(this.pagination, true) }}