MusikimUnterricht.de

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 [02/04/2026 10:24] (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 194: Zeile 201:
 <tbody></tbody> <tbody></tbody>
 </table> </table>
 +</div>
 +
 </div> </div>
  
 <script> <script>
  
-/* -------- Google Sheets URL -------- */ +const sheetURL = "https://docs.google.com/spreadsheets/d/e/2PACX-1vSwWpyG-nbRkwF_0InvmPsBRij8J11wELxBpuX0U_rSYi1e26YdDC8zy5giF_5XYOn7vz9feNopYrwZ/pub?output=csv";
- +
-const sheetURL = "https://docs.google.com/spreadsheets/d/e/2PACX-1vSwWpyG-nbRkwF_0InvmPsBRij8J11wELxBpuX0U_rSYi1e26YdDC8zy5giF_5XYOn7vz9feNopYrwZ/pub?output=csv" +
- +
-/* -------- Daten laden (PapaParse) -------- */+
  
 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 249:
 }); });
  
-/* -------- GEMA Icons -------- */+/* -------- GEMA Ampel -------- */
  
 function getGemaIcon(status) { function getGemaIcon(status) {
Zeile 254: Zeile 271:
 } }
  
-/* -------- Suche (schnell) -------- */+/* -------- Suche -------- */
  
 function debounce(func, delay) { function debounce(func, delay) {
Zeile 264: Zeile 281:
 } }
  
-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 297:
   });   });
  
-  document.getElementById("info").textContent =+  document.querySelector("#gema-app #info").textContent =
     visibleCount + " Schule(n) gefunden";     visibleCount + " Schule(n) gefunden";
  
Zeile 287: Zeile 305:
  
 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 319:
 } }
  
-/* -------- 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");
 } }
  
links/gema.1774173030.txt.gz · Zuletzt geändert: von Eric Weber