Add single page viewer

lib/components/gallery_basic_info.dart

@@ -38,7 +38,9 @@ class GalleryBasicInfo extends StatelessWidget {
                   mainAxisAlignment: MainAxisAlignment.spaceAround,
                   children: [
                     ElevatedButton(
-                        onPressed: null,
+                        onPressed: () {
+                          context.push('/gallery/${gMeta.gid}/page/1');
+                        },
                         child: Text(AppLocalizations.of(context)!.read)),
                     ElevatedButton(
                         onPressed: () {

lib/components/gallery_info.dart

@@ -68,7 +68,7 @@ class _GalleryInfo extends State<GalleryInfo> with ThemeModeWidget {
                 ]),
               ),
         ThumbnailGridView(
-            widget.gData.pages,
+            widget.gData,
             SliverGridDelegateWithFixedCrossAxisCount(
                 crossAxisCount: useMobile ? 2 : 5),
             files: widget.files,

lib/components/gallery_info_desktop.dart

@@ -131,6 +131,13 @@ class GalleryInfoDesktop extends StatelessWidget {
                         SizedBox(
                             width: 150,
                             child: Column(children: [
+                              ElevatedButton(
+                                  onPressed: () {
+                                    context.push(
+                                        '/gallery/${gData.meta.gid}/page/1');
+                                  },
+                                  child:
+                                      Text(AppLocalizations.of(context)!.read)),
                               ElevatedButton(
                                   onPressed: () {
                                     context.push(

lib/components/thumbnail.dart

@@ -3,21 +3,32 @@ import 'dart:ui';
 import 'package:dio/dio.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+import 'package:go_router/go_router.dart';
 import 'package:logging/logging.dart';
 import 'package:path/path.dart';
 import 'package:palette_generator/palette_generator.dart';
 import '../api/client.dart';
+import '../api/file.dart';
 import '../api/gallery.dart';
 import '../globals.dart';
 import '../utils.dart';
 import '../utils/clipboard.dart';
+import '../viewer/single.dart';
 import 'image.dart';
 
 final _log = Logger("Thumbnail");
 
 class Thumbnail extends StatefulWidget {
   const Thumbnail(ExtendedPMeta pMeta,
-      {Key? key, int? max, int? width, int? height, int? fileId, this.gid})
+      {Key? key,
+      int? max,
+      int? width,
+      int? height,
+      int? fileId,
+      this.gid,
+      this.index,
+      this.files,
+      this.gdata})
       : _pMeta = pMeta,
         _max = max ?? 1200,
         _width = width,
@@ -30,6 +41,9 @@ class Thumbnail extends StatefulWidget {
   final int? _height;
   final int? _fileId;
   final int? gid;
+  final int? index;
+  final EhFiles? files;
+  final GalleryData? gdata;
 
   int get height => _height != null
       ? _height!
@@ -223,6 +237,19 @@ class _Thumbnail extends State<Thumbnail> {
               ];
               return list;
             }));
+    final timg = _data != null
+        ? ImageWithContextMenu(_data!,
+            uri: _uri, fileName: _fileName, dir: _dir)
+        : null;
+    final img = widget.gid != null && widget.index != null && _data != null
+        ? GestureDetector(
+            onTap: () {
+              context.push("/gallery/${widget.gid}/page/${widget.index}",
+                  extra: SinglePageViewerExtra(
+                      data: widget.gdata, files: widget.files));
+            },
+            child: timg)
+        : timg;
     return SizedBox(
         width: widget.width.toDouble(),
         height: widget.height.toDouble(),
@@ -240,10 +267,7 @@ class _Thumbnail extends State<Thumbnail> {
                                       sigmaX: 10,
                                       sigmaY: 10,
                                       tileMode: TileMode.decal),
-                                  child: ImageWithContextMenu(_data!,
-                                      uri: _uri,
-                                      fileName: _fileName,
-                                      dir: _dir))),
+                                  child: img)),
                           SizedBox(
                               width: widget.width.toDouble(),
                               height: widget.height.toDouble(),
@@ -265,8 +289,7 @@ class _Thumbnail extends State<Thumbnail> {
                         SizedBox(
                             width: widget.width.toDouble(),
                             height: widget.height.toDouble(),
-                            child: ImageWithContextMenu(_data!,
-                                uri: _uri, fileName: _fileName, dir: _dir)),
+                            child: img),
                         moreVertMenu
                       ])
                 : Center(

lib/components/thumbnail_gridview.dart

@@ -5,10 +5,10 @@ import '../globals.dart';
 import 'thumbnail.dart';
 
 class ThumbnailGridView extends StatelessWidget {
-  const ThumbnailGridView(this.pages, this.gridDelegate,
+  const ThumbnailGridView(this.gdata, this.gridDelegate,
       {Key? key, this.files, this.gid})
       : super(key: key);
-  final List<ExtendedPMeta> pages;
+  final GalleryData gdata;
   final int? gid;
   final EhFiles? files;
   final SliverGridDelegate gridDelegate;
@@ -16,7 +16,8 @@ class ThumbnailGridView extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final displayAd = prefs.getBool("displayAd") ?? false;
-    final npages = displayAd ? pages : pages.where((e) => !e.isAd).toList();
+    final npages =
+        displayAd ? gdata.pages : gdata.pages.where((e) => !e.isAd).toList();
     return SliverGrid.builder(
         gridDelegate: gridDelegate,
         itemCount: npages.length,
@@ -26,7 +27,12 @@ class ThumbnailGridView extends StatelessWidget {
               files != null ? files!.files[page.token]!.first.id : null;
           return Container(
               padding: const EdgeInsets.all(4),
-              child: Thumbnail(page, fileId: fileId, gid: gid));
+              child: Thumbnail(page,
+                  fileId: fileId,
+                  gid: gid,
+                  index: index + 1,
+                  files: files,
+                  gdata: gdata));
         });
   }
 }