@ecency/render-helper 2.5.6 → 2.5.8

package/dist/browser/index.d.ts

@@ -51,10 +51,26 @@ declare function catchPostImage(obj: Entry | string, width?: number, height?: nu
 declare function getPostBodySummary(obj: Entry | string, length?: number, platform?: 'ios' | 'android' | 'web'): string;
 
 declare function setProxyBase(p: string): void;
+interface ProxifyOptions {
+    /**
+     * Request a tiny blurred LQIP placeholder. The proxy resizes to ~20px and
+     * gaussian-blurs it (a few hundred bytes), for use behind the real image
+     * while it loads.
+     */
+    blur?: boolean;
+    /**
+     * Route on-host uploads through the /p/ proxy even when no width/height is
+     * requested, so the server still negotiates WebP/AVIF via the Accept header
+     * (instead of streaming the original bytes from direct-serve). Use for
+     * displayed `<img>` sources; leave off for OG/social images, where the
+     * original format is safest.
+     */
+    forceProxy?: boolean;
+}
 /**
  * @param _format - @deprecated Ignored. Always uses 'match' — format is handled server-side via Accept header.
  */
-declare function proxifyImageSrc(url?: string, width?: number, height?: number, _format?: string): string;
+declare function proxifyImageSrc(url?: string, width?: number, height?: number, _format?: string, opts?: ProxifyOptions): string;
 /**
  * Builds a srcset string with multiple width variants for responsive images.
  * Uses the image proxy's width parameter to serve appropriately sized images.
@@ -85,4 +101,4 @@ declare function isValidPermlink(permlink: string): boolean;
  */
 declare function simpleMarkdownToHTML(input: string): string;
 
-export { type Entry, IMAGE_SIZES, type RenderOptions, SECTION_LIST, type SeoContext, buildSrcSet, catchPostImage, isValidPermlink, getPostBodySummary as postBodySummary, proxifyImageSrc, markdown2Html as renderPostBody, setCacheSize, setProxyBase, setSlowRenderThresholdMs, simpleMarkdownToHTML };
+export { type Entry, IMAGE_SIZES, type ProxifyOptions, type RenderOptions, SECTION_LIST, type SeoContext, buildSrcSet, catchPostImage, isValidPermlink, getPostBodySummary as postBodySummary, proxifyImageSrc, markdown2Html as renderPostBody, setCacheSize, setProxyBase, setSlowRenderThresholdMs, simpleMarkdownToHTML };

package/dist/browser/index.js

@@ -77,6 +77,7 @@ var TRUVVL_REGEX = /^https?:\/\/embed.truvvl.com\/(@[\w.\d-]+)\/(.*)/i;
 var LBRY_REGEX = /^(https?:)?\/\/lbry.tv\/\$\/embed\/[^?#]+(?:$|[?#])/i;
 var ODYSEE_REGEX = /^(https?:)?\/\/odysee\.com\/(?:\$|%24)\/embed\/[^?#]+(?:$|[?#])/i;
 var SKATEHIVE_IPFS_REGEX = /^https?:\/\/ipfs\.skatehive\.app\/ipfs\/([^/?#]+)/i;
+var SKATEHYPE_EMBED_REGEX = /^(https?:)?\/\/(www\.)?skatehype\.com\/ifplay\.php\?v=\d+(?:$|[&#])/i;
 var ARCH_REGEX = /^(https?:)?\/\/archive.org\/embed\/[^/?#]+(?:$|[?#])/i;
 var SPEAK_REGEX = /(?:https?:\/\/(?:(?:play\.)?3speak\.([a-z]+)\/watch\?v=)|(?:(?:play\.)?3speak\.([a-z]+)\/embed\?v=))([A-Za-z0-9_\-\.\/]+)(&.*)?/i;
 var SPEAK_EMBED_REGEX = /^(https?:)?\/\/(?:play\.)?3speak\.([a-z]+)\/(?:embed|watch)\?.+$/i;
@@ -474,9 +475,11 @@ function setProxyBase(p2) {
 function getProxyBase() {
   return proxyBase;
 }
+var PROXY_P_PREFIXES = () => [`${proxyBase}/p/`, "https://images.ecency.com/p/"];
 function extractPHash(url) {
-  if (url.startsWith(`${proxyBase}/p/`)) {
-    const [hash] = url.split("/p/")[1].split("?");
+  const prefix = PROXY_P_PREFIXES().find((p2) => url.startsWith(p2));
+  if (prefix) {
+    const [hash] = url.slice(prefix.length).split("?");
     return hash.replace(/\.(webp|png)$/, "");
   }
   return null;
@@ -492,17 +495,18 @@ function getLatestUrl(str) {
   const [last] = [...str.replace(/https?:\/\//g, "\n$&").trim().split("\n")].reverse();
   return last;
 }
-function proxifyImageSrc(url, width = 0, height = 0, _format = "match") {
+function proxifyImageSrc(url, width = 0, height = 0, _format = "match", opts = {}) {
   if (!url || typeof url !== "string" || !isValidUrl(url)) {
     return "";
   }
+  const routeThroughProxy = width > 0 || height > 0 || !!opts.blur || !!opts.forceProxy;
   if (url.indexOf("https://images.hive.blog/") === 0 && url.indexOf("https://images.hive.blog/D") !== 0) {
     return url.replace("https://images.hive.blog", proxyBase);
   }
   if (url.indexOf("https://steemitimages.com/") === 0 && url.indexOf("https://steemitimages.com/D") !== 0) {
     return url.replace("https://steemitimages.com", proxyBase);
   }
-  if (url.indexOf("https://images.ecency.com/") === 0) {
+  if (url.indexOf("https://images.ecency.com/") === 0 && !routeThroughProxy) {
     return url.replace("https://images.ecency.com", proxyBase);
   }
   const realUrl = getLatestUrl(url);
@@ -517,6 +521,9 @@ function proxifyImageSrc(url, width = 0, height = 0, _format = "match") {
   if (height > 0) {
     options.height = height;
   }
+  if (opts.blur) {
+    options.blur = 1;
+  }
   const qs = querystring.stringify(options);
   if (pHash) {
     return `${proxyBase}/p/${pHash}?${qs}`;
@@ -577,7 +584,7 @@ function img(el, state) {
   const base = trimTrailingSlash(getProxyBase());
   const hasAlreadyProxied = src.startsWith(`${base}/p/`) || src.startsWith(`${base}/u/`) || new RegExp(`^${base.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}/\\d+x\\d+/`).test(src);
   if (shouldReplace && !hasAlreadyProxied) {
-    const proxified = proxifyImageSrc(decodedSrc);
+    const proxified = proxifyImageSrc(decodedSrc, 0, 0, "match", { forceProxy: true });
     if (proxified) {
       el.setAttribute("src", proxified);
       const srcset = buildSrcSet(decodedSrc);
@@ -597,7 +604,7 @@ function img(el, state) {
   }
 }
 function createImageHTML(src, isLCP) {
-  const proxified = proxifyImageSrc(src);
+  const proxified = proxifyImageSrc(src, 0, 0, "match", { forceProxy: true });
   if (!proxified) return "";
   const base = trimTrailingSlash(getProxyBase());
   const isAlreadyProxied = src.startsWith(`${base}/u/`) || new RegExp(`^${base.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}/\\d+x\\d+/`).test(src);
@@ -1396,6 +1403,13 @@ function iframe(el, parentDomain = "ecency.com", forApp = false) {
     el.setAttribute("allowfullscreen", "true");
     return;
   }
+  if (src.match(SKATEHYPE_EMBED_REGEX)) {
+    const normalizedSrc = src.replace(/^(https?:)?\/\//i, "https://");
+    el.setAttribute("src", normalizedSrc);
+    el.setAttribute("frameborder", "0");
+    el.setAttribute("allowfullscreen", "true");
+    return;
+  }
   if (src.match(ARCH_REGEX)) {
     el.setAttribute("src", src);
     return;