v2.8.1

Fix issue with path creation
2026-08-19 08:35:41 +02:00 · 2019-12-24 20:21:29 +01:00 · 2019-12-24 20:18:22 +01:00 · 2019-12-24 20:15:03 +01:00 · 2019-12-24 19:47:17 +01:00 · 2019-12-24 19:42:45 +01:00
66 changed files with 1769 additions and 485 deletions
@@ -1,5 +1,32 @@
 # Changelog

+## [2.8.1] - 2019-12-24
+### Changed
+- Fix issue with path creation
+
+## [2.8.0] - 2019-12-24
+### Added
+- Photo gallery feature
+
+## [2.7.1] - 2019-12-21
+### Added
+- Add version to title bar
+
+## [2.7.0] - 2019-12-21
+### Changed
+- Add missing icon
+### Added
+- Add support for pixxxels
+
+## [2.6.0] - 2019-12-21
+### Changed
+- Disable download button when nothing selected in Link collector grab menu
+- Better quality app icon
+- Implement context menu on download tab
+- Add stop remove and start button to context menu
+- Link will not be removed automatically from link collector tab
+- Some UI fixes
+
 ## [2.5.1] - 2019-12-09
 ### Changed
 - Disable download button when nothing selected in Link collector grab menu
@@ -4,7 +4,7 @@
    <modelVersion>4.0.0</modelVersion>
    <groupId>tn.mnlr</groupId>
    <artifactId>vripper</artifactId>
-    <version>2.5.1</version>
+    <version>2.8.1</version>
    <packaging>pom</packaging>
    <parent>
        <groupId>org.springframework.boot</groupId>
@@ -86,7 +86,6 @@ getPort().then(port => {
  }
  vripperServer = spawn(javaBinPath, [
    "-Xms256m",
-    "-Xmx1024m",
    "-Dvripper.server.port=" + port,
    "-jar",
    jarPath
@@ -136,6 +135,7 @@ if (!gotTheLock) {
      })
      .catch((error) => {
        // Terminate immediately
+        console.log(error);
        vripperServer.kill('SIGKILL');
        terminated = true;
        app.quit();
@@ -1,6 +1,6 @@
 {
  "name": "vripper-electron",
-  "version": "2.5.1",
+  "version": "2.8.1",
  "lockfileVersion": 1,
  "requires": true,
  "dependencies": {
@@ -35,6 +35,11 @@
        "defer-to-connect": "^1.0.1"
      }
    },
+    "@types/color-name": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz",
+      "integrity": "sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ=="
+    },
    "@types/debug": {
      "version": "4.1.5",
      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.5.tgz",
@@ -117,6 +122,7 @@
      "version": "3.2.1",
      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+      "dev": true,
      "requires": {
        "color-convert": "^1.9.0"
      }
@@ -216,9 +222,9 @@
      "dev": true
    },
    "astral-regex": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
-      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz",
+      "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ=="
    },
    "async-exit-hook": {
      "version": "2.0.1",
@@ -519,18 +525,18 @@
      "dev": true
    },
    "cli-truncate": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-2.0.0.tgz",
-      "integrity": "sha512-C4hp+8GCIFVsUUiXcw+ce+7wexVWImw8rQrgMBFsqerx9LvvcGlwm6sMjQYAEmV/Xb87xc1b5Ttx505MSpZVqg==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-2.1.0.tgz",
+      "integrity": "sha512-n8fOixwDD6b/ObinzTrp1ZKFzbgvKZvuz/TvejnLn1aQfC6r52XEx85FmuC+3HI+JM7coBRXUvNqEU2PHVrHpg==",
      "requires": {
-        "slice-ansi": "^2.1.0",
-        "string-width": "^4.1.0"
+        "slice-ansi": "^3.0.0",
+        "string-width": "^4.2.0"
      },
      "dependencies": {
        "ansi-regex": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
-          "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg=="
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
+          "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg=="
        },
        "emoji-regex": {
          "version": "8.0.0",
@@ -543,21 +549,21 @@
          "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
        },
        "string-width": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.1.0.tgz",
-          "integrity": "sha512-NrX+1dVVh+6Y9dnQ19pR0pP4FiEIlUvdTGn8pw6CKTNq5sgib2nIhmUNT5TAmhWmvKr3WcxBcP3E8nWezuipuQ==",
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.0.tgz",
+          "integrity": "sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==",
          "requires": {
            "emoji-regex": "^8.0.0",
            "is-fullwidth-code-point": "^3.0.0",
-            "strip-ansi": "^5.2.0"
+            "strip-ansi": "^6.0.0"
          }
        },
        "strip-ansi": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
-          "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
+          "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
          "requires": {
-            "ansi-regex": "^4.1.0"
+            "ansi-regex": "^5.0.0"
          }
        }
      }
@@ -626,6 +632,7 @@
      "version": "1.9.3",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "dev": true,
      "requires": {
        "color-name": "1.1.3"
      }
@@ -633,7 +640,8 @@
    "color-name": {
      "version": "1.1.3",
      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
+      "dev": true
    },
    "combined-stream": {
      "version": "1.0.8",
@@ -760,11 +768,6 @@
        "array-find-index": "^1.0.1"
      }
    },
-    "custom-electron-titlebar": {
-      "version": "3.0.10",
-      "resolved": "https://registry.npmjs.org/custom-electron-titlebar/-/custom-electron-titlebar-3.0.10.tgz",
-      "integrity": "sha512-FVKy7P0NpMTkm5rEpETXkJWQ7w9ufdU8TA5xhfiR1Jgnhy6fBaCNUMmXWLrNFrhG69MVvDXM/lLN21Rxaz78Ig=="
-    },
    "dashdash": {
      "version": "1.14.1",
      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
@@ -2426,19 +2429,41 @@
      }
    },
    "slice-ansi": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-2.1.0.tgz",
-      "integrity": "sha512-Qu+VC3EwYLldKa1fCxuuvULvSJOKEgk9pi8dZeCVK7TqBfUNTH4sFkk4joj8afVSfAYgJoSOetjx9QWOJ5mYoQ==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-3.0.0.tgz",
+      "integrity": "sha512-pSyv7bSTC7ig9Dcgbw9AuRNUb5k5V6oDudjZoMBSr13qpLBG7tB+zgCkARjq7xIUgdz5P1Qe8u+rSGdouOOIyQ==",
      "requires": {
-        "ansi-styles": "^3.2.0",
-        "astral-regex": "^1.0.0",
-        "is-fullwidth-code-point": "^2.0.0"
+        "ansi-styles": "^4.0.0",
+        "astral-regex": "^2.0.0",
+        "is-fullwidth-code-point": "^3.0.0"
      },
      "dependencies": {
+        "ansi-styles": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.0.tgz",
+          "integrity": "sha512-7kFQgnEaMdRtwf6uSfUnVr9gSGC7faurn+J/Mv90/W+iTtN0405/nLdopfMWwchyxhbGYl6TC4Sccn9TUkGAgg==",
+          "requires": {
+            "@types/color-name": "^1.1.1",
+            "color-convert": "^2.0.1"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        },
        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+          "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
        }
      }
    },
@@ -1,6 +1,6 @@
 {
  "name": "vripper-electron",
-  "version": "2.5.1",
+  "version": "2.8.1",
  "description": "A ripper for vipergirls.to built using web technolgies",
  "main": "main.js",
  "author": "death-claw <53543762+death-claw@users.noreply.github.com>",
@@ -8,7 +8,7 @@
  "license": "ISC",
  "build": {
    "appId": "tn.mnlr.vripper",
-    "productName": "vripper",
+    "productName": "VRipper",
    "files": [
      "**/*",
      "!**/node_modules/*/{CHANGELOG.md,README.md,README,readme.md,readme}",
@@ -38,7 +38,7 @@
      }
    ],
    "win": {
-      "icon": "icon.png",
+      "icon": "icon.ico",
      "target": [
        "nsis"
      ]
@@ -62,7 +62,7 @@
      "target": [
        "dmg"
      ],
-      "icon": "icon.png"
+      "icon": "icon.icns"
    }
  },
  "scripts": {
@@ -77,7 +77,6 @@
    "axios": "^0.19.0",
    "cheerio": "^1.0.0-rc.3",
    "copy-dir": "^1.1.0",
-    "custom-electron-titlebar": "^3.0.10",
    "electron-context-menu": "^0.13.0",
    "get-port": "^5.0.0",
    "rimraf": "^2.6.3"
@@ -5,7 +5,7 @@
  <parent>
    <groupId>tn.mnlr</groupId>
    <artifactId>vripper</artifactId>
-    <version>2.5.1</version>
+    <version>2.8.1</version>
  </parent>
  <artifactId>vripper-electron</artifactId>
  <name>vripper-electron</name>
@@ -5,7 +5,7 @@
    <parent>
        <groupId>tn.mnlr</groupId>
        <artifactId>vripper</artifactId>
-        <version>2.5.1</version>
+        <version>2.8.1</version>
    </parent>
    <artifactId>vripper-server</artifactId>
    <name>vripper-server</name>
@@ -72,6 +72,11 @@
            <artifactId>guava</artifactId>
            <version>28.1-jre</version>
        </dependency>
+        <dependency>
+            <groupId>org.imgscalr</groupId>
+            <artifactId>imgscalr-lib</artifactId>
+            <version>4.2</version>
+        </dependency>
        <dependency>
            <groupId>tn.mnlr</groupId>
            <artifactId>vripper-ui</artifactId>
@@ -30,6 +30,7 @@ import java.io.InputStream;
 import java.net.URI;
 import java.net.URISyntaxException;
 import java.nio.file.Files;
+import java.nio.file.StandardCopyOption;
 import java.util.Iterator;

@Service
@@ -97,11 +98,10 @@ abstract public class Host {
            imageFileData.setImageName(formatImageFileName);
            File destinationFolder = pathService.getDownloadDestinationFolder(image.getPostId());
            logger.debug(String.format("Saving to %s", destinationFolder.getPath()));
+            logger.debug(String.format("Creating %s", destinationFolder.getPath()));
+            destinationFolder.mkdirs();
            if (!destinationFolder.exists()) {
-                logger.debug(String.format("Creating %s", destinationFolder.getPath()));
-                if (destinationFolder.mkdirs()) {
-                    logger.debug(String.format("Folder %s is created", destinationFolder.toString()));
-                }
+                logger.debug(String.format("Folder %s is created", destinationFolder.toString()));
            }

            HttpClient client = cm.getClient().build();
@@ -127,9 +127,11 @@ abstract public class Host {
                        image.increase(read);
                        downloadSpeedService.increase(read);
                    }
+                    fos.flush();
                    EntityUtils.consumeQuietly(response.getEntity());
                }
-                checkImageTypeAndRename(outputFile, imageFileData.getImageName(), image.getIndex());
+                File finalName = checkImageTypeAndRename(outputFile, imageFileData.getImageName(), image.getIndex());
+                imageFileData.setFileName(finalName.getName());
            }
        } catch (Exception e) {
            if (Thread.interrupted()) {
@@ -139,27 +141,38 @@ abstract public class Host {
        }
    }

-    private void checkImageTypeAndRename(File outputFile, String imageName, int index) throws HostException {
-        String formatName;
+    private File checkImageTypeAndRename(File outputFile, String imageName, int index) throws HostException {
        try (ImageInputStream iis = ImageIO.createImageInputStream(outputFile)) {
            Iterator<ImageReader> it = ImageIO.getImageReaders(iis);
            if (!it.hasNext()) {
                throw new HostException("Image file is not recognized!");
            }
            ImageReader reader = it.next();
-            formatName = reader.getFormatName();
-            if (formatName.toUpperCase().equals("JPEG")) {
-                formatName = "jpg";
+            if (reader.getFormatName().toUpperCase().equals("JPEG")) {
+                String imageNameLC = imageName.toLowerCase();
+                if (!imageNameLC.endsWith("_jpg") && !imageNameLC.endsWith("_jpeg")) {
+                    imageName += ".jpg";
+                } else {
+                    String toReplace = null;
+                    if (imageNameLC.endsWith("_jpg")) {
+                        toReplace = "_jpg";
+                    } else if (imageNameLC.endsWith("_jpeg")) {
+                        toReplace = "_jpeg";
+                    }
+                    if (toReplace != null) {
+                        imageName = imageName.substring(0, imageName.length() - toReplace.length()) + ".jpg";
+                    }
+                }
            }
        } catch (Exception e) {
            throw new HostException("Failed to guess image format", e);
        }
        try {
-            File outImage = new File(outputFile.getParent(), (appSettingsService.isForceOrder() ? String.format("%03d_", index) : "") + imageName + "." + formatName.toLowerCase());
+            File outImage = new File(outputFile.getParent(), (appSettingsService.isForceOrder() ? String.format("%03d_", index) : "") + imageName);
            if (outImage.exists() && outImage.delete()) {
                logger.debug(String.format("%s is deleted", outImage.toString()));
            }
-            Files.move(outputFile.toPath(), outImage.toPath());
+            return Files.move(outputFile.toPath(), outImage.toPath(), StandardCopyOption.ATOMIC_MOVE).toFile();
        } catch (Exception e) {
            throw new HostException("Failed to rename the image", e);
        }
@@ -0,0 +1,67 @@
+package tn.mnlr.vripper.host;
+
+import org.apache.http.client.protocol.HttpClientContext;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+import org.w3c.dom.Document;
+import org.w3c.dom.Node;
+import tn.mnlr.vripper.exception.HostException;
+import tn.mnlr.vripper.exception.XpathException;
+import tn.mnlr.vripper.q.ImageFileData;
+import tn.mnlr.vripper.services.ConnectionManager;
+
+@Service
+public class PixxxelsHost extends Host {
+
+    private static final Logger logger = LoggerFactory.getLogger(PixxxelsHost.class);
+
+    private static final String host = "pixxxels.cc";
+    private static final String IMG_XPATH = "//*[@id='download']";
+    private static final String TITLE_XPATH = "//*[contains(@class,'imagename')]";
+
+    @Autowired
+    private ConnectionManager cm;
+
+    @Override
+    public String getHost() {
+        return host;
+    }
+
+    @Override
+    public String getLookup() {
+        return host;
+    }
+
+    @Override
+    protected void setNameAndUrl(final String _url, final ImageFileData imageFileData, final HttpClientContext context) throws HostException {
+
+        String url = _url.replace("http://", "https://");
+        Response resp = getResponse(url, context);
+        Document doc = resp.getDocument();
+
+        Node imgNode, titleNode;
+        try {
+            logger.debug(String.format("Looking for xpath expression %s in %s", IMG_XPATH, url));
+            imgNode = xpathService.getAsNode(doc, IMG_XPATH);
+
+            logger.debug(String.format("Looking for xpath expression %s in %s", TITLE_XPATH, url));
+            titleNode = xpathService.getAsNode(doc, TITLE_XPATH);
+
+        } catch (XpathException e) {
+            throw new HostException(e);
+        }
+
+        try {
+            logger.debug(String.format("Resolving name and image url for %s", url));
+            String imgTitle = titleNode.getTextContent().trim();
+            String imgUrl = imgNode.getAttributes().getNamedItem("href").getTextContent().trim();
+
+            imageFileData.setImageUrl(imgUrl);
+            imageFileData.setImageName(imgTitle.isEmpty() ? imgUrl.substring(imgUrl.lastIndexOf('/') + 1) : imgTitle);
+        } catch (Exception e) {
+            throw new HostException("Unexpected error occurred", e);
+        }
+    }
+}
@@ -7,9 +7,11 @@ import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
+import tn.mnlr.vripper.VripperApplication;
 import tn.mnlr.vripper.entities.Image;
 import tn.mnlr.vripper.services.AppSettingsService;
 import tn.mnlr.vripper.services.AppStateService;
+import tn.mnlr.vripper.services.ThumbnailGenerator;

 import javax.annotation.PostConstruct;
 import javax.annotation.PreDestroy;
@@ -36,6 +38,12 @@ public class ExecutionService {
    @Autowired
    private AppStateService appStateService;

+    @Autowired
+    private ThumbnailGenerator thumbnailGenerator;
+
+    @Autowired
+    private AppSettingsService appSettingsService;
+
    private final AtomicInteger threadCount = new AtomicInteger();

    private ExecutorService executor = Executors.newFixedThreadPool(10);
@@ -130,6 +138,11 @@ public class ExecutionService {
                            .onComplete(e -> {
                                appStateService.doneDownloadJob(finalTake.getImage());
                                logger.debug(String.format("Finished downloading %s", finalTake.getImage().getUrl()));
+                                if (appSettingsService.isViewPhotos()) {
+                                    VripperApplication.commonExecutor.submit(
+                                            () -> thumbnailGenerator.getThumbnails()
+                                                    .get(new ThumbnailGenerator.CacheKey(finalTake.getImage().getPostId(), finalTake.getImageFileData().getFileName())));
+                                }
                                synchronized (threadCount) {
                                    threadCount.decrementAndGet();
                                    running.remove(finalTake);
@@ -10,6 +10,7 @@ public class ImageFileData {

    private String pageUrl;
    private String imageName;
+    private String fileName;
    private String imageUrl;
    private HttpUriRequest imageRequest;
 }
@@ -44,6 +44,7 @@ public class AppSettingsService {
    private final String THREADSUBFOLDER = "THREADSUBFOLDER";
    private final String CLEAR = "CLEAR";
    private final String DARK_THEME = "DARK_THEME";
+    private final String VIEW_PHOTOS = "VIEW_PHOTOS";

    private String downloadPath;
    private int maxThreads;
@@ -58,6 +59,7 @@ public class AppSettingsService {
    private boolean forceOrder;
    private boolean clearCompleted;
    private boolean darkTheme;
+    private boolean viewPhotos;

    public void setVPassword(String vPassword) {
        if(vPassword.isEmpty()) {
@@ -82,6 +84,7 @@ public class AppSettingsService {
        threadSubLocation = prefs.getBoolean(THREADSUBFOLDER, false);
        clearCompleted = prefs.getBoolean(CLEAR, false);
        darkTheme = prefs.getBoolean(DARK_THEME, false);
+        viewPhotos = prefs.getBoolean(VIEW_PHOTOS, false);
    }

    @PreDestroy
@@ -100,6 +103,7 @@ public class AppSettingsService {
        prefs.putBoolean(THREADSUBFOLDER, threadSubLocation);
        prefs.putBoolean(CLEAR, clearCompleted);
        prefs.putBoolean(DARK_THEME, darkTheme);
+        prefs.putBoolean(VIEW_PHOTOS, viewPhotos);

        try {
            prefs.sync();
@@ -175,8 +179,10 @@ public class AppSettingsService {
        private boolean threadSubLocation;
        @JsonProperty("clearCompleted")
        private boolean clearCompleted;
+        @JsonProperty("viewPhotos")
+        private boolean viewPhotos;

-        public Settings(String downloadPath, int maxThreads, boolean autoStart, boolean vLogin, String vUsername, String vPassword, boolean vThanks, boolean desktopClipboard, boolean forceOrder, boolean subLocation, boolean threadSubLocation, boolean clearCompleted) {
+        public Settings(String downloadPath, int maxThreads, boolean autoStart, boolean vLogin, String vUsername, String vPassword, boolean vThanks, boolean desktopClipboard, boolean forceOrder, boolean subLocation, boolean threadSubLocation, boolean clearCompleted, boolean viewPhotos) {
            this.downloadPath = downloadPath;
            this.maxThreads = maxThreads;
            this.autoStart = autoStart;
@@ -189,6 +195,7 @@ public class AppSettingsService {
            this.subLocation = subLocation;
            this.threadSubLocation = threadSubLocation;
            this.clearCompleted = clearCompleted;
+            this.viewPhotos = viewPhotos;
        }
    }
 }
@@ -41,13 +41,6 @@ public class PathService {
     * @return Sanitized local path string
     */
    public final String formatImageFileName(String imageName) {
-        int extensionIndex = imageName.lastIndexOf('.');
-        String fileName;
-        if (extensionIndex != -1) {
-            fileName = imageName.substring(0, extensionIndex);
-        } else {
-            fileName = imageName;
-        }
-        return sanitize(fileName);
+        return sanitize(imageName);
    }
 }
@@ -54,9 +54,7 @@ public class PersistenceService {
        om.addMixIn(Post.class, PostPersistanceMixin.class);
        subscription = processor
                .onBackpressureLatest()
-                .buffer(10, TimeUnit.SECONDS)
-                .filter(e -> !e.isEmpty())
-                .map(e -> e.get(0))
+                .throttleLatest(1, TimeUnit.SECONDS)
                .doOnNext(this::persist)
                .subscribe();
    }
@@ -0,0 +1,103 @@
+package tn.mnlr.vripper.services;
+
+import com.google.common.cache.CacheBuilder;
+import com.google.common.cache.CacheLoader;
+import com.google.common.cache.LoadingCache;
+import lombok.Getter;
+import lombok.NoArgsConstructor;
+import lombok.Setter;
+import org.imgscalr.Scalr;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Service;
+
+import javax.annotation.PostConstruct;
+import javax.imageio.ImageIO;
+import java.awt.image.BufferedImage;
+import java.io.File;
+import java.nio.file.Files;
+import java.util.Objects;
+
+@Service
+public class ThumbnailGenerator {
+
+    @Getter
+    private LoadingCache<CacheKey, byte[]> thumbnails;
+    @Value("${base.dir}")
+    private String baseDir;
+    @Autowired
+    private PathService pathService;
+    private File cacheFolder;
+    CacheLoader<CacheKey, byte[]> loader = new CacheLoader<>() {
+        @Override
+        public byte[] load(CacheKey key) throws Exception {
+            File destinationFolder = pathService.getDownloadDestinationFolder(key.getPostId());
+            if (!destinationFolder.exists() || !destinationFolder.isDirectory()) {
+                return null;
+            }
+            return Files.readAllBytes(generateThumbnail(new File(destinationFolder, key.getImgName()), key.getPostId()).toPath());
+        }
+    };
+
+    @PostConstruct
+    private void init() throws Exception {
+        cacheFolder = new File(baseDir + File.separator + ".vripper" + File.separator + "cache");
+        cacheFolder.mkdirs();
+        if (!cacheFolder.exists()) {
+            throw new Exception(String.format("%s could not be created", cacheFolder.toString()));
+        }
+        thumbnails = CacheBuilder.newBuilder()
+                .maximumSize(20000)
+                .build(loader);
+    }
+
+    private File generateThumbnail(File inputFile, String postId) throws Exception {
+        if (!inputFile.exists()) {
+            throw new Exception(String.format("Input file %s does not exist", inputFile.toString()));
+        }
+        File postsCacheFolder = new File(cacheFolder, postId);
+        postsCacheFolder.mkdirs();
+        if (!postsCacheFolder.exists()) {
+            throw new Exception(String.format("%s could not be created", postsCacheFolder.toString()));
+        }
+
+        File thumbFile = new File(postsCacheFolder, inputFile.getName());
+        if (thumbFile.exists()) {
+            return thumbFile;
+        }
+
+        BufferedImage image = ImageIO.read(inputFile);
+        BufferedImage resize = Scalr.resize(image, 350, 350);
+        ImageIO.write(resize, "jpg", thumbFile);
+        image.flush();
+        resize.flush();
+        return thumbFile;
+    }
+
+    @Getter
+    @Setter
+    @NoArgsConstructor
+    public static class CacheKey {
+        private String postId;
+        private String imgName;
+
+        public CacheKey(String postId, String imgName) {
+            this.postId = postId;
+            this.imgName = imgName;
+        }
+
+        @Override
+        public boolean equals(Object o) {
+            if (this == o) return true;
+            if (o == null || getClass() != o.getClass()) return false;
+            CacheKey cacheKey = (CacheKey) o;
+            return Objects.equals(postId, cacheKey.postId) &&
+                    Objects.equals(imgName, cacheKey.imgName);
+        }
+
+        @Override
+        public int hashCode() {
+            return Objects.hash(postId, imgName);
+        }
+    }
+}
@@ -158,7 +158,7 @@ class VRThreadHandler extends DefaultHandler {
                        imageCount,
                        String.format("https://vipergirls.to/threads/%s/?p=%s&viewfull=1#post%s", threadId, postId, postId),
                        previews,
-                        hostMap.entrySet().stream().map(e -> e.getKey().getHost() + " (" + e.getValue().get() + ")").collect(Collectors.joining(", "))
+                        hostMap.entrySet().stream().filter(v -> v.getValue().get() > 0).map(e -> e.getKey().getHost() + " (" + e.getValue().get() + ")").collect(Collectors.joining(", "))
                ));
            }
            previewCounter = 0;
@@ -0,0 +1,143 @@
+package tn.mnlr.vripper.web.restendpoints;
+
+import lombok.Getter;
+import lombok.NoArgsConstructor;
+import lombok.NonNull;
+import lombok.Setter;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.http.CacheControl;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.MediaType;
+import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.*;
+import tn.mnlr.vripper.services.AppSettingsService;
+import tn.mnlr.vripper.services.PathService;
+import tn.mnlr.vripper.services.ThumbnailGenerator;
+
+import javax.imageio.ImageIO;
+import javax.imageio.ImageReader;
+import javax.imageio.stream.ImageInputStream;
+import javax.servlet.http.HttpServletResponse;
+import java.awt.*;
+import java.io.File;
+import java.nio.file.Files;
+import java.nio.file.Paths;
+import java.util.List;
+import java.util.*;
+import java.util.concurrent.TimeUnit;
+import java.util.stream.Collectors;
+
+@RestController
+@CrossOrigin(value = "*")
+public class GalleryEndpoint {
+
+    private static final Logger logger = LoggerFactory.getLogger(GalleryEndpoint.class);
+
+    @Autowired
+    private PathService pathService;
+
+    @Autowired
+    private ThumbnailGenerator thumbnailGenerator;
+
+    private static final String cacheControl = CacheControl.maxAge(365, TimeUnit.DAYS).getHeaderValue();
+    @Autowired
+    private AppSettingsService appSettingsService;
+
+    @ExceptionHandler(Exception.class)
+    public ResponseEntity handleException(Exception e) {
+        logger.error("Error when process request", e);
+        return ResponseEntity
+                .status(HttpStatus.INTERNAL_SERVER_ERROR)
+                .body(e.getMessage());
+    }
+
+    @GetMapping(value = "/image/{postId}/{imgName}", produces = {MediaType.IMAGE_JPEG_VALUE})
+    @ResponseStatus(value = HttpStatus.OK)
+    public ResponseEntity<byte[]> getImage(@PathVariable("postId") @NonNull String postId, @PathVariable("imgName") @NonNull String imgName, HttpServletResponse response) throws Exception {
+        if (!appSettingsService.isViewPhotos()) {
+            return new ResponseEntity("Gallery option is disabled", HttpStatus.BAD_REQUEST);
+        }
+        response.addHeader("Cache-Control", cacheControl);
+        File destinationFolder = pathService.getDownloadDestinationFolder(postId);
+        return ResponseEntity.ok(Files.readAllBytes(Paths.get(destinationFolder.toPath().toString(), imgName)));
+    }
+
+    @GetMapping(value = "/image/thumb/{postId}/{imgName}", produces = {MediaType.IMAGE_JPEG_VALUE})
+    @ResponseStatus(value = HttpStatus.OK)
+    public ResponseEntity<byte[]> getImageThumb(@PathVariable("postId") @NonNull String postId, @PathVariable("imgName") @NonNull String imgName, HttpServletResponse response) throws Exception {
+        if (!appSettingsService.isViewPhotos()) {
+            return new ResponseEntity("Gallery option is disabled", HttpStatus.BAD_REQUEST);
+        }
+        response.addHeader("Cache-Control", cacheControl);
+        File destinationFolder = pathService.getDownloadDestinationFolder(postId);
+        if (destinationFolder.exists() && destinationFolder.isDirectory()) {
+            return ResponseEntity.ok(thumbnailGenerator.getThumbnails().get(new ThumbnailGenerator.CacheKey(postId, imgName)));
+        }
+        return new ResponseEntity("Gallery does not exist in download location, you probably removed it", HttpStatus.BAD_REQUEST);
+    }
+
+    @GetMapping("/gallery/{postId}")
+    @ResponseStatus(value = HttpStatus.OK)
+    public ResponseEntity<List<GalleryImage>> getGallery(@PathVariable("postId") @NonNull String postId) {
+        if (!appSettingsService.isViewPhotos()) {
+            return new ResponseEntity("Gallery option is disabled", HttpStatus.BAD_REQUEST);
+        }
+        File destinationFolder = pathService.getDownloadDestinationFolder(postId);
+        if (destinationFolder.exists() && destinationFolder.isDirectory()) {
+            return ResponseEntity.ok(
+                    Arrays.stream(Objects.requireNonNull(destinationFolder.listFiles()))
+                            .filter(f -> !f.getName().endsWith("tmp"))
+                            .sorted(Comparator.comparing(File::getName))
+                            .map(GalleryImage::fromFile)
+                            .filter(Objects::nonNull)
+                            .collect(Collectors.toList())
+            );
+        }
+        return new ResponseEntity("Gallery does not exist in download location, you probably removed it", HttpStatus.BAD_REQUEST);
+    }
+}
+
+@Getter
+@Setter
+@NoArgsConstructor
+class GalleryImage {
+
+    private static final Logger logger = LoggerFactory.getLogger(GalleryImage.class);
+    private String src;
+    private String msrc;
+    private double w;
+    private double h;
+
+    public GalleryImage(String src, String msrc, double w, double h) {
+        this.src = src;
+        this.msrc = msrc;
+        this.w = w;
+        this.h = h;
+    }
+
+    public static GalleryImage fromFile(File file) {
+        Dimension dimension;
+        try (ImageInputStream in = ImageIO.createImageInputStream(file)) {
+            final Iterator<ImageReader> readers = ImageIO.getImageReaders(in);
+            if (readers.hasNext()) {
+                ImageReader reader = readers.next();
+                try {
+                    reader.setInput(in);
+                    dimension = new Dimension(reader.getWidth(0), reader.getHeight(0));
+                } finally {
+                    reader.dispose();
+                }
+            } else {
+                logger.error(String.format("No reader found for image %s", file.toString()));
+                return null;
+            }
+        } catch (Exception e) {
+            logger.error(String.format("Failed to create image object for %s", file.toString()), e);
+            return null;
+        }
+
+        return new GalleryImage(file.getName(), file.getName(), dimension.getWidth(), dimension.getHeight());
+    }
+}
@@ -56,7 +56,7 @@ public class SettingsRestEndpoint {
            } catch (ValidationException e) {
                return ResponseEntity
                        .status(HttpStatus.BAD_REQUEST)
-                        .body(new Response(e.getMessage()));
+                        .body(e.getMessage());
            }
            this.settings.setDownloadPath(settings.getDownloadPath());
            this.settings.setMaxThreads(settings.getMaxThreads());
@@ -79,6 +79,7 @@ public class SettingsRestEndpoint {
            this.settings.setSubLocation(settings.isSubLocation());
            this.settings.setThreadSubLocation(settings.isThreadSubLocation());
            this.settings.setClearCompleted(settings.isClearCompleted());
+            this.settings.setViewPhotos(settings.isViewPhotos());

            this.settings.save();

@@ -103,7 +104,8 @@ public class SettingsRestEndpoint {
                settings.isForceOrder(),
                settings.isSubLocation(),
                settings.isThreadSubLocation(),
-                settings.isClearCompleted()
+                settings.isClearCompleted(),
+                settings.isViewPhotos()
        );
    }

@@ -27,9 +27,14 @@
              "src/assets"
            ],
            "styles": [
-              "src/styles.scss"
+              "src/styles.scss",
+              "./node_modules/photoswipe/dist/photoswipe.css",
+              "./node_modules/photoswipe/dist/default-skin/default-skin.css"
            ],
-            "scripts": []
+            "scripts": [
+              "./node_modules/photoswipe/dist/photoswipe.min.js",
+              "./node_modules/photoswipe/dist/photoswipe-ui-default.min.js"
+            ]
          },
          "configurations": {
            "production": {
@@ -83,9 +88,14 @@
            "tsConfig": "src/tsconfig.spec.json",
            "karmaConfig": "src/karma.conf.js",
            "styles": [
-              "src/styles.scss"
+              "src/styles.scss",
+              "./node_modules/photoswipe/dist/photoswipe.css",
+              "./node_modules/photoswipe/dist/default-skin/default-skin.css"
+            ],
+            "scripts": [
+              "./node_modules/photoswipe/dist/photoswipe.min.js",
+              "./node_modules/photoswipe/dist/photoswipe-ui-default.min.js"
            ],
-            "scripts": [],
            "assets": [
              "src/favicon.ico",
              "src/assets"
@@ -1,6 +1,6 @@
 {
  "name": "vripper-ui",
-  "version": "2.5.1",
+  "version": "2.8.1",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
@@ -29,12 +29,13 @@
    "core-js": "^2.5.4",
    "hammerjs": "^2.0.8",
    "ngx-electron": "^2.2.0",
+    "photoswipe": "^4.1.3",
    "rxjs": "~6.5.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
-    "@angular-devkit/build-angular": "^0.803.20",
+    "@angular-devkit/build-angular": "^0.803.21",
    "@angular/cli": "~8.3.20",
    "@angular/compiler-cli": "^8.2.14",
    "@angular/language-service": "~8.2.14",
@@ -5,7 +5,7 @@
  <parent>
    <groupId>tn.mnlr</groupId>
    <artifactId>vripper</artifactId>
-    <version>2.5.1</version>
+    <version>2.8.1</version>
  </parent>
  <artifactId>vripper-ui</artifactId>
  <name>vripper-ui</name>
@@ -3,7 +3,7 @@ import { ClipboardService } from './clipboard.service';
 import { ElectronService } from 'ngx-electron';
 import { Component, OnDestroy, AfterViewInit, Renderer2, ChangeDetectionStrategy, NgZone } from '@angular/core';
 import { MatDialog } from '@angular/material';
-import { Subscription, BehaviorSubject, Subject } from 'rxjs';
+import { Subscription, BehaviorSubject, Subject, merge } from 'rxjs';
 import { WsConnectionService, WSState } from './ws-connection.service';

@Component({
@@ -39,9 +39,8 @@ export class AppComponent implements OnDestroy, AfterViewInit {
        }), 500);
      } else if (wsState === WSState.OPEN) {
        this.clipboardService.init();
-        this.appService
-          .loadTheme()
-          .subscribe(() => this.ngZone.run(() => this.appState.next('CONNECTED')));
+        merge(this.appService.loadTheme(), this.appService.loadSettings())
+        .subscribe(() => this.ngZone.run(() => this.appState.next('CONNECTED')));
      }
    }));
  }
@@ -1,3 +1,5 @@
+import { ContextMenuService } from './ctxt-menu.service';
+import { PostContextMenuComponent } from './posts/post-context-menu.component';
 import { PostsDataService } from './posts-data.service';
 import { AppPreviewDirective } from './common/preview-tooltip.directive';
 import { WsConnectionService } from './ws-connection.service';
@@ -36,6 +38,8 @@ import { SelectionService } from './selection-service';
 import { ToolbarComponent } from './toolbar/toolbar.component';
 import { GrabQueueComponent } from './grab-queue/grab-queue.component';
 import { UrlGrabRendererComponent } from './grab-queue/url-renderer.component';
+import { GalleryComponent } from './gallery/gallery.component';
+import { PhotoSwipeComponent } from './photo-swipe/photo-swipe.component';

@NgModule({
  declarations: [
@@ -57,7 +61,10 @@ import { UrlGrabRendererComponent } from './grab-queue/url-renderer.component';
    ScanComponent,
    StatusBarComponent,
    ToolbarComponent,
-    GrabQueueComponent
+    GrabQueueComponent,
+    PostContextMenuComponent,
+    GalleryComponent,
+    PhotoSwipeComponent
  ],
  entryComponents: [
    PostDetailComponent,
@@ -65,7 +72,9 @@ import { UrlGrabRendererComponent } from './grab-queue/url-renderer.component';
    ConfirmDialogComponent,
    AppPreviewComponent,
    ScanComponent,
-    MultiPostComponent
+    MultiPostComponent,
+    PostContextMenuComponent,
+    GalleryComponent
  ],
  imports: [
    BrowserAnimationsModule,
@@ -91,7 +100,8 @@ import { UrlGrabRendererComponent } from './grab-queue/url-renderer.component';
    ServerService,
    SharedService,
    SelectionService,
-    PostsDataService
+    PostsDataService,
+    ContextMenuService
  ],
  bootstrap: [AppComponent]
 })
@@ -1,11 +1,14 @@
+import { Settings } from './common/settings.model';
+import { environment } from 'src/environments/environment';
 import { MatDialog } from '@angular/material';
 import { HttpClient } from '@angular/common/http';
 import { Injectable, Renderer2 } from '@angular/core';
 import { ServerService } from './server-service';
 import { tap } from 'rxjs/operators';
 import { ScanComponent } from './scan/scan.component';
-import { Observable } from 'rxjs';
+import { Observable, Subject } from 'rxjs';
 import { BreakpointState, Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
+import { Title } from '@angular/platform-browser';

@Injectable()
 export class AppService {
@@ -14,10 +17,25 @@ export class AppService {
    private serverService: ServerService,
    public dialog: MatDialog,
    private breakpointObserver: BreakpointObserver,
-  ) {}
+    private titleService: Title
+  ) {
+    this.titleService.setTitle('VRipper ' + environment.version);
+  }
+
+  private _darkTheme = false;
+  private _settings: Settings;
+  private _renderer: Renderer2;
+
+  // private settings$: Subject<Settings> = new Subject();
+
+  get settings(): Settings {
+    return { ...this._settings };
+  }
+
+  get darkTheme(): boolean {
+    return this._darkTheme;
+  }

-  darkTheme = false;
-  _renderer: Renderer2;
  set renderer(renderer: Renderer2) {
    this._renderer = renderer;
  }
@@ -25,8 +43,8 @@ export class AppService {
  isExtraSmall: Observable<BreakpointState> = this.breakpointObserver.observe(Breakpoints.XSmall);

  updateTheme(darkTheme: boolean) {
-    this.darkTheme = darkTheme;
-    if (this.darkTheme) {
+    this._darkTheme = darkTheme;
+    if (this._darkTheme) {
      this._renderer.addClass(document.body, 'dark-theme');
      this._renderer.removeClass(document.body, 'light-theme');
    } else {
@@ -35,17 +53,27 @@ export class AppService {
    }
    this.httpClient
      .post<Theme>(this.serverService.baseUrl + '/settings/theme', {
-        darkTheme: this.darkTheme
+        darkTheme: this._darkTheme
      })
      .subscribe();
  }

+  updateSettings(settings: Settings) {
+    this._settings = settings;
+  }
+
  loadTheme() {
    return this.httpClient
      .get<Theme>(this.serverService.baseUrl + '/settings/theme')
      .pipe(tap(theme => this.updateTheme(theme.darkTheme)));
  }

+  loadSettings() {
+    return this.httpClient
+      .get<Settings>(this.serverService.baseUrl + '/settings')
+      .pipe(tap(settings => this.updateSettings(settings)));
+  }
+
  scan(url?: string) {

    const scanDialog = this.dialog.open(ScanComponent, {
@@ -10,28 +10,33 @@ export class AppPreviewDirective implements OnInit, OnDestroy {

  @Input() appPreview: string[];

-  constructor(private overlayPositionBuilder: OverlayPositionBuilder,
+  constructor(
+    private overlayPositionBuilder: OverlayPositionBuilder,
    private elementRef: ElementRef,
    private overlay: Overlay,
-    private ngZone: NgZone) {}
+    private ngZone: NgZone
+  ) {}

  ngOnInit() {
    const positionStrategy = this.overlayPositionBuilder
-    .flexibleConnectedTo(this.elementRef)
-    .withPush(true)
-    .withGrowAfterOpen(true)
-    .withPositions([{
-      originX: 'center',
-      originY: 'bottom',
-      overlayX: 'center',
-      overlayY: 'top',
-    }, {
-      originX: 'center',
-      originY: 'top',
-      overlayX: 'center',
-      overlayY: 'bottom',
-    }]);
-    this.overlayRef = this.overlay.create({ positionStrategy });
+      .flexibleConnectedTo(this.elementRef)
+      .withPush(true)
+      .withGrowAfterOpen(true)
+      .withPositions([
+        {
+          originX: 'center',
+          originY: 'bottom',
+          overlayX: 'center',
+          overlayY: 'top'
+        },
+        {
+          originX: 'center',
+          originY: 'top',
+          overlayX: 'center',
+          overlayY: 'bottom'
+        }
+      ]);
+    this.overlayRef = this.overlay.create({ positionStrategy, scrollStrategy: this.overlay.scrollStrategies.close() });
  }

  ngOnDestroy() {
@@ -7,4 +7,5 @@ export interface Settings {
    vPassword: string;
    vThanks: boolean;
    desktopClipboard: boolean;
+    viewPhotos: boolean;
  }
@@ -0,0 +1,68 @@
+import { PostState } from './posts/post-state.model';
+import { Injectable, ComponentRef } from '@angular/core';
+import { filter, take } from 'rxjs/operators';
+import { fromEvent, Subscription } from 'rxjs';
+import { OverlayPositionBuilder, Overlay, OverlayRef } from '@angular/cdk/overlay';
+import { ComponentPortal } from '@angular/cdk/portal';
+import { PostContextMenuComponent } from './posts/post-context-menu.component';
+
+@Injectable()
+export class ContextMenuService {
+  constructor(private overlayPositionBuilder: OverlayPositionBuilder, private overlay: Overlay) {}
+
+  postCtxtMenuPortal = new ComponentPortal(PostContextMenuComponent);
+  private postCtxtMenuOverlayRef: OverlayRef;
+  sub: Subscription;
+
+  openPostCtxtMenu(mouseEvent: MouseEvent, postState: PostState) {
+    mouseEvent.preventDefault();
+    this.closePostCtxtMenu();
+    const positionStrategy = this.overlayPositionBuilder
+      .flexibleConnectedTo({ x: mouseEvent.x, y: mouseEvent.y })
+      .withPush(true)
+      .withGrowAfterOpen(true)
+      .withPositions([
+        {
+          originX: 'start',
+          originY: 'bottom',
+          overlayX: 'start',
+          overlayY: 'top'
+        },
+        {
+          originX: 'start',
+          originY: 'top',
+          overlayX: 'start',
+          overlayY: 'bottom'
+        }
+      ]);
+    this.postCtxtMenuOverlayRef = this.overlay.create({
+      positionStrategy
+    });
+    const ref: ComponentRef<PostContextMenuComponent> = this.postCtxtMenuOverlayRef.attach(this.postCtxtMenuPortal);
+    ref.instance.postState = postState;
+    ref.instance.contextMenuService = this;
+    this.sub = fromEvent<MouseEvent>(document, 'click')
+      .pipe(
+        filter(event => {
+          const clickTarget = event.target as HTMLElement;
+          return !!this.postCtxtMenuOverlayRef && !this.postCtxtMenuOverlayRef.overlayElement.contains(clickTarget);
+        }),
+        take(1)
+      )
+      .subscribe(() => this.closePostCtxtMenu());
+  }
+
+  closePostCtxtMenu() {
+    if (this.sub != null) {
+      this.sub.unsubscribe();
+    }
+    if (this.postCtxtMenuOverlayRef) {
+      this.postCtxtMenuOverlayRef.dispose();
+      this.postCtxtMenuOverlayRef = null;
+    }
+  }
+}
+
+export interface Theme {
+  darkTheme: boolean;
+}
@@ -0,0 +1,26 @@
+<div class="dialog-container" fxLayout="column" style="height: 100%;">
+  <div fxFlex="nogrow">
+    <h2 class="no-wrap" mat-dialog-title>{{ dialogData.title }}</h2>
+  </div>
+  <mat-dialog-content fxFlex="grow">
+    <div class="container">
+      <div class="masonry ">
+        <ng-container *ngFor="let img of images | async; let i=index">
+          <figure class="masonry-brick " fxLayout="row" fxLayoutAlign="center center"
+                  style="position: relative; cursor: pointer;">
+            <mat-progress-spinner *ngIf="!img._initialized" mode="indeterminate"
+                                  style="position: absolute;"></mat-progress-spinner>
+            <img (click)="openSlideshow(i)" (load)="loaded(img)" [src]="img.msrc"/>
+          </figure>
+        </ng-container>
+        <app-photo-swipe #photoSwipe></app-photo-swipe>
+      </div>
+    </div>
+  </mat-dialog-content>
+  <mat-dialog-actions align="end" fxFlex="nogrow">
+    <button (click)="refresh()" color="primary" mat-raised-button>
+      <mat-icon>refresh</mat-icon>
+      <span>Refresh</span></button>
+    <button mat-dialog-close mat-raised-button>Close</button>
+  </mat-dialog-actions>
+</div>
@@ -0,0 +1,25 @@
+.container {
+  height: 100%;
+}
+
+.masonry {
+  display: flex;
+  flex-flow: row wrap;
+  margin-left: -8px;
+  width: 100%;
+}
+
+.masonry-brick {
+  flex: auto;
+  height: 250px;
+  min-width: 150px;
+  margin: 0 8px 8px 0;
+}
+
+img {
+  height: 250px;
+  width: auto;
+}
+
+figure {
+}
@@ -0,0 +1,87 @@
+import { IImage, PhotoSwipeComponent } from './../photo-swipe/photo-swipe.component';
+import { Component, OnInit, ChangeDetectionStrategy, Inject, NgZone, OnDestroy, ViewChild } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { MatDialogRef, MAT_DIALOG_DATA, MatSnackBar } from '@angular/material';
+import { ServerService } from '../server-service';
+import { PostState } from '../posts/post-state.model';
+import { BehaviorSubject, Subject } from 'rxjs';
+
+class Image extends IImage {
+  constructor(public src: string, public msrc: string, public w: number, public h: number, public _initialized: boolean) {
+    super(src, msrc, w, h);
+  }
+}
+
+@Component({
+  selector: 'app-gallery',
+  templateUrl: './gallery.component.html',
+  styleUrls: ['./gallery.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class GalleryComponent implements OnInit, OnDestroy {
+  constructor(
+    public dialogRef: MatDialogRef<GalleryComponent>,
+    @Inject(MAT_DIALOG_DATA) public dialogData: PostState,
+    private httpClient: HttpClient,
+    private serverService: ServerService,
+    private _snackBar: MatSnackBar,
+    private ngZone: NgZone
+  ) {}
+
+  images: Subject<Image[]> = new BehaviorSubject([]);
+  _images: Image[] = [];
+
+  @ViewChild('photoSwipe', { static: true }) photoSwipe: PhotoSwipeComponent;
+
+  loaded(img: Image) {
+    img._initialized = true;
+  }
+
+  ngOnInit() {
+    this.refresh();
+  }
+
+  ngOnDestroy() {}
+
+  openSlideshow(index: number) {
+    this.photoSwipe.openGallery(this._images, {
+      index: index,
+      getThumbBoundsFn: this.getThumbBoundsFn,
+      showHideOpacity: true,
+      preload: [1, 8]
+    });
+  }
+
+  getThumbBoundsFn(index: number) {
+    // See Options -> getThumbBoundsFn section of documentation for more info
+    const thumbnail = document.querySelectorAll('.masonry-brick img')[index],
+      pageYScroll = window.pageYOffset || document.documentElement.scrollTop,
+      rect = thumbnail.getBoundingClientRect();
+
+    return { x: rect.left, y: rect.top + pageYScroll, w: rect.width };
+  }
+
+  refresh() {
+    this.httpClient.get<Image[]>(this.serverService.baseUrl + '/gallery/' + this.dialogData.postId).subscribe(
+      response => {
+        this.ngZone.run(() => {
+          response.forEach(i => {
+            i.src = this.serverService.baseUrl + '/image/' + this.dialogData.postId + '/' + i.src;
+            i.msrc = this.serverService.baseUrl + '/image/thumb/' + this.dialogData.postId + '/' + i.msrc;
+            i._initialized = false;
+          });
+          this._images = response;
+          this.images.next(this._images);
+        });
+      },
+      error => {
+        this.ngZone.run(() => {
+          this.dialogRef.close();
+          this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+            duration: 5000
+          });
+        });
+      }
+    );
+  }
+}
@@ -18,6 +18,7 @@ export class GrabQueueComponent implements OnInit {
          field: 'link',
          sortable: true,
          sort: 'asc',
+          suppressMovable: true,
          cellRenderer: 'urlCellRenderer'
        }
      ],
@@ -14,9 +14,13 @@ import { HttpClient } from '@angular/common/http';
  selector: 'app-url-cell-grab',
  template: `
    <div fxLayout="row" fxLayoutAlign="space-between center">
-      <span><a (click)="goTo()" href="javascript:void(0)">{{ grabQueue.link }}</a></span>
+      <span style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"
+        ><a (click)="goTo()" href="javascript:void(0)">{{ grabQueue.link }}</a></span
+      >
      <span>
-        <button style="margin-right: 5px" (click)="grab()" color="primary" mat-mini-fab><mat-icon>get_app</mat-icon></button>
+        <button style="margin-right: 5px" (click)="grab()" color="primary" mat-mini-fab>
+          <mat-icon>get_app</mat-icon>
+        </button>
        <button (click)="remove()" color="primary" mat-mini-fab><mat-icon>delete</mat-icon></button>
      </span>
    </div>
@@ -5,3 +5,45 @@ table {
 :host ::ng-deep .mat-tab-body-wrapper {
  height: 100%;
 }
+
+.app-custom-plain-container-with-desc {
+  align-items: center;
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-start;
+  flex-wrap: wrap;
+
+  figure {
+    margin: 0;
+    position: relative;
+
+    img {
+      max-width: 100%;
+      height: auto;
+      cursor: pointer;
+    }
+
+    figcaption {
+      background: rgba(0, 0, 0, .5);
+      color: #fff;
+      font-size: 85%;
+      padding: 5px;
+      position: absolute;
+      bottom: 3px;
+      left: 0;
+      right: 0;
+    }
+  }
+
+  .description {
+    font-weight: 400;
+    text-align: center;
+  }
+
+  .app-custom-image-with-desc {
+    height: auto;
+    margin-right: 2px;
+    width: 200px;
+    align-self: start;
+  }
+}
@@ -15,7 +15,9 @@ import {
    MatSnackBar,
    MatTabsModule,
    MatDividerModule,
-    MatChipsModule
+    MatChipsModule,
+    MatListModule,
+    MatProgressSpinnerModule
 } from '@angular/material';

@NgModule({
@@ -34,7 +36,9 @@ import {
        MatSnackBarModule,
        MatTabsModule,
        MatDividerModule,
-        MatChipsModule
+        MatChipsModule,
+        MatListModule,
+        MatProgressSpinnerModule
    ],
    providers: [MatSnackBar]
 })
@@ -14,7 +14,7 @@ import { MatSnackBar, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
 import { GridOptions, RowNode } from 'ag-grid-community';
 import { UrlRendererComponent } from './url-renderer.component';
 import { WsHandler } from '../ws-handler';
-import { Subscription, concat, merge, BehaviorSubject, Subject } from 'rxjs';
+import { Subscription, BehaviorSubject, Subject } from 'rxjs';
 import { HttpClient } from '@angular/common/http';
 import { ServerService } from '../server-service';
 import { GrabQueueState } from '../grab-queue/grab-queue.model';
@@ -54,6 +54,7 @@ export class MultiPostComponent implements OnInit, OnDestroy, AfterViewInit {
          field: 'number',
          cellClass: 'no-padding',
          maxWidth: 100,
+          suppressMovable: true,
          checkboxSelection: true,
          headerCheckboxSelection: true,
          headerCheckboxSelectionFilteredOnly: false,
@@ -62,17 +63,20 @@ export class MultiPostComponent implements OnInit, OnDestroy, AfterViewInit {
        {
          headerName: 'Title',
          field: 'title',
+          suppressMovable: true,
          cellClass: 'no-padding'
        },
        {
          headerName: 'URL',
          field: 'url',
          cellClass: 'no-padding',
+          suppressMovable: true,
          cellRenderer: 'urlCellRenderer'
        },
        {
          headerName: 'Hosts',
          field: 'hosts',
+          suppressMovable: true,
          cellClass: 'no-padding'
        }
      ],
@@ -118,18 +122,18 @@ export class MultiPostComponent implements OnInit, OnDestroy, AfterViewInit {
      threadId: this.dialogData.threadId
    }));

-    merge(
-      this.httpClient.post(this.serverService.baseUrl + '/post/add', data),
-      this.httpClient.post(this.serverService.baseUrl + '/grab/remove', { url: this.dialogData.link })
-    )
-      .pipe(finalize(() => {
-        this.dialogRef.close();
-        this.loading.emit(false);
-      }))
+    this.httpClient
+      .post(this.serverService.baseUrl + '/post/add', data)
+      .pipe(
+        finalize(() => {
+          this.dialogRef.close();
+          this.loading.emit(false);
+        })
+      )
      .subscribe(
        () => {},
        error => {
-          this._snackBar.open(error.error, null, {
+          this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
            duration: 5000
          });
        }
@@ -0,0 +1,51 @@
+<!-- Root element of PhotoSwipe. Must have class pswp. -->
+<div #photoSwipe aria-hidden="true" class="pswp" role="dialog" tabindex="-1">
+  <!-- Background of PhotoSwipe.
+   It's a separate element as animating opacity is faster than rgba(). -->
+  <div class="pswp__bg"></div>
+
+  <!-- Slides wrapper with overflow:hidden. -->
+  <div class="pswp__scroll-wrap">
+    <!-- Container that holds slides.
+      PhotoSwipe keeps only 3 of them in the DOM to save memory.
+      Don't modify these 3 pswp__item elements, data is added later on. -->
+    <div class="pswp__container">
+      <div class="pswp__item"></div>
+      <div class="pswp__item"></div>
+      <div class="pswp__item"></div>
+    </div>
+
+    <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
+    <div class="pswp__ui pswp__ui--hidden">
+      <div class="pswp__top-bar">
+        <!--  Controls are self-explanatory. Order can be changed. -->
+
+        <div class="pswp__counter"></div>
+
+        <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
+
+        <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
+
+        <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
+
+        <!-- Preloader demo https://codepen.io/dimsemenov/pen/yyBWoR -->
+        <!-- element will get class pswp__preloader--active when preloader is running -->
+        <div class="pswp__preloader">
+          <div class="pswp__preloader__icn">
+            <div class="pswp__preloader__cut">
+              <div class="pswp__preloader__donut"></div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
+
+      <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
+
+      <div class="pswp__caption">
+        <div class="pswp__caption__center"></div>
+      </div>
+    </div>
+  </div>
+</div>
@@ -0,0 +1,23 @@
+import { Component, ViewChild, ElementRef, Input } from '@angular/core';
+
+import PhotoSwipe from 'photoswipe';
+import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default';
+
+export class IImage {
+  constructor(public src: string, public msrc: string, public w: number, public h: number) {}
+}
+
+@Component({
+  selector: 'app-photo-swipe',
+  templateUrl: './photo-swipe.component.html',
+  styleUrls: ['./photo-swipe.component.css']
+})
+export class PhotoSwipeComponent {
+  @ViewChild('photoSwipe', { static: true }) photoSwipe: ElementRef;
+
+  openGallery(images: IImage[], options?: any) {
+    options = { ...options, history: false };
+    const gallery = new PhotoSwipe(this.photoSwipe.nativeElement, PhotoSwipeUI_Default, images, options);
+    gallery.init();
+  }
+}
@@ -27,6 +27,7 @@ export class PostDetailComponent implements OnInit, OnDestroy {
          field: 'index',
          sortable: true,
          sort: 'asc',
+          suppressMovable: true,
          cellClass: 'col-white',
          width: 10
        },
@@ -34,6 +35,7 @@ export class PostDetailComponent implements OnInit, OnDestroy {
          headerName: 'URL',
          field: 'url',
          sortable: true,
+          suppressMovable: true,
          cellRenderer: 'progressCellRenderer',
          cellClass: 'no-padding'
        }
@@ -0,0 +1,249 @@
+import { AppService } from './../app.service';
+import { GalleryComponent } from './../gallery/gallery.component';
+import { ServerService } from './../server-service';
+import { HttpClient } from '@angular/common/http';
+import { ElectronService } from 'ngx-electron';
+import { Component, ChangeDetectionStrategy, NgZone, OnDestroy } from '@angular/core';
+import { trigger, state, style, transition, animate } from '@angular/animations';
+import { MatDialog, MatSnackBar } from '@angular/material';
+import { PostDetailComponent } from '../post-detail/post-detail.component';
+import { Observable, Subject, BehaviorSubject, Subscription } from 'rxjs';
+import { BreakpointState, BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
+import { PostState } from './post-state.model';
+import { DownloadPath } from '../common/download-path.model';
+import { ContextMenuService } from '../ctxt-menu.service';
+import { ConfirmDialogComponent } from '../common/confirmation-component/confirmation-dialog';
+import { filter, flatMap } from 'rxjs/operators';
+import { RemoveResponse } from '../common/remove-response.model';
+
+@Component({
+  selector: 'app-post-ctx-menu',
+  template: `
+    <mat-card class="mat-elevation-z4">
+      <mat-action-list>
+        <button
+          (click)="restart()"
+          *ngIf="
+            (postState.status === 'COMPLETE' && postState.progress !== 100) ||
+            postState.status === 'ERROR' ||
+            postState.status === 'STOPPED'
+          "
+          mat-list-item
+        >
+          <mat-icon>play_arrow</mat-icon>
+          <span>Start</span>
+        </button>
+        <button
+          (click)="stop()"
+          *ngIf="postState.status === 'DOWNLOADING' || postState.status === 'PARTIAL' || postState.status === 'PENDING'"
+          mat-list-item
+        >
+          <mat-icon>stop</mat-icon>
+          <span>Stop</span>
+        </button>
+        <button (click)="remove()" mat-list-item>
+          <mat-icon>delete</mat-icon>
+          <span>Remove</span>
+        </button>
+        <button (click)="seeDetails()" mat-list-item>
+          <mat-icon>list</mat-icon>
+          <span>Files</span>
+        </button>
+        <button *ngIf="isViewEnabled | async" (click)="openGallery()" mat-list-item>
+          <mat-icon>photo_library</mat-icon>
+          <span>View Photos</span>
+        </button>
+        <button (click)="open()" *ngIf="electronService.isElectronApp" mat-list-item>
+          <mat-icon>open_in_new</mat-icon>
+          <span>Download Location</span>
+        </button>
+      </mat-action-list>
+    </mat-card>
+  `,
+  styles: [
+    `
+      mat-card {
+        padding: 0 0 8px 0;
+      }
+      mat-icon {
+        margin-right: 5px;
+      }
+    `
+  ],
+  animations: [
+    trigger('simpleFadeAnimation', [
+      state('in', style({ opacity: 1 })),
+
+      transition(':enter', [style({ opacity: 0 }), animate(300)])
+    ])
+  ],
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class PostContextMenuComponent {
+  postState: PostState;
+  isExtraSmall: Observable<BreakpointState> = this.breakpointObserver.observe(Breakpoints.XSmall);
+  fs;
+  contextMenuService: ContextMenuService;
+  constructor(
+    public electronService: ElectronService,
+    private dialog: MatDialog,
+    private breakpointObserver: BreakpointObserver,
+    private httpClient: HttpClient,
+    private serverService: ServerService,
+    private _snackBar: MatSnackBar,
+    private ngZone: NgZone,
+    private appService: AppService
+  ) {
+    if (this.electronService.isElectronApp) {
+      this.fs = this.electronService.remote.require('fs');
+    }
+    this.isViewEnabled.next(this.appService.settings.viewPhotos);
+  }
+
+  isViewEnabled: Subject<boolean> = new BehaviorSubject(false);
+  restart() {
+    this.contextMenuService.closePostCtxtMenu();
+    this.httpClient.post(this.serverService.baseUrl + '/post/restart', [this.postState.postId]).subscribe(
+      () => {
+        this._snackBar.open('Download started', null, {
+          duration: 5000
+        });
+      },
+      error => {
+        this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+          duration: 5000
+        });
+      }
+    );
+  }
+
+  remove() {
+    this.contextMenuService.closePostCtxtMenu();
+    this.ngZone.run(() => {
+      this.dialog
+        .open(ConfirmDialogComponent, {
+          maxHeight: '100vh',
+          maxWidth: '100vw',
+          height: '200px',
+          width: '60%',
+          data: { header: 'Confirmation', content: 'Are you sure you want to remove this item ?' }
+        })
+        .afterClosed()
+        .pipe(
+          filter(e => e === 'yes'),
+          flatMap(e =>
+            this.httpClient.post<RemoveResponse>(this.serverService.baseUrl + '/post/remove', [this.postState.postId])
+          )
+        )
+        .subscribe(
+          () => {},
+          error => {
+            this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+              duration: 5000
+            });
+          }
+        );
+    });
+  }
+
+  stop() {
+    this.contextMenuService.closePostCtxtMenu();
+    this.httpClient.post(this.serverService.baseUrl + '/post/stop', [this.postState.postId]).subscribe(
+      () => {
+        this._snackBar.open('Download stopped', null, {
+          duration: 5000
+        });
+      },
+      error => {
+        this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+          duration: 5000
+        });
+      }
+    );
+  }
+
+  seeDetails() {
+    this.contextMenuService.closePostCtxtMenu();
+    this.ngZone.run(() => {
+      const dialogRef = this.dialog.open(PostDetailComponent, {
+        width: '90%',
+        height: '90%',
+        maxWidth: '100vw',
+        maxHeight: '100vh',
+        data: this.postState
+      });
+
+      const smallDialogSubscription = this.isExtraSmall.subscribe(result => {
+        if (result.matches) {
+          dialogRef.updateSize('100%', '100%');
+        } else {
+          dialogRef.updateSize('90%', '90%');
+        }
+      });
+
+      dialogRef.afterClosed().subscribe(() => {
+        if (smallDialogSubscription != null) {
+          smallDialogSubscription.unsubscribe();
+        }
+      });
+    });
+  }
+
+  openGallery() {
+    this.contextMenuService.closePostCtxtMenu();
+    this.ngZone.run(() => {
+      const dialogRef = this.dialog.open(GalleryComponent, {
+        width: '90%',
+        height: '90%',
+        maxWidth: '100vw',
+        maxHeight: '100vh',
+        data: this.postState
+      });
+
+      const smallDialogSubscription = this.isExtraSmall.subscribe(result => {
+        if (result.matches) {
+          dialogRef.updateSize('100%', '100%');
+        } else {
+          dialogRef.updateSize('90%', '90%');
+        }
+      });
+
+      dialogRef.afterClosed().subscribe(() => {
+        if (smallDialogSubscription != null) {
+          smallDialogSubscription.unsubscribe();
+        }
+      });
+    });
+  }
+
+  open() {
+    this.contextMenuService.closePostCtxtMenu();
+    if (!this.electronService.isElectronApp) {
+      console.error('Cannot open downloader folder, not electron app');
+      return;
+    }
+    // Request the server to give the correct file location
+    this.httpClient.get<DownloadPath>(this.serverService.baseUrl + '/post/path/' + this.postState.postId).subscribe(
+      path => {
+        if (this.fs.existsSync(path.path)) {
+          this.electronService.shell.openItem(path.path);
+        } else {
+          if (this.postState.done <= 0) {
+            this._snackBar.open('Download has not been started yet for this post', null, {
+              duration: 5000
+            });
+          } else {
+            this._snackBar.open(path.path + ' does not exist, you probably removed it', null, {
+              duration: 5000
+            });
+          }
+        }
+      },
+      error => {
+        this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+          duration: 5000
+        });
+      }
+    );
+  }
+}
@@ -1,4 +1,4 @@
-<div class="container" style="height: 100%; background-color: white">
+<div (contextmenu)="context($event)" class="container" style="height: 100%; background-color: white">
  <ng-container *ngIf="postState$ | async as postState">
    <div
      [ngClass]="{
@@ -28,19 +28,6 @@
          >{{ postState.done + '/' + postState.total }} from {{ postState.hosts }}</span
          >
        </span>
-        <button [matMenuTriggerFor]="menu" fxFlex="nogrow" mat-icon-button>
-          <mat-icon>more_vert</mat-icon>
-        </button>
-        <mat-menu #menu="matMenu">
-          <button (click)="seeDetails()" mat-menu-item>
-            <mat-icon>list</mat-icon>
-            <span>Files</span>
-          </button>
-          <button (click)="open()" *ngIf="electronService.isElectronApp" mat-menu-item>
-            <mat-icon>open_in_new</mat-icon>
-            <span>Download Location</span>
-          </button>
-        </mat-menu>
      </div>
      <div class="progress-bar" color="accent" style="position: absolute; width: 100%; top: 37px; padding: 0 10px">
        <mat-progress-bar *ngIf="(loaded | async)" [value]="postState.progress" color="primary"
@@ -5,6 +5,7 @@
 .row-text {
    white-space: nowrap; 
    overflow: hidden;
+    padding-right: 15px;
 }

 .row-text > span {
@@ -7,19 +7,15 @@ import {
  NgZone,
  ChangeDetectionStrategy,
  AfterViewInit,
-  EventEmitter
+  EventEmitter,
 } from '@angular/core';
 import { AgRendererComponent } from 'ag-grid-angular';
-import { Subscription, Observable, BehaviorSubject, Subject } from 'rxjs';
+import { Subscription, BehaviorSubject, Subject } from 'rxjs';
 import { WsHandler } from '../ws-handler';
-import { ICellRendererParams } from 'ag-grid-community';
+import { ICellRendererParams, RowNode, GridApi } from 'ag-grid-community';
 import { ElectronService } from 'ngx-electron';
-import { BreakpointState, Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
-import { MatDialog, MatSnackBar } from '@angular/material';
-import { PostDetailComponent } from '../post-detail/post-detail.component';
-import { HttpClient } from '@angular/common/http';
-import { ServerService } from '../server-service';
-import { DownloadPath } from '../common/download-path.model';
+import { MatDialog } from '@angular/material';
+import { ContextMenuService } from '../ctxt-menu.service';

@Component({
  selector: 'app-progress-cell',
@@ -32,16 +28,9 @@ export class PostProgressRendererComponent implements AgRendererComponent, OnIni
    private wsConnectionService: WsConnectionService,
    private zone: NgZone,
    public electronService: ElectronService,
-    private breakpointObserver: BreakpointObserver,
    public dialog: MatDialog,
-    private httpClient: HttpClient,
-    private serverService: ServerService,
-    private _snackBar: MatSnackBar
-  ) {
+    private contextMenuService: ContextMenuService) {
    this.websocketHandlerPromise = this.wsConnectionService.getConnection();
-    if (this.electronService.isElectronApp) {
-      this.fs = this.electronService.remote.require('fs');
-    }
  }

  websocketHandlerPromise: Promise<WsHandler>;
@@ -49,10 +38,10 @@ export class PostProgressRendererComponent implements AgRendererComponent, OnIni
  private postState: PostState;
  updatesSubscription: Subscription;
  expanded = false;
-  isExtraSmall: Observable<BreakpointState> = this.breakpointObserver.observe(Breakpoints.XSmall);
-  fs;
  loaded: Subject<boolean> = new BehaviorSubject(false);
  loading;
+  node: RowNode;
+  gridApi: GridApi;

  trunc(value: number): number {
    return Math.trunc(value);
@@ -86,6 +75,8 @@ export class PostProgressRendererComponent implements AgRendererComponent, OnIni
  }

  agInit(params: ICellRendererParams): void {
+    this.node = params.node;
+    this.gridApi = params.api;
    this.postState = params.data;
  }

@@ -103,55 +94,9 @@ export class PostProgressRendererComponent implements AgRendererComponent, OnIni
    }
  }

-  seeDetails() {
-    const dialogRef = this.dialog.open(PostDetailComponent, {
-      width: '90%',
-      height: '90%',
-      maxWidth: '100vw',
-      maxHeight: '100vh',
-      data: this.postState
-    });
-
-    const smallDialogSubscription = this.isExtraSmall.subscribe(result => {
-      if (result.matches) {
-        dialogRef.updateSize('100%', '100%');
-      } else {
-        dialogRef.updateSize('90%', '90%');
-      }
-    });
-
-    dialogRef.afterClosed().subscribe(() => {
-      if (smallDialogSubscription != null) {
-        smallDialogSubscription.unsubscribe();
-      }
-    });
-  }
-
-  open() {
-    if (!this.electronService.isElectronApp) {
-      console.error('Cannot open downloader folder, not electron app');
-      return;
-    }
-    // Request the server to give the correct file location
-    this.httpClient.get<DownloadPath>(this.serverService.baseUrl + '/post/path/' + this.postState.postId).subscribe(
-      path => {
-        if (this.fs.existsSync(path.path)) {
-          this.electronService.shell.openItem(path.path);
-        } else {
-          if (this.postState.done <= 0) {
-            this._snackBar.open('Download has not been started yet for this post', null, {
-              duration: 5000
-            });
-          } else {
-            this._snackBar.open(path.path + ' does not exist, you probably removed it', null, {
-              duration: 5000
-            });
-          }
-        }
-      },
-      error => {
-        console.error(error);
-      }
-    );
+  context(event: MouseEvent) {
+    this.gridApi.getSelectedNodes().forEach(e => e.setSelected(false));
+    this.node.setSelected(true);
+    this.contextMenuService.openPostCtxtMenu(event, this.postState);
  }
 }
@@ -6,6 +6,7 @@ import { WsConnectionService } from '../ws-connection.service';
 import { GridOptions } from 'ag-grid-community';
 import { PostProgressRendererComponent } from './post-progress.renderer.component';
 import { Subject } from 'rxjs';
+import { ContextMenuService } from '../ctxt-menu.service';

@Component({
  selector: 'app-posts',
@@ -17,7 +18,8 @@ export class PostsComponent implements OnInit, OnDestroy, AfterViewInit {
    private wsConnection: WsConnectionService,
    private zone: NgZone,
    private selectionService: SelectionService,
-    private postsDataService: PostsDataService
+    private postsDataService: PostsDataService,
+    private contextMenuService: ContextMenuService
  ) {
    this.gridOptions = <GridOptions>{
      columnDefs: [
@@ -28,10 +30,12 @@ export class PostsComponent implements OnInit, OnDestroy, AfterViewInit {
          cellRenderer: 'progressCellRenderer',
          cellClass: 'no-padding',
          sort: 'asc',
+          suppressMovable: true,
          headerCheckboxSelection: true,
          headerCheckboxSelectionFilteredOnly: true
        }
      ],
+      rowBuffer: 200,
      rowHeight: 48,
      animateRows: true,
      rowSelection: 'multiple',
@@ -50,7 +54,8 @@ export class PostsComponent implements OnInit, OnDestroy, AfterViewInit {
      },
      onGridSizeChanged: () => this.gridOptions.api.sizeColumnsToFit(),
      onRowDataUpdated: () => this.gridOptions.api.sizeColumnsToFit(),
-      onSelectionChanged: () => this.selectionService.onSelectionChanged(this.gridOptions.api.getSelectedNodes())
+      onSelectionChanged: () => this.selectionService.onSelectionChanged(this.gridOptions.api.getSelectedNodes()),
+      onBodyScroll: () => this.contextMenuService.closePostCtxtMenu()
    };
  }

@@ -42,8 +42,12 @@
            >Save posts in sub folders
            </mat-checkbox>

-            <mat-checkbox *ngIf="generalSettingsForm.get('subLocation').value" color="primary"
-                          formControlName="threadSubLocation" name="threadSubLocation" style="margin-left: 15px"
+            <mat-checkbox
+              *ngIf="generalSettingsForm.get('subLocation').value"
+              color="primary"
+              formControlName="threadSubLocation"
+              name="threadSubLocation"
+              style="margin-left: 15px"
            >Create a subfolder per thread
            </mat-checkbox>

@@ -52,13 +56,17 @@
            </mat-checkbox>

            <mat-checkbox color="primary" formControlName="autoStart" name="autoStart"
-              >Auto start downloads</mat-checkbox
-            >
+            >Auto start downloads
+            </mat-checkbox>

            <mat-checkbox color="primary" formControlName="clearCompleted" name="clearCompleted"
            >Clear Finished
            </mat-checkbox>

+            <mat-checkbox color="primary" formControlName="viewPhotos" name="viewPhotos">
+              Enable View photo in gallery option
+            </mat-checkbox>
+
            <mat-slide-toggle color="primary" formControlName="vLogin" name="vLogin">
              ViperGirls Authentication
            </mat-slide-toggle>
@@ -66,7 +74,7 @@
            <section *ngIf="generalSettingsForm.get('vLogin').value">
              <div>
                <mat-form-field>
-                  <input formControlName="vUsername" matInput placeholder="ViperGirls Username" name="vUsername" />
+                  <input formControlName="vUsername" matInput name="vUsername" placeholder="ViperGirls Username"/>
                </mat-form-field>

                <mat-form-field>
@@ -104,7 +112,8 @@
      [disabled]="
        (generalSettingsForm.pristine && desktopSettingsForm.pristine) ||
        generalSettingsForm.invalid ||
-        desktopSettingsForm.invalid
+        desktopSettingsForm.invalid ||
+        loading
      "
    >
      Apply
@@ -1,3 +1,4 @@
+import { finalize } from 'rxjs/operators';
 import { AppService } from './../app.service';
 import { ClipboardService } from './../clipboard.service';
 import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
@@ -25,6 +26,8 @@ export class SettingsComponent implements OnInit {
    private appService: AppService
  ) {}

+  loading = false;
+
  generalSettingsForm = new FormGroup({
    downloadPath: new FormControl(''),
    maxThreads: new FormControl(''),
@@ -37,6 +40,7 @@ export class SettingsComponent implements OnInit {
    vUsername: new FormControl(''),
    vPassword: new FormControl(''),
    vThanks: new FormControl(false),
+    viewPhotos: new FormControl(false)
  });

  desktopSettingsForm = new FormGroup({
@@ -49,6 +53,10 @@ export class SettingsComponent implements OnInit {
    this.appService.updateTheme(this.darkTheme);
  }

+  updateSettings(settings: Settings) {
+    this.appService.updateSettings(settings);
+  }
+
  ngOnInit() {
    this.darkTheme = this.appService.darkTheme;
    this.httpClient.get<Settings>(this.serverService.baseUrl + '/settings').subscribe(
@@ -57,33 +65,35 @@ export class SettingsComponent implements OnInit {
        this.desktopSettingsForm.reset(data);
      },
      error => {
-        console.error(error);
+        this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+          duration: 5000
+        });
      }
    );
  }

  browse() {
-    this.electronService.remote.dialog.showOpenDialog(
-      this.electronService.remote.getCurrentWindow(),
-      {
+    this.electronService.remote.dialog
+      .showOpenDialog(this.electronService.remote.getCurrentWindow(), {
        properties: ['openDirectory']
-      }
-    ).then((value: OpenDialogReturnValue) => {
-      if (value.filePaths !== undefined) {
-        this.generalSettingsForm.get('downloadPath').setValue(value.filePaths[0]);
-        this.generalSettingsForm.get('downloadPath').markAsDirty();
-        this.generalSettingsForm.get('downloadPath').markAsTouched();
-      }
-    });
-
+      })
+      .then((value: OpenDialogReturnValue) => {
+        if (value.filePaths !== undefined) {
+          this.generalSettingsForm.get('downloadPath').setValue(value.filePaths[0]);
+          this.generalSettingsForm.get('downloadPath').markAsDirty();
+          this.generalSettingsForm.get('downloadPath').markAsTouched();
+        }
+      });
  }

  onSubmit(): void {
+    this.loading = true;
    this.httpClient
      .post<Settings>(this.serverService.baseUrl + '/settings', {
        ...this.generalSettingsForm.value,
        ...this.desktopSettingsForm.value
      })
+      .pipe(finalize(() => (this.loading = false)))
      .subscribe(
        data => {
          this._snackBar.open('Settings updated', null, {
@@ -92,6 +102,7 @@ export class SettingsComponent implements OnInit {
          this.generalSettingsForm.reset(data);
          this.desktopSettingsForm.reset(data);
          this.clipboardService.init(data);
+          this.updateSettings(data);
        },
        error => {
          this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
@@ -28,7 +28,7 @@
    <div fxFlex="grow" id="global-search">
      <form autocomplete="off">
        <mat-form-field style="width: 100%">
-          <input (ngModelChange)="search($event)" matInput name="search" ngModel/>
+          <input (ngModelChange)="search($event)" matInput name="search" ngModel placeholder="Search"/>
          <mat-icon matSuffix>search</mat-icon>
        </mat-form-field>
      </form>
@@ -101,7 +101,9 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
          this.postsDataService.remove(data);
        },
        error => {
-          console.error(error);
+          this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+            duration: 5000
+          });
        }
      );
  }
@@ -116,7 +118,9 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
        });
      },
      error => {
-        console.error(error);
+        this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+          duration: 5000
+        });
      }
    );
  }
@@ -131,7 +135,9 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
        });
      },
      error => {
-        console.error(error);
+        this._snackBar.open(error.error || 'Unexpected error, check log file', null, {
+          duration: 5000
+        });
      }
    );
  }
@@ -15,4 +15,9 @@
      border-radius:12px;  
      box-shadow:0 0 3px black;
    }
+  }
+
+  #global-search {
+    font-size: 16px;
+    line-height: 18px;
  }
@@ -32,10 +32,13 @@ export class WsConnectionService {
        return this.wsHandler;
      }
      if (this.electronService.isElectronApp) {
-        this.electronService.ipcRenderer.send('get-port');
+        const portRequest = setInterval(() => {
+          this.electronService.ipcRenderer.send('get-port');
+        }, 1000);

        // wait for MainIPC
        this.electronService.ipcRenderer.once('port', (event, port) => {
+          clearInterval(portRequest);
          console.log('server running on port', port);
          this.serverService.baseUrl = 'http://localhost:' + port;
          this.tryConnect(resolve, reject);
@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+  xmlns:dc="http://purl.org/dc/elements/1.1/"
+  xmlns:cc="http://creativecommons.org/ns#"
+  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+  xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+  xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+  xmlns="http://www.w3.org/2000/svg"
+  width="1024"
+  height="1024"
+  viewBox="0 0 270.93333 270.93334"
+  version="1.1"
+  id="svg8"
+  inkscape:export-filename="C:\Users\Marwen\IdeaProjects\vripper-project\vripper-electron\build\icons\1024x1024.png"
+  inkscape:export-xdpi="96.00956"
+  inkscape:export-ydpi="96.00956"
+  inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+  sodipodi:docname="v.svg">
+  <defs
+    id="defs2"/>
+  <sodipodi:namedview
+    id="base"
+    pagecolor="#ffffff"
+    bordercolor="#666666"
+    borderopacity="1.0"
+    inkscape:pageopacity="0.0"
+    inkscape:pageshadow="2"
+    inkscape:zoom="0.35"
+    inkscape:cx="-200.49762"
+    inkscape:cy="299.73785"
+    inkscape:document-units="mm"
+    inkscape:current-layer="layer1"
+    showgrid="false"
+    units="px"
+    inkscape:window-width="1920"
+    inkscape:window-height="1017"
+    inkscape:window-x="-8"
+    inkscape:window-y="-8"
+    inkscape:window-maximized="1"/>
+  <metadata
+    id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+        rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+          rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+        <dc:title/>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+    inkscape:label="Layer 1"
+    inkscape:groupmode="layer"
+    id="layer1"
+    transform="translate(0,-26.06665)">
+    <circle
+      id="path3715"
+      cx="135.46666"
+      cy="161.53331"
+      style="fill:#aa0000;fill-opacity:1;stroke-width:0.35248032"
+      r="135.45317"/>
+    <flowRoot
+      xml:space="preserve"
+      id="flowRoot4522"
+      style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:40.00005341px;line-height:1.25;font-family:'Fira Code';-inkscape-font-specification:'Fira Code, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none"
+      transform="matrix(5.7825687,0,0,5.7825687,-859.25089,-2020.8769)"><flowRegion
+         id="flowRegion4524"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:40.00005341px;font-family:'Fira Code';-inkscape-font-specification:'Fira Code, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1"><rect
+           id="rect4526"
+           width="514.28571"
+           height="380"
+           x="160"
+           y="356.80539"
+           style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:40.00005341px;font-family:'Fira Code';-inkscape-font-specification:'Fira Code, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1" /></flowRegion>
+      <flowPara
+        id="flowPara4534">V</flowPara></flowRoot>
+  </g>
+</svg>
@@ -1,4 +1,5 @@
 export const environment = {
  production: true,
-  localhost: ''
+  localhost: '',
+  version: '2.8.1'
 };
@@ -4,7 +4,8 @@

 export const environment = {
  production: false,
-  localhost: 'http://localhost:8080'
+  localhost: 'http://localhost:8080',
+  version: '2.8.1'
 };

 /*
@@ -1,15 +1,15 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="utf-8">
-  <title>V Ripper</title>
-  <base href="/">
+  <meta charset="utf-8"/>
+  <title>VRipper</title>
+  <base href="/"/>

-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <meta content="width=device-width, initial-scale=1" name="viewport"/>
+  <link href="favicon.ico" rel="icon" type="image/x-icon"/>
  <script src="assets/sockjs.min.js"></script>
 </head>
 <body class="mat-app-background">
-  <app-root></app-root>
+<app-root></app-root>
 </body>
 </html>
Author	SHA1	Message	Date
death-claw	d009aa3f8c	v2.8.1	2019-12-24 20:21:29 +01:00
death-claw	078d49f883	v2.8.1	2019-12-24 20:18:22 +01:00
death-claw	f1bf517ba5	Fix issue with path creation	2019-12-24 20:15:03 +01:00
death-claw	6269ed6f6e	v2.8.0	2019-12-24 19:47:17 +01:00
death-claw	43b8dedbb1	Use pointer cursor on gallery items	2019-12-24 19:42:45 +01:00
death-claw	978be7bd49	Add view photos settings Some improvements	2019-12-23 22:46:46 +01:00
death-claw	1b7f3aef62	Add missing css and script includes	2019-12-23 19:36:07 +01:00
death-claw	7d24ee4867	Use photoswipe for image gallery	2019-12-23 00:02:13 +01:00
death-claw	269a3475b0	Generate thumbnails on the fly and cache them	2019-12-21 19:17:51 +01:00
death-claw	18e2bc6afc	Add Photo Viewer	2019-12-21 17:23:22 +01:00
death-claw	c6ef54e115	v2.7.1	2019-12-21 11:24:03 +01:00
death-claw	441b2831fc	Add version to title	2019-12-21 11:16:53 +01:00
death-claw	3cf4d60eca	v2.7.0	2019-12-21 09:59:17 +01:00
death-claw	d228c89a1c	Add support for pixxxels Add missing icon	2019-12-21 09:56:57 +01:00
death-claw	f3b592e81b	v2.6.0	2019-12-21 08:39:04 +01:00
death-claw	a5ff659fb4	Better quality app icon Implement context menu on download tab Add stop remove and start button to context menu Link will not be removed automatically from link collector tab Some UI fixes	2019-12-21 08:34:56 +01:00