☰

Feishu Bubble Enhancement

a script to enhance lark/feishu's msg bubble in wrong way

  1. // ==UserScript==
  2. // @name         Feishu Bubble Enhancement
  3. // @namespace    http://tampermonkey.net/
  4. // @version      2024-04-01
  5. // @description  a script to enhance lark/feishu's msg bubble in wrong way
  6. // @author       haru
  7. // @match        https://*/next/messenger
  8. // @icon         https://www.google.com/s2/favicons?sz=64&domain=bytedance.larkoffice.com
  9. // @grant        none
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     // 替换为想要屏蔽的人名
  17.     const groupA = ['小李', '李四', '王八'];
  18.  
  19.     // 替换为想要强调的人名
  20.     const groupB = ['张经理', '小明', '马云'];
  21.  
  22.     const messageItemSelector = '.js-message-item.message-item';
  23.     const nameSelector = '.message-info-name';
  24.  
  25.     const blurEffect = 'blur(5px)';
  26.     const renderDouble = 'scale(2.5)';
  27.  
  28.     const rainbowEffect = `
  29.         background: linear-gradient(90deg, rgba(255, 0, 0, 0.60) 0%, rgba(255, 230, 0, 0.60) 17.4%, rgba(4, 252, 44, 0.60) 33.4%, rgba(0, 224, 255, 0.60) 51.09%, rgba(66, 0, 255, 0.60) 66.4%, rgba(250, 0, 255, 0.60) 79.9%, rgba(255, 0, 0, 0.60) 100%);
  30.         background-size: 100% 100%;
  31.         opcaity: 0.5;
  32.     `;
  33.  
  34.     setInterval(() => {
  35.         const messageItems = [...document.querySelectorAll(messageItemSelector)];
  36.  
  37.         messageItems.forEach(item => {
  38.             const name = item.querySelector(nameSelector)?.innerText;
  39.             if (!name) {
  40.                 return;
  41.             }
  42.  
  43.             if (groupA.includes(name)) {
  44.                 item.style.filter = blurEffect;
  45.             } else if (groupB.includes(name)) {
  46.                 item.style.transform = renderDouble;
  47.                 item.style.transformOrigin = 'left';
  48.                 item.style.paddingTop = '4em';
  49.                 item.style.paddingBottom = '4em';
  50.  
  51.                 // 如果一个人连续发多句话，这里就没法改下边的样式了。哎呀但是就这样吧随便了【
  52.                 const div = item.querySelector('.NewMessageContextMenuTrigger.MessageContextMenuTrigger.MessageContextMenuTrigger--scene-chat.message-section-left.message-section-newFileCard');
  53.                 if (div) {
  54.                     div.style.cssText = rainbowEffect;
  55.                 }
  56.             }
  57.         });
  58.     }, 1000);
  59. })();