Greasy Fork is available in English.

YouTube Sticky Live Chat

生放送主とモデレータの最新のコメントを上に固定するユーザスクリプト

旧: v0.3.5 - 2020/05/07 - Imported from URL
新: v0.4.0 - 2020/05/12 - Imported from URL

  • --- /tmp/diffy20240426-2593769-hrabc4 2024-04-26 06:53:59.183117093 +0000
  • +++ /tmp/diffy20240426-2593769-b0k2ba 2024-04-26 06:53:59.183117093 +0000
  • @@ -2,79 +2,61 @@
  • // @name YouTube Sticky Live Chat
  • // @name:ja YouTube Sticky Live Chat
  • // @namespace https://i544c.github.io
  • -// @version 0.3.5
  • +// @version 0.4.0
  • // @description Pin the latest message written by live owner or moderator to the top
  • // @description:ja 生放送主とモデレータの最新のコメントを上に固定するユーザスクリプト
  • // @author i544c
  • -// @match https://www.youtube.com/*
  • +// @match https://www.youtube.com/live_chat*
  • // @grant none
  • // @license MIT
  • // ==/UserScript==
  • (() => {
  • - const main = e => {
  • - console.log('Found LiveChat frame');
  • - const chatframe = e.target.contentDocument;
  • - const style = document.createElement('style');
  • - style.textContent = `
  • - yt-live-chat-app {
  • - /* Global variables */
  • - --ysl-line-length: 3;
  • - --ysl-message-height: calc(1em * var(--ysl-line-length) + 4px);
  • - }
  • -
  • - #item-offset {
  • - overflow: visible !important;
  • - }
  • -
  • - #items {
  • - transform: none !important;
  • - }
  • -
  • - yt-live-chat-text-message-renderer[author-type="owner"],
  • - yt-live-chat-text-message-renderer[author-type="moderator"] {
  • - background: var(--yt-live-chat-message-highlight-background-color);
  • - position: sticky;
  • - top: -1px;
  • - z-index: 1;
  • - height: var(--ysl-message-height);
  • - min-height: var(--ysl-message-height);
  • - }
  • -
  • - yt-live-chat-text-message-renderer[author-type="owner"]:hover,
  • - yt-live-chat-text-message-renderer[author-type="moderator"]:hover {
  • - height: 100% !important;
  • - }
  • -
  • - yt-live-chat-text-message-renderer[author-type="owner"] #content,
  • - yt-live-chat-text-message-renderer[author-type="moderator"] #content {
  • - align-self: normal;
  • - /* String truncate */
  • - display: -webkit-box;
  • - -webkit-box-orient: vertical;
  • - -webkit-line-clamp: var(--ysl-line-length);
  • - overflow: hidden;
  • - }
  • -
  • - yt-live-chat-text-message-renderer[author-type="owner"] #content:hover,
  • - yt-live-chat-text-message-renderer[author-type="moderator"] #content:hover {
  • - -webkit-box-orient: inline-axis;
  • - }
  • - `;
  • - chatframe.body.appendChild(style);
  • - };
  • -
  • -
  • - const findFrame = () => {
  • - const findInterval = window.setInterval(() => {
  • - const chatframe = document.querySelector('#chatframe');
  • - if (chatframe) {
  • - chatframe.addEventListener('load', main);
  • - window.clearInterval(findInterval);
  • - }
  • - }, 1000);
  • - };
  • -
  • - findFrame();
  • - document.addEventListener('yt-navigate-finish', findFrame);
  • -
  • + const style = document.createElement('style');
  • + style.textContent = `
  • + yt-live-chat-app {
  • + /* Global variables */
  • + --ysl-line-length: 3;
  • + --ysl-message-height: calc(1em * var(--ysl-line-length) + 4px);
  • + }
  • +
  • + #item-offset {
  • + overflow: visible !important;
  • + }
  • +
  • + #items {
  • + transform: none !important;
  • + }
  • +
  • + yt-live-chat-text-message-renderer[author-type="owner"],
  • + yt-live-chat-text-message-renderer[author-type="moderator"] {
  • + background: var(--yt-live-chat-message-highlight-background-color);
  • + position: sticky;
  • + top: -1px;
  • + z-index: 1;
  • + height: var(--ysl-message-height);
  • + min-height: var(--ysl-message-height);
  • + }
  • +
  • + yt-live-chat-text-message-renderer[author-type="owner"]:hover,
  • + yt-live-chat-text-message-renderer[author-type="moderator"]:hover {
  • + height: 100% !important;
  • + }
  • +
  • + yt-live-chat-text-message-renderer[author-type="owner"] #content,
  • + yt-live-chat-text-message-renderer[author-type="moderator"] #content {
  • + align-self: normal;
  • + /* String truncate */
  • + display: -webkit-box;
  • + -webkit-box-orient: vertical;
  • + -webkit-line-clamp: var(--ysl-line-length);
  • + overflow: hidden;
  • + }
  • +
  • + yt-live-chat-text-message-renderer[author-type="owner"] #content:hover,
  • + yt-live-chat-text-message-renderer[author-type="moderator"] #content:hover {
  • + -webkit-box-orient: inline-axis;
  • + }
  • + `;
  • + document.body.appendChild(style);
  • })();