From 50fc7413a9ed87c23faca4a00bbb68a8474c460e Mon Sep 17 00:00:00 2001
From: ccbikai <ccbikai@gmail.com>
Date: Fri, 9 Aug 2024 12:03:02 +0800
Subject: [PATCH] feat: enhance UI and fix video handling

- Hide video elements in widget for improved user experience
- Update header background for better contrast
- Prevent empty image containers from rendering
- Remove unsupported video player elements
- Add onclick attribute to links for enhanced functionality
- Include Yandex.ru in target whitelist for expanded compatibility
---
 src/assets/item.css          | 4 ++++
 src/components/header.astro  | 1 +
 src/lib/telegram/index.js    | 5 +++--
 src/pages/static/[...url].js | 1 +
 4 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/assets/item.css b/src/assets/item.css
index 89f4fd54..d167a564 100644
--- a/src/assets/item.css
+++ b/src/assets/item.css
@@ -118,6 +118,10 @@
     display: block !important;
   }
 
+  .tgme_widget_message_video_wrap {
+    display: none;
+  }
+
   .tgme_widget_message_poll_options {
     display: block;
 
diff --git a/src/components/header.astro b/src/components/header.astro
index b8e3cc72..9ddb1d26 100644
--- a/src/components/header.astro
+++ b/src/components/header.astro
@@ -156,6 +156,7 @@ const staticProxy = getEnv(import.meta.env, Astro, 'STATIC_PROXY') ?? '/static/'
 <style>
   #site-intro {
     color: var(--secondary-color);
+    background-color: var(--code-background-color);
     word-break: break-word;
 
     & :global(.emoji) {
diff --git a/src/lib/telegram/index.js b/src/lib/telegram/index.js
index dae06906..603a4136 100644
--- a/src/lib/telegram/index.js
+++ b/src/lib/telegram/index.js
@@ -45,7 +45,7 @@ function getImages($, item, { staticProxy, id, index, title }) {
       </button>
     `
   })?.get()
-  return `<div class="image-list-container ${images.length % 2 === 0 ? 'image-list-even' : 'image-list-odd'}">${images?.join('')}</div>`
+  return images.length ? `<div class="image-list-container ${images.length % 2 === 0 ? 'image-list-even' : 'image-list-odd'}">${images?.join('')}</div>` : ''
 }
 
 function getVideo($, item, { staticProxy, index }) {
@@ -100,7 +100,7 @@ function getReply($, item, { channel }) {
 function modifyHTMLContent($, content, { index } = {}) {
   $(content).find('.emoji')?.attr('style', '')
   $(content).find('a')?.each((_index, a) => {
-    $(a)?.attr('title', $(a)?.text())
+    $(a)?.attr('title', $(a)?.text())?.attr('onclick', '')
   })
   $(content).find('tg-spoiler')?.each((_index, spoiler) => {
     const id = `spoiler-${index}-${_index}`
@@ -141,6 +141,7 @@ function getPost($, item, { channel, staticProxy, index = 0 }) {
       // $(item).find('.tgme_widget_message_sticker_wrap')?.html(),
       $(item).find('.tgme_widget_message_poll')?.html(),
       $.html($(item).find('.tgme_widget_message_document_wrap')),
+      $.html($(item).find('.tgme_widget_message_video_player.not_supported')),
       $.html($(item).find('.tgme_widget_message_location_wrap')),
       getLinkPreview($, item, { staticProxy, index }),
     ].filter(Boolean).join('').replace(/(url\(["'])((https?:)?\/\/)/g, (match, p1, p2, _p3) => {
diff --git a/src/pages/static/[...url].js b/src/pages/static/[...url].js
index e0354d7a..130d5fd3 100644
--- a/src/pages/static/[...url].js
+++ b/src/pages/static/[...url].js
@@ -5,6 +5,7 @@ const targetWhitelist = [
   'telegram.dog',
   'cdn-telegram.org',
   'telesco.pe',
+  'yandex.ru',
 ]
 
 export const prerender = false