Updates

Author: gvbvdxx

src/chat/interface/chatmessagegen.js

@@ -1,6 +1,7 @@
 var elements = require("../../gp2/elements.js");
 var AElement = require("../../gp2/aelement.js");
 var { isSafeURLOrDomain } = require("../../safehtmlencode.js");
+var imageViewer = require("./viewers/image.js");
 
 function getBracketCodeJSON(
   inputText = "",
@@ -274,6 +275,7 @@ function getBracketCodeJSON(
                 objectFit: "contain",
                 width: IMAGE_EMOJI_SIZE + "px",
                 height: IMAGE_EMOJI_SIZE + "px",
+                pointerEvents: "none",
               },
               src: url,
             });
@@ -287,36 +289,44 @@ function getBracketCodeJSON(
         if (name == "image" && !exists) {
           exists = true;
           if (isSafeURLOrDomain(value.trim())) {
-            elm.children.push({
-              element: "div",
-              className: "divButton roundborder",
-              style: {
-                padding: "4px 4px",
-              },
-              eventListeners: [
-                {
-                  event: "click",
-                  func: async function () {},
+            (function (value) {
+              elm.children.push({
+                element: "div",
+                className: "divButton roundborder",
+                style: {
+                  padding: "4px 4px",
+                  textAlign: "center",
+                  fontSize: "10px",
                 },
-              ],
-              children: [
-                {
-                  element: "img",
-                  src: value.trim(),
-                  style: {
-                    width: "40px",
-                    height: "40px",
+                eventListeners: [
+                  {
+                    event: "click",
+                    func: async function () {
+                      imageViewer.showImage(value);
+                    },
                   },
-                },
-                {
-                  element: "br",
-                },
-                {
-                  element: "b",
-                  textContent: "Image",
-                },
-              ],
-            });
+                ],
+                children: [
+                  {
+                    element: "img",
+                    src: value.trim(),
+                    style: {
+                      width: "40px",
+                      height: "40px",
+                      objectFit: "contain",
+                      pointerEvents: "none",
+                    },
+                  },
+                  {
+                    element: "br",
+                  },
+                  {
+                    element: "b",
+                    textContent: "Image",
+                  },
+                ],
+              });
+            })(value);
           }
           elm.children.push({
             element: "span",

src/chat/interface/viewers/image.js

@@ -32,31 +32,34 @@ class ImageViewerDialog {
             element: "div",
             className: "whiteBox centerMiddle popupDialogAnimation",
             style: {
-              overflowY: "auto",
-              maxHeight: "calc(100vh - 100px)",
-              maxWidth: "calc(100vw - 300px)",
-              minWidth: "360px",
-              minHeight: "360px",
+              maxHeight: "calc(100svh - 100px)",
+              maxWidth: "calc(100svw - 300px)",
+              minWidth: "50px",
+              minHeight: "50px",
             },
             children: [
               {
                 element: "div",
                 style: {
                   display: "flex",
                   flexDirection: "column",
+                  width: "100%",
+                  height: "100%",
                 },
                 children: [
                   {
                     element: "div",
                     style: {
                       display: "block",
+                      width: "100%",
                     },
                     children: [
                       {
                         element: "span",
                         style: {
                           fontSize: "30px",
                           fontWeight: "bold",
+                          textAlign: "center",
                         },
                         textContent: "Attached image",
                       },
@@ -66,36 +69,59 @@ class ImageViewerDialog {
                   {
                     element: "div",
                     style: {
-                      margin: "8px 0",
                       padding: "8px",
-                      backgroundColor: "#fffae6",
-                      border: "1px solid #f0e68c",
                       borderRadius: "6px",
-                      fontSize: "14px",
-                      color: "#665500",
+                      background: "black",
                       flexGrow: "1",
+                      flexShrink: "0",
+                      overflow: "auto",
+                      maxHeight: "calc(100svh - 250px)",
+                      minHeight: "300px",
+                      justifyContent: "center",
                     },
-                    children: [],
+                    children: [
+                      {
+                        element: "img",
+                        src: "",
+                        style: {
+                          pointerEvents: "none",
+                          objectFit: "contain",
+                          minWidth: "300px",
+                          minHeight: "300px",
+                          position: "relative",
+                        },
+                        GPWhenCreated: function (elm) {
+                          _this.imageElement = elm;
+                        },
+                      },
+                    ],
                   },
 
                   {
                     element: "div",
                     style: {
                       display: "flex",
+                      alignItems: "center",
                     },
                     children: [
                       {
                         element: "div",
                         className: "divButton roundborder",
                         textContent: "Download",
                         style: {
-                          flexGrow: "1",
+                          margin: "2px",
                         },
                         eventListeners: [
                           {
                             event: "click",
                             func: function () {
-                              _this.dialogElement.hidden = true;
+                              var a = document.createElement("a");
+                              a.href = _this.imageElement.src;
+                              a.download = _this.imageElement.src
+                                .slice("/")
+                                .pop();
+                              a.click();
+                              a.remove();
                             },
                           },
                         ],
@@ -105,7 +131,7 @@ class ImageViewerDialog {
                         className: "divButton roundborder",
                         textContent: "Close",
                         style: {
-                          flexGrow: "1",
+                          margin: "2px",
                         },
                         eventListeners: [
                           {
@@ -126,8 +152,9 @@ class ImageViewerDialog {
       },
     ])[0];
   }
-  showImage() {
-    dialogElement.hidden = true;
+  showImage(src) {
+    this.imageElement.src = src;
+    this.dialogElement.hidden = false;
   }
 }
 

src/pages/navigate-loader.js

@@ -2,6 +2,7 @@ var loader = require("./loadingscreen.js");
 
 var isLoading = true;
 var loadingScreen = loader.doLoadingScreen();
+document.body.append(loadingScreen);
 
 document.addEventListener("DOMContentLoaded", () => {
   window.addEventListener("load", () => {
@@ -15,6 +16,9 @@ document.addEventListener("DOMContentLoaded", () => {
 navigation.addEventListener("navigate", (event) => {
   var destinationUrl = event.destination.url;
   var navigationType = event.navigationType;
+  if (event.downloadRequest) {
+    return; // Don't show loading screen for downloads
+  }
 
   if (!isLoading) {
     isLoading = true;
@@ -35,3 +39,10 @@ navigation.addEventListener("navigateerror", (event) => {
     loadingScreen.remove();
   }
 });
+
+window.addEventListener("pageshow", (event) => {
+  if (event.persisted && isLoading) {
+    isLoading = false;
+    loadingScreen.remove();
+  }
+});

wpstatic/version.json

@@ -1 +1 @@
-{"timestamp":"1762370103028"}
+{"timestamp":"1762371966829"}