From 202fb021b2c79b3ba96a761033093ad70c27625d Mon Sep 17 00:00:00 2001
From: Hermes <hermes@local>
Date: Sat, 8 Aug 2026 18:57:30 +0200
Subject: [PATCH] fix detail: resolve wrapped object + catalog fallback, native
 meta layout, Watch/Download buttons, back via keydown+Controller

---
 plugin.js | 133 +++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 106 insertions(+), 27 deletions(-)

diff --git a/plugin.js b/plugin.js
index 3aea62f..0aa1df6 100644
--- a/plugin.js
+++ b/plugin.js
@@ -56,12 +56,18 @@
         var css =
             '.mymovies{padding:2.2em 3.4em;overflow-y:auto;height:100%;box-sizing:border-box}' +
             '.movies-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1.4em}' +
-            '.mymovies-detail{padding:3em;max-width:900px}' +
-            '.detail-head{display:flex;gap:2em;flex-wrap:wrap}' +
-            '.detail-poster{width:220px;border-radius:10px}' +
-            '.detail-info h1{margin:0 0 .4em;font-size:1.8em}' +
-            '.detail-info>div{margin:.3em 0;opacity:.85}' +
-            '.detail-actions{margin-top:1.5em}' +
+            '.mymovies-detail{padding:3em;max-width:980px;box-sizing:border-box}' +
+            '.detail-head{display:flex;gap:2.2em;flex-wrap:wrap;align-items:flex-start}' +
+            '.detail-poster{width:240px;max-width:40vw;border-radius:12px;display:block;background:#1b1b1f}' +
+            '.detail-info{flex:1;min-width:260px}' +
+            '.detail-info h1{margin:0 0 .35em;font-size:2em;line-height:1.15}' +
+            '.detail-orig{opacity:.6;font-size:1.1em;margin-bottom:.6em}' +
+            '.detail-meta{display:flex;flex-wrap:wrap;gap:.6em;margin:.4em 0 1em}' +
+            '.detail-meta>span{padding:.25em .7em;border-radius:6px;background:rgba(255,255,255,.08);font-size:.95em}' +
+            '.detail-desc{opacity:.85;line-height:1.5;font-size:1.05em;margin-top:.6em;max-width:60ch}' +
+            '.detail-actions{display:flex;gap:1em;margin-top:1.8em;flex-wrap:wrap}' +
+            '.detail-actions .btn{padding:.7em 1.8em;border-radius:8px;background:rgba(255,255,255,.1);font-size:1.1em;cursor:pointer}' +
+            '.detail-actions .btn.focus,.detail-actions .btn:hover{background:var(--accent-color,#3a7afe);color:#fff}' +
             '.mymovies-empty{padding:2em;opacity:.6;font-size:1.2em}';
         $('<style id="mymovies-style">').text(css).appendTo('head');
     }
@@ -77,6 +83,17 @@
 
         this.create = function (b) {
             body = b;
+            comp._onKey = function (e) {
+                if (e.key === 'Backspace' || e.key === 'Escape') {
+                    e.preventDefault();
+                    Lampa.Activity.back();
+                }
+            };
+            document.addEventListener('keydown', comp._onKey, true);
+        };
+
+        this.destroy = function () {
+            if (comp._onKey) document.removeEventListener('keydown', comp._onKey, true);
         };
 
         // Wire up keyboard/remote navigation (pattern from Shikimori plugin).
@@ -139,6 +156,7 @@
                 var movies = (data && data.movies) || [];
                 movies = sortMovies(movies);
                 comp._movies = movies;
+                window.__mymovies_catalog = movies;
                 console.log('[mymovies] loaded', movies.length, 'films');
                 renderMovies($(grid), movies);
                 // re-apply navigation once cards exist (activity.start may have run before load)
@@ -187,30 +205,67 @@
 
     // ---------- Component: movie detail ----------
     var selected = null;
+    function resolveMovie(m) {
+        // Lampa sometimes wraps the pushed object; normalize to the real film.
+        if (m && m.object && (m.object.id || m.object.poster || m.object.title)) return m.object;
+        return m;
+    }
     function MyMoviesDetail() {
         var comp = this;
         var body;
 
         this.create = function (b) {
             body = b;
+            // Browser/keyboard fallback: Backspace / Escape -> back (remote uses Controller 'back')
+            comp._onKey = function (e) {
+                if (e.key === 'Backspace' || e.key === 'Escape') {
+                    e.preventDefault();
+                    Lampa.Activity.back();
+                }
+            };
+            document.addEventListener('keydown', comp._onKey, true);
+        };
+
+        this.destroy = function () {
+            if (comp._onKey) document.removeEventListener('keydown', comp._onKey, true);
         };
 
         this.start = function () {
-            // Remote: only "back" is needed on the detail screen.
-            Lampa.Controller.add('mymovies_detail', {
-                back: function () {
-                    Lampa.Activity.back();
-                },
-                gone: function () {
-                    Lampa.Controller.clear('mymovies_detail');
-                }
-            });
-            Lampa.Controller.toggle('mymovies_detail');
+            var apply = function () {
+                var btns = $('.mymovies-detail .detail-actions .btn.selector');
+                if (!btns.length) return;
+                Lampa.Controller.add('mymovies_detail', {
+                    toggle: function () {
+                        Lampa.Controller.collectionSet($('.mymovies-detail .detail-actions'));
+                        Lampa.Controller.collectionFocus(btns[0], $('.mymovies-detail .detail-actions'));
+                    },
+                    back: function () { Lampa.Activity.back(); },
+                    right: function () { Navigator.move('right'); },
+                    left: function () { Navigator.move('left'); },
+                    enter: function () {
+                        var el = $('.mymovies-detail .detail-actions .btn.selector.focus')[0] || btns[0];
+                        if (!el) return;
+                        if (el.getAttribute('data-act') === 'download') download(m);
+                        else play(m);
+                    },
+                    gone: function () { Lampa.Controller.clear('mymovies_detail'); }
+                });
+                Lampa.Controller.toggle('mymovies_detail');
+            };
+            apply();
+            setTimeout(apply, 300);
         };
 
         this.render = function () {
-            var m = (comp.activity && comp.activity.object) || selected;
-            if (!m) { Lampa.Activity.back(); return document.createElement('div'); }
+            var raw = (comp.activity && comp.activity.object) || selected;
+            var m = resolveMovie(raw);
+            // Fallback: lookup full record from the cached catalog by id.
+            if ((!m || !m.poster) && window.__mymovies_catalog) {
+                var id = m && m.id;
+                var found = window.__mymovies_catalog.filter(function (x) { return x.id === id; })[0];
+                if (found) m = found;
+            }
+            if (!m || !m.title) { Lampa.Activity.back(); return document.createElement('div'); }
 
             injectStyles();
             var html = document.createElement('div');
@@ -220,6 +275,7 @@
             var poster = document.createElement('img');
             poster.className = 'detail-poster';
             poster.src = resolve(m.poster || m.cover);
+            poster.alt = m.title || '';
             head.appendChild(poster);
             var info = document.createElement('div');
             info.className = 'detail-info';
@@ -227,22 +283,34 @@
             h1.textContent = m.title;
             info.appendChild(h1);
             if (m.original_title) { var d = document.createElement('div'); d.className = 'detail-orig'; d.textContent = m.original_title; info.appendChild(d); }
-            if (m.year) { var d = document.createElement('div'); d.className = 'detail-year'; d.textContent = m.year; info.appendChild(d); }
-            if (m.genre && m.genre.length) { var d = document.createElement('div'); d.className = 'detail-genre'; d.textContent = m.genre.join(', '); info.appendChild(d); }
-            if (m.rating) { var d = document.createElement('div'); d.className = 'detail-rating'; d.textContent = '★ ' + m.rating; info.appendChild(d); }
+            var meta = document.createElement('div');
+            meta.className = 'detail-meta';
+            if (m.year) { var s = document.createElement('span'); s.textContent = m.year; meta.appendChild(s); }
+            if (m.genre && m.genre.length) { var s = document.createElement('span'); s.textContent = m.genre.join(', '); meta.appendChild(s); }
+            if (m.rating) { var s = document.createElement('span'); s.textContent = '★ ' + m.rating; meta.appendChild(s); }
+            if (meta.children.length) info.appendChild(meta);
             if (m.description) { var d = document.createElement('div'); d.className = 'detail-desc'; d.textContent = m.description; info.appendChild(d); }
             head.appendChild(info);
             html.appendChild(head);
+
             var actions = document.createElement('div');
             actions.className = 'detail-actions';
-            var btn = document.createElement('div');
-            btn.className = 'btn selector';
-            btn.setAttribute('data-act', 'play');
-            btn.textContent = 'Watch';
-            actions.appendChild(btn);
+            var btnWatch = document.createElement('div');
+            btnWatch.className = 'btn selector';
+            btnWatch.setAttribute('data-act', 'play');
+            btnWatch.textContent = 'Watch';
+            actions.appendChild(btnWatch);
+            if (m.torrent || m.magnet) {
+                var btnDl = document.createElement('div');
+                btnDl.className = 'btn selector';
+                btnDl.setAttribute('data-act', 'download');
+                btnDl.textContent = 'Download';
+                actions.appendChild(btnDl);
+                $(btnDl).on('hover:enter', function () { download(m); });
+            }
             html.appendChild(actions);
 
-            $(btn).on('hover:enter', function () { play(m); });
+            $(btnWatch).on('hover:enter', function () { play(m); });
             return html;
         };
     }
@@ -270,6 +338,17 @@
         });
     }
 
+    function download(m) {
+        var url = m.magnet ? m.magnet : resolve(m.torrent);
+        if (!url) return;
+        // Open the torrent/magnet in the system (player or download manager)
+        if (Lampa.Player && Lampa.Player.play) {
+            Lampa.Player.play({ url: url, title: m.title, img: resolve(m.poster || m.cover), season: 0, episode: 0 });
+        } else {
+            window.open(url, '_blank');
+        }
+    }
+
     // ---------- Menu item ----------
     // Lampa builds the main menu on the 'menu:start' event, e.body is the jQuery menu root.
     // Remove ALL old copies from the DOM first, then add exactly one button.