@@ Zeile 738: / Zeile 738: @@
 // -------------------------------------
+/* Whisky News – Popup (v6)
+   - News (Titel + Intro + 2 Karten) bleiben erhalten
+   - Oben: Canvas mit sanft schwenkendem Whiskyglas
+   - Darunter: animierter Trinkspruch „Slàinte mhath“
+*/
+mw.loader.using(['mediawiki.util','jquery']).then(function(){
+  (function($, mw){
+    'use strict';
+    var CONFIG = {
+      enabled: true,
+      id: 'wow_mannheim_whisky_news_v6',  // Version erhöhen, damit alle es sehen
+      title: 'Whisky News: Messeabfüllungen – World of Whisky (Mannheim)',
+      introHTML: '<p>Frisch zur Messe in Mannheim: Zwei limitierte Abfüllungen. Schau sie dir an und bewerte sie im Wiki!</p>',
+      // Karten (Bilder optional – URLs ggf. ersetzen)
+      images: [
+        {
+          src: 'https://ados-wiki.de/images/2/2f/South_Islay_Single_Malt_13_year-old_%28Sherry_Octave_Cask_Finish%29.single.jpg', // TODO: ersetzen
+          alt: 'South Islay 13y – Sherry Octave Cask Finish',
+          link: 'https://ados-wiki.de/wiki/South_Islay_Single_Malt_13_year-old_(Sherry_Octave_Cask_Finish)',
+          cta: 'Zur South Islay Abfüllung'
+        },
+        {
+          src: 'https://ados-wiki.de/images/9/95/Tullibardine_13_year-old_%28Shiraz_Wine_Octave_Cask_Finish%29.single.jpg', // TODO: ersetzen
+          alt: 'Tullibardine 13y – Shiraz Wine Octave Cask Finish',
+          link: 'https://ados-wiki.de/wiki/Tullibardine_13_year-old',
+          cta: 'Zur Tullibardine Abfüllung'
+        }
+      ],
+      // Popup-Steuerung
+      dailyLimit: 1,
+      escToClose: true,
+      clickBackdropToClose: true,
+      // Animations-/Text-Optionen
+      toastText: 'Slàinte mhath'
+    };
+    if (!CONFIG.enabled) return;
+    // 1×/Tag je Nutzer
+    var isAnon = (mw.config.get('wgUserName') === null);
+    function LSget(k){ try { return localStorage.getItem(k); } catch(e){ return null; } }
+    function LSset(k,v){ try { localStorage.setItem(k, v); } catch(e){} }
+    var key = 'popup_' + CONFIG.id + (isAnon?':anon':':user');
+    var today = (d => d.getFullYear()+'-'+('0'+(d.getMonth()+1)).slice(-2)+'-'+('0'+d.getDate()).slice(-2))(new Date());
+    if (LSget(key) === today) return;
+    function markSeen(){ LSset(key, today); }
+    $(function(){
+      // Overlay + Modal
+      var $overlay = $('<div>', {'class':'mw-popup-overlay'});
+      var $modal = $('<div>', {
+        'class':'mw-popup-modal',
+        'role':'dialog',
+        'aria-modal':'true',
+        'aria-labelledby':'mw-news-title'
+      });
+      // Bühne oben: Whiskyglas im Canvas
+      var $stage = $('<div>', {'class':'mw-fw-canvas-wrap'});
+      var $canvas = $('<canvas>', {'class':'mw-fw-canvas','aria-hidden':'true'});
+      $stage.append($canvas);
+      // Trinkspruch (CSS-animiert)
+      var $toast = $('<div>', {'class':'mw-slainte-toast', id:'mw-news-title'}).text(CONFIG.toastText);
+      // Titel + Intro (für Screenreader behalten wir aria-labelledby am Toast)
+      var $title = $('<h2>').text(CONFIG.title);
+      var $intro = $('<div>', {'class':'mw-popup-content'}).html(CONFIG.introHTML);
+      // Karten
+      var $cards = $('<div>', {'class':'mw-wnews-cards'});
+      CONFIG.images.forEach(function(img){
+        var $card = $('<a>', {'class':'mw-wnews-card','href':img.link,'target':'_blank','rel':'noopener'});
+        var $thumb = $('<div>', {'class':'mw-wnews-thumb'});
+        if (img.src) $thumb.append($('<img>', {src: img.src, alt: img.alt, loading:'lazy'}));
+        $card.append(
+          $thumb,
+          $('<div>', {'class':'mw-wnews-meta'}).append(
+            $('<div>', {'class':'mw-wnews-title', text: img.alt}),
+            $('<div>', {'class':'mw-wnews-cta', text: img.cta || 'Mehr ansehen'})
+          )
+        );
+        $cards.append($card);
+      });
+      // Button
+      var $btnRow = $('<div>', {'class':'mw-popup-button-row'});
+      var $ok = $('<button>', {'class':'mw-popup-close', type:'button'}).text('OK');
+      $btnRow.append($ok);
+      // zusammenbauen
+      $modal.append($stage, $toast, $title, $intro, $cards, $btnRow);
+      $('body').append($overlay, $modal);
+      function close(){
+        stopAnim(true);
+        markSeen();
+        $overlay.remove(); $modal.remove();
+        $(document).off('keydown.mwwnews visibilitychange');
+      }
+      if (CONFIG.clickBackdropToClose) $overlay.on('click', close);
+      $ok.on('click', close);
+      if (CONFIG.escToClose){
+        $(document).on('keydown.mwwnews', function(e){
+          var k = e.key || e.keyCode;
+          if (k==='Escape' || k==='Esc' || k===27){ e.preventDefault(); close(); }
+        });
+      }
+      // ===== Canvas: sanft schwenkendes Whiskyglas =====
+      var canvas = $canvas[0], ctx = canvas.getContext && canvas.getContext('2d');
+      var reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+      var dpr=1, cw=0, ch=0, raf=null, t0=0, started=false, ro;
+      var glass = {x:0,y:0,w:0,h:0,r:0};
+      var baseFill=0, amp=0;
+      function setSize(){
+        var r = $stage[0].getBoundingClientRect();
+        if (r.width <= 0 || r.height <= 0) return false;
+        var newDpr = Math.max(1, window.devicePixelRatio || 1);
+        if (cw!==r.width || ch!==r.height || dpr!==newDpr){
+          dpr=newDpr; cw=r.width; ch=r.height;
+          canvas.width = Math.floor(cw*dpr);
+          canvas.height = Math.floor(ch*dpr);
+          canvas.style.width = cw+'px';
+          canvas.style.height = ch+'px';
+          layout();
+        }
+        return true;
+      }
+      function layout(){
+        var w=canvas.width, h=canvas.height;
+        glass.x = w*0.18; glass.y = h*0.15; glass.w = w*0.64; glass.h = h*0.7;
+        glass.r = Math.min(glass.w,glass.h)*0.08;
+        baseFill = glass.y + glass.h*0.58;
+        amp = Math.min(14*dpr, canvas.height*0.03);
+      }
+      function drawGlass(){
+        ctx.save();
+        ctx.strokeStyle = 'rgba(255,255,255,0.28)';
+        ctx.lineWidth = Math.max(2, 2*dpr);
+        ctx.beginPath();
+        ctx.moveTo(glass.x+glass.r, glass.y);
+        ctx.arcTo(glass.x+glass.w, glass.y, glass.x+glass.w, glass.y+glass.h, glass.r);
+        ctx.arcTo(glass.x+glass.w, glass.y+glass.h, glass.x, glass.y+glass.h, glass.r);
+        ctx.arcTo(glass.x, glass.y+glass.h, glass.x, glass.y, glass.r);
+        ctx.arcTo(glass.x, glass.y, glass.x+glass.w, glass.y, glass.r);
+        ctx.closePath();
+        ctx.stroke();
+        // Glanzkante
+        ctx.beginPath();
+        ctx.moveTo(glass.x+glass.w*0.15, glass.y+glass.h*0.1);
+        ctx.quadraticCurveTo(glass.x+glass.w*0.25, glass.y+glass.h*0.05, glass.x+glass.w*0.3, glass.y+glass.h*0.3);
+        ctx.strokeStyle = 'rgba(255,255,255,0.18)';
+        ctx.stroke();
+        ctx.restore();
+      }
+      function drawLiquid(t){
+        var topY = baseFill + Math.sin(t*2.0)*amp*0.25 + Math.sin(t*0.7)*amp*0.15;
+        // Clip ins Glas
+        ctx.save();
+        ctx.beginPath();
+        ctx.moveTo(glass.x+glass.r, glass.y);
+        ctx.arcTo(glass.x+glass.w, glass.y, glass.x+glass.w, glass.y+glass.h, glass.r);
+        ctx.arcTo(glass.x+glass.w, glass.y+glass.h, glass.x, glass.y+glass.h, glass.r);
+        ctx.arcTo(glass.x, glass.y+glass.h, glass.x, glass.y, glass.r);
+        ctx.arcTo(glass.x, glass.y, glass.x+glass.w, glass.y, glass.r);
+        ctx.closePath();
+        ctx.clip();
+        // Whisky-Farbverlauf
+        var grd = ctx.createLinearGradient(0, topY-30*dpr, 0, glass.y+glass.h);
+        grd.addColorStop(0, 'rgba(255,190,90,0.96)');
+        grd.addColorStop(1, 'rgba(170,85,20,0.98)');
+        // Flüssigkeit als Wellen-Path (kein Rechteck)
+        ctx.beginPath();
+        ctx.moveTo(glass.x, topY);
+        for (var x=0; x<=glass.w; x+=6*dpr){
+          var y = topY + Math.sin((x*0.055) + t*3.6) * amp * 0.22;
+          ctx.lineTo(glass.x + x, y);
+        }
+        ctx.lineTo(glass.x + glass.w, glass.y + glass.h);
+        ctx.lineTo(glass.x,              glass.y + glass.h);
+        ctx.closePath();
+        ctx.fillStyle = grd;
+        ctx.fill();
+        // feiner Lichtsaum
+        ctx.beginPath();
+        ctx.moveTo(glass.x, topY);
+        for (var x2=0; x2<=glass.w; x2+=6*dpr){
+          var y2 = topY + Math.sin((x2*0.055) + t*3.6) * amp * 0.22;
+          ctx.lineTo(glass.x + x2, y2);
+        }
+        ctx.strokeStyle = 'rgba(255,215,120,0.35)';
+        ctx.lineWidth = Math.max(1, 1*dpr);
+        ctx.stroke();
+        ctx.restore();
+      }
+      function frame(ts){
+        if (!t0) t0 = ts;
+        var t = (ts - t0)/1000;
+        // Hintergrund sanft
+        ctx.globalCompositeOperation = 'source-over';
+        ctx.fillStyle = 'rgba(5,10,20,0.16)';
+        ctx.fillRect(0,0,canvas.width,canvas.height);
+        drawGlass();
+        drawLiquid(t);
+        // kleiner Randglanz
+        ctx.save();
+        ctx.globalCompositeOperation = 'lighter';
+        ctx.strokeStyle = 'rgba(255,255,255,0.15)';
+        ctx.lineWidth = 1*dpr;
+        ctx.beginPath();
+        ctx.arc(glass.x + glass.w*0.85, glass.y + glass.h*0.15, 10*dpr, 0, Math.PI*2);
+        ctx.stroke();
+        ctx.restore();
+        raf = requestAnimationFrame(frame);
+      }
+      function startAnim(){
+        if (!ctx || reduce) return;
+        if (!setSize()) { setTimeout(startAnim, 50); return; }
+        if (started) return;
+        started = true; t0=0;
+        raf = requestAnimationFrame(frame);
+        if ('ResizeObserver' in window) {
+          ro = new ResizeObserver(function(){ setSize(); });
+          ro.observe($stage[0]);
+        } else {
+          $(window).on('resize.mwwnews', setSize);
+        }
+        document.addEventListener('visibilitychange', onVis);
+      }
+      function stopAnim(remove){
+        if (raf){ cancelAnimationFrame(raf); raf=null; }
+        started = false;
+        if (remove){
+          if (ro){ ro.disconnect(); ro=null; } else { $(window).off('resize.mwwnews'); }
+          document.removeEventListener('visibilitychange', onVis);
+        }
+      }
+      function onVis(){ if (document.hidden) stopAnim(false); else startAnim(); }
+      // Start
+      setTimeout(startAnim, 0);
+      markSeen();
+    });
+  })(jQuery, mw);
+});

MediaWiki:Common.js: Unterschied zwischen den Versionen