Greasy Fork

Greasy Fork is available in English.

douyin-helper 抖音优化

抖音网页版优化,配合 Yandex 浏览器、油猴脚本代替抖音APP,防止烧屏

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name              douyin-helper 抖音优化
// @version           0.0.1
// @description       抖音网页版优化,配合 Yandex 浏览器、油猴脚本代替抖音APP,防止烧屏
// @author            soul mate
// @namespace         http://tampermonkey.net/soulmate
// @license           MIT
// @match             https://www.douyin.com/*
// @homepage          http://greasyfork.icu/scripts/******
// @supportURL        https://github.com
// @run-at            document-body
// @grant             GM_download
// @grant             GM_addStyle
// ==/UserScript==

(function() {
  "use strict";
  GM_addStyle(`
/** 纯净模式
 * ======================================================== */
/* 纯净模式,即隐藏点赞、文案、小进度条等 */
.douyin-pure {
  /* 侧边栏 */
  /* 底部左侧(播放按钮、进度)*/
  /* 底部右侧(自动连播按钮等)*/
  /* 文案 */
}
.douyin-pure .xgplayer-controls + div,
.douyin-pure .xgplayer-controls .xg-left-grid,
.douyin-pure .xgplayer-controls .xg-right-grid {
  opacity: 0.1 !important;
}
.douyin-pure .xgplayer-video-info-wrap {
  opacity: 0.3 !important;
}
/** 大屏模式
 * ======================================================== */
/* 大屏模式,视频放大显示 */
.douyin-large .xgplayer-is-fullscreen .xg-video-container > video,
.douyin-large .xgplayer-is-fullscreen .imgBackground > img {
  margin-left: -7.4vw !important;
  width: calc(100% + 14.8vw) !important;
}
/** 基本样式
 * ======================================================== */
/* 移动端取消高亮 */
* {
  -webkit-tap-highlight-color: transparent !important;
}
/* 去除多余动画 */
*:not(.swiper-wrapper) {
  animation: none !important;
  transition: none !important;
}
/** 动画,防止固定显示烧屏
 * ======================================================== */
/* 上下缓动的动画 */
@keyframes moveUpAndDown {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-3vh);
  }
}
/* 侧边栏 */
.xgplayer-controls + div,
.video-info-detail {
  animation: moveUpAndDown 10s linear infinite alternate !important;
}
/** 侧边栏
 * ======================================================== */
/* 上下切换按钮 */
@media screen and (orientation: portrait) {
  .xgplayer-playswitch {
    /* 上下切换按钮颜色移除 */
  }
  .xgplayer-playswitch .xgplayer-icon {
    transform: scale(1.8) !important;
    margin-bottom: 2vh !important;
  }
  .xgplayer-playswitch * {
    background-color: transparent !important;
  }
}
/* 侧边按钮 */
.xgplayer-controls + div {
  pointer-events: none;
  padding-bottom: 10vh;
  padding-right: 15px !important;
}
.xgplayer-controls + div > div {
  pointer-events: auto !important;
  /* 侧边按钮图标阴影 */
}
.xgplayer-controls + div > div > div {
  /* 收藏等按钮隐藏 */
}
.xgplayer-controls + div > div > div:nth-child(1) > div {
  /* 头像去掉顶部 margin */
  margin-top: 0;
  /* 关注按钮下移,方便手机点击 */
}
.xgplayer-controls + div > div > div:nth-child(1) > div > a + div {
  position: relative;
  top: 12px;
  opacity: 0.5;
  margin-top: 0;
}
.xgplayer-controls + div > div > div:nth-child(n + 4) {
  display: none;
}
.xgplayer-controls + div > div svg {
  filter: drop-shadow(0px 0px 1px rgba(0, 0, 0, 0.5));
}
/* 横屏【更多】按钮显示 */
@media screen and (orientation: landscape) {
  .xgplayer-controls + div > div > div:last-child {
    display: block;
  }
}
/** 底部按钮文案等
 * ======================================================== */
@media screen and (orientation: portrait) {
  .xgplayer {
    /* 全屏按钮变大,方便手机端点击,目前是满屏了 */
  }
  .xgplayer .xgplayer-fullscreen .xg-get-fullscreen {
    pointer-events: auto !important;
    position: absolute;
    width: 1000vh !important;
    height: 1000vh !important;
    bottom: -100vh;
    right: -100vh;
    opacity: 0;
  }
  .xgplayer .xgplayer-immersive-switch-setting {
    display: none !important;
  }
  .xgplayer .xgplayer-autoplay-setting .xgplayer-setting-title {
    display: inline-flex;
    flex-direction: row-reverse;
    overflow: hidden;
    width: 24px;
    white-space: nowrap;
  }
}
.xgplayer {
  /* 作者\文案等缩小,加阴影方便查看 */
  /* 左侧边栏放大到下半屏,方便滑动上/下一个 */
}
.xgplayer .xgplayer-video-info-wrap {
  opacity: 1;
  --fc: rgba(0, 0, 0, 0.1);
  text-shadow: -1px -1px 0 var(--fc), -1px 1px 0 var(--fc), 1px -1px 0 var(--fc), 1px 1px 0 var(--fc), -1px 0 0 var(--fc), 1px 0 0 var(--fc), 0 -1px 0 var(--fc), 0 1px 0 var(--fc), 0 0 4px rgba(0, 0, 0, 0.5);
}
.xgplayer .xgplayer-video-info-wrap .video-info-detail {
  background-image: none !important;
}
.xgplayer .xg-left-bar {
  top: 60% !important;
  left: 0 !important;
  bottom: 0 !important;
  display: block !important;
  width: 100% !important;
  z-index: 0 !important;
  pointer-events: auto;
}
.xgplayer .xg-right-bar {
  top: 0 !important;
  left: 0 !important;
  bottom: 90% !important;
  display: block !important;
  width: 100% !important;
  z-index: 10000 !important;
  pointer-events: auto;
}
/**  评论弹窗、视频弹窗
 * ======================================================== */
/* 全屏时评论弹窗、视频弹窗优化 */
@media screen and (orientation: portrait) {
  .xgplayer-fullscreen-parent {
    /* 弹窗显示在屏幕底部 */
  }
  .xgplayer-fullscreen-parent .playerContainer + div {
    width: 100%;
    overflow: hidden;
    position: absolute;
    top: 50vh;
    bottom: 0;
    transition: none;
    pointer-events: none;
    max-width: 100%;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div {
    /* 评论列表 */
    /* 视频列表 */
    /* 评论列表弹窗背景透明 */
    /* 视频弹窗背景透明 */
    /* 弹窗背景透明 */
    /* 视频弹窗背景透明,方便看文案 */
    /* 弹窗关闭按钮点击区域放大 */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(1),
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) {
    width: 100%;
    left: 0;
    transition: none;
    overflow: initial;
    pointer-events: auto;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(1) {
    /* 评论列表展开按钮点击区域加大 */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(1) button {
    width: 100%;
    text-align: left;
    margin-top: 0;
    height: 48px;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) {
    top: 100px;
    background: rgba(255, 255, 255, 0.23) !important;
    border: 0 !important;
    /* 视频列表   */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div {
    /* 视频弹窗wrapper */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div,
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div > div {
    position: relative;
    background: transparent !important;
    overflow: hidden;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) {
    /* 视频弹窗header */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) {
    /* 标题等穿透点击,方便点到关闭按钮 */
    /* 视频弹窗header右侧按钮区域,占满,方便关闭按钮 */
    /* 视频弹窗header图标颜色 */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > :first-child {
    position: relative;
    z-index: 10;
    pointer-events: none;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > :first-child > * {
    pointer-events: all;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > div:last-child {
    justify-content: flex-end;
    display: flex;
    left: 0;
    height: 60px;
    position: absolute;
    width: 100%;
    /* 视频弹窗header折起展开按钮显示样式 */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > div:last-child svg:not(:last-child) {
    position: absolute;
    top: 12px;
    right: 32px;
    z-index: 3;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) path {
    fill: #2f3035;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) ul {
    width: 100%;
    max-width: 90vw;
    margin: 0 auto;
    /* 视频列表项目   */
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) ul li {
    padding: 0;
    width: calc((100% - 24px) / 3);
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) ul li:nth-child(3n) {
    padding: 0;
    padding-bottom: 8px;
    padding-left: 6px;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) ul li:nth-child(3n-1) {
    padding: 0 3px 8px;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) ul li:nth-child(3n-2) {
    padding-bottom: 8px;
    padding-right: 6px;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(3) {
    background-color: transparent !important;
    border: none !important;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(4) {
    background: transparent !important;
  }
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) svg:last-child,
  .xgplayer-fullscreen-parent .playerContainer + div > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) svg:last-child {
    position: absolute;
    left: 0;
    top: -50vh;
    width: 100%;
    height: calc(50vh + 60px);
    padding-top: 50vh;
    padding-left: calc(100% - 36px);
    z-index: 2;
  }
}
/* 非通用类名,头条修改类目要相应修改 */
/* 去春节广告 */
div[slot="wrapper-start"] {
  display: none !important;
}
/* 去评论登录弹窗 */
.comment-input-un-login-container {
  display: none !important;
}
/* 登录弹窗 */
.login-mask-enter-done {
  display: none !important;
}
/* 图文隐藏切换按钮 */
.xgplayer .swiper-container + svg,
.xgplayer .swiper-container + svg + svg {
  display: none;
}
/* 页面按钮透明度 */
@media screen and (orientation: portrait) {
  .xg-inner-controls .xg-left-grid,
  .xg-inner-controls .xg-right-grid {
    opacity: 0.3 !important;
  }
}
  `);

  console.log("douyinHelper \u52A0\u8F7D\u6210\u529F~");
  (() => {
    pageInit();
    function pageInit() {
      addPureFunction();
      addLargeFunction();
    }
    function togglePureFunction(status = false) {
      let bodyClassList = document.body.classList;
      if (status) {
        if (!bodyClassList.contains("douyin-pure")) {
          bodyClassList.add("douyin-pure");
        }
      } else {
        if (bodyClassList.contains("douyin-pure")) {
          localStorage.removeItem("____douyin_pure");
          bodyClassList.remove("douyin-pure");
        } else {
          localStorage.setItem("____douyin_pure", "1");
          bodyClassList.add("douyin-pure");
        }
      }
    }
    function addPureFunction() {
      let isPure = localStorage.getItem("____douyin_pure") === "1";
      if (isPure) {
        togglePureFunction(isPure);
      }
      document.addEventListener("click", (e) => {
        var _a, _b;
        let classList = (_a = e.target) == null ? void 0 : _a.classList;
        if ((_b = classList == null ? void 0 : classList.contains) == null ? void 0 : _b.call(classList, "xg-right-bar")) {
          togglePureFunction();
        }
      });
    }
    function toggleLargeFunction(status = false) {
      let bodyClassList = document.body.classList;
      if (status) {
        if (!bodyClassList.contains("douyin-large")) {
          bodyClassList.add("douyin-large");
        }
      } else {
        if (bodyClassList.contains("douyin-large")) {
          localStorage.removeItem("____douyin_large");
          bodyClassList.remove("douyin-large");
        } else {
          localStorage.setItem("____douyin_large", "1");
          bodyClassList.add("douyin-large");
        }
      }
    }
    function addLargeFunction() {
      let isLarge = localStorage.getItem("____douyin_large") === "1";
      if (isLarge) {
        toggleLargeFunction(isLarge);
      }
      document.addEventListener("dblclick", (e) => {
        var _a, _b;
        let classList = (_a = e.target) == null ? void 0 : _a.classList;
        if ((_b = classList == null ? void 0 : classList.contains) == null ? void 0 : _b.call(classList, "xg-right-bar")) {
          toggleLargeFunction();
        }
      });
    }
  })();
})();