From efc254759f04b75319d287f092d0a4ff2643fda9 Mon Sep 17 00:00:00 2001 From: Tempe Techie <95053628+tempe-techie@users.noreply.github.com> Date: Sun, 24 Mar 2024 11:28:07 +0100 Subject: [PATCH] img preview before post submit --- components/chat/ChatFeed.vue | 11 ++++++++++- utils/textUtils.js | 19 +++++++++++++++++++ 2 files changed, 29 insertions(+), 1 deletion(-) diff --git a/components/chat/ChatFeed.vue b/components/chat/ChatFeed.vue index c5b9b8e..f12540e 100644 --- a/components/chat/ChatFeed.vue +++ b/components/chat/ChatFeed.vue @@ -85,6 +85,15 @@ + +
+ +
@@ -124,7 +133,7 @@ import SwitchChainButton from "~/components/SwitchChainButton.vue"; import TenorGifSearch from "~/components/tenor/TenorGifSearch.vue"; import TenorStickerSearch from "~/components/tenor/TenorStickerSearch.vue"; import FileUploadModal from "~/components/storage/FileUploadModal.vue"; - +import { getAllImagesFromText } from "~/utils/textUtils"; import EmojiPicker from '~/components/EmojiPicker.vue' import 'emoji-mart-vue-fast/css/emoji-mart.css' diff --git a/utils/textUtils.js b/utils/textUtils.js index daf8617..18a9b0e 100644 --- a/utils/textUtils.js +++ b/utils/textUtils.js @@ -68,7 +68,26 @@ export function findFirstUrl(text) { return null; } +export function getAllImagesFromText(text) { + if (!text) { return [] }; + + // find multiple image links in the text and return them as an array + let imageRegex = /(https?:\/\/.*\.(?:png|jpg|jpeg|gif|webp))/gi; + let imageLinks = text.match(imageRegex); + + if (!imageLinks) { + imageRegex = /(http|https|ipfs):\/\/\S+\?.img/g; + imageLinks = text.match(imageRegex); + } + + if (!imageLinks) { return [] }; + + return imageLinks; +} + export function getImageFromText(text) { + if (!text) { return null }; + let imageRegex = /(https?:\/\/.*\.(?:png|jpg|jpeg|gif|webp))/i; let imageLinks = text.match(imageRegex);