Benutzer-Werkzeuge

Webseiten-Werkzeuge


links:gema

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

Link zu der Vergleichsansicht

Beide Seiten, vorherige ÜberarbeitungVorherige Überarbeitung
Nächste Überarbeitung
Vorherige Überarbeitung
links:gema [22/03/2026 10:50] Eric Weberlinks:gema [20/05/2026 08:53] (aktuell) Eric Weber
Zeile 1: Zeile 1:
 ====== GEMA-Pauschalvertrag ====== ====== GEMA-Pauschalvertrag ======
-;;# 
-Stand: 22.03.26 
-;;# 
  
 ### ###
Zeile 14: Zeile 11:
 <title>Schulübersicht GEMA-Abfrage</title> <title>Schulübersicht GEMA-Abfrage</title>
  
-<!-- PapaParse (CSV Parser) --> 
 <script src="https://cdn.jsdelivr.net/npm/papaparse@5.4.1/papaparse.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/papaparse@5.4.1/papaparse.min.js"></script>
  
 <style> <style>
  
-/* ---------- Grunddesign ---------- */+/* ========================= 
 +   NUR INNERHALB VON #gema-app 
 +   ========================= */
  
-body {+#gema-app {
   font-family: Arial, sans-serif;   font-family: Arial, sans-serif;
-  background:#f4f6f9+  background: transparent
-  margin:20px;+  padding:20px;
 } }
  
-input {+#gema-app input {
   width:100%;   width:100%;
   max-width:400px;   max-width:400px;
Zeile 36: Zeile 34:
 } }
  
-#info {+#gema-app #info {
   font-weight:bold;   font-weight:bold;
   margin-bottom:15px;   margin-bottom:15px;
 } }
  
-/* ---------- Tabelle ---------- */+#gema-app #lastUpdate { 
 +  margin-bottom:10px; 
 +  color:#555; 
 +
 + 
 +/* Button */ 
 + 
 +#gema-app .toggle-btn { 
 +  margin-bottom:15px; 
 +  padding:8px 14px; 
 +  border:none; 
 +  border-radius:8px; 
 +  background:#2c7be5; 
 +  color:white; 
 +  cursor:pointer; 
 +
 + 
 +#gema-app .toggle-btn:hover { 
 +  background:#1a5fd1; 
 +
 + 
 +#gema-app .toggle-btn:focus, 
 +#gema-app .toggle-btn:active { 
 +  background:#2c7be5; 
 +  outline:none; 
 +
 + 
 +#gema-app .toggle-btn:focus-visible { 
 +  outline:3px solid #1a5fd1; 
 +
 + 
 +/* Tabelle */
  
-.table-wrapper {+#gema-app .table-wrapper {
   overflow-x:auto;   overflow-x:auto;
 } }
  
-table {+#gema-app table {
   border-collapse: collapse;   border-collapse: collapse;
   width:100%;   width:100%;
Zeile 56: Zeile 85:
 } }
  
-th {+#gema-app th {
   padding:12px;   padding:12px;
   background:linear-gradient(to right,#f0f0f0,#e6e6e6);   background:linear-gradient(to right,#f0f0f0,#e6e6e6);
Zeile 63: Zeile 92:
 } }
  
-td {+#gema-app td {
   padding:12px;   padding:12px;
   border-bottom:1px solid #eee;   border-bottom:1px solid #eee;
 } }
  
-tr:hover {+#gema-app tr:hover {
   background:#f9fbff;   background:#f9fbff;
 } }
  
-/* ---------- Button ---------- */+/* Kartenansicht */
  
-.toggle-btn { +#gema-app.card-view table, 
-  margin-bottom:15px; +#gema-app.card-view thead, 
-  padding:8px 14px; +#gema-app.card-view tbody, 
-  border:none; +#gema-app.card-view th, 
-  border-radius:8px; +#gema-app.card-view td, 
-  background:#2c7be5; +#gema-app.card-view tr {
-  color:white; +
-  cursor:pointer; +
-+
- +
-.toggle-btn:hover { +
-  background:#1a5fd1; +
-+
- +
-.toggle-btn:focus, +
-.toggle-btn:active { +
-  background:#2c7be5; +
-  color:white; +
-  outline:none; +
-+
- +
-.toggle-btn:focus-visible { +
-  outline:3px solid #1a5fd1; +
-+
- +
-/* ---------- Karten ---------- */ +
- +
-.card-view table, +
-.card-view thead, +
-.card-view tbody, +
-.card-view th, +
-.card-view td, +
-.card-view tr {+
   display:block;   display:block;
 } }
  
-.card-view thead {+#gema-app.card-view thead {
   display:none;   display:none;
 } }
  
-.card-view tr {+#gema-app.card-view tr {
   margin-bottom:20px;   margin-bottom:20px;
   background:white;   background:white;
Zeile 123: Zeile 125:
 } }
  
-.card-view td {+#gema-app.card-view td {
   display:flex;   display:flex;
   gap:10px;   gap:10px;
Zeile 129: Zeile 131:
 } }
  
-.card-view td:before {+#gema-app.card-view td:before {
   content: attr(data-label);   content: attr(data-label);
   font-weight:bold;   font-weight:bold;
Zeile 136: Zeile 138:
 } }
  
-/* ---------- Mobile ---------- */+/* Mobile fallback */
  
 @media (max-width:768px) { @media (max-width:768px) {
-  body:not(.force-table) .table-wrapper table, +  #gema-app:not(.force-table) .table-wrapper table, 
-  body:not(.force-table) .table-wrapper thead, +  #gema-app:not(.force-table) .table-wrapper thead, 
-  body:not(.force-table) .table-wrapper tbody, +  #gema-app:not(.force-table) .table-wrapper tbody, 
-  body:not(.force-table) .table-wrapper th, +  #gema-app:not(.force-table) .table-wrapper th, 
-  body:not(.force-table) .table-wrapper td, +  #gema-app:not(.force-table) .table-wrapper td, 
-  body:not(.force-table) .table-wrapper tr {+  #gema-app:not(.force-table) .table-wrapper tr {
     display:block;     display:block;
   }   }
  
-  body:not(.force-table) .table-wrapper thead {+  #gema-app:not(.force-table) .table-wrapper thead {
     display:none;     display:none;
   }   }
  
-  body:not(.force-table) .table-wrapper tr {+  #gema-app:not(.force-table) .table-wrapper tr {
     margin-bottom:20px;     margin-bottom:20px;
     background:white;     background:white;
Zeile 160: Zeile 162:
   }   }
  
-  body:not(.force-table) .table-wrapper td {+  #gema-app:not(.force-table) .table-wrapper td {
     display:flex;     display:flex;
     gap:10px;     gap:10px;
Zeile 166: Zeile 168:
   }   }
  
-  body:not(.force-table) .table-wrapper td:before {+  #gema-app:not(.force-table) .table-wrapper td:before {
     content: attr(data-label);     content: attr(data-label);
     font-weight:bold;     font-weight:bold;
Zeile 175: Zeile 177:
 </style> </style>
 </head> </head>
 +
 <body> <body>
 +
 +<div id="gema-app">
  
 <input type="text" id="searchInput" placeholder="🔍 Suche..."> <input type="text" id="searchInput" placeholder="🔍 Suche...">
 +
 +<div id="lastUpdate">Letzte Aktualisierung: lädt...</div>
 <div id="info"></div> <div id="info"></div>
  
Zeile 196: Zeile 203:
 </div> </div>
  
-<script>+<div style="text-align: right; margin-top: 16px; font-size: 0.75rem; color: #95a5a6;"> 
 +  Made with <a href="https://claude.ai" target="_blank" style="color: #3498db; text-decoration: none;">claude.ai</a> 
 +  by <a href="https://www.ericweber.de" target="_blank" style="color: #3498db; text-decoration: none;">Eric Weber</a> 
 +</div>
  
-/* -------- Google Sheets URL -------- */+</div>
  
-const sheetURL = "https://docs.google.com/spreadsheets/d/e/2PACX-1vSwWpyG-nbRkwF_0InvmPsBRij8J11wELxBpuX0U_rSYi1e26YdDC8zy5giF_5XYOn7vz9feNopYrwZ/pub?output=csv"+<script>
  
-/* -------- Daten laden (PapaParse) -------- */+const sheetURL = "https://docs.google.com/spreadsheets/d/e/2PACX-1vSwWpyG-nbRkwF_0InvmPsBRij8J11wELxBpuX0U_rSYi1e26YdDC8zy5giF_5XYOn7vz9feNopYrwZ/pub?output=csv";
  
 Papa.parse(sheetURL, { Papa.parse(sheetURL, {
   download: true,   download: true,
-  header: true, +  skipEmptyLines: false,
-  skipEmptyLines: true,+
   complete: function(results) {   complete: function(results) {
  
-    const data = results.data; +    const allRows = results.data; 
-    const tbody = document.querySelector("#schoolTable tbody");+ 
 +    // 👉 F2 = [1][5] 
 +    const lastUpdate = allRows[1]?.[5] || "kein Datum"; 
 +    document.querySelector("#gema-app #lastUpdate").textContent = 
 +      "Letzte Aktualisierung: " + lastUpdate; 
 + 
 +    // 👉 Header + Daten trennen 
 +    const headers = allRows[0]; 
 +    const dataRows = allRows.slice(1); 
 + 
 +    const tbody = document.querySelector("#gema-app #schoolTable tbody"); 
 + 
 +    dataRows.forEach(row => {
  
-    data.forEach(row => {+      const rowObj = {}; 
 +      headers.forEach((h, i) => rowObj[h] = row[i]);
  
       const tr = document.createElement("tr");       const tr = document.createElement("tr");
  
       tr.innerHTML = `       tr.innerHTML = `
-        <td data-label="Schulname">${row.Schulname || ""}</td> +        <td data-label="Schulname">${rowObj.Schulname || ""}</td> 
-        <td data-label="Ort">${row.Ort || ""}</td> +        <td data-label="Ort">${rowObj.Ort || ""}</td> 
-        <td data-label="Schulträger">${row["Schulträger"] || ""}</td> +        <td data-label="Schulträger">${rowObj["Schulträger"] || ""}</td> 
-        <td data-label="GEMA">${getGemaIcon(row.GEMA)}</td>+        <td data-label="GEMA">${getGemaIcon(rowObj.GEMA)}</td>
       `;       `;
  
-      tr.dataset.search = Object.values(row).join(" ").toLowerCase();+      tr.dataset.search = Object.values(rowObj).join(" ").toLowerCase();
  
       tbody.appendChild(tr);       tbody.appendChild(tr);
Zeile 232: Zeile 254:
 }); });
  
-/* -------- GEMA Icons -------- */+/* -------- GEMA Ampel -------- */
  
 function getGemaIcon(status) { function getGemaIcon(status) {
Zeile 254: Zeile 276:
 } }
  
-/* -------- Suche (schnell) -------- */+/* -------- Suche -------- */
  
 function debounce(func, delay) { function debounce(func, delay) {
Zeile 264: Zeile 286:
 } }
  
-document.getElementById("searchInput").addEventListener("keyup", debounce(function() {+document.querySelector("#gema-app #searchInput") 
 +.addEventListener("keyup", debounce(function() {
  
   let filter = this.value.toLowerCase();   let filter = this.value.toLowerCase();
-  let rows = document.querySelectorAll("#schoolTable tbody tr");+  let rows = document.querySelectorAll("#gema-app tbody tr");
   let visibleCount = 0;   let visibleCount = 0;
  
Zeile 279: Zeile 302:
   });   });
  
-  document.getElementById("info").textContent =+  document.querySelector("#gema-app #info").textContent =
     visibleCount + " Schule(n) gefunden";     visibleCount + " Schule(n) gefunden";
  
Zeile 287: Zeile 310:
  
 function sortTable(n) { function sortTable(n) {
-  let table = document.getElementById("schoolTable");+  let table = document.querySelector("#gema-app #schoolTable");
   let rows = Array.from(table.tBodies[0].rows);   let rows = Array.from(table.tBodies[0].rows);
   let asc = table.getAttribute("data-dir") !== "asc";   let asc = table.getAttribute("data-dir") !== "asc";
Zeile 301: Zeile 324:
 } }
  
-/* -------- Ansicht wechseln -------- */+/* -------- Ansicht -------- */
  
 function toggleView() { function toggleView() {
-  document.body.classList.toggle("card-view"); +  document.getElementById("gema-app").classList.toggle("card-view"); 
-  document.body.classList.toggle("force-table");+  document.getElementById("gema-app").classList.toggle("force-table");
 } }
  
Zeile 319: Zeile 342:
   - Die jeweiligen Veranstaltungen werden durch die Schulen bei der GEMA angemeldet. Die Gebühren dafür trägt der Schulträger.   - Die jeweiligen Veranstaltungen werden durch die Schulen bei der GEMA angemeldet. Die Gebühren dafür trägt der Schulträger.
   - Als VDP-Mitglied (Verband deutscher Privatschulen) und/oder des BVMW (Bundesverbandes der mittelständischen Wirtschaft) gibt es die Möglichkeit Preisnachlässe zu bekommen. In der Regel halten sich die Preisnachlässe im Rahmen von 20-30%.   - Als VDP-Mitglied (Verband deutscher Privatschulen) und/oder des BVMW (Bundesverbandes der mittelständischen Wirtschaft) gibt es die Möglichkeit Preisnachlässe zu bekommen. In der Regel halten sich die Preisnachlässe im Rahmen von 20-30%.
 +  - Es wird aktuell von mir geprüft, ob es einen Pauschalvertrag der Landesregierung gibt, der es allen Fördervereinen der Schulen ermöglicht, in einem bestimmten Rahmen kostenfreie Veranstaltungen durchzuführen. Alle Infos gibt's demnächst hier und natürlich auch in unserem [[https://fbmusik.de|Newsletter]]
links/gema.1774173030.txt.gz · Zuletzt geändert: von Eric Weber