├── .husky
    ├── .gitignore
    └── pre-commit
├── .github
    └── ISSUE_TEMPLATE
    │   ├── config.yml
    │   ├── feature.yml
    │   └── bug_report.yml
├── src
    ├── player
    │   ├── plugins
    │   │   ├── danmaku
    │   │   │   ├── index.ts
    │   │   │   ├── types.ts
    │   │   │   ├── parser.ts
    │   │   │   ├── progressBarPower.ts
    │   │   │   ├── apis.ts
    │   │   │   ├── utils.ts
    │   │   │   ├── danmakuList.ts
    │   │   │   ├── filter.ts
    │   │   │   ├── index.scss
    │   │   │   └── html.ts
    │   │   ├── autoseek
    │   │   │   ├── index.ts
    │   │   │   ├── index.scss
    │   │   │   ├── html.template.html
    │   │   │   └── autoseek.ts
    │   │   └── shortcuts
    │   │   │   ├── index.ts
    │   │   │   ├── utils.ts
    │   │   │   ├── help
    │   │   │       ├── index.ts
    │   │   │       ├── index.scss
    │   │   │       └── showHelp.ts
    │   │   │   ├── types.ts
    │   │   │   ├── shortcuts.ts
    │   │   │   ├── keybindings.ts
    │   │   │   └── commands.ts
    │   ├── assets
    │   │   ├── Hennyano.png
    │   │   ├── NachoNeko.png
    │   │   ├── NachoNeko1.png
    │   │   └── NachoNeko2.png
    │   ├── index.ts
    │   └── index.scss
    ├── adapter
    │   ├── _iframe_player_parser
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── parser.ts
    │   ├── agefans
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   ├── mobilePlay.ts
    │   │   └── play.ts
    │   ├── xfani
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── cycanime
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── mutean
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── gugufan
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── girigirilove
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── index.ts
    │   ├── anime1
    │   │   ├── history.ts
    │   │   ├── index.ts
    │   │   ├── index.scss
    │   │   └── play.ts
    │   ├── bimiacg
    │   │   ├── index.scss
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── standalone
    │   │   ├── index.ts
    │   │   └── play.ts
    │   ├── common
    │   │   ├── history.scss
    │   │   ├── history.ts
    │   │   └── defineIframePlayer.ts
    │   └── ntdm9
    │   │   ├── index.ts
    │   │   ├── play.ts
    │   │   └── favorite.ts
    ├── index.ts
    ├── utils
    │   ├── isUrl.ts
    │   ├── parseTime.ts
    │   ├── wait.ts
    │   ├── copy.ts
    │   ├── sleep.ts
    │   ├── opencc.ts
    │   ├── queryDom.ts
    │   ├── parseToJSON.ts
    │   ├── popover.scss
    │   ├── message.scss
    │   ├── renderKey.ts
    │   ├── alert.ts
    │   ├── alert.scss
    │   ├── execInUnsafeWindow.ts
    │   ├── tabs.scss
    │   ├── message.ts
    │   ├── keybind.ts
    │   ├── request.ts
    │   ├── tabs.ts
    │   ├── storage.ts
    │   ├── popover.ts
    │   ├── modal.scss
    │   ├── modal.ts
    │   └── subtitles.ts
    ├── global.scss
    └── runtime
    │   └── index.ts
├── types.d.ts
├── public
    ├── subtitles.srt
    ├── subtitles.vtt
    ├── index.html
    └── subtitles.ass
├── LICENSE
├── README.md
├── package.json
├── .gitignore
├── meta.template
└── tsconfig.json


/.husky/.gitignore:
--------------------------------------------------------------------------------
1 | _
2 | 


--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/config.yml:
--------------------------------------------------------------------------------
1 | blank_issues_enabled: true
2 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/index.ts:
--------------------------------------------------------------------------------
1 | export { setup } from './danmaku'
2 | 


--------------------------------------------------------------------------------
/.husky/pre-commit:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 | . "$(dirname "$0")/_/husky.sh"
3 | 
4 | npx pretty-quick --staged
5 | 


--------------------------------------------------------------------------------
/src/player/plugins/autoseek/index.ts:
--------------------------------------------------------------------------------
1 | import './index.scss'
2 | export { setup } from './autoseek'
3 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/index.ts:
--------------------------------------------------------------------------------
1 | import './commands'
2 | 
3 | export { setup, Shortcuts } from './shortcuts'
4 | 


--------------------------------------------------------------------------------
/src/player/assets/Hennyano.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/IronKinoko/agefans-enhance/HEAD/src/player/assets/Hennyano.png


--------------------------------------------------------------------------------
/src/player/assets/NachoNeko.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/IronKinoko/agefans-enhance/HEAD/src/player/assets/NachoNeko.png


--------------------------------------------------------------------------------
/src/player/assets/NachoNeko1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/IronKinoko/agefans-enhance/HEAD/src/player/assets/NachoNeko1.png


--------------------------------------------------------------------------------
/src/player/assets/NachoNeko2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/IronKinoko/agefans-enhance/HEAD/src/player/assets/NachoNeko2.png


--------------------------------------------------------------------------------
/src/adapter/_iframe_player_parser/index.scss:
--------------------------------------------------------------------------------
1 | .pro-ascepan-top {
2 |   #bkcl {
3 |     display: none !important;
4 |   }
5 | }
6 | 


--------------------------------------------------------------------------------
/src/index.ts:
--------------------------------------------------------------------------------
1 | import 'plyr/dist/plyr.css'
2 | import './global.scss'
3 | import './adapter'
4 | import { runtime } from './runtime'
5 | 
6 | runtime.run()
7 | 


--------------------------------------------------------------------------------
/src/adapter/agefans/index.scss:
--------------------------------------------------------------------------------
1 | .agefans-wrapper {
2 |   .video_detail_episode {
3 |     a:visited {
4 |       color: rgb(220, 53, 69) !important;
5 |     }
6 |   }
7 | }
8 | 


--------------------------------------------------------------------------------
/src/adapter/xfani/index.scss:
--------------------------------------------------------------------------------
1 | .xfani.widescreen {
2 |   .header_nav0,
3 |   .top-back.hoa,
4 |   .fixedGroup {
5 |     visibility: hidden;
6 |     pointer-events: none;
7 |   }
8 | }
9 | 


--------------------------------------------------------------------------------
/src/adapter/cycanime/index.scss:
--------------------------------------------------------------------------------
1 | .cycanime.widescreen {
2 |   .header_nav0,
3 |   .top-back.hoa,
4 |   .fixedGroup {
5 |     visibility: hidden;
6 |     pointer-events: none;
7 |   }
8 | }
9 | 


--------------------------------------------------------------------------------
/src/adapter/mutean/index.scss:
--------------------------------------------------------------------------------
1 | .mutefun.widescreen {
2 |   .header,
3 |   .module-player-side,
4 |   .fixedGroup {
5 |     visibility: hidden;
6 |     pointer-events: none;
7 |   }
8 | }
9 | 


--------------------------------------------------------------------------------
/src/utils/isUrl.ts:
--------------------------------------------------------------------------------
1 | export function isUrl(text: string) {
2 |   return /^((https?):\/\/)?([^!@#$%^&*?.\s-]([^!@#$%^&*?.\s]{0,63}[^!@#$%^&*?.\s])?\.)+[a-z]{2,6}\/?/.test(
3 |     text
4 |   )
5 | }
6 | 


--------------------------------------------------------------------------------
/src/adapter/gugufan/index.scss:
--------------------------------------------------------------------------------
 1 | .gugufan.widescreen {
 2 |   .header_nav0,
 3 |   .header_nav1,
 4 |   .top-back.hoa,
 5 |   .fixedGroup {
 6 |     visibility: hidden;
 7 |     pointer-events: none;
 8 |   }
 9 | }
10 | 


--------------------------------------------------------------------------------
/src/adapter/girigirilove/index.scss:
--------------------------------------------------------------------------------
 1 | .girigirilove.widescreen {
 2 |   .header_nav0,
 3 |   .header_nav1,
 4 |   .top-back.hoa,
 5 |   .fixedGroup {
 6 |     visibility: hidden;
 7 |     pointer-events: none;
 8 |   }
 9 | }
10 | 


--------------------------------------------------------------------------------
/src/utils/parseTime.ts:
--------------------------------------------------------------------------------
1 | export function parseTime(time = 0) {
2 |   time = Math.round(time)
3 |   return `${Math.floor(time / 60)
4 |     .toString()
5 |     .padStart(2, '0')}:${(time % 60).toString().padStart(2, '0')}`
6 | }
7 | 


--------------------------------------------------------------------------------
/src/utils/wait.ts:
--------------------------------------------------------------------------------
 1 | import { sleep } from './sleep'
 2 | 
 3 | export async function wait(selector: () => boolean) {
 4 |   let bool = selector()
 5 | 
 6 |   while (!bool) {
 7 |     await sleep()
 8 |     bool = selector()
 9 |   }
10 | }
11 | 


--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/feature.yml:
--------------------------------------------------------------------------------
 1 | name: 新功能/意见/建议
 2 | description: 有什么好的建议快提给我吧
 3 | body:
 4 |   - type: textarea
 5 |     id: desc
 6 |     attributes:
 7 |       label: 简要描述下需要的功能、意见或建议
 8 |       value:
 9 |     validations:
10 |       required: true
11 | 


--------------------------------------------------------------------------------
/src/utils/copy.ts:
--------------------------------------------------------------------------------
1 | export function copyToClipboard(element: JQuery | HTMLElement) {
2 |   var $temp = $('<textarea>')
3 |   $('body').append($temp)
4 |   $temp.val($(element).text()).trigger('select')
5 |   document.execCommand('copy')
6 |   $temp.remove()
7 | }
8 | 


--------------------------------------------------------------------------------
/src/utils/sleep.ts:
--------------------------------------------------------------------------------
 1 | export function sleep(ms?: number) {
 2 |   if (!ms) {
 3 |     return new Promise((resolve) => {
 4 |       requestAnimationFrame(resolve)
 5 |     })
 6 |   }
 7 | 
 8 |   return new Promise((resolve) => {
 9 |     setTimeout(resolve, ms)
10 |   })
11 | }
12 | 


--------------------------------------------------------------------------------
/src/adapter/index.ts:
--------------------------------------------------------------------------------
 1 | import './_iframe_player_parser'
 2 | 
 3 | import './agefans'
 4 | import './ntdm9'
 5 | import './bimiacg'
 6 | import './mutean'
 7 | import './cycanime'
 8 | import './xfani'
 9 | import './standalone'
10 | import './anime1'
11 | import './gugufan'
12 | import './girigirilove'
13 | 


--------------------------------------------------------------------------------
/src/utils/opencc.ts:
--------------------------------------------------------------------------------
 1 | import OpenCC from 'opencc-js'
 2 | 
 3 | export function opencc(text: string) {
 4 |   const cn2tw = OpenCC.Converter({ from: 'cn', to: 'tw' })
 5 |   const tw2cn = OpenCC.Converter({ from: 'tw', to: 'cn' })
 6 |   const cn = tw2cn(text)
 7 |   const tw = cn2tw(text)
 8 |   return { cn, tw }
 9 | }
10 | 


--------------------------------------------------------------------------------
/src/adapter/anime1/history.ts:
--------------------------------------------------------------------------------
 1 | import { renderHistory } from '../common/history'
 2 | 
 3 | export function historyModule() {
 4 |   const $btn = $(
 5 |     `<li class="menu-item">
 6 |       <a href="javascript:void(0)" >歷史</a>
 7 |     </li>`
 8 |   ).on('click', renderHistory)
 9 | 
10 |   $('.menu.nav-menu').append($btn)
11 | }
12 | 


--------------------------------------------------------------------------------
/types.d.ts:
--------------------------------------------------------------------------------
 1 | /// <reference types="bocchi/env" />
 2 | 
 3 | interface Window {
 4 |   [x: string]: any
 5 | }
 6 | 
 7 | declare function GM_getValue<T>(key: string): T | undefined
 8 | declare function GM_getValue<T>(key: string, defaultValue: T): T
 9 | declare function GM_setValue(key: string, value: any): void
10 | declare function GM_xmlhttpRequest(params: any): any
11 | 


--------------------------------------------------------------------------------
/src/adapter/bimiacg/index.scss:
--------------------------------------------------------------------------------
 1 | .bimi-wrapper {
 2 |   .play-full,
 3 |   #bkcl,
 4 |   marquee {
 5 |     display: none !important;
 6 |   }
 7 | 
 8 |   .k-episode-anchor:visited {
 9 |     color: white !important;
10 |   }
11 |   a.episode-active {
12 |     background: var(--k-player-primary-color) !important;
13 |     color: var(--k-player-color) !important;
14 |   }
15 | }
16 | 


--------------------------------------------------------------------------------
/src/adapter/standalone/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | // import './index.scss'
 3 | import play from './play'
 4 | 
 5 | runtime.register({
 6 |   domains: ['127.0.0.1', 'ironkinoko.github.io'],
 7 |   opts: [{ test: '*', run: play }],
 8 |   search: {
 9 |     getEpisode: () => '',
10 |     getSearchName: () => '',
11 |     getAnimeScope: () => 'standalone',
12 |   },
13 | })
14 | 


--------------------------------------------------------------------------------
/src/player/index.ts:
--------------------------------------------------------------------------------
 1 | export * from './Kplayer'
 2 | import { KPlayer } from './Kplayer'
 3 | import { setup as setupDanmaku } from './plugins/danmaku'
 4 | import { setup as setupShortcuts } from './plugins/shortcuts'
 5 | import { setup as setupAutoSeek } from './plugins/autoseek'
 6 | 
 7 | KPlayer.register(setupShortcuts)
 8 | KPlayer.register(setupDanmaku)
 9 | KPlayer.register(setupAutoSeek)
10 | 


--------------------------------------------------------------------------------
/src/utils/queryDom.ts:
--------------------------------------------------------------------------------
 1 | export function queryDom<T extends Element>(selector: string) {
 2 |   return new Promise<T>((resolve) => {
 3 |     let dom: JQuery<T>
 4 |     function search() {
 5 |       dom = $<T>(selector)
 6 |       if (dom.length === 0) {
 7 |         requestAnimationFrame(search)
 8 |       } else {
 9 |         resolve(dom[0])
10 |       }
11 |     }
12 |     search()
13 |   })
14 | }
15 | 


--------------------------------------------------------------------------------
/src/utils/parseToJSON.ts:
--------------------------------------------------------------------------------
 1 | export function parseToJSON<T = any>(raw: string) {
 2 |   return new Promise<T>((resolve, reject) => {
 3 |     const blob = new Blob([raw], { type: 'application/json' })
 4 | 
 5 |     const url = URL.createObjectURL(blob)
 6 |     fetch(url)
 7 |       .then((r) => r.json())
 8 |       .then(resolve)
 9 |       .catch(reject)
10 |       .finally(() => {
11 |         URL.revokeObjectURL(url)
12 |       })
13 |   })
14 | }
15 | 


--------------------------------------------------------------------------------
/public/subtitles.srt:
--------------------------------------------------------------------------------
 1 | 0
 2 | 00:00:00,000 --> 00:00:01,000
 3 | [SRT] We are in New York City
 4 | 
 5 | 1
 6 | 00:00:01,000 --> 00:00:02,000
 7 | [SRT] We're actually at the Lucern Hotel, just down the street
 8 | 
 9 | 2
10 | 00:00:02,000 --> 00:00:03,000
11 | [SRT] 三十年河东 三十年河西
12 | 
13 | 3
14 | 00:00:03,000 --> 00:00:04,000
15 | [SRT] And with me is Neil deGrasse Tyson
16 | 
17 | 4
18 | 00:00:04,000 --> 00:00:10,000
19 | [SRT] Astrophysicist, Director of the Hayden Planetarium
20 | 


--------------------------------------------------------------------------------
/public/subtitles.vtt:
--------------------------------------------------------------------------------
 1 | WEBVTT
 2 | 
 3 | 00:00.000 --> 00:01.000 vertical:rl
 4 | <v Roger Bingham>[VTT] We are in New York City
 5 | 
 6 | 00:01.000 --> 00:02.000
 7 | <v Roger Bingham>[VTT] We're actually at the Lucern Hotel, just down the street
 8 | 
 9 | 00:02.000 --> 00:03.000
10 | <v Roger Bingham>[VTT] 三十年河东 三十年河西
11 | 
12 | 00:03.000 --> 00:04.000
13 | <v Roger Bingham>[VTT] And with me is Neil deGrasse Tyson
14 | 
15 | 00:04.000 --> 00:10.000
16 | <v Roger Bingham>[VTT] Astrophysicist, Director of the Hayden Planetarium
17 | 


--------------------------------------------------------------------------------
/src/utils/popover.scss:
--------------------------------------------------------------------------------
 1 | .k-popover {
 2 |   position: relative;
 3 |   &-overlay {
 4 |     position: absolute;
 5 |     display: none;
 6 |     bottom: 100%;
 7 |     left: 50%;
 8 |     transform: translateX(-50%);
 9 |     z-index: 100;
10 |     padding-bottom: 20px;
11 |   }
12 |   &-content {
13 |     background: var(--k-player-background);
14 |     border-radius: 4px;
15 |     overflow-x: hidden;
16 |     overflow-y: auto;
17 |     cursor: initial;
18 |     max-height: var(--k-player-popover-max-height, 70vh);
19 |     &::-webkit-scrollbar {
20 |       display: none;
21 |     }
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/src/utils/message.scss:
--------------------------------------------------------------------------------
 1 | #k-player-message {
 2 |   z-index: 999;
 3 |   position: absolute;
 4 |   left: 20px;
 5 |   bottom: 60px;
 6 |   .k-player-message-item {
 7 |     display: block;
 8 |     width: max-content;
 9 |     padding: 8px 16px;
10 |     background: var(--k-player-background);
11 |     border-radius: 4px;
12 |     color: white;
13 |     font-size: 14px;
14 |     white-space: nowrap;
15 |     overflow: hidden;
16 |     box-sizing: border-box;
17 |     margin-top: 4px;
18 |     &:hover {
19 |       background: var(--k-player-background-highlight);
20 |       transition: all 0.3s;
21 |     }
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/src/utils/renderKey.ts:
--------------------------------------------------------------------------------
 1 | const isMac = /macintosh|mac os x/i.test(navigator.userAgent)
 2 | 
 3 | const KeyMap = {
 4 |   ArrowUp: '↑',
 5 |   ArrowDown: '↓',
 6 |   ArrowLeft: '←',
 7 |   ArrowRight: '→',
 8 |   ctrl: 'Ctrl',
 9 |   alt: 'Alt',
10 |   shift: 'Shift',
11 | }
12 | 
13 | const MacKeyMap = {
14 |   ctrl: '⌃',
15 |   meta: '⌘',
16 |   alt: '⌥',
17 |   shift: '⇧',
18 | }
19 | if (isMac) {
20 |   Object.assign(KeyMap, MacKeyMap)
21 | }
22 | 
23 | export function renderKey(key: string) {
24 |   Object.entries(KeyMap).forEach(([k, v]) => {
25 |     key = key.replace(new RegExp(k, 'i'), v)
26 |   })
27 |   return key
28 | }
29 | 


--------------------------------------------------------------------------------
/src/adapter/common/history.scss:
--------------------------------------------------------------------------------
 1 | .k-episode-anchor:visited {
 2 |   color: rgb(220, 53, 69) !important;
 3 | }
 4 | .k-his-table {
 5 |   width: 100%;
 6 |   line-height: 1.4;
 7 |   border-spacing: 0;
 8 |   border-collapse: separate;
 9 |   th,
10 |   td {
11 |     padding: 6px 8px;
12 |   }
13 | 
14 |   tr {
15 |     transition: background 0.3s ease;
16 |   }
17 | 
18 |   tr:hover {
19 |     background: #f1f1f1;
20 |   }
21 | 
22 |   a {
23 |     text-decoration: none;
24 |     transition: color 0.15s ease;
25 |   }
26 |   a:hover {
27 |     color: var(--k-player-primary-color);
28 |   }
29 | 
30 |   .k-btn {
31 |     color: var(--k-player-primary-color);
32 |   }
33 | }
34 | 


--------------------------------------------------------------------------------
/src/utils/alert.ts:
--------------------------------------------------------------------------------
 1 | import './alert.scss'
 2 | 
 3 | export function alert(html: string) {
 4 |   return `<div class="k-alert k-alert-info">
 5 |   <svg class="k-alert-icon" viewBox="64 64 896 896" focusable="false" data-icon="info-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true">
 6 |     <path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272zm-32-344a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"></path>
 7 |   </svg>
 8 |   <div class="k-alert-content">
 9 |     <div class="k-alert-message">${html}</div>
10 |   </div>
11 | </div>`
12 | }
13 | 


--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="zh">
 3 |   <head>
 4 |     <meta charset="UTF-8" />
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6 |     <title>agefans enhance 在线播放器</title>
 7 |     <style>
 8 |       html,
 9 |       body {
10 |         margin: 0;
11 |         padding: 0;
12 |         width: 100%;
13 |         height: 100%;
14 |       }
15 |     </style>
16 |   </head>
17 |   <body>
18 |     <div id="player">
19 |       请先安装<a
20 |         target="_blank"
21 |         ref="noopener noreferrer"
22 |         href="https://greasyfork.org/scripts/424023"
23 |         >脚本</a
24 |       >再使用该页面
25 |     </div>
26 |   </body>
27 | </html>
28 | 


--------------------------------------------------------------------------------
/src/adapter/ntdm9/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { renderFavoriteList } from './favorite'
 3 | import { iframePlayer, runInTop } from './play'
 4 | 
 5 | runtime.register({
 6 |   domains: ['.ntdm8.'],
 7 |   opts: [
 8 |     { test: '*', run: iframePlayer.createHistory },
 9 |     { test: /^\/$/, run: renderFavoriteList },
10 |     { test: '/play', run: runInTop },
11 |     { test: '/play', run: iframePlayer.runInIframe, runInIframe: true },
12 |   ],
13 |   search: {
14 |     name: 'NT动漫',
15 |     search: (cn) =>
16 |       `http://www.ntdm8.com/search/-------------.html?wd=${cn}&page=1`,
17 |     getAnimeScope: () => window.location.pathname.match(/\/play\/(\d+)-/)![1],
18 |   },
19 | })
20 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/types.ts:
--------------------------------------------------------------------------------
 1 | import { Comment as BaseComment } from '@ironkinoko/danmaku'
 2 | 
 3 | export type RawComments = {
 4 |   count: number
 5 |   comments: {
 6 |     m: string
 7 |     /** time,type,color,uid */
 8 |     p: string
 9 |   }[]
10 | }
11 | 
12 | export interface Comment extends BaseComment {
13 |   user: { source: string; id: string }
14 | }
15 | 
16 | export interface Anime {
17 |   id: string
18 |   name: string
19 | }
20 | export interface Episode {
21 |   id: number
22 |   name: string
23 | }
24 | 
25 | export enum Commands {
26 |   danmakuSwitch = 'switchDanmaku',
27 |   danmakuSyncBack = 'danmakuSyncBack',
28 |   danmakuSyncForward = 'danmakuSyncForward',
29 |   danmakuSyncRestore = 'danmakuSyncRestore',
30 | }
31 | 


--------------------------------------------------------------------------------
/src/utils/alert.scss:
--------------------------------------------------------------------------------
 1 | .k-alert {
 2 |   margin-bottom: 16px;
 3 |   box-sizing: border-box;
 4 |   color: black;
 5 |   font-size: 14px;
 6 |   font-variant: tabular-nums;
 7 |   line-height: 1.5715;
 8 |   list-style: none;
 9 |   font-feature-settings: 'tnum';
10 |   position: relative;
11 |   display: flex;
12 |   align-items: center;
13 |   padding: 8px 15px;
14 |   word-wrap: break-word;
15 |   border-radius: 2px;
16 |   &-icon {
17 |     margin-right: 8px;
18 |     display: block;
19 |     color: var(--k-player-primary-color);
20 |   }
21 |   &-content {
22 |     flex: 1;
23 |     min-width: 0;
24 |   }
25 |   &-info {
26 |     background-color: var(--k-player-primary-color-highlight);
27 |     border: 1px solid var(--k-player-primary-color);
28 |   }
29 | }
30 | 


--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/bug_report.yml:
--------------------------------------------------------------------------------
 1 | name: Bug 报告
 2 | description: 出现什么问题了快提交给我吧，以便改进脚本体验
 3 | labels: [bug]
 4 | body:
 5 |   - type: input
 6 |     id: url
 7 |     attributes:
 8 |       label: Bug 网页链接
 9 |       description: 哪个页面出现的 Bug，把链接填写下
10 |       placeholder: 请填写网页链接
11 |     validations:
12 |       required: true
13 |   - type: input
14 |     id: browser
15 |     attributes:
16 |       label: 浏览器信息
17 |       placeholder: 使用的浏览器的名称和版本，如果知道 UserAgent 信息就更好了
18 |       description: 可在 https://tool.chinaz.com/useragent/ 中查看当前的UserAgent
19 |     validations:
20 |       required: false
21 |   - type: textarea
22 |     id: desc
23 |     attributes:
24 |       label: 简要描述下问题
25 |       description: 你可以使用【?】键打开【脚本信息】使用【报错意见】中的【GitHub Issues】提交问题，这样可以带上更多有效的信息
26 |     validations:
27 |       required: false
28 | 


--------------------------------------------------------------------------------
/src/adapter/agefans/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime/index'
 2 | import './index.scss'
 3 | import { mobilePlayModule } from './mobilePlay'
 4 | import { playModule, playModuleInIframe } from './play'
 5 | 
 6 | runtime.register({
 7 |   domains: ['age.tv', 'agemys', 'agefans', 'agedm'],
 8 |   opts: [
 9 |     {
10 |       test: '*',
11 |       run: () => {
12 |         $('body').addClass('agefans-wrapper')
13 |       },
14 |     },
15 |     { test: '/play', run: playModule },
16 |     { test: '/play', run: playModuleInIframe, runInIframe: true },
17 |     { test: () => location.hash.includes('/play/'), run: mobilePlayModule },
18 |   ],
19 |   search: {
20 |     name: 'agefans',
21 |     search: (cn) => `https://www.age.tv/search?query=${cn}`,
22 |     getAnimeScope: () => window.location.href.match(/\/play\/(\d+)/)![1],
23 |   },
24 | })
25 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/parser.ts:
--------------------------------------------------------------------------------
 1 | import { Comment } from './types'
 2 | import { convert32ToHex } from './utils'
 3 | 
 4 | export function parsePakkuDanmakuXML(xml: string) {
 5 |   const $xml = $(xml)
 6 | 
 7 |   return $xml
 8 |     .find('d')
 9 |     .map((_, el) => {
10 |       const p = el.getAttribute('p')!
11 |       const [
12 |         time,
13 |         type,
14 |         fontSize,
15 |         color,
16 |         sendTime,
17 |         pool,
18 |         senderHash,
19 |         id,
20 |         weight,
21 |       ] = p.split(',')
22 | 
23 |       return {
24 |         mode: ({ 1: 'rtl', 4: 'bottom', 5: 'top' } as const)[type] || 'rtl',
25 |         text: el.textContent!,
26 |         time: parseFloat(time),
27 |         style: { color: convert32ToHex(color) },
28 |         user: { source: 'Pakku', id: senderHash },
29 |       } as Comment
30 |     })
31 |     .toArray()
32 | }
33 | 


--------------------------------------------------------------------------------
/src/utils/execInUnsafeWindow.ts:
--------------------------------------------------------------------------------
 1 | export function execInUnsafeWindow(fn: () => any) {
 2 |   return new Promise<any>((resolve, reject) => {
 3 |     const contextId = Math.random().toFixed(16).slice(2)
 4 |     // content context
 5 |     window.addEventListener('message', function listener(e) {
 6 |       if (e.data && e.data.contextId === contextId) {
 7 |         const data = e.data.data
 8 |         resolve(data)
 9 |         window.removeEventListener('message', listener)
10 |         script.remove()
11 |       }
12 |     })
13 | 
14 |     // page context
15 |     const code = `
16 |     ;(async function runInUnsafeWindow() {
17 |       const data = await (${fn.toString()})()
18 |       window.postMessage({ contextId: '${contextId}', data }, '*')
19 |     })()
20 |     `
21 | 
22 |     const script = document.createElement('script')
23 |     script.textContent = code
24 |     document.body.appendChild(script)
25 |   })
26 | }
27 | 


--------------------------------------------------------------------------------
/src/utils/tabs.scss:
--------------------------------------------------------------------------------
 1 | .k-tab {
 2 |   flex: 1;
 3 |   white-space: nowrap;
 4 |   cursor: pointer;
 5 |   text-align: center;
 6 |   padding: 8px 0;
 7 | 
 8 |   &s {
 9 |     display: flex;
10 |     position: relative;
11 |     border-bottom: 1px solid rgba($color: white, $alpha: 0.2);
12 |     &-wrapper {
13 |       text-align: left;
14 |       overflow: hidden;
15 |       * {
16 |         box-sizing: border-box;
17 |       }
18 |     }
19 |   }
20 | 
21 |   &-indicator {
22 |     position: absolute;
23 |     width: 0;
24 |     height: 1px;
25 |     left: 0;
26 |     bottom: -1px;
27 |     background-color: var(--k-player-primary-color);
28 |     transition: all 0.3s;
29 |   }
30 | 
31 |   &s-panes {
32 |     display: flex;
33 |     flex-wrap: nowrap;
34 |     transition: all 0.3s;
35 |   }
36 | 
37 |   &-pane {
38 |     flex: 0 0 100%;
39 |     width: 100%;
40 |     padding: 8px;
41 |     position: relative;
42 |   }
43 | }
44 | 


--------------------------------------------------------------------------------
/src/player/plugins/autoseek/index.scss:
--------------------------------------------------------------------------------
 1 | #k-autoseek-config {
 2 |   line-height: 32px;
 3 |   font-size: 14px;
 4 | 
 5 |   .k-autoseek-config-tips {
 6 |     font-size: 12px;
 7 |     color: #666;
 8 |     margin-top: 8px;
 9 |     line-height: 1.6;
10 | 
11 |     summary {
12 |       cursor: pointer;
13 |     }
14 | 
15 |     .k-autoseek-config-tips-title {
16 |       color: #232323;
17 |       font-weight: 500;
18 |       margin-bottom: 4px;
19 |       margin-top: 8px;
20 |     }
21 |   }
22 | }
23 | 
24 | #k-autoseek-overlay {
25 |   position: absolute;
26 |   inset: 0;
27 |   pointer-events: none;
28 |   z-index: 1000;
29 | 
30 |   .k-autoseek-segment {
31 |     position: absolute;
32 |     background: white;
33 |     top: 50%;
34 |     transform: translateY(-50%);
35 | 
36 |     width: calc(var(--plyr-range-track-height) + 2px);
37 |     height: calc(var(--plyr-range-track-height) + 2px);
38 |     border-radius: 50%;
39 |   }
40 | }
41 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/utils.ts:
--------------------------------------------------------------------------------
 1 | export function normalizeKeyEvent(e: KeyboardEvent) {
 2 |   const SPECIAL_KEY_EN = '`-=[]\\;\',./~!@#$%^&*()_+{}|:"<>?'.split('')
 3 |   const SPECIAL_KEY_ZH =
 4 |     '·-=【】、；‘，。/～！@#¥%…&*（）—+「」｜：“《》？'.split('')
 5 | 
 6 |   let key = e.key
 7 | 
 8 |   if (e.code === 'Space') {
 9 |     key = 'Space'
10 |   }
11 | 
12 |   // trans a-z to A-Z
13 |   if (/^[a-z]$/.test(key)) {
14 |     key = key.toUpperCase()
15 |   } else if (SPECIAL_KEY_ZH.includes(key)) {
16 |     key = SPECIAL_KEY_EN[SPECIAL_KEY_ZH.indexOf(key)]
17 |   }
18 | 
19 |   let keyArr = []
20 | 
21 |   e.ctrlKey && keyArr.push('ctrl')
22 |   e.metaKey && keyArr.push('meta')
23 |   e.shiftKey && !SPECIAL_KEY_EN.includes(key) && keyArr.push('shift')
24 |   e.altKey && keyArr.push('alt')
25 | 
26 |   if (!/Control|Meta|Shift|Alt/i.test(key)) keyArr.push(key)
27 | 
28 |   keyArr = [...new Set(keyArr)]
29 | 
30 |   return keyArr.join(' ')
31 | }
32 | 


--------------------------------------------------------------------------------
/src/utils/message.ts:
--------------------------------------------------------------------------------
 1 | import './message.scss'
 2 | export class Message {
 3 |   private $message: JQuery<HTMLDivElement>
 4 |   private MaxLength = 5
 5 |   constructor(selector: string | JQuery) {
 6 |     this.$message = $('<div id="k-player-message">')
 7 |     this.$message.appendTo($(selector as any))
 8 |   }
 9 | 
10 |   info(message: JQuery | string, ms = 2000) {
11 |     if (this.$message.children().length > this.MaxLength) {
12 |       this.$message.children().first().remove()
13 |     }
14 | 
15 |     return new Promise<void>((resolve) => {
16 |       $(`<div class="k-player-message-item"></div>`)
17 |         .append(message)
18 |         .hide()
19 |         .appendTo(this.$message)
20 |         .show(150)
21 |         .delay(ms)
22 |         .hide(150, function () {
23 |           $(this).remove()
24 |           resolve()
25 |         })
26 |     })
27 |   }
28 | 
29 |   destroy() {
30 |     this.$message.empty()
31 |   }
32 | }
33 | 


--------------------------------------------------------------------------------
/src/utils/keybind.ts:
--------------------------------------------------------------------------------
 1 | const SHIFT_KEY = '~!@#$%^&*()_+{}|:"<>?' + '～！@#¥%…&*（）——+「」｜：“《》？'
 2 | 
 3 | export function keybind(
 4 |   keys: string[],
 5 |   cb: (e: KeyboardEvent, key: string) => void
 6 | ) {
 7 |   const isMac = /macintosh|mac os x/i.test(navigator.userAgent)
 8 |   keys = keys.filter((key) => !key.includes(isMac ? 'ctrl' : 'meta'))
 9 |   $(window).on('keydown', (e) => {
10 |     if (document.activeElement?.tagName === 'INPUT') return
11 | 
12 |     let keyArr = []
13 | 
14 |     e.ctrlKey && keyArr.push('ctrl')
15 |     e.metaKey && keyArr.push('meta')
16 |     e.shiftKey && !SHIFT_KEY.includes(e.key) && keyArr.push('shift')
17 |     e.altKey && keyArr.push('alt')
18 | 
19 |     if (!['Control', 'Meta', 'Shift', 'Alt'].includes(e.key)) {
20 |       keyArr.push(e.key)
21 |     }
22 | 
23 |     keyArr = [...new Set(keyArr)]
24 | 
25 |     const key = keyArr.join('+')
26 | 
27 |     if (keys.includes(key)) {
28 |       cb(e.originalEvent!, key)
29 |     }
30 |   })
31 | }
32 | 


--------------------------------------------------------------------------------
/src/utils/request.ts:
--------------------------------------------------------------------------------
 1 | export interface Opts {
 2 |   url: string
 3 |   method?: 'GET' | 'POST'
 4 |   params?: any
 5 |   headers?: Record<string, string>
 6 | }
 7 | 
 8 | export function request<T = any>(opts: Opts) {
 9 |   let { url, method, params } = opts
10 | 
11 |   if (params) {
12 |     let u = new URL(url)
13 |     Object.keys(params).forEach((key) => {
14 |       const value = params[key]
15 |       if (value !== undefined && value !== null) {
16 |         u.searchParams.set(key, params[key])
17 |       }
18 |     })
19 |     url = u.toString()
20 |   }
21 | 
22 |   return new Promise<T>((resolve, reject) => {
23 |     console.log('[agefans-enhance]', url)
24 |     GM_xmlhttpRequest({
25 |       url,
26 |       method: method || 'GET',
27 |       responseType: 'json',
28 |       headers: opts.headers,
29 |       onload: (res: any) => {
30 |         console.log('[agefans-enhance]', res, res.response)
31 |         resolve(res.response)
32 |       },
33 |       onerror: reject,
34 |     })
35 |   })
36 | }
37 | 


--------------------------------------------------------------------------------
/src/adapter/agefans/mobilePlay.ts:
--------------------------------------------------------------------------------
 1 | import { wait } from '../../utils/wait'
 2 | import { defineIframePlayer } from '../common/defineIframePlayer'
 3 | 
 4 | function getActive() {
 5 |   return $('.van-grid-item.van-grid-item--active')
 6 | }
 7 | function switchPart(next: boolean) {
 8 |   const $active = getActive()
 9 | 
10 |   let $nextActive = $active[next ? 'next' : 'prev']()
11 | 
12 |   $nextActive.get(0)?.click()
13 | 
14 |   return undefined
15 | }
16 | 
17 | const iframePlayer = defineIframePlayer({
18 |   iframeSelector: '#playerIFrame iframe',
19 |   getActive,
20 |   setActive: (href) => {},
21 |   search: {
22 |     getSearchName: () => $('.detail-box h2').text(),
23 |     getEpisode: () => getActive().text(),
24 |   },
25 |   getEpisodeList: () => $('.video-source-box .van-grid-item'),
26 |   getSwitchEpisodeURL: (next) => switchPart(next),
27 | })
28 | 
29 | export async function mobilePlayModule() {
30 |   await wait(() => getActive().length > 0)
31 | 
32 |   iframePlayer.runInTop()
33 | }
34 | export function playModuleInIframe() {
35 |   iframePlayer.runInIframe()
36 | }
37 | 


--------------------------------------------------------------------------------
/public/subtitles.ass:
--------------------------------------------------------------------------------
 1 | [Script Info]
 2 | ; Script generated by Ebby.co
 3 | ScriptType: v4.00+
 4 | PlayResX: 384
 5 | PlayResY: 288
 6 | ScaledBorderAndShadow: yes
 7 | 
 8 | [V4+ Styles]
 9 | Format: Name, Fontname, Fontsize, PrimaryColour, SecondaryColour, OutlineColour, BackColour, Bold, Italic, Underline, StrikeOut, ScaleX, ScaleY, Spacing, Angle, BorderStyle, Outline, Shadow, Alignment, MarginL, MarginR, MarginV, Encoding
10 | Style: Default,Arial,16,&Hffffff,&Hffffff,&H0,&H0,0,0,0,0,100,100,0,0,1,1,0,2,10,10,10,0
11 | 
12 | [Events]
13 | Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
14 | Dialogue: 0,0:00:00.00,0:00:01.00,Default,,0,0,0,,[ASS] We are in New York City
15 | Dialogue: 0,0:00:01.00,0:00:02.00,Default,,0,0,0,,[ASS] We're actually at the Lucern Hotel, just down the street
16 | Dialogue: 0,0:00:02.00,0:00:03.00,Default,,0,0,0,,[ASS] 三十年河东 三十年河西
17 | Dialogue: 0,0:00:03.00,0:00:04.00,Default,,0,0,0,,[ASS] And with me is Neil deGrasse Tyson
18 | Dialogue: 0,0:00:04.00,0:00:10.00,Default,,0,0,0,,[ASS] Astrophysicist, Director of the Hayden Planetarium
19 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2021 IronKinoko
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/help/index.ts:
--------------------------------------------------------------------------------
 1 | import { keybind } from '../../../../utils/keybind'
 2 | import { modal } from '../../../../utils/modal'
 3 | import { scriptInfo } from './showHelp'
 4 | 
 5 | const GlobalKey = 'show-help-info'
 6 | 
 7 | export function help() {
 8 |   if (!document.fullscreenElement) {
 9 |     const video = $('#k-player')[0] as HTMLVideoElement
10 | 
11 |     if (parent !== self) {
12 |       parent.postMessage(
13 |         {
14 |           key: GlobalKey,
15 |           video: video
16 |             ? {
17 |                 src: video.currentSrc,
18 |                 videoWidth: video.videoWidth,
19 |                 videoHeight: video.videoHeight,
20 |               }
21 |             : null,
22 |         },
23 |         '*'
24 |       )
25 |       return
26 |     }
27 | 
28 |     showHelp(video)
29 |   }
30 | }
31 | 
32 | function showHelp(video: any) {
33 |   if ($('.script-info').length) return
34 | 
35 |   modal({
36 |     className: 'script-info',
37 |     title: 'agefans Enhance',
38 |     content: scriptInfo(video),
39 |   })
40 | }
41 | 
42 | keybind(['?', '？'], help)
43 | window.addEventListener('message', (e) => {
44 |   if (e.data?.key !== GlobalKey) return
45 |   showHelp(e.data.video)
46 | })
47 | 


--------------------------------------------------------------------------------
/src/adapter/anime1/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { historyModule } from './history'
 3 | import './index.scss'
 4 | import { runInSingle, runInCategory } from './play'
 5 | 
 6 | runtime.register({
 7 |   domains: ['anime1.me'],
 8 |   opts: [
 9 |     {
10 |       test: '*',
11 |       run: () => {
12 |         $('html').addClass('anime1')
13 |         historyModule()
14 |       },
15 |     },
16 |     { test: 'category', run: runInCategory },
17 |     { test: /^\/\d+/, run: runInSingle },
18 |   ],
19 |   search: {
20 |     name: 'Anime1',
21 |     search: (cn, tw) => `https://anime1.me/?s=${tw}`,
22 |     getSearchName: () => {
23 |       return $('.entry-title')
24 |         .text()
25 |         .replace(/\[\d+\]/, '')
26 |         .trim()
27 |     },
28 |     getEpisode: () => {
29 |       try {
30 |         return $('.entry-title')
31 |           .text()
32 |           .match(/\[(\d+)\]/)![1]
33 |           .replace(/^0+/, '')
34 |       } catch (error) {
35 |         return ''
36 |       }
37 |     },
38 |     getAnimeScope: () => {
39 |       try {
40 |         const target = $<HTMLAnchorElement>('a:contains("全集連結")')[0]
41 |         const url = new URL(target.href)
42 |         return url.searchParams.get('cat')!
43 |       } catch (error) {
44 |         return ''
45 |       }
46 |     },
47 |   },
48 | })
49 | 


--------------------------------------------------------------------------------
/src/adapter/standalone/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { isUrl } from '../../utils/isUrl'
 3 | import { local } from '../../utils/storage'
 4 | 
 5 | export default function main() {
 6 |   replacePlayer()
 7 | }
 8 | 
 9 | function getUrlId(url: string) {
10 |   const key = 'k-player-standalone-url-store'
11 |   const store = local.getItem<Record<string, string>>(key, {})
12 |   let id = store[url]
13 |   if (!id) {
14 |     id = Math.random().toString(36).slice(2)
15 |     store[url] = id
16 |     local.setItem(key, store)
17 |   }
18 | 
19 |   return id
20 | }
21 | 
22 | function replacePlayer() {
23 |   const player = new KPlayer('#player')
24 | 
25 |   player.message.info(
26 |     '请使用Ctrl+V粘贴视频地址，或者拖拽视频文件/链接到页面',
27 |     60000
28 |   )
29 | 
30 |   player.on('loadstart', (e) => {
31 |     player.message.destroy()
32 |     const id = getUrlId(player.src)
33 |     history.replaceState(null, '', `#${id}`)
34 |   })
35 |   window.addEventListener('paste', (e) => {
36 |     const text = e.clipboardData?.getData('text')
37 | 
38 |     if (text && isUrl(text)) {
39 |       player.src = text
40 |     }
41 |   })
42 | 
43 |   if (process.env.NODE_ENV === 'development') {
44 |     // a test video link
45 |     player.src = 'https://media.w3.org/2010/05/video/movie_300.mp4'
46 |     player.plyr.loop = true
47 |   }
48 | }
49 | 


--------------------------------------------------------------------------------
/src/adapter/girigirilove/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { iframePlayer, runInTop, parser } from './play'
 3 | import './index.scss'
 4 | 
 5 | runtime.register({
 6 |   domains: ['.girigirilove.'],
 7 |   opts: [
 8 |     { test: '/playGV', run: runInTop },
 9 |     { test: '/playGV', run: iframePlayer.runInIframe, runInIframe: true },
10 |     { test: '/addons/aplyer', run: parser, runInIframe: true },
11 |   ],
12 |   search: {
13 |     name: 'girigiri爱',
14 |     search: (cn) =>
15 |       `https://bgm.girigirilove.com/search/-------------/?wd=${cn}`,
16 |     getSearchName: () => {
17 |       return new Promise((resolve) => {
18 |         const fn = (e: MessageEvent<any>) => {
19 |           if (e.data.key === 'getSearchName') {
20 |             resolve(e.data.name)
21 |             window.removeEventListener('message', fn)
22 |           }
23 |         }
24 |         window.addEventListener('message', fn)
25 |         parent.postMessage({ key: 'getSearchName' }, '*')
26 |       })
27 |     },
28 |     getEpisode: () => {
29 |       return new Promise((resolve) => {
30 |         const fn = (e: MessageEvent<any>) => {
31 |           if (e.data.key === 'getEpisode') {
32 |             resolve(e.data.name)
33 |             window.removeEventListener('message', fn)
34 |           }
35 |         }
36 |         window.addEventListener('message', fn)
37 |         parent.postMessage({ key: 'getEpisode' }, '*')
38 |       })
39 |     },
40 |     getAnimeScope: () =>
41 |       window.location.href.match(/\/playGV(\d+)-/)?.[1] || '',
42 |   },
43 | })
44 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # agefans enhance
 2 | 
 3 | 增强网站播放功能，实现自动换集、画中画、历史记录、断点续播、弹幕等功能
 4 | 
 5 | ## 网站适配列表
 6 | 
 7 | - [agefans](http://www.age.tv)
 8 | - [NT 动漫](https://www.ntdm8.com)
 9 | - [bimiacg](http://www.bimiacg10.net)
10 | - [MuteFun](https://www.mutean.com)
11 | - [次元城](https://www.ciyuancheng.net)
12 | - [稀饭动漫](https://dm.xifanacg.com)
13 | - [Anime1](https://anime1.me)
14 | - [咕咕番](https://www.gugu3.com)
15 | - [girigiri 爱](https://anime.girigirilove.com/)
16 | - [独立播放器](https://ironkinoko.github.io/agefans-enhance/)
17 | 
18 | **请使用 <kbd>?</kbd> 键查看脚本信息与快捷键**
19 | 
20 | **请使用 <kbd>?</kbd> 键查看脚本信息与快捷键**
21 | 
22 | **请使用 <kbd>?</kbd> 键查看脚本信息与快捷键**
23 | 
24 | ## 特性
25 | 
26 | 替换播放器，实现以下功能
27 | 
28 | - 弹幕
29 | - 画中画
30 | - 自动换集
31 | - 超多快捷键，支持自定义
32 | - 调整播放器外边框，适配视频比例
33 | - 记录播放位置，自动续播
34 | - 可以按 <kbd>?</kbd> 键调出脚本信息窗口，查看**视频信息**与**快捷键**
35 | - 多站点适配，可搜索相同视频资源/种子
36 | 
37 | ## 安装
38 | 
39 | 可以通过 [Greasy Fork](https://greasyfork.org/scripts/424023) 或 [GitHub](https://github.com/IronKinoko/agefans-enhance/raw/gh-pages/index.user.js) 安装
40 | 
41 | ## 权限声明
42 | 
43 | 1. `GM_xmlhttpRequest`
44 | 
45 |    - 脚本会请求有限的网络权限。仅用于访问弹幕查询功能需要链接到的 **dandanplay.net** 第三方域名
46 |    - 你可以从 **脚本编辑/设置/XHR 安全** 中管理网络权限
47 | 
48 | 2. `GM_getValue`, `GM_setValue`
49 | 
50 |    - 脚本会使用本地存储功能，用于在不同页面间保存 **播放器配置** 与 **agefans 历史浏览记录**
51 | 
52 | 3. `@include`
53 | 
54 |    - 脚本还匹配了 **agefans** 以外的一些链接，用于提供相同视频资源搜索功能
55 | 
56 | ## 预览
57 | 
58 | ![预览图片](https://raw.githubusercontent.com/IronKinoko/asset/master/agefans-enhance/preview.jpg)
59 | 
60 | ## 特别鸣谢
61 | 
62 | [弹弹 play](https://www.dandanplay.com/) 提供弹幕服务
63 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/types.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../Kplayer'
 2 | 
 3 | export interface CommandEvent {
 4 |   (this: KPlayer, event: KeyboardEvent): void
 5 | }
 6 | export interface Command {
 7 |   command: string
 8 |   keydown: CommandEvent
 9 |   keyup?: CommandEvent
10 | }
11 | export interface KeyBinding {
12 |   command: string
13 |   description: string
14 |   editable?: boolean
15 |   key: string
16 |   mac?: string
17 | }
18 | export interface CustomKeyBinding {
19 |   command: string
20 |   key: string
21 | }
22 | 
23 | export enum Commands {
24 |   forward5 = 'forward5',
25 |   backward5 = 'backward5',
26 |   forward30 = 'forward30',
27 |   backward30 = 'backward30',
28 |   forward60 = 'forward60',
29 |   backward60 = 'backward60',
30 |   forward90 = 'forward90',
31 |   backward90 = 'backward90',
32 |   togglePlay = 'togglePlay',
33 |   next = 'next',
34 |   prev = 'prev',
35 |   toggleWidescreen = 'toggleWidescreen',
36 |   Escape = 'Escape',
37 |   restoreSpeed = 'restoreSpeed',
38 |   increaseSpeed = 'increaseSpeed',
39 |   decreaseSpeed = 'decreaseSpeed',
40 |   temporaryIncreaseSpeed = 'temporaryIncreaseSpeed',
41 |   togglePIP = 'togglePIP',
42 |   internal = 'internal',
43 |   help = 'help',
44 |   prevFrame = 'prevFrame',
45 |   nextFrame = 'nextFrame',
46 |   toggleFullscreen = 'toggleFullscreen',
47 |   decreaseVolume = 'decreaseVolume',
48 |   increaseVolume = 'increaseVolume',
49 |   toggleMute = 'toggleMute',
50 |   forwardCustom = 'forwardCustom',
51 |   backwardCustom = 'backwardCustom',
52 |   recordCustomSeekTime = 'recordCustomSeekTime',
53 | }
54 | 


--------------------------------------------------------------------------------
/src/adapter/xfani/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { iframePlayer, runInTop, parser } from './play'
 3 | import './index.scss'
 4 | 
 5 | runtime.register({
 6 |   domains: ['.xifanacg.', 'player.moedot'],
 7 |   opts: [
 8 |     { test: '/watch', run: runInTop },
 9 |     { test: '/watch', run: iframePlayer.runInIframe, runInIframe: true },
10 |     {
11 |       test: () => location.hostname.includes('player.moedot'),
12 |       run: parser,
13 |       runInIframe: true,
14 |     },
15 |   ],
16 |   search: {
17 |     name: '稀饭动漫',
18 |     search: (cn) => `https://dm.xifanacg.com/search.html?wd=${cn}`,
19 |     getSearchName: () => {
20 |       return new Promise((resolve) => {
21 |         const fn = (e: MessageEvent<any>) => {
22 |           if (e.data.key === 'getSearchName') {
23 |             resolve(e.data.name)
24 |             window.removeEventListener('message', fn)
25 |           }
26 |         }
27 |         window.addEventListener('message', fn)
28 |         parent.postMessage({ key: 'getSearchName' }, '*')
29 |       })
30 |     },
31 |     getEpisode: () => {
32 |       return new Promise((resolve) => {
33 |         const fn = (e: MessageEvent<any>) => {
34 |           if (e.data.key === 'getEpisode') {
35 |             resolve(e.data.name)
36 |             window.removeEventListener('message', fn)
37 |           }
38 |         }
39 |         window.addEventListener('message', fn)
40 |         parent.postMessage({ key: 'getEpisode' }, '*')
41 |       })
42 |     },
43 |     getAnimeScope: () =>
44 |       window.location.href.match(/\/watch\/(\d+)\//)?.[1] || '',
45 |   },
46 | })
47 | 


--------------------------------------------------------------------------------
/src/adapter/mutean/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { iframePlayer, runInTop, parser } from './play'
 3 | import './index.scss'
 4 | 
 5 | runtime.register({
 6 |   domains: ['.mutedm.', '.mutean.', '.mute01.'],
 7 |   opts: [
 8 |     { test: '/vodplay', run: runInTop },
 9 |     { test: '/vodplay', run: iframePlayer.runInIframe, runInIframe: true },
10 |     {
11 |       test: ['/addons/dp/player/dp.php'],
12 |       run: parser,
13 |       runInIframe: true,
14 |     },
15 |   ],
16 |   search: {
17 |     name: 'MuteFun',
18 |     search: (cn) => `https://www.mutean.com/vodsearch/${cn}-------------.html`,
19 |     getSearchName: () => {
20 |       return new Promise((resolve) => {
21 |         const fn = (e: MessageEvent<any>) => {
22 |           if (e.data.key === 'getSearchName') {
23 |             resolve(e.data.name)
24 |             window.removeEventListener('message', fn)
25 |           }
26 |         }
27 |         window.addEventListener('message', fn)
28 |         parent.postMessage({ key: 'getSearchName' }, '*')
29 |       })
30 |     },
31 |     getEpisode: () => {
32 |       return new Promise((resolve) => {
33 |         const fn = (e: MessageEvent<any>) => {
34 |           if (e.data.key === 'getEpisode') {
35 |             resolve(e.data.name)
36 |             window.removeEventListener('message', fn)
37 |           }
38 |         }
39 |         window.addEventListener('message', fn)
40 |         parent.postMessage({ key: 'getEpisode' }, '*')
41 |       })
42 |     },
43 |     getAnimeScope: () =>
44 |       window.location.href.match(/\/vodplay\/(\d+)-/)?.[1] || '',
45 |   },
46 | })
47 | 


--------------------------------------------------------------------------------
/src/adapter/cycanime/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { iframePlayer, runInTop, parser } from './play'
 3 | import './index.scss'
 4 | 
 5 | runtime.register({
 6 |   domains: ['.cycanime.', '.cyc-anime.', '.cycani.', '.ciyuancheng.'],
 7 |   opts: [
 8 |     { test: '/watch', run: runInTop },
 9 |     { test: '/watch', run: iframePlayer.runInIframe, runInIframe: true },
10 |     {
11 |       test: () => location.hostname.includes('player.cycanime'),
12 |       run: parser,
13 |       runInIframe: true,
14 |     },
15 |   ],
16 |   search: {
17 |     name: '次元城',
18 |     search: (cn) => `https://www.cycani.org/search.html?wd=${cn}`,
19 |     getSearchName: () => {
20 |       return new Promise((resolve) => {
21 |         const fn = (e: MessageEvent<any>) => {
22 |           if (e.data.key === 'getSearchName') {
23 |             resolve(e.data.name)
24 |             window.removeEventListener('message', fn)
25 |           }
26 |         }
27 |         window.addEventListener('message', fn)
28 |         parent.postMessage({ key: 'getSearchName' }, '*')
29 |       })
30 |     },
31 |     getEpisode: () => {
32 |       return new Promise((resolve) => {
33 |         const fn = (e: MessageEvent<any>) => {
34 |           if (e.data.key === 'getEpisode') {
35 |             resolve(e.data.name)
36 |             window.removeEventListener('message', fn)
37 |           }
38 |         }
39 |         window.addEventListener('message', fn)
40 |         parent.postMessage({ key: 'getEpisode' }, '*')
41 |       })
42 |     },
43 |     getAnimeScope: () =>
44 |       window.location.href.match(/\/watch\/(\d+)\//)?.[1] || '',
45 |   },
46 | })
47 | 


--------------------------------------------------------------------------------
/src/adapter/cycanime/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { queryDom } from '../../utils/queryDom'
 3 | import { wait } from '../../utils/wait'
 4 | import { defineIframePlayer } from '../common/defineIframePlayer'
 5 | function getActive() {
 6 |   return $<HTMLAnchorElement>('.anthology-list-play li.on > a')
 7 | }
 8 | function switchPart(next: boolean) {
 9 |   return getActive().parent()[next ? 'next' : 'prev']().find('a')[0]?.href
10 | }
11 | 
12 | export function runInTop() {
13 |   $('body').addClass('cycanime')
14 |   iframePlayer.runInTop()
15 | }
16 | 
17 | export const iframePlayer = defineIframePlayer({
18 |   iframeSelector: '#playleft iframe',
19 |   getActive,
20 |   setActive: (href) => {
21 |     $<HTMLAnchorElement>('.anthology-list-play li a').each((_, el) => {
22 |       if (el.href === href) {
23 |         el.parentElement!.classList.add('ecnav-dt', 'on')
24 |         $('.play-on').insertAfter($(el).find('span'))
25 |       } else {
26 |         el.parentElement!.classList.remove('ecnav-dt', 'on')
27 |       }
28 |     })
29 |   },
30 |   search: {
31 |     getSearchName: () => $('.player-title-link').text(),
32 |     getEpisode: () => getActive().text(),
33 |   },
34 |   getEpisodeList: () => $('.anthology-list-play li a'),
35 |   getSwitchEpisodeURL: (next) => switchPart(next),
36 | })
37 | 
38 | export async function parser() {
39 |   const video = await queryDom<HTMLVideoElement>('video')
40 | 
41 |   await wait(() => !!video.currentSrc)
42 |   let url = video.currentSrc
43 |   video.src = ''
44 |   const player = new KPlayer('#mui-player', {
45 |     eventToParentWindow: true,
46 |   })
47 |   player.src = url
48 | }
49 | 


--------------------------------------------------------------------------------
/src/adapter/gugufan/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { iframePlayer, runInTop, parser, parser2 } from './play'
 3 | import './index.scss'
 4 | 
 5 | runtime.register({
 6 |   domains: ['.gugu3.'],
 7 |   opts: [
 8 |     { test: /^\/index.php\/vod\/play/, run: runInTop },
 9 |     {
10 |       test: /^\/index.php\/vod\/play/,
11 |       run: iframePlayer.runInIframe,
12 |       runInIframe: true,
13 |     },
14 |     { test: '/addons/dp/player', run: parser, runInIframe: true },
15 |     { test: '?url=', run: parser2, runInIframe: true },
16 |   ],
17 |   search: {
18 |     name: '咕咕番',
19 |     search: (cn) => `https://www.gugu3.com/index.php/vod/search.html?wd=${cn}`,
20 |     getSearchName: () => {
21 |       return new Promise((resolve) => {
22 |         const fn = (e: MessageEvent<any>) => {
23 |           if (e.data.key === 'getSearchName') {
24 |             resolve(e.data.name)
25 |             window.removeEventListener('message', fn)
26 |           }
27 |         }
28 |         window.addEventListener('message', fn)
29 |         parent.postMessage({ key: 'getSearchName' }, '*')
30 |       })
31 |     },
32 |     getEpisode: () => {
33 |       return new Promise((resolve) => {
34 |         const fn = (e: MessageEvent<any>) => {
35 |           if (e.data.key === 'getEpisode') {
36 |             resolve(e.data.name)
37 |             window.removeEventListener('message', fn)
38 |           }
39 |         }
40 |         window.addEventListener('message', fn)
41 |         parent.postMessage({ key: 'getEpisode' }, '*')
42 |       })
43 |     },
44 |     getAnimeScope: () => window.location.href.match(/\/id\/(\d+)\//)?.[1] || '',
45 |   },
46 | })
47 | 


--------------------------------------------------------------------------------
/src/adapter/girigirilove/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { queryDom } from '../../utils/queryDom'
 3 | import { wait } from '../../utils/wait'
 4 | import { defineIframePlayer } from '../common/defineIframePlayer'
 5 | function getActive() {
 6 |   return $<HTMLAnchorElement>('.anthology-list-play li.on > a')
 7 | }
 8 | function switchPart(next: boolean) {
 9 |   return getActive().parent()[next ? 'next' : 'prev']().find('a')[0]?.href
10 | }
11 | 
12 | export function runInTop() {
13 |   $('body').addClass('girigirilove')
14 |   $('.player-news,#buffer,#install').remove()
15 |   iframePlayer.runInTop()
16 | }
17 | 
18 | export const iframePlayer = defineIframePlayer({
19 |   iframeSelector: '#playleft iframe',
20 |   getActive,
21 |   setActive: (href) => {
22 |     $<HTMLAnchorElement>('.anthology-list-play li a').each((_, el) => {
23 |       if (el.href === href) {
24 |         el.parentElement!.classList.add('ecnav-dt', 'on')
25 |         $('.play-on').insertAfter($(el).find('span'))
26 |       } else {
27 |         el.parentElement!.classList.remove('ecnav-dt', 'on')
28 |       }
29 |     })
30 |   },
31 |   search: {
32 |     getSearchName: () => $('.player-title-link').text(),
33 |     getEpisode: () => getActive().text(),
34 |   },
35 |   getEpisodeList: () => $('.anthology-list-play li a'),
36 |   getSwitchEpisodeURL: (next) => switchPart(next),
37 | })
38 | 
39 | export async function parser() {
40 |   const video = await queryDom<HTMLVideoElement>('video')
41 | 
42 |   await wait(() => !!video.currentSrc)
43 |   video.src = ''
44 | 
45 |   const player = new KPlayer('#APlayer', {
46 |     eventToParentWindow: true,
47 |   })
48 |   player.src = new URLSearchParams(location.search).get('url')!
49 | }
50 | 


--------------------------------------------------------------------------------
/src/utils/tabs.ts:
--------------------------------------------------------------------------------
 1 | import './tabs.scss'
 2 | 
 3 | interface Tab {
 4 |   name: string
 5 |   className?: string
 6 |   content: string | JQuery | (() => string | JQuery)
 7 | }
 8 | export function tabs(opts: Tab[]) {
 9 |   const tabsHTML: string[] = []
10 |   const tabsContentHTML: JQuery[] = []
11 |   opts.forEach((tab, idx) => {
12 |     const tabHTML = `<div class="k-tab" data-idx="${idx}">${tab.name}</div>`
13 |     const $contentHTML = $(
14 |       `<div class="k-tab-pane ${tab.className || ''}"></div>`
15 |     )
16 | 
17 |     $contentHTML.append(
18 |       typeof tab.content === 'function' ? tab.content() : tab.content
19 |     )
20 | 
21 |     tabsHTML.push(tabHTML)
22 |     tabsContentHTML.push($contentHTML)
23 |   })
24 | 
25 |   const $root = $(`<div class="k-tabs-wrapper">
26 |     <div class="k-tabs">
27 |       ${tabsHTML.join('')}
28 |       <div class="k-tab-indicator"></div>
29 |     </div>
30 |     <div class="k-tabs-panes"></div>
31 |   </div>`)
32 | 
33 |   $root.find('.k-tabs-panes').append(...tabsContentHTML)
34 | 
35 |   const $indicator = $root.find('.k-tab-indicator')
36 | 
37 |   $root.find('.k-tab').on('click', (e) => {
38 |     $root.find('.k-tab').removeClass('active')
39 |     const $tab = $(e.target).addClass('active')
40 |     const idx = parseInt($tab.attr('data-idx') as string)
41 |     $root.find('.k-tabs-panes').css('transform', `translateX(-${idx * 100}%)`)
42 | 
43 |     function updateIndictor() {
44 |       const width = $tab.outerWidth()
45 |       if (width) $indicator.css({ width, left: idx * width })
46 |       else requestAnimationFrame(updateIndictor)
47 |     }
48 |     updateIndictor()
49 |   })
50 | 
51 |   $root.find('.k-tab:first').trigger('click')
52 | 
53 |   return $root
54 | }
55 | 


--------------------------------------------------------------------------------
/src/adapter/bimiacg/index.ts:
--------------------------------------------------------------------------------
 1 | import './index.scss'
 2 | import { runtime } from '../../runtime/index'
 3 | import { parser, runInTop, iframePlayer } from './play'
 4 | 
 5 | runtime.register({
 6 |   domains: [/bimiacg\d+.net/],
 7 |   opts: [
 8 |     {
 9 |       test: '*',
10 |       setup: () => $('body').addClass('bimi-wrapper'),
11 |       run: iframePlayer.createHistory,
12 |     },
13 |     { test: /^\/video\/\d+\/play\//, run: runInTop },
14 |     {
15 |       test: /^\/video\/\d+\/play\//,
16 |       run: iframePlayer.runInIframe,
17 |       runInIframe: true,
18 |     },
19 |     { test: '/static/danmu', runInIframe: true, run: parser },
20 |   ],
21 |   search: {
22 |     name: 'BIMI动漫',
23 |     search: (cn) => `http://www.bimiacg10.net/vod/search/wd/${cn}/`,
24 |     getSearchName: () => {
25 |       return new Promise((resolve) => {
26 |         const fn = (e: MessageEvent<any>) => {
27 |           if (e.data.key === 'getSearchName') {
28 |             resolve(e.data.name)
29 |             window.removeEventListener('message', fn)
30 |           }
31 |         }
32 |         window.addEventListener('message', fn)
33 |         parent.postMessage({ key: 'getSearchName' }, '*')
34 |       })
35 |     },
36 |     getEpisode: () => {
37 |       return new Promise((resolve) => {
38 |         const fn = (e: MessageEvent<any>) => {
39 |           if (e.data.key === 'getEpisode') {
40 |             resolve(e.data.name)
41 |             window.removeEventListener('message', fn)
42 |           }
43 |         }
44 |         window.addEventListener('message', fn)
45 |         parent.postMessage({ key: 'getEpisode' }, '*')
46 |       })
47 |     },
48 |     getAnimeScope: () => window.location.href.match(/\/(\d+)\/play/)?.[1] || '',
49 |   },
50 | })
51 | 


--------------------------------------------------------------------------------
/src/adapter/mutean/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { execInUnsafeWindow } from '../../utils/execInUnsafeWindow'
 3 | import { queryDom } from '../../utils/queryDom'
 4 | import { wait } from '../../utils/wait'
 5 | import { defineIframePlayer } from '../common/defineIframePlayer'
 6 | function getActive() {
 7 |   return $<HTMLAnchorElement>('.module-play-list .module-play-list-link.active')
 8 | }
 9 | function switchPart(next: boolean) {
10 |   return getActive()[next ? 'next' : 'prev']().get(0)?.href
11 | }
12 | 
13 | export function runInTop() {
14 |   $('body').addClass('mutefun')
15 |   iframePlayer.runInTop()
16 | }
17 | 
18 | export const iframePlayer = defineIframePlayer({
19 |   iframeSelector: '#playleft iframe',
20 |   getActive,
21 |   setActive: (href) => {
22 |     $<HTMLAnchorElement>('.module-play-list-link').each((_, el) => {
23 |       if (el.href === href) {
24 |         el.classList.add('active')
25 |         $('.playon').insertAfter($(el).find('span'))
26 |       } else {
27 |         el.classList.remove('active')
28 |       }
29 |     })
30 |   },
31 |   search: {
32 |     getSearchName: () => $('.module-info-heading h1').text(),
33 |     getEpisode: () => getActive().text(),
34 |   },
35 |   getEpisodeList: () => $('.module-play-list-link'),
36 |   getSwitchEpisodeURL: (next) => switchPart(next),
37 | })
38 | 
39 | export async function parser() {
40 |   const video = await queryDom<HTMLVideoElement>('video')
41 | 
42 |   await wait(() => !!video.currentSrc)
43 |   let url = await execInUnsafeWindow(() => window.config.url)
44 | 
45 |   video.src = ''
46 |   const player = new KPlayer('#player', {
47 |     eventToParentWindow: true,
48 |   })
49 |   player.src = url
50 | 
51 |   $('#ADplayer,#ADtip').remove()
52 | }
53 | 


--------------------------------------------------------------------------------
/src/utils/storage.ts:
--------------------------------------------------------------------------------
 1 | function createStorage(storage: Storage) {
 2 |   function getItem<T = any>(key: string): T | undefined
 3 |   function getItem<T = any>(key: string, defaultValue: T): T
 4 |   function getItem<T = any>(key: string, defaultValue?: T): T | undefined {
 5 |     try {
 6 |       const value = storage.getItem(key)
 7 |       if (value) return JSON.parse(value)
 8 |       return defaultValue
 9 |     } catch (error) {
10 |       return defaultValue
11 |     }
12 |   }
13 | 
14 |   return {
15 |     getItem,
16 |     setItem(key: string, value: any) {
17 |       storage.setItem(key, JSON.stringify(value))
18 |     },
19 |     removeItem: storage.removeItem.bind(storage),
20 |     clear: storage.clear.bind(storage),
21 |   }
22 | }
23 | 
24 | export const session = createStorage(window.sessionStorage)
25 | export const local = createStorage(window.localStorage)
26 | 
27 | let gm: Pick<ReturnType<typeof createStorage>, 'getItem' | 'setItem'>
28 | try {
29 |   if (typeof GM_getValue === 'undefined')
30 |     throw new Error('GM_getValue is not defined')
31 |   if (typeof GM_setValue === 'undefined')
32 |     throw new Error('GM_setValue is not defined')
33 | 
34 |   function getItem<T = any>(key: string): T | undefined
35 |   function getItem<T = any>(key: string, defaultValue: T): T
36 |   function getItem<T = any>(key: string, defaultValue?: T): T | undefined {
37 |     try {
38 |       return GM_getValue(key) ?? local.getItem(key) ?? defaultValue
39 |     } catch (error) {
40 |       return defaultValue
41 |     }
42 |   }
43 | 
44 |   gm = {
45 |     getItem,
46 |     setItem(key: string, value: any) {
47 |       local.setItem(key, value)
48 |       GM_setValue(key, value)
49 |     },
50 |   }
51 | } catch (error) {
52 |   gm = local
53 | }
54 | export { gm }
55 | 


--------------------------------------------------------------------------------
/src/utils/popover.ts:
--------------------------------------------------------------------------------
 1 | import './popover.scss'
 2 | export function popover(opts: {
 3 |   target: string | JQuery
 4 |   overlay: string | JQuery
 5 |   trigger?: 'hover' | 'click'
 6 |   onVisibleChange?: (visible: boolean) => void
 7 | }) {
 8 |   const { target, overlay, trigger = 'hover', onVisibleChange } = opts
 9 |   const $target = $(target as JQuery)
10 |   const $content = $(
11 |     `<div class="k-popover-overlay"><div class="k-popover-content"></div></div>`
12 |   )
13 |   $content.on('click', (e) => e.stopPropagation())
14 |   $content.find('.k-popover-content').append(overlay)
15 |   $target.addClass('k-popover')
16 |   $target.append($content)
17 | 
18 |   let isActive = false
19 |   let timeId: number | undefined
20 |   const toggle = (visible: boolean, delay?: number) => {
21 |     clearTimeout(timeId)
22 |     timeId = window.setTimeout(() => {
23 |       if (visible) {
24 |         isActive = true
25 |         $content.fadeIn('fast')
26 |         $target.addClass('k-popover-active')
27 |         onVisibleChange?.(true)
28 |       } else {
29 |         isActive = false
30 |         $content.fadeOut('fast')
31 |         $target.removeClass('k-popover-active')
32 |         onVisibleChange?.(false)
33 |       }
34 |     }, delay)
35 |   }
36 | 
37 |   if (trigger === 'click') {
38 |     $target.on('click', () => {
39 |       toggle(!isActive)
40 |     })
41 |     window.addEventListener(
42 |       'click',
43 |       (e) => {
44 |         if (!$target[0].contains(e.target as any)) {
45 |           if (isActive) toggle(false)
46 |         }
47 |       },
48 |       { capture: true }
49 |     )
50 |   } else {
51 |     $target.on('mouseenter', () => {
52 |       toggle(true, 100)
53 |     })
54 |     $target.on('mouseleave', () => {
55 |       toggle(false, 100)
56 |     })
57 |   }
58 | 
59 |   return $target
60 | }
61 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "agefans",
 3 |   "version": "1.53.9",
 4 |   "description": "增强播放功能，实现自动换集、无缝换集、画中画、历史记录、断点续播、弹幕等功能。适配agefans、NT动漫、bimiacg、mutefun、次元城、稀饭动漫",
 5 |   "main": "index.user.js",
 6 |   "repository": {
 7 |     "type": "git",
 8 |     "url": "git+https://github.com/IronKinoko/agefans-enhance.git"
 9 |   },
10 |   "keywords": [
11 |     "agefans",
12 |     "userscirpt"
13 |   ],
14 |   "author": "IronKinoko <kinoko.main@gmail.com>",
15 |   "license": "MIT",
16 |   "bugs": {
17 |     "url": "https://github.com/IronKinoko/agefans-enhance/issues"
18 |   },
19 |   "homepage": "https://github.com/IronKinoko/agefans-enhance#readme",
20 |   "scripts": {
21 |     "dev": "bocchi dev",
22 |     "build": "bocchi build",
23 |     "lint": "tsc --noEmit",
24 |     "prepare": "husky install",
25 |     "deploy": "gh-pages -d dist",
26 |     "preversion": "npm run lint",
27 |     "version": "npm run build",
28 |     "postversion": "npm run deploy && git push && git push --tags"
29 |   },
30 |   "devDependencies": {
31 |     "@types/jquery": "^3.5.14",
32 |     "@types/lodash-es": "^4.17.6",
33 |     "@types/opencc-js": "^1.0.3",
34 |     "bocchi": "^1.3.1",
35 |     "gh-pages": "^3.2.3",
36 |     "husky": "^6.0.0",
37 |     "lint-staged": "^11.2.6",
38 |     "prettier": "^2.6.2",
39 |     "pretty-quick": "^3.1.3",
40 |     "typescript": "^5.7.3"
41 |   },
42 |   "dependencies": {
43 |     "@ironkinoko/danmaku": "1.4.2",
44 |     "hls.js": "1.0.9",
45 |     "lodash-es": "^4.17.21",
46 |     "opencc-js": "^1.0.5",
47 |     "plyr": "3.6.4"
48 |   },
49 |   "globals": {
50 |     "hls.js": "Hls",
51 |     "plyr": "Plyr",
52 |     "@ironkinoko/danmaku": "Danmaku",
53 |     "opencc-js": "OpenCC"
54 |   },
55 |   "prettier": {
56 |     "singleQuote": true,
57 |     "semi": false,
58 |     "tabWidth": 2,
59 |     "trailingComma": "es5"
60 |   }
61 | }
62 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/progressBarPower.ts:
--------------------------------------------------------------------------------
 1 | import { Comment } from './types'
 2 | 
 3 | type Point = { x: string; y: string }
 4 | 
 5 | /**
 6 |  * 逻辑源自 bilibili 高能进度条 svg path 规则
 7 |  */
 8 | export function createProgressBarPower(
 9 |   $pbp: JQuery<HTMLElement>,
10 |   duration: number,
11 |   comments: Comment[]
12 | ) {
13 |   const data = comments.map((cmt) => cmt.time!)
14 |   // svg总长度
15 |   const svgMaxLength = 1000
16 |   // 分成 size 份
17 |   const size = 100
18 |   // svg步长
19 |   const stepLength = svgMaxLength / size
20 | 
21 |   // 每份时间多长
22 |   const stepTime = duration / size
23 |   const counts = []
24 |   let i = 0,
25 |     j = 0
26 |   // 统计的每份基础时间里弹幕数量
27 |   while (i++ <= size) {
28 |     const base = stepTime * i
29 |     let count = 0
30 |     while (data[j++] < base) {
31 |       count++
32 |     }
33 |     counts.push(count)
34 |   }
35 | 
36 |   // 为了美观，100 高度的 svg，底部 20 预留显示出来，其他从 80 开始算
37 |   let start = 'M 0 100 L '
38 |   let end = ' 1000.0 80.0 L 1000 100 Z'
39 | 
40 |   // 巅峰弹幕数量
41 |   const maxCount = Math.max(Math.max(...counts), 1)
42 | 
43 |   const points: Point[] = []
44 |   counts.forEach((count, i) => {
45 |     const x = i * stepLength
46 |     const y = (1 - count / maxCount) * 80
47 | 
48 |     // 做一份相同的数据，让曲线在两侧顺滑变化
49 |     if (i !== 0)
50 |       points.push({ x: (x - stepLength / 2).toFixed(2), y: y.toFixed(2) })
51 |     if (i !== counts.length - 1)
52 |       points.push({ x: x.toFixed(2), y: y.toFixed(2) })
53 |   })
54 | 
55 |   for (let i = 0; i < points.length; ) {
56 |     const p1 = points[i++] // data point
57 |     const p2 = points[i++] // mid point
58 |     start += `${p1.x} ${p1.y} C ${p2.x} ${p1.y}, ${p2.x} ${p2.y},`
59 |   }
60 | 
61 |   $pbp.find('path').attr('d', start + end)
62 | 
63 |   $('.plyr__controls__item.plyr__progress__container .plyr__progress').append(
64 |     $pbp
65 |   )
66 | }
67 | 


--------------------------------------------------------------------------------
/src/adapter/anime1/index.scss:
--------------------------------------------------------------------------------
 1 | .anime1 {
 2 |   overflow: visible;
 3 | 
 4 |   * {
 5 |     font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
 6 |       Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
 7 |       sans-serif;
 8 |   }
 9 |   .single-page {
10 |     @media screen and (min-width: 769px) {
11 |       .content-area {
12 |         width: 100%;
13 |         float: none;
14 |       }
15 | 
16 |       .widget-area {
17 |         margin: 0 auto;
18 |         float: none;
19 |         .search-form {
20 |           text-align: center;
21 |         }
22 |       }
23 | 
24 |       .vjscontainer {
25 |         width: 100%;
26 |         height: auto;
27 |         max-width: unset;
28 | 
29 |         .video-js {
30 |           pointer-events: none;
31 |         }
32 |       }
33 |     }
34 |   }
35 | 
36 |   .category {
37 |     .vjscontainer {
38 |       cursor: pointer;
39 | 
40 |       .video-js {
41 |         pointer-events: none;
42 |       }
43 |     }
44 |   }
45 | 
46 |   #k-player-wrapper,
47 |   .k-modal {
48 |     button,
49 |     input[type='text'],
50 |     input[type='checkbox'],
51 |     select,
52 |     textarea,
53 |     label {
54 |       color: inherit;
55 |       font-size: inherit;
56 |       line-height: inherit;
57 |       font-weight: 400;
58 |       word-wrap: break-word;
59 |     }
60 |     input[type='text'],
61 |     select {
62 |       color: #232323;
63 |       padding: unset;
64 |       background: white;
65 |     }
66 | 
67 |     table {
68 |       border: none;
69 |     }
70 | 
71 |     th,
72 |     td {
73 |       background: white;
74 |     }
75 | 
76 |     .k-input,
77 |     .k-select {
78 |       background: white;
79 |       border: 1px solid #f1f1f1;
80 |       color: black;
81 |       outline: 0;
82 |       border-radius: 2px;
83 |       transition: all 0.15s ease;
84 |       &:focus,
85 |       &:hover {
86 |         border-color: var(--k-player-primary-color);
87 |       }
88 |       &::placeholder {
89 |         color: #999;
90 |       }
91 |     }
92 |   }
93 | }
94 | 


--------------------------------------------------------------------------------
/src/adapter/ntdm9/play.ts:
--------------------------------------------------------------------------------
 1 | import { defineIframePlayer } from '../common/defineIframePlayer'
 2 | import { renderFavoriteBtn, updateCurrentPageFavorite } from './favorite'
 3 | function getActive() {
 4 |   return $('.active-play')
 5 | }
 6 | function switchPart(next: boolean) {
 7 |   return $('.active-play').parent()[next ? 'next' : 'prev']().find('a').get(0)
 8 |     ?.href
 9 | }
10 | 
11 | export function runInTop() {
12 |   parseURLJumpParams()
13 | 
14 |   iframePlayer.runInTop()
15 |   renderFavoriteBtn()
16 | }
17 | 
18 | function parseURLJumpParams() {
19 |   const url = new URL(window.location.href)
20 |   const jumpToLast = url.searchParams.get('jumpToLast')
21 |   if (jumpToLast) {
22 |     window.location.replace($('.movurl:visible a').last().attr('href')!)
23 |   }
24 | }
25 | 
26 | export const iframePlayer = defineIframePlayer({
27 |   iframeSelector: '#playleft iframe',
28 |   getActive: () => $('.active-play'),
29 |   setActive: (href) => {
30 |     $<HTMLAnchorElement>('.movurl a').each((_, el) => {
31 |       if (el.href === href) {
32 |         el.classList.add('active-play')
33 |       } else {
34 |         el.classList.remove('active-play')
35 |       }
36 |     })
37 |   },
38 |   search: {
39 |     getSearchName: () => $('#detailname a:nth-child(1)').text(),
40 |     getEpisode: () => getActive().text(),
41 |   },
42 |   getEpisodeList: () => $('.movurl a'),
43 |   getSwitchEpisodeURL: (next) => switchPart(next),
44 |   history: {
45 |     creator: (renderHistory) => {
46 |       const $btn = $(`<a class="nav_button" href="javascript:void(0)">历史</a>`)
47 |       $btn.on('click', renderHistory)
48 |       $btn.insertBefore('#top_search_from')
49 |     },
50 |     getId: () => location.pathname.match(/\/(\d+)-/)![1],
51 |   },
52 |   onPlayerMessage: (key, data) => {
53 |     if (key === 'canplay') {
54 |       const video = data.video
55 |       const width = $('#ageframediv').width()
56 |       if (width) $('#ageframediv').height((video.height / video.width) * width)
57 | 
58 |       updateCurrentPageFavorite()
59 |     }
60 |   },
61 | })
62 | 


--------------------------------------------------------------------------------
/src/player/plugins/autoseek/html.template.html:
--------------------------------------------------------------------------------
 1 | <div id="k-autoseek-config">
 2 |   <form class="k-settings-list">
 3 |     <div class="k-settings-item">
 4 |       <label class="k-checkbox">
 5 |         <input type="checkbox" name="start.enabled" />
 6 |         跳过片头
 7 |       </label>
 8 |       <input
 9 |         type="text"
10 |         name="start.start"
11 |         class="k-input-number"
12 |         placeholder="起跳时间"
13 |       />
14 |       <input
15 |         type="number"
16 |         name="start.diff"
17 |         class="k-input-number"
18 |         placeholder="长度"
19 |       />
20 |     </div>
21 | 
22 |     <div class="k-settings-item">
23 |       <label class="k-checkbox">
24 |         <input type="checkbox" name="end.enabled" />
25 |         跳过片尾
26 |       </label>
27 |       <input
28 |         type="text"
29 |         name="end.start"
30 |         class="k-input-number"
31 |         placeholder="起跳时间"
32 |       />
33 |       <input
34 |         type="number"
35 |         name="end.diff"
36 |         class="k-input-number"
37 |         placeholder="长度"
38 |       />
39 |     </div>
40 |     <div class="k-autoseek-config-tips">
41 |       <details>
42 |         <summary>使用说明</summary>
43 |         <div class="k-autoseek-config-tips-title">
44 |           第一个值表示“起跳时间”，二个值表示“跳过多少时间”
45 |         </div>
46 |         <div>起跳时间格式：分秒时间(2:30)、秒数(150)</div>
47 |         <div>跳过多少时间：秒数(85)</div>
48 |         <div>
49 |           例如：在 2:30 位置起跳，跳过 85s 时长，视频最终会在 145s 处播放
50 |         </div>
51 |         <div class="k-autoseek-config-tips-title">
52 |           结尾的起跳时间可以是小于等于 0 的数字
53 |         </div>
54 |         <div>
55 |           例子1：片尾填写 -10 与 60，那么视频倒数 10s 处再往前数 60s
56 |           的位置开始跳转，视频最终在倒数 10s 处播放
57 |         </div>
58 |         <div>
59 |           例子2：片尾填写 600 与 60，那么视频 10:00 处开始跳转 60s，视频最终在
60 |           660s 处播放
61 |         </div>
62 |       </details>
63 |     </div>
64 |     <div class="k-autoseek-config-tips">
65 |       仅在当前番剧播放页生效，其他番剧需要重新配置
66 |     </div>
67 |   </form>
68 | </div>
69 | 
70 | <div id="k-autoseek-overlay"></div>
71 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
  1 | # Logs
  2 | logs
  3 | *.log
  4 | npm-debug.log*
  5 | yarn-debug.log*
  6 | yarn-error.log*
  7 | lerna-debug.log*
  8 | 
  9 | # Diagnostic reports (https://nodejs.org/api/report.html)
 10 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 11 | 
 12 | # Runtime data
 13 | pids
 14 | *.pid
 15 | *.seed
 16 | *.pid.lock
 17 | 
 18 | # Directory for instrumented libs generated by jscoverage/JSCover
 19 | lib-cov
 20 | 
 21 | # Coverage directory used by tools like istanbul
 22 | coverage
 23 | *.lcov
 24 | 
 25 | # nyc test coverage
 26 | .nyc_output
 27 | 
 28 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
 29 | .grunt
 30 | 
 31 | # Bower dependency directory (https://bower.io/)
 32 | bower_components
 33 | 
 34 | # node-waf configuration
 35 | .lock-wscript
 36 | 
 37 | # Compiled binary addons (https://nodejs.org/api/addons.html)
 38 | build/Release
 39 | 
 40 | # Dependency directories
 41 | node_modules/
 42 | jspm_packages/
 43 | 
 44 | # TypeScript v1 declaration files
 45 | typings/
 46 | 
 47 | # TypeScript cache
 48 | *.tsbuildinfo
 49 | 
 50 | # Optional npm cache directory
 51 | .npm
 52 | 
 53 | # Optional eslint cache
 54 | .eslintcache
 55 | 
 56 | # Microbundle cache
 57 | .rpt2_cache/
 58 | .rts2_cache_cjs/
 59 | .rts2_cache_es/
 60 | .rts2_cache_umd/
 61 | 
 62 | # Optional REPL history
 63 | .node_repl_history
 64 | 
 65 | # Output of 'npm pack'
 66 | *.tgz
 67 | 
 68 | # Yarn Integrity file
 69 | .yarn-integrity
 70 | 
 71 | # dotenv environment variables file
 72 | .env
 73 | .env.test
 74 | 
 75 | # parcel-bundler cache (https://parceljs.org/)
 76 | .cache
 77 | 
 78 | # Next.js build output
 79 | .next
 80 | 
 81 | # Nuxt.js build / generate output
 82 | .nuxt
 83 | dist
 84 | 
 85 | # Gatsby files
 86 | .cache/
 87 | # Comment in the public line in if your project uses Gatsby and *not* Next.js
 88 | # https://nextjs.org/blog/next-9-1#public-directory-support
 89 | # public
 90 | 
 91 | # vuepress build output
 92 | .vuepress/dist
 93 | 
 94 | # Serverless directories
 95 | .serverless/
 96 | 
 97 | # FuseBox cache
 98 | .fusebox/
 99 | 
100 | # DynamoDB Local files
101 | .dynamodb/
102 | 
103 | # TernJS port file
104 | .tern-port
105 | 
106 | .DS_Store
107 | 
108 | *.dev.js


--------------------------------------------------------------------------------
/src/adapter/xfani/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { execInUnsafeWindow } from '../../utils/execInUnsafeWindow'
 3 | import { queryDom } from '../../utils/queryDom'
 4 | import { wait } from '../../utils/wait'
 5 | import { defineIframePlayer } from '../common/defineIframePlayer'
 6 | function getActive() {
 7 |   return $<HTMLAnchorElement>('.anthology-list-play li.on > a')
 8 | }
 9 | function switchPart(next: boolean) {
10 |   return getActive().parent()[next ? 'next' : 'prev']().find('a')[0]?.href
11 | }
12 | 
13 | // 因为内部重新生成了iframe节点，导致原本的postMessage丢失目标了，所以重发一下
14 | function sendVideoParams() {
15 |   const script = Array.from(document.scripts).find((item) =>
16 |     item.innerHTML.includes('iframeObj.contentWindow.postMessage')
17 |   )!
18 |   new Function(script.innerHTML)()
19 | }
20 | 
21 | export function runInTop() {
22 |   $('body').addClass('xfani')
23 |   $('.player-news').remove()
24 |   iframePlayer.runInTop()
25 |   sendVideoParams()
26 | }
27 | 
28 | export const iframePlayer = defineIframePlayer({
29 |   iframeSelector: '#playleft iframe',
30 |   getActive,
31 |   setActive: (href) => {
32 |     $<HTMLAnchorElement>('.anthology-list-play li a').each((_, el) => {
33 |       if (el.href === href) {
34 |         el.parentElement!.classList.add('ecnav-dt', 'on')
35 |         $('.play-on').insertAfter($(el).find('span'))
36 |       } else {
37 |         el.parentElement!.classList.remove('ecnav-dt', 'on')
38 |       }
39 |     })
40 |   },
41 |   search: {
42 |     getSearchName: () => $('.player-title-link').text(),
43 |     getEpisode: () => getActive().text(),
44 |   },
45 |   getEpisodeList: () => $('.anthology-list-play li a'),
46 |   getSwitchEpisodeURL: (next) => switchPart(next),
47 | })
48 | 
49 | export async function parser() {
50 |   const video = await queryDom<HTMLVideoElement>('video')
51 |   const cleanly = () => {
52 |     video.pause()
53 |     video.volume = 0
54 |   }
55 |   setInterval(cleanly, 16)
56 | 
57 |   $('#loading').hide()
58 |   $('#player').hide()
59 |   $('body').append('<div id="player2"></div>')
60 |   const player = new KPlayer('#player2', {
61 |     eventToParentWindow: true,
62 |   })
63 | 
64 |   const url = new URLSearchParams(window.location.search).get('url')!
65 |   player.src = url
66 | }
67 | 


--------------------------------------------------------------------------------
/src/adapter/common/history.ts:
--------------------------------------------------------------------------------
 1 | import { throttle } from 'lodash-es'
 2 | import { modal } from '../../utils/modal'
 3 | import { parseTime } from '../../utils/parseTime'
 4 | import { local } from '../../utils/storage'
 5 | import './history.scss'
 6 | 
 7 | export interface Info {
 8 |   id: string
 9 |   url: string
10 |   animeName: string
11 |   episodeName: string
12 |   time?: number
13 | }
14 | const his = {
15 |   key: 'k-history',
16 |   load() {
17 |     return local.getItem<Info[]>(this.key, [])
18 |   },
19 |   save(data: Info[]) {
20 |     local.setItem(this.key, data.slice(0, 300))
21 |   },
22 |   log(info: Omit<Info, 'time'>, time: number) {
23 |     let data = this.load()
24 |     data = data.filter((o) => o.id !== info.id)
25 |     data.unshift({ ...info, time })
26 |     this.save(data)
27 |   },
28 |   remove(id: string) {
29 |     let data = this.load()
30 |     data = data.filter((o) => o.id !== id)
31 |     this.save(data)
32 |   },
33 | }
34 | 
35 | export const logHis = throttle(his.log.bind(his), 1000)
36 | 
37 | export function renderHistory() {
38 |   const data = his.load()
39 | 
40 |   const $root = $(`
41 |     <table class="k-table k-his-table">
42 |       <colgroup>
43 |         <col>
44 |         <col style="width:80px">
45 |         <col style="width:60px">
46 |         <col style="width:60px">
47 |       </colgroup>
48 |       <thead>
49 |         <tr>
50 |           <th>标题</th>
51 |           <th>章节</th>
52 |           <th>时间</th>
53 |           <th></th>
54 |         </tr>
55 |       </thead>
56 |       <tbody></tbody>
57 |     </table>
58 |       `)
59 | 
60 |   const content = data
61 |     .map(
62 |       (info) =>
63 |         `<tr>
64 |     <td>
65 |       <a href="${info.url}">${info.animeName}</a>
66 |     </td>
67 |     <td>
68 |       <a href="${info.url}">${info.episodeName}</a>
69 |     </td>
70 |     <td>${parseTime(info.time)}</td>
71 |     <td>
72 |       <span class="k-btn delete-btn" data-id="${info.id}">删除</span>
73 |     </td>
74 |     </tr>`
75 |     )
76 |     .join('')
77 | 
78 |   const $content = $(content)
79 |   $content.find('.delete-btn').on('click', function () {
80 |     const id = $(this).attr('data-id')!
81 |     his.remove(id)
82 |     $(this).closest('tr').remove()
83 |   })
84 | 
85 |   $root.find('tbody').append($content)
86 | 
87 |   modal({
88 |     title: '历史记录',
89 |     content: $root,
90 |   })
91 | }
92 | 


--------------------------------------------------------------------------------
/src/adapter/_iframe_player_parser/index.ts:
--------------------------------------------------------------------------------
 1 | import { runtime } from '../../runtime'
 2 | import { parser } from './parser'
 3 | import './index.scss'
 4 | 
 5 | // 这是个解析器网站，里面只有一个播放器。将其替换成 KPlayer
 6 | runtime.register({
 7 |   domains: [
 8 |     'pro.ascepan.top',
 9 |     'danmu.yhdmjx.com',
10 |     'sp-flv.com',
11 |     '43.240.74.134',
12 |     '43.240.156.118',
13 |     'jx.ejtsyc.com',
14 |   ],
15 |   opts: [
16 |     {
17 |       test: () => window.location.href.includes('danmu.yhdmjx.com/m3u8.php'),
18 |       runInIframe: true,
19 |       run: parser['danmu.yhdmjx.com'],
20 |     },
21 |     {
22 |       test: () => window.location.href.includes('pro.ascepan.top/player'),
23 |       runInIframe: true,
24 |       run: parser['pro.ascepan.top'],
25 |       setup: () => $('body').addClass('pro-ascepan-top'),
26 |     },
27 |     {
28 |       test: () => !!window.location.href.match(/sp-flv\.com.*url=/),
29 |       runInIframe: true,
30 |       run: parser['sp-flv.com'],
31 |     },
32 |     {
33 |       test: () =>
34 |         !!window.location.href.match(
35 |           /((43.240.74.134)|(43.240.156.118)|(jx.ejtsyc.com)).*vip.*url=/
36 |         ),
37 |       runInIframe: true,
38 |       run: parser['agefans-01'],
39 |     },
40 |     {
41 |       test: () =>
42 |         !!window.location.href.match(
43 |           /((43.240.74.134)|(43.240.156.118)|(jx.ejtsyc.com)).*m3u8.*url=/
44 |         ),
45 |       runInIframe: true,
46 |       run: parser['agefans-02'],
47 |     },
48 |   ],
49 |   search: {
50 |     getSearchName: () => {
51 |       return new Promise((resolve) => {
52 |         const fn = (e: MessageEvent<any>) => {
53 |           if (e.data.key === 'getSearchName') {
54 |             resolve(e.data.name)
55 |             window.removeEventListener('message', fn)
56 |           }
57 |         }
58 |         window.addEventListener('message', fn)
59 |         parent.postMessage({ key: 'getSearchName' }, '*')
60 |       })
61 |     },
62 |     getEpisode: () => {
63 |       return new Promise((resolve) => {
64 |         const fn = (e: MessageEvent<any>) => {
65 |           if (e.data.key === 'getEpisode') {
66 |             resolve(e.data.name)
67 |             window.removeEventListener('message', fn)
68 |           }
69 |         }
70 |         window.addEventListener('message', fn)
71 |         parent.postMessage({ key: 'getEpisode' }, '*')
72 |       })
73 |     },
74 |   },
75 | })
76 | 


--------------------------------------------------------------------------------
/src/adapter/anime1/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { logHis } from '../common/history'
 3 | 
 4 | async function fetchVideoLinks(params: any) {
 5 |   const { apireq, tserver, vid } = params
 6 | 
 7 |   const res = await $.ajax({
 8 |     xhrFields: {
 9 |       withCredentials: true,
10 |     },
11 |     type: 'POST',
12 |     url: '//v.anime1.me/api',
13 |     contentType: 'application/x-www-form-urlencoded',
14 |     data: 'd=' + apireq,
15 |   })
16 |   const src = res.s[0].src
17 | 
18 |   const thumbnails = `https://${tserver}.anime1.me/${vid}/thumbnails.vtt`
19 |   return { src, thumbnails }
20 | }
21 | 
22 | function enhanceSinglePage() {
23 |   $('body').addClass('single-page')
24 | }
25 | 
26 | export async function runInSingle() {
27 |   enhanceSinglePage()
28 | 
29 |   const $root = $('.video-js')
30 |   const vlinks = await fetchVideoLinks($root.data())
31 | 
32 |   const player = new KPlayer('.video-js', {
33 |     previewThumbnails: { enabled: true, src: vlinks.thumbnails },
34 |   })
35 | 
36 |   player.src = vlinks.src
37 | 
38 |   player.on('prev', () => {
39 |     player.message.destroy()
40 |     player.message.info('该网站不支持跳转上一集')
41 |   })
42 |   player.on('next', () => {
43 |     player.message.destroy()
44 |     const target = $<HTMLAnchorElement>('a:contains("下一集")')[0]
45 |     if (
46 |       target &&
47 |       target.hasAttribute('href') &&
48 |       !target.hasAttribute('disabled')
49 |     )
50 |       target.click()
51 |     else player.message.info('没有下一集了')
52 |   })
53 | 
54 |   player.on('timeupdate', () => {
55 |     try {
56 |       const animeName = $('.entry-title')
57 |         .text()
58 |         .replace(/\[\d+\]/, '')
59 |         .trim()
60 | 
61 |       const episodeName = $('.entry-title')
62 |         .text()
63 |         .match(/\[(\d+)\]/)![1]
64 |         .replace(/^0+/, '')
65 | 
66 |       const target = $<HTMLAnchorElement>('a:contains("全集連結")')[0]
67 |       const url = new URL(target.href)
68 | 
69 |       const id = url.searchParams.get('cat')!
70 |       logHis(
71 |         {
72 |           animeName,
73 |           episodeName,
74 |           url: window.location.href,
75 |           id,
76 |         },
77 |         player.currentTime
78 |       )
79 |     } catch (error) {}
80 |   })
81 | }
82 | 
83 | export function runInCategory() {
84 |   $('body').addClass('category')
85 | 
86 |   $('.vjscontainer').on('click', function () {
87 |     $(this).parent().prev().find('a')[0].click()
88 |   })
89 | }
90 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/shortcuts.ts:
--------------------------------------------------------------------------------
 1 | import { renderKey } from '../../../utils/renderKey'
 2 | import { KPlayer } from '../../Kplayer'
 3 | import { KeyBindings } from './keybindings'
 4 | import { Command, Commands } from './types'
 5 | import { normalizeKeyEvent } from './utils'
 6 | 
 7 | declare module '../../KPlayer' {
 8 |   interface KPlayer {
 9 |     shortcuts: Shortcuts
10 |   }
11 | }
12 | 
13 | export class Shortcuts {
14 |   constructor(private player: KPlayer) {
15 |     player.shortcuts = this
16 |     window.addEventListener('keydown', this.handleKeyEvent)
17 |     window.addEventListener('keyup', this.handleKeyEvent)
18 |   }
19 |   static Commands = Commands
20 |   static keyBindings = new KeyBindings()
21 |   private static commands: Command[] = []
22 | 
23 |   static registerCommand(
24 |     command: Command['command'],
25 |     keydown: Command['keydown'],
26 |     keyup?: Command['keyup']
27 |   ) {
28 |     this.commands.push({ command, keydown, keyup })
29 |   }
30 | 
31 |   handleKeyEvent = (e: KeyboardEvent) => {
32 |     if (/input|textarea|select/i.test(document.activeElement?.tagName!)) return
33 |     const key = normalizeKeyEvent(e)
34 | 
35 |     const command = Shortcuts.keyBindings.getCommand(key)
36 |     if (command) {
37 |       e.preventDefault()
38 |       this.invoke(command, e)
39 |     }
40 |   }
41 | 
42 |   invoke(command: string, e: KeyboardEvent) {
43 |     const cmd = Shortcuts.commands.find((cmd) => cmd.command === command)
44 |     if (cmd) {
45 |       const type = e.type === 'keydown' ? 'keydown' : 'keyup'
46 |       cmd[type]?.call(this.player, e)
47 |     }
48 |   }
49 | }
50 | 
51 | customElements.define(
52 |   'k-shortcuts-tip',
53 |   class extends HTMLElement {
54 |     unsubscribe: () => void
55 |     node: HTMLSpanElement
56 |     constructor() {
57 |       super()
58 | 
59 |       this.node = document.createElement('span')
60 |       const shadowRoot = this.attachShadow({ mode: 'open' })
61 |       shadowRoot.appendChild(this.node)
62 | 
63 |       this.unsubscribe = Shortcuts.keyBindings.subscribe(() => {
64 |         this.renderKey()
65 |       })
66 |       this.renderKey()
67 |     }
68 | 
69 |     renderKey() {
70 |       const command = this.getAttribute('command')!
71 |       const kb = Shortcuts.keyBindings.getKeyBinding(command)
72 |       if (kb) {
73 |         this.node.textContent = renderKey(kb.key)
74 |       }
75 |     }
76 | 
77 |     disconnectedCallback() {
78 |       this.unsubscribe()
79 |     }
80 |   }
81 | )
82 | 
83 | export function setup(player: KPlayer) {
84 |   new Shortcuts(player)
85 | }
86 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/apis.ts:
--------------------------------------------------------------------------------
 1 | import { memoize } from 'lodash-es'
 2 | import { request } from '../../../utils/request'
 3 | import { Comment, RawComments } from './types'
 4 | import { convert32ToHex, parseUid } from './utils'
 5 | 
 6 | // https://api.dandanplay.net/swagger/ui/index#/
 7 | 
 8 | const KEY =
 9 |   'eyJYLUFwcElkIjoiaHZmNnB6dnhjbSIsIlgtQXBwU2VjcmV0IjoiSVpoY1VJYWtveEZhSzl4QkJESjlCczFPVTJzNGtLNXQifQ=='
10 | const headers = JSON.parse(atob(KEY))
11 | 
12 | export async function getComments(
13 |   episodeId: number | string
14 | ): Promise<Comment[]> {
15 |   const res: RawComments = await request({
16 |     url: `https://api.dandanplay.net/api/v2/comment/${episodeId}?withRelated=true&chConvert=1`,
17 |     headers,
18 |   })
19 | 
20 |   return res.comments
21 |     .map((o) => {
22 |       const [time, type, color, uid] = o.p.split(',')
23 | 
24 |       const user = parseUid(uid)
25 | 
26 |       return {
27 |         mode: ({ 1: 'rtl', 4: 'bottom', 5: 'top' } as const)[type] || 'rtl',
28 |         text: o.m,
29 |         time: parseFloat(time),
30 |         style: { color: convert32ToHex(color) },
31 |         user,
32 |       }
33 |     })
34 |     .sort((a, b) => a.time - b.time)
35 | }
36 | 
37 | type DDPResult<T> = {
38 |   errorCode: number
39 |   success: boolean
40 |   errorMessage: string
41 | } & T
42 | type DDPSearchAnimeResponse = DDPResult<{
43 |   animes: {
44 |     animeId: number
45 |     bangumiId: string
46 |     animeTitle: string
47 |   }[]
48 | }>
49 | 
50 | export async function queryAnimes(anime: string) {
51 |   const res = await request<DDPSearchAnimeResponse>({
52 |     url: 'https://api.dandanplay.net/api/v2/search/anime',
53 |     params: { keyword: anime },
54 |     headers,
55 |   })
56 | 
57 |   if (!res.success) throw new Error(res.errorMessage)
58 | 
59 |   return res.animes.map((o) => ({
60 |     id: o.bangumiId,
61 |     name: o.animeTitle,
62 |   }))
63 | }
64 | 
65 | type DDPBangumiResponse = DDPResult<{
66 |   bangumi: {
67 |     episodes: {
68 |       episodeId: number
69 |       episodeTitle: string
70 |     }[]
71 |   }
72 | }>
73 | 
74 | export const queryEpisodes = memoize(async function (animeId: string) {
75 |   const res = await request<DDPBangumiResponse>({
76 |     url: `https://api.dandanplay.net/api/v2/bangumi/${animeId}`,
77 |     headers,
78 |   })
79 | 
80 |   if (!res.success) {
81 |     setTimeout(() => queryEpisodes.cache.clear?.(), 100)
82 |     throw new Error(res.errorMessage)
83 |   }
84 |   return res.bangumi.episodes.map((o) => ({
85 |     id: o.episodeId,
86 |     name: o.episodeTitle,
87 |   }))
88 | })
89 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/help/index.scss:
--------------------------------------------------------------------------------
  1 | .script-info .k-modal-body {
  2 |   padding: 0;
  3 |   * {
  4 |     box-sizing: border-box;
  5 |     font-size: 14px;
  6 |     line-height: normal;
  7 |     font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
  8 |       Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
  9 |       sans-serif;
 10 |   }
 11 | 
 12 |   table {
 13 |     width: 100%;
 14 |     border-spacing: 0;
 15 |     border-collapse: separate;
 16 |   }
 17 | 
 18 |   tbody tr td:first-child {
 19 |     white-space: nowrap;
 20 |     width: 85px;
 21 |   }
 22 |   th,
 23 |   td {
 24 |     padding: 8px;
 25 |     border-bottom: 1px solid #f1f1f1;
 26 |     word-wrap: break-word;
 27 |     word-break: break-all;
 28 |   }
 29 |   .info-title {
 30 |     font-weight: 600;
 31 |     padding-top: 24px;
 32 |   }
 33 | 
 34 |   a {
 35 |     color: var(--k-player-primary-color);
 36 |     margin: -4px 0 -4px -8px;
 37 |     padding: 4px 8px;
 38 |     border-radius: 4px;
 39 |     text-decoration: none;
 40 |     cursor: pointer;
 41 |     display: inline-block;
 42 |     white-space: nowrap;
 43 |   }
 44 | 
 45 |   a:hover {
 46 |     color: var(--k-player-primary-color);
 47 |     background-color: var(--k-player-primary-color-highlight);
 48 |   }
 49 | 
 50 |   .k-tabs {
 51 |     border-bottom: 1px solid #f1f1f1;
 52 |   }
 53 | 
 54 |   .shortcuts {
 55 |     padding: 8px;
 56 | 
 57 |     &-wrapper {
 58 |       height: 400px;
 59 |       padding: 0;
 60 |       overflow-y: scroll;
 61 |       position: relative;
 62 |       &::-webkit-scrollbar {
 63 |         width: 8px;
 64 |       }
 65 |       &::-webkit-scrollbar-thumb {
 66 |         background: rgba(0, 0, 0, 0.15);
 67 |         border-radius: 4px;
 68 |         &:hover {
 69 |           background-color: rgba(0, 0, 0, 0.45);
 70 |         }
 71 |       }
 72 |     }
 73 | 
 74 |     th {
 75 |       position: sticky;
 76 |       background-color: white;
 77 |       top: 0;
 78 |       z-index: 1;
 79 |     }
 80 | 
 81 |     .shortcuts-input-wrapper {
 82 |       display: flex;
 83 |       align-items: center;
 84 |     }
 85 |     .k-input {
 86 |       flex: 1;
 87 |       padding: 4px 8px;
 88 |       border-radius: 4px;
 89 |     }
 90 |     a {
 91 |       margin-left: 8px;
 92 |     }
 93 |     .k-font-kbd {
 94 |       font-family: consolas, monospace;
 95 |     }
 96 |   }
 97 | 
 98 |   .feature {
 99 |     margin-bottom: 8px;
100 |     &-title {
101 |       font-weight: 500;
102 |     }
103 |     &-description {
104 |       color: #666;
105 |     }
106 |   }
107 | }
108 | 


--------------------------------------------------------------------------------
/src/adapter/gugufan/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { execInUnsafeWindow } from '../../utils/execInUnsafeWindow'
 3 | import { queryDom } from '../../utils/queryDom'
 4 | import { sleep } from '../../utils/sleep'
 5 | import { wait } from '../../utils/wait'
 6 | import { defineIframePlayer } from '../common/defineIframePlayer'
 7 | function getActive() {
 8 |   return $<HTMLAnchorElement>('.anthology-list-play li.on > a')
 9 | }
10 | function switchPart(next: boolean) {
11 |   return getActive().parent()[next ? 'next' : 'prev']().find('a')[0]?.href
12 | }
13 | 
14 | export function runInTop() {
15 |   $('body').addClass('gugufan')
16 |   $('.player-news,#buffer,#install').remove()
17 |   iframePlayer.runInTop()
18 | }
19 | 
20 | export const iframePlayer = defineIframePlayer({
21 |   iframeSelector: '#playleft iframe',
22 |   getActive,
23 |   setActive: (href) => {
24 |     $<HTMLAnchorElement>('.anthology-list-play li a').each((_, el) => {
25 |       if (el.href === href) {
26 |         el.parentElement!.classList.add('ecnav-dt', 'on')
27 |         $('.play-on').insertAfter($(el).find('span'))
28 |       } else {
29 |         el.parentElement!.classList.remove('ecnav-dt', 'on')
30 |       }
31 |     })
32 |   },
33 |   search: {
34 |     getSearchName: () => $('.player-title-link').text(),
35 |     getEpisode: () => getActive().text(),
36 |   },
37 |   getEpisodeList: () => $('.anthology-list-play li a'),
38 |   getSwitchEpisodeURL: (next) => switchPart(next),
39 | })
40 | 
41 | // /addons/dp/player
42 | export async function parser() {
43 |   const video = await queryDom<HTMLVideoElement>('video')
44 | 
45 |   await wait(() => !!video.currentSrc)
46 |   video.src = ''
47 | 
48 |   $('#ADplayer').remove()
49 |   $('#ADtip').remove()
50 | 
51 |   await execInUnsafeWindow(() => {
52 |     // @ts-ignore
53 |     EC.ad?.destroy()
54 |     // @ts-ignore
55 |     EC.dp?.destroy()
56 |   })
57 | 
58 |   const player = new KPlayer('#player', {
59 |     eventToParentWindow: true,
60 |   })
61 |   player.src = await execInUnsafeWindow(() => window.config.url)
62 | }
63 | 
64 | // ?url=<videoId>
65 | export async function parser2() {
66 |   const video = await queryDom<HTMLVideoElement>('video')
67 | 
68 |   let url = ''
69 |   while (!url) {
70 |     url = await execInUnsafeWindow(() => window.MIZHI.player_url)
71 |     await sleep(16)
72 |   }
73 | 
74 |   await wait(() => !!video.currentSrc)
75 |   URL.revokeObjectURL(video.currentSrc)
76 |   video.src = ''
77 | 
78 |   await execInUnsafeWindow(() => {
79 |     window.MIZHI.art.destroy()
80 |   })
81 | 
82 |   const player = new KPlayer('#loading', {
83 |     eventToParentWindow: true,
84 |   })
85 |   player.src = url
86 | 
87 |   $('.layui-layer').remove()
88 | }
89 | 


--------------------------------------------------------------------------------
/meta.template:
--------------------------------------------------------------------------------
 1 | // ==UserScript==
 2 | // @name         agefans Enhance
 3 | // @namespace    https://github.com/IronKinoko/agefans-enhance
 4 | // @icon         https://www.age.tv/favicon.ico
 5 | // @version      #version#
 6 | // @description  #description#
 7 | // @author       IronKinoko
 8 | // @include      https://www.age.tv/*
 9 | // @include      https://www.agefans.*
10 | // @include      https://www.agemys.*
11 | // @include      https://www.agedm.*
12 | // @include      https://m.agedm.*
13 | // @include      http*://www.ntdm*.com/*
14 | // @include      http*://www.bimiacg*.net*
15 | // @include      https://pro.ascepan.top/*
16 | // @include      https://jx.ejtsyc.com*
17 | // @include      https://danmu.yhdmjx.com/*
18 | // @include      https://*.sp-flv.com*
19 | // @include      https://*43.240.74.134*
20 | // @include      https://*43.240.156.118*
21 | // @include      https://www.mutedm.com/*
22 | // @include      https://www.mutean.com/*
23 | // @include      https://www.mute01.com/*
24 | // @include      https://www.cycanime.com/*
25 | // @include      https://www.cyc-anime.net/*
26 | // @include      https://www.cycani.org/*
27 | // @include      https://www.ciyuancheng.net/*
28 | // @include      https://player.cycanime.com/*
29 | // @include      https://dm.xifanacg.com/*
30 | // @include      https://player.moedot.net/*
31 | // @include      https://www.anime1.me/*
32 | // @include      https://anime1.me/*
33 | // @include      https://www.gugu3.com/*
34 | // @include      https://player.gugu3.com/*
35 | // @include      https://*.girigirilove.com/*
36 | // @include      http://127.0.0.1:5500/public/index.html*
37 | // @include      https://ironkinoko.github.io/agefans-enhance/*
38 | // @run-at       document-end
39 | // @require      https://unpkg.com/jquery@3.6.0/dist/jquery.min.js
40 | // @require      https://unpkg.com/plyr@3.6.4/dist/plyr.min.js
41 | // @require      https://unpkg.com/hls.js@1.6.15/dist/hls.min.js
42 | // @require      https://unpkg.com/@ironkinoko/danmaku@1.4.3/dist/danmaku.umd.js
43 | // @require      https://unpkg.com/opencc-js@1.0.5/dist/umd/full.js
44 | // @grant        GM_getValue
45 | // @grant        GM_setValue
46 | // @grant        GM_xmlhttpRequest
47 | // @connect      dandanplay.net
48 | // @license      MIT
49 | // @downloadURL  https://github.com/IronKinoko/agefans-enhance/raw/gh-pages/index.user.js
50 | // @updateURL    https://github.com/IronKinoko/agefans-enhance/raw/gh-pages/index.user.js
51 | // ==/UserScript==
52 | 
53 | /**
54 |  * 权限声明:
55 |  * 1. GM_xmlhttpRequest
56 |  *    脚本会请求有限的网络权限。仅用于访问弹幕查询功能需要链接到的 dandanplay.net 第三方域名
57 |  *    你可以从 脚本编辑/设置/XHR安全 中管理网络权限
58 |  *
59 |  * 2. GM_getValue, GM_setValue
60 |  *    脚本会使用本地存储功能，用于在不同页面间保存“播放器配置”与“agefans 历史浏览记录”。
61 |  *
62 |  * 3. @include
63 |  *    脚本还匹配了 agefans 以外的一些链接，用于提供相同视频资源搜索功能
64 |  */
65 | 


--------------------------------------------------------------------------------
/src/adapter/bimiacg/play.ts:
--------------------------------------------------------------------------------
 1 | import { KPlayer } from '../../player'
 2 | import { execInUnsafeWindow } from '../../utils/execInUnsafeWindow'
 3 | import { queryDom } from '../../utils/queryDom'
 4 | import { local } from '../../utils/storage'
 5 | import { wait } from '../../utils/wait'
 6 | import { defineIframePlayer } from '../common/defineIframePlayer'
 7 | 
 8 | function getActive() {
 9 |   return $<HTMLAnchorElement>('.episode-active')
10 | }
11 | function switchPart(next: boolean) {
12 |   return getActive().parent()[next ? 'next' : 'prev']().find('a')[0]?.href
13 | }
14 | 
15 | export function runInTop() {
16 |   $('#bkcl').remove()
17 | 
18 |   if (local.getItem('bangumi-history')) {
19 |     local.setItem('k-history', local.getItem('bangumi-history'))
20 |     local.removeItem('bangumi-history')
21 |   }
22 | 
23 |   $<HTMLAnchorElement>('.player_list a').each((_, el) => {
24 |     if (el.href === location.href) {
25 |       el.classList.add('episode-active')
26 | 
27 |       // 滚动到最高处
28 |       const parent = el.offsetParent!
29 |       parent.scrollTop = el.offsetTop
30 |     }
31 |   })
32 | 
33 |   $('.tb.player').get(0)?.scrollIntoView({ behavior: 'smooth', block: 'start' })
34 | 
35 |   iframePlayer.runInTop()
36 | }
37 | 
38 | export const iframePlayer = defineIframePlayer({
39 |   iframeSelector: '#playleft iframe',
40 |   getActive,
41 |   setActive: (href) => {
42 |     $<HTMLAnchorElement>('.player_list a').each((_, el) => {
43 |       if (el.href === href) {
44 |         el.classList.add('episode-active')
45 |       } else {
46 |         el.classList.remove('episode-active')
47 |       }
48 |     })
49 |   },
50 |   search: {
51 |     getSearchName: () => $('.v_path a.current').text(),
52 |     getEpisode: () => getActive().text(),
53 |   },
54 |   getEpisodeList: () => $('.player_list a'),
55 |   getSwitchEpisodeURL: (next) => switchPart(next),
56 |   history: {
57 |     creator: (renderHistory) => {
58 |       const $btn = $('<li class="item"><a>历史</a></li>')
59 |       $btn.on('click', renderHistory)
60 | 
61 |       $('.header-top__nav ul').append($btn)
62 |     },
63 |     getId: () => location.pathname.match(/\/(?<id>\d+)\/play/)!.groups!.id,
64 |   },
65 |   onPlayerMessage: (key, data) => {
66 |     if (key === 'canplay') {
67 |       const video = data.video
68 |       const width = $('#video').width()
69 |       if (width) $('#video').height((video.height / video.width) * width)
70 |     }
71 |   },
72 | })
73 | 
74 | export async function parser() {
75 |   const video = await queryDom<HTMLVideoElement>('video')
76 |   video.src = ''
77 | 
78 |   const url = await execInUnsafeWindow(() => window.url)
79 |   const player = new KPlayer('#player', { eventToParentWindow: true })
80 |   if (url.includes('m3u8')) {
81 |     player.setM3u8(url)
82 |   } else {
83 |     player.src = url
84 |   }
85 | }
86 | 


--------------------------------------------------------------------------------
/src/utils/modal.scss:
--------------------------------------------------------------------------------
  1 | .k-modal {
  2 |   position: fixed;
  3 |   left: 0;
  4 |   right: 0;
  5 |   top: 0;
  6 |   bottom: 0;
  7 |   display: flex;
  8 |   align-items: center;
  9 |   justify-content: center;
 10 |   z-index: 2147483647;
 11 |   text-align: left;
 12 |   animation: fadeIn 0.3s ease forwards;
 13 |   color: rgba(0, 0, 0, 0.85);
 14 |   font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
 15 |     Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 16 | 
 17 |   @keyframes fadeIn {
 18 |     from {
 19 |       opacity: 0;
 20 |     }
 21 |     to {
 22 |       opacity: 1;
 23 |     }
 24 |   }
 25 |   * {
 26 |     color: inherit;
 27 |   }
 28 | 
 29 |   &-mask {
 30 |     position: fixed;
 31 |     left: 0;
 32 |     right: 0;
 33 |     bottom: 0;
 34 |     top: 0;
 35 |     background: rgba(0, 0, 0, 0.45);
 36 |     cursor: pointer;
 37 |   }
 38 |   &-wrap {
 39 |     position: fixed;
 40 |     left: 0;
 41 |     right: 0;
 42 |     bottom: 0;
 43 |     top: 0;
 44 |     overflow: auto;
 45 |     text-align: center;
 46 |     user-select: none;
 47 |     &::before {
 48 |       content: '';
 49 |       display: inline-block;
 50 |       width: 0;
 51 |       height: 100%;
 52 |       vertical-align: middle;
 53 |     }
 54 |   }
 55 |   &-container {
 56 |     margin: 20px 0;
 57 |     display: inline-block;
 58 |     vertical-align: middle;
 59 |     text-align: left;
 60 |     position: relative;
 61 |     width: 520px;
 62 |     min-height: 100px;
 63 |     background: white;
 64 |     border-radius: 2px;
 65 |     user-select: text;
 66 |   }
 67 |   &-header {
 68 |     font-size: 16px;
 69 |     border-bottom: 1px solid #f1f1f1;
 70 |     display: flex;
 71 |     justify-content: space-between;
 72 |     align-items: center;
 73 |     &-title {
 74 |       padding: 16px;
 75 |       font-weight: 500;
 76 |     }
 77 |   }
 78 | 
 79 |   &-close {
 80 |     cursor: pointer;
 81 |     height: 55px;
 82 |     width: 55px;
 83 |     position: absolute;
 84 |     right: 0;
 85 |     top: 0;
 86 |     display: flex;
 87 |     justify-content: center;
 88 |     align-items: center;
 89 |     user-select: none;
 90 |     * {
 91 |       color: rgba(0, 0, 0, 0.45);
 92 |       transition: color 0.15s ease;
 93 |     }
 94 |     &:hover * {
 95 |       color: rgba(0, 0, 0, 0.85);
 96 |     }
 97 |   }
 98 |   &-body {
 99 |     padding: 16px;
100 |     font-size: 14px;
101 |   }
102 |   &-footer {
103 |     padding: 10px 16px;
104 |     font-size: 14px;
105 |     border-top: 1px solid #f1f1f1;
106 |     display: flex;
107 |     justify-content: flex-end;
108 |   }
109 |   &-btn {
110 |     user-select: none;
111 |     display: flex;
112 |     align-items: center;
113 |     justify-content: center;
114 |     height: 32px;
115 |     line-height: 32px;
116 |     border-radius: 2px;
117 |     border: 1px solid #1890ff;
118 |     background: #1890ff;
119 |     color: white;
120 |     min-width: 64px;
121 |     cursor: pointer;
122 |     padding: 0 8px;
123 |   }
124 | }
125 | 


--------------------------------------------------------------------------------
/src/global.scss:
--------------------------------------------------------------------------------
  1 | :root {
  2 |   --k-player-background-highlight: rgba(95, 95, 95, 0.65);
  3 |   --k-player-background: rgba(0, 0, 0, 0.65);
  4 |   --k-player-color: white;
  5 |   --k-player-primary-color: #00b3ff;
  6 |   --k-player-primary-color-highlight: rgba(0, 179, 255, 0.1);
  7 | }
  8 | 
  9 | .k-menu {
 10 |   list-style: none;
 11 |   margin: 0;
 12 |   padding: 0;
 13 |   border-radius: 4px;
 14 |   overflow: hidden;
 15 |   &-item {
 16 |     padding: 0 16px;
 17 |     line-height: 36px;
 18 |     height: 36px;
 19 |     cursor: pointer;
 20 |     width: 100%;
 21 |     white-space: nowrap;
 22 |     color: white;
 23 |     transition: all 0.3s;
 24 |     text-align: center;
 25 | 
 26 |     &:hover {
 27 |       background: var(--k-player-background-highlight);
 28 |     }
 29 |   }
 30 | }
 31 | .k-btn {
 32 |   color: var(--k-player-primary-color);
 33 |   padding: 4px 8px;
 34 |   border-radius: 4px;
 35 |   cursor: pointer;
 36 |   white-space: nowrap;
 37 |   transition: all 0.15s;
 38 |   user-select: none;
 39 |   text-decoration: none;
 40 | 
 41 |   &:hover {
 42 |     color: var(--k-player-primary-color);
 43 |     background: var(--k-player-primary-color-highlight);
 44 |   }
 45 | }
 46 | 
 47 | .k-capsule {
 48 |   div {
 49 |     @extend .k-btn;
 50 |     background: var(--k-player-primary-color-highlight);
 51 |   }
 52 |   input:not(:checked) + div {
 53 |     color: #999;
 54 |     background: #ddd;
 55 |   }
 56 | }
 57 | 
 58 | .k-menu-item.k-menu-active {
 59 |   color: var(--k-player-primary-color);
 60 | }
 61 | .k-input,
 62 | .k-select {
 63 |   background: white;
 64 |   border: 1px solid #d9d9d9;
 65 |   color: black;
 66 |   outline: 0;
 67 |   border-radius: 2px;
 68 |   transition: all 0.15s ease;
 69 |   &:focus,
 70 |   &:hover {
 71 |     border-color: var(--k-player-primary-color);
 72 |   }
 73 |   &::placeholder {
 74 |     color: #999;
 75 |   }
 76 | }
 77 | .k-checkbox {
 78 |   display: inline-flex;
 79 |   align-items: center;
 80 |   cursor: pointer;
 81 |   input {
 82 |     margin: 0;
 83 |     margin-right: 4px;
 84 |   }
 85 | }
 86 | 
 87 | .k-settings {
 88 |   &-list {
 89 |     margin: 0;
 90 |     padding: 8px;
 91 |     text-align: left;
 92 | 
 93 |     label {
 94 |       cursor: pointer;
 95 |     }
 96 |   }
 97 |   &-item {
 98 |     width: 100%;
 99 |     white-space: nowrap;
100 |     color: white;
101 |     display: flex;
102 |     align-items: center;
103 |     gap: 8px;
104 |   }
105 |   &-list > &-item + &-item {
106 |     margin-top: 8px;
107 |   }
108 | }
109 | 
110 | .k-table {
111 |   width: 100%;
112 |   border-spacing: 0;
113 |   border-collapse: separate;
114 | 
115 |   th,
116 |   td {
117 |     padding: 8px;
118 |     border: none;
119 |     border-bottom: 1px solid #f1f1f1;
120 |     word-wrap: break-word;
121 |     word-break: break-all;
122 |   }
123 | }
124 | 
125 | .k-input-number {
126 |   @extend .k-input;
127 | 
128 |   height: 32px;
129 |   width: 100px;
130 |   border-radius: 4px;
131 |   padding: 0 8px;
132 |   box-sizing: border-box;
133 |   font-size: 14px;
134 | 
135 |   -webkit-appearance: none;
136 |   appearance: none;
137 |   &[type='number'] {
138 |     &::-webkit-outer-spin-button,
139 |     &::-webkit-inner-spin-button {
140 |       -webkit-appearance: none; // Chrome, Safari
141 |       margin: 0;
142 |     }
143 |   }
144 | }
145 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/utils.ts:
--------------------------------------------------------------------------------
  1 | import { local } from '../../../utils/storage'
  2 | import { KPlayer, LocalConfig } from '../../Kplayer'
  3 | import { Anime } from './types'
  4 | 
  5 | function createStorage<T = string>(storageKey: string) {
  6 |   function storage(key: string): T | undefined
  7 |   function storage(key: string, value: T): void
  8 |   function storage(key: string, value?: T): T | undefined {
  9 |     const store = local.getItem<Record<string, T>>(storageKey, {})
 10 |     if (value) {
 11 |       store[key] = value
 12 |       local.setItem(storageKey, store)
 13 |     } else {
 14 |       return store[key]
 15 |     }
 16 |   }
 17 |   return storage
 18 | }
 19 | export const storageAnimeName = createStorage<Anime & { keyword: string }>(
 20 |   'k-player-danmaku-anime-name-v3'
 21 | )
 22 | export const storageEpisodeName = createStorage(
 23 |   'k-player-danmaku-episode-name-v3'
 24 | )
 25 | export function convert32ToHex(color: string) {
 26 |   return '#' + parseInt(color).toString(16)
 27 | }
 28 | export function parseUid(uid: string) {
 29 |   let source = '弹弹play',
 30 |     id = uid
 31 | 
 32 |   const matcher = uid.match(/^\[(.*?)\](.*)/)
 33 |   if (matcher) {
 34 |     source = matcher[1]
 35 |     id = matcher[2]
 36 |   }
 37 | 
 38 |   return { source, id }
 39 | }
 40 | 
 41 | export function rangePercent(min: number, input: number, max: number) {
 42 |   input = Math.min(max, Math.max(min, input))
 43 | 
 44 |   return ((input - min) / (max - min)) * 100
 45 | }
 46 | 
 47 | export function addRangeListener(opts: {
 48 |   $dom: JQuery
 49 |   name: keyof LocalConfig
 50 |   /** 返回一个百分比，用于设置 --value 样式 */
 51 |   onInput?: (val: number) => void
 52 |   onChange?: (val: number) => void
 53 |   player: KPlayer
 54 | }) {
 55 |   const { $dom, name, onInput, player, onChange } = opts
 56 |   const $valueDom = $(
 57 |     '<div style="width:45px;flex-shrink:0;text-align:right;white-space:nowrap;"></div>'
 58 |   )
 59 |   $valueDom.insertAfter($dom)
 60 | 
 61 |   const min = parseFloat($dom.attr('min')!)
 62 |   const max = parseFloat($dom.attr('max')!)
 63 |   const setStyle = () => {
 64 |     const value = parseFloat($dom.val() as string)
 65 |     player.configSaveToLocal(name, value)
 66 |     onInput?.(value)
 67 |     $valueDom.text((value * 100).toFixed(0) + '%')
 68 |     $dom.css('--value', rangePercent(min, value, max) + '%')
 69 |   }
 70 |   $dom.val(player.localConfig[name] as number)
 71 |   $dom.on('input', setStyle)
 72 |   $dom.on('change', () => {
 73 |     onChange?.(parseFloat($dom.val() as string))
 74 |   })
 75 |   setStyle()
 76 | }
 77 | 
 78 | export function getCheckboxGroupValue($dom: JQuery<HTMLInputElement>) {
 79 |   const ret: string[] = []
 80 |   $dom.each((_, el) => {
 81 |     if (el.checked) ret.push(el.value)
 82 |   })
 83 |   return ret
 84 | }
 85 | export function setCheckboxGroupValue(
 86 |   $dom: JQuery<HTMLInputElement>,
 87 |   value: any[]
 88 | ) {
 89 |   $dom.each((_, el) => {
 90 |     if (value.includes(el.value)) {
 91 |       el.checked = true
 92 |     }
 93 |   })
 94 | }
 95 | 
 96 | export function lockWrap<T extends (...args: any[]) => any>(fn: T) {
 97 |   let lock = false
 98 |   return (async (...args: any[]) => {
 99 |     if (lock) return
100 |     try {
101 |       lock = true
102 |       await fn(...args)
103 |     } finally {
104 |       lock = false
105 |     }
106 |   }) as T
107 | }
108 | 


--------------------------------------------------------------------------------
/src/utils/modal.ts:
--------------------------------------------------------------------------------
  1 | import './modal.scss'
  2 | 
  3 | export interface ModalOpts {
  4 |   title?: string | JQuery
  5 |   content: string | JQuery
  6 |   afterClose?: () => void
  7 |   onClose?: () => void
  8 |   onOk?: () => void
  9 |   okText?: string
 10 |   className?: string
 11 |   width?: number
 12 |   handleOkOnEnter?: boolean
 13 | }
 14 | export function modal(opts: ModalOpts) {
 15 |   const {
 16 |     title,
 17 |     content,
 18 |     onClose,
 19 |     onOk,
 20 |     afterClose,
 21 |     okText = '确 定',
 22 |     handleOkOnEnter,
 23 |   } = opts
 24 |   const store = {
 25 |     width: document.body.style.width,
 26 |     overflow: document.body.style.overflow,
 27 |   }
 28 | 
 29 |   const ID = Math.random().toString(16).slice(2)
 30 |   $(`
 31 | <div class="k-modal ${opts.className || ''}" role="dialog" id="${ID}">
 32 |   <div class="k-modal-mask"></div>
 33 |   <div class="k-modal-wrap">
 34 |     <div class="k-modal-container" ${
 35 |       opts.width ? `style="width:${opts.width}px;"` : ''
 36 |     }>
 37 |       <div class="k-modal-header">
 38 |         <div class="k-modal-header-title"></div>
 39 |         <a class="k-modal-close">
 40 |           <svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg>
 41 |         </a>
 42 |       </div>
 43 |       <div class="k-modal-body">
 44 |       </div>
 45 |     </div>
 46 |   </div>
 47 | </div>`).appendTo('body')
 48 | 
 49 |   // init css
 50 |   $('body').css({
 51 |     width: `calc(100% - ${window.innerWidth - document.body.clientWidth}px)`,
 52 |     overflow: 'hidden',
 53 |   })
 54 | 
 55 |   if (title) {
 56 |     $(`#${ID} .k-modal-header-title`).append(title)
 57 |   } else $(`#${ID} .k-modal-header-title`).remove()
 58 |   $(`#${ID} .k-modal-body`).append(content)
 59 |   $(`#${ID} .k-modal-close`).on('click', () => {
 60 |     handleClose()
 61 |   })
 62 |   $(`#${ID} .k-modal-container`).on('click', (e) => {
 63 |     e.stopPropagation()
 64 |   })
 65 |   $(`#${ID} .k-modal-wrap`).on('click', () => {
 66 |     handleClose()
 67 |   })
 68 | 
 69 |   function reset() {
 70 |     $(`#${ID}`).remove()
 71 |     $('body').css(store)
 72 |     window.removeEventListener('keydown', fn, { capture: true })
 73 |     afterClose?.()
 74 |   }
 75 | 
 76 |   function handleClose() {
 77 |     onClose?.()
 78 |     reset()
 79 |   }
 80 |   function handleOk() {
 81 |     onOk?.()
 82 |     reset()
 83 |   }
 84 | 
 85 |   function fn(e: KeyboardEvent) {
 86 |     if (['Escape'].includes(e.key)) {
 87 |       e.stopPropagation()
 88 |       handleClose()
 89 |     }
 90 | 
 91 |     if (handleOkOnEnter && e.key === 'Enter') {
 92 |       e.stopPropagation()
 93 |       handleOk()
 94 |     }
 95 |   }
 96 |   window.addEventListener('keydown', fn, { capture: true })
 97 | 
 98 |   if (onOk) {
 99 |     $(`#${ID} .k-modal-container`).append(`
100 |       <div class="k-modal-footer">
101 |         <button class="k-modal-btn k-modal-ok">${okText}</button>
102 |       </div>
103 |     `)
104 |     $(`#${ID} .k-modal-ok`).on('click', () => {
105 |       handleOk()
106 |     })
107 |   }
108 | }
109 | 


--------------------------------------------------------------------------------
/src/utils/subtitles.ts:
--------------------------------------------------------------------------------
  1 | function readAsText(file: File) {
  2 |   return new Promise<string>((resolve, reject) => {
  3 |     const fd = new FileReader()
  4 |     fd.onload = () => {
  5 |       resolve(fd.result as string)
  6 |     }
  7 |     fd.readAsText(file)
  8 |   })
  9 | }
 10 | 
 11 | async function parseSRTToVTT(file: File) {
 12 |   function srtToVtt(srtContent: string) {
 13 |     // 分割 SRT 文件的行
 14 |     const lines = srtContent.split('\n')
 15 |     let vttContent = 'WEBVTT\n\n'
 16 | 
 17 |     lines.forEach((line, index) => {
 18 |       // 忽略序号行
 19 |       if (!line.match(/^\d+$/)) {
 20 |         // 转换时间格式
 21 |         line = line.replace(/(\d{2}:\d{2}:\d{2}),(\d{3})/g, '$1.$2')
 22 |         vttContent += line + '\n'
 23 |       }
 24 |     })
 25 | 
 26 |     return vttContent
 27 |   }
 28 | 
 29 |   const srtContent = await readAsText(file)
 30 |   const vttContent = srtToVtt(srtContent)
 31 | 
 32 |   return new Blob([vttContent], { type: 'text/vtt' })
 33 | }
 34 | 
 35 | async function parseASSToVTT(file: File) {
 36 |   function assToVtt(assContent: string) {
 37 |     // 分割 ASS 文件的行
 38 |     const lines = assContent.split('\n')
 39 |     let vttContent = 'WEBVTT\n\n'
 40 |     let formatParts: string[] = []
 41 | 
 42 |     const eventStartIdx = lines.findIndex((line) => line.includes('[Events]'))
 43 |     const formatLine = lines
 44 |       .slice(eventStartIdx)
 45 |       .find((line) => line.startsWith('Format:'))
 46 | 
 47 |     if (!formatLine) throw new Error('ASS文件格式错误，未找到events.format')
 48 |     formatParts = formatLine
 49 |       .split(':')[1]
 50 |       .split(',')
 51 |       .map((part) => part.trim())
 52 | 
 53 |     // 处理每一行
 54 |     lines.forEach((line) => {
 55 |       // 只处理 Dialogue 行
 56 |       if (line.startsWith('Dialogue:')) {
 57 |         const parts = line.split(',')
 58 |         const formatMap: { [key: string]: string } = {}
 59 | 
 60 |         formatParts.forEach((part, index) => {
 61 |           formatMap[part] = parts[index].trim()
 62 |         })
 63 | 
 64 |         const timeStart = formatMap['Start']
 65 |         const timeEnd = formatMap['End']
 66 |         const text = formatMap['Text']
 67 | 
 68 |         // 转换时间格式
 69 |         const vttTimeStart = timeStart.replace(
 70 |           /(\d+):(\d+):(\d+).(\d+)/,
 71 |           (match, p1, p2, p3, p4) => {
 72 |             return `${p1.padStart(2, '0')}:${p2.padStart(2, '0')}:${p3.padStart(
 73 |               2,
 74 |               '0'
 75 |             )}.${p4.padEnd(3, '0')}`
 76 |           }
 77 |         )
 78 |         const vttTimeEnd = timeEnd.replace(
 79 |           /(\d+):(\d+):(\d+).(\d+)/,
 80 |           (match, p1, p2, p3, p4) => {
 81 |             return `${p1.padStart(2, '0')}:${p2.padStart(2, '0')}:${p3.padStart(
 82 |               2,
 83 |               '0'
 84 |             )}.${p4.padEnd(3, '0')}`
 85 |           }
 86 |         )
 87 |         vttContent += `${vttTimeStart} --> ${vttTimeEnd}\n${text}\n\n`
 88 |       }
 89 |     })
 90 | 
 91 |     return vttContent
 92 |   }
 93 | 
 94 |   const assContent = await readAsText(file)
 95 |   const vttContent = assToVtt(assContent)
 96 | 
 97 |   return new Blob([vttContent], { type: 'text/vtt' })
 98 | }
 99 | 
100 | export function parseSubtitles(file: File) {
101 |   if (file.name.match(/\.srt$/i)) {
102 |     return parseSRTToVTT(file)
103 |   }
104 | 
105 |   if (file.name.match(/\.vtt$/i)) {
106 |     return file
107 |   }
108 | 
109 |   if (file.name.match(/\.ass$/i)) {
110 |     return parseASSToVTT(file)
111 |   }
112 | 
113 |   throw new Error('不受支持的文件类型')
114 | }
115 | 


--------------------------------------------------------------------------------
/src/adapter/_iframe_player_parser/parser.ts:
--------------------------------------------------------------------------------
  1 | import { KPlayer } from '../../player'
  2 | import { execInUnsafeWindow } from '../../utils/execInUnsafeWindow'
  3 | import { queryDom } from '../../utils/queryDom'
  4 | import { sleep } from '../../utils/sleep'
  5 | import { wait } from '../../utils/wait'
  6 | 
  7 | let player: KPlayer
  8 | 
  9 | export const parser = {
 10 |   'danmu.yhdmjx.com': async () => {
 11 |     function detectLoadError() {
 12 |       let timeId = setInterval(() => {
 13 |         if (document.body.innerText.includes('动漫专用解析')) {
 14 |           clearInterval(timeId)
 15 | 
 16 |           const dom = document.querySelector<HTMLHeadingElement>('b h1')!
 17 |           const root = document.querySelector<HTMLTableCellElement>('table td')!
 18 |           const errorMessage = dom.innerHTML
 19 |           root.innerHTML = `
 20 |             <style>p,h1{ font-family: 'system-ui, -apple-system, BlinkMacSystemFont, sans-serif'; }</style>
 21 |             <h1>动漫解析失败</h1>
 22 |             <p>当前时间：<span id="current-time"></span></p>
 23 |             <p>检测到页面加载失败，<span id="status">2秒后自动重试</span></p>
 24 |             <p>如果一直无法加载，请尝试切换到其他线路</p>
 25 |             <p>${errorMessage}</p>
 26 |             `
 27 | 
 28 |           setInterval(() => {
 29 |             document.getElementById('current-time')!.innerText =
 30 |               new Date().toLocaleTimeString()
 31 |           }, 16)
 32 | 
 33 |           setTimeout(() => {
 34 |             document.getElementById('status')!.innerText = '正在刷新重试中...'
 35 |             location.reload()
 36 |           }, 2000)
 37 |         }
 38 |       }, 16)
 39 |       return () => clearInterval(timeId)
 40 |     }
 41 | 
 42 |     const dispose = detectLoadError()
 43 | 
 44 |     const video = await queryDom<HTMLVideoElement>('video')
 45 |     video.src = ''
 46 |     dispose()
 47 | 
 48 |     player = new KPlayer('#player', { eventToParentWindow: true })
 49 | 
 50 |     player.src = await execInUnsafeWindow(() =>
 51 |       window.v_decrypt(window.config.url, window._token_key, window.key_token)
 52 |     )
 53 |   },
 54 |   'pro.ascepan.top': async () => {
 55 |     const video = await queryDom<HTMLVideoElement>('video')
 56 |     video.src = ''
 57 | 
 58 |     player = new KPlayer('#player', { eventToParentWindow: true })
 59 |     player.src = await execInUnsafeWindow(() => window.config.url)
 60 |   },
 61 |   'sp-flv.com': async () => {
 62 |     const video = await queryDom<HTMLVideoElement>('video')
 63 | 
 64 |     await wait(() => !!video.currentSrc)
 65 |     let url = video.currentSrc
 66 | 
 67 |     if (url.startsWith('blob:')) {
 68 |       url = await execInUnsafeWindow(() => window.video_url)
 69 | 
 70 |       if (url) {
 71 |         video.src = ''
 72 |         player = new KPlayer('#mplayer-media-wrapper', {
 73 |           eventToParentWindow: true,
 74 |         })
 75 |         player.src = url
 76 |       }
 77 |     } else {
 78 |       video.src = ''
 79 |       player = new KPlayer('#mplayer-media-wrapper', {
 80 |         eventToParentWindow: true,
 81 |       })
 82 |       player.src = url
 83 |     }
 84 |   },
 85 |   /**
 86 |    * agefans-01
 87 |    * @include 43.240.74.134:8443/vip/?url=
 88 |    */
 89 |   'agefans-01': async () => {
 90 |     let url: string = ''
 91 |     while (!url) {
 92 |       url = await execInUnsafeWindow(() => window.stray?.url)
 93 |       await sleep(100)
 94 |     }
 95 |     $('#artplayer').remove()
 96 |     $('body').append('<div id="k-player-container"/>')
 97 |     player = new KPlayer('#k-player-container', { eventToParentWindow: true })
 98 |     player.src = url
 99 |   },
100 |   /**
101 |    * agefans-02
102 |    * @include 43.240.74.134:8443/m3u8/?url=
103 |    */
104 |   'agefans-02': async () => {
105 |     let url: string = ''
106 |     while (!url) {
107 |       url = await execInUnsafeWindow(() => window.art?.hls?.url || window.Vurl)
108 |       await sleep(100)
109 |     }
110 | 
111 |     await execInUnsafeWindow(() => window.art.destroy(false))
112 | 
113 |     $('#loading').remove()
114 |     $('body').append('<div id="k-player-container"/>')
115 |     player = new KPlayer('#k-player-container', { eventToParentWindow: true })
116 |     player.src = url
117 |   },
118 | }
119 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/danmakuList.ts:
--------------------------------------------------------------------------------
  1 | import { KPlayer } from '../..'
  2 | import { modal } from '../../../utils/modal'
  3 | import { parseTime } from '../../../utils/parseTime'
  4 | import { Comment } from './types'
  5 | 
  6 | export function createDanmakuList(
  7 |   player: KPlayer,
  8 |   getComments: () => Comment[] | undefined,
  9 |   refreshDanmaku: () => void
 10 | ) {
 11 |   const $open = $('#k-player-danmaku-search-form .open-danmaku-list')
 12 | 
 13 |   $open.on('click', () => {
 14 |     const comments = getComments()
 15 |     if (!comments) return
 16 | 
 17 |     const $root = $(`
 18 |       <div class="k-player-danmaku-list-wrapper">
 19 |         <div class="k-player-danmaku-list-source-filter">
 20 |           <div>来源：</div>
 21 |           <div class="k-player-danmaku-list-source"></div>
 22 |         </div>
 23 |       
 24 |         <div class="k-player-danmaku-list-table-wrapper">
 25 |           <div class="k-player-danmaku-list-table-content">
 26 |             <table class="k-table k-player-danmaku-list-table">
 27 |               <thead>
 28 |                 <tr>
 29 |                   <th>时间</th>
 30 |                   <th>内容</th>
 31 |                   <th>来源</th>
 32 |                 </tr>
 33 |               </thead>
 34 |               <tbody>
 35 |               </tbody>
 36 |             </table>
 37 |           </div>
 38 |         </div>
 39 | 
 40 |       </div>
 41 |     `)
 42 | 
 43 |     let i = 0
 44 |     let end = 100
 45 |     const render = () => {
 46 |       if (i >= comments.length) {
 47 |         $content.height('')
 48 |         return
 49 |       }
 50 | 
 51 |       $root.find('tbody').append(
 52 |         comments
 53 |           .slice(i, end)
 54 |           .map(
 55 |             (cmt) => `
 56 |         <tr data-source="${cmt.user.source}">
 57 |           <td>${parseTime(cmt.time)}</td>
 58 |           <td>${cmt.text}</td>
 59 |           <td>${cmt.user.source}</td>
 60 |         </tr>`
 61 |           )
 62 |           .join('')
 63 |       )
 64 |       i = end
 65 |     }
 66 |     render()
 67 | 
 68 |     modal({
 69 |       title: '弹幕列表',
 70 |       content: $root,
 71 |       className: 'k-player-danmaku-list',
 72 |       afterClose: () => {
 73 |         refreshDanmaku()
 74 |       },
 75 |     })
 76 | 
 77 |     const $source = $root.find('.k-player-danmaku-list-source')
 78 | 
 79 |     const sourceCountMap = comments.reduce<Record<string, number>>(
 80 |       (map, cmt) => {
 81 |         const source = cmt.user.source
 82 |         map[source] ??= 0
 83 |         map[source]++
 84 |         return map
 85 |       },
 86 |       {}
 87 |     )
 88 |     Object.entries(sourceCountMap).forEach(([source, count]) => {
 89 |       const isDisabled =
 90 |         player.localConfig.danmakuSourceDisabledList.includes(source)
 91 |       const percent = ((count / comments.length) * 100).toFixed(2)
 92 |       $(`<label class="k-player-danmaku-list-source-item k-capsule">
 93 |           <input hidden type="checkbox" value="${source}"/>
 94 |           <div title="${source}有${count}条弹幕">${source}(${percent}%)</div>
 95 |         </label>`)
 96 |         .appendTo($source)
 97 |         .find('input')
 98 |         .prop('checked', !isDisabled)
 99 |         .on('change', (e) => {
100 |           let next = [...player.localConfig.danmakuSourceDisabledList]
101 |           if (e.currentTarget.checked) {
102 |             next = next.filter((src) => src !== source)
103 |           } else {
104 |             next.push(source)
105 |           }
106 |           player.configSaveToLocal('danmakuSourceDisabledList', next)
107 |         })
108 |     })
109 | 
110 |     const $wrapper = $root.find('.k-player-danmaku-list-table-wrapper')
111 |     const $content = $root.find('.k-player-danmaku-list-table-content')
112 |     const $table = $root.find('.k-player-danmaku-list-table')
113 | 
114 |     const itemHeight = $root.find('thead tr').height()!
115 |     $content.height(itemHeight * (comments.length + 1))
116 | 
117 |     $wrapper.on('scroll', (e) => {
118 |       const dom = e.currentTarget
119 |       const height = dom.scrollTop + dom.clientHeight + 1000
120 | 
121 |       if ($table.height()! < height) {
122 |         end = Math.ceil(height / itemHeight)
123 |         render()
124 |       }
125 |     })
126 |   })
127 | }
128 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/filter.ts:
--------------------------------------------------------------------------------
  1 | import { KPlayer } from '../..'
  2 | import { modal } from '../../../utils/modal'
  3 | import { parseToJSON } from '../../../utils/parseToJSON'
  4 | 
  5 | export function createFilter(player: KPlayer, refreshDanmaku: () => void) {
  6 |   const $filter = $('#k-player-danmaku-filter-form')
  7 | 
  8 |   // import 相关事件
  9 |   const $importLabel = $('#k-player-danmaku-filter-import')
 10 |   $importLabel.on('click', () => {
 11 |     modal({
 12 |       title: '导入B站屏蔽设定',
 13 |       content: `
 14 |       <p>1. 随便点开一个视频，右侧弹幕列表打开屏蔽设定，对屏蔽列表右键，导出xml或json文件。</p>
 15 |       <p>2. 点击下面【开始导入】按钮，选择刚下载的xml或json文件</p>
 16 |       `,
 17 |       okText: '开始导入',
 18 |       onOk: importBiliSettings,
 19 |     })
 20 |   })
 21 |   function importBiliSettings() {
 22 |     const $import = $<HTMLInputElement>(
 23 |       '<input type="file" style="display:none" accept=".xml,.json"/>'
 24 |     )
 25 | 
 26 |     $import.on('change', (e) => {
 27 |       const file = e.target.files?.[0]
 28 |       $import.remove()
 29 |       if (!file) return
 30 |       const fd = new FileReader()
 31 |       fd.onload = () => {
 32 |         const result = fd.result as string
 33 |         if (typeof result === 'string') {
 34 |           if (file.name.endsWith('.xml')) importBiliXML(result)
 35 |           if (file.name.endsWith('.json')) importBiliJSON(result)
 36 |         }
 37 |       }
 38 |       fd.readAsText(file)
 39 |     })
 40 |     $import.appendTo('body')
 41 |     $import.get(0)?.click()
 42 |   }
 43 | 
 44 |   function importBiliXML(xml: string) {
 45 |     const $xml = $(xml)
 46 |     const $activeItems = $xml.find('item[enabled="true"]')
 47 |     let rules = $activeItems
 48 |       .map((_, el) => el.textContent)
 49 |       .get()
 50 |       .filter((t) => /^(t|r)=/.test(t))
 51 |       .map((t) => t.replace(/^(t|r)=/, ''))
 52 | 
 53 |     mergeRules(rules)
 54 |   }
 55 | 
 56 |   async function importBiliJSON(jsonStr: string) {
 57 |     try {
 58 |       let json = await parseToJSON<
 59 |         {
 60 |           type: number
 61 |           filter: string
 62 |           opened: boolean
 63 |         }[]
 64 |       >(jsonStr)
 65 | 
 66 |       let rules = json
 67 |         .filter((o) => o.opened && o.type !== 2)
 68 |         .map((o) => (o.type === 1 ? `/${o.filter}/` : o.filter))
 69 | 
 70 |       mergeRules(rules)
 71 |     } catch (error) {
 72 |       player.message.info('导入失败，JSON 格式有误', 3000)
 73 |     }
 74 |   }
 75 | 
 76 |   function mergeRules(rules: string[]) {
 77 |     const mergedRules = new Set([...player.localConfig.danmakuFilter, ...rules])
 78 | 
 79 |     player.message.info(
 80 |       `导入 ${
 81 |         mergedRules.size - player.localConfig.danmakuFilter.length
 82 |       } 条规则`
 83 |     )
 84 | 
 85 |     player.configSaveToLocal('danmakuFilter', [...mergedRules])
 86 | 
 87 |     refreshDanmaku()
 88 |     refreshFilterDom()
 89 |   }
 90 | 
 91 |   // input 相关事件
 92 |   const $input = $filter.find('[name="filter-input"]')
 93 |   $input.on('keypress', (e) => {
 94 |     if (e.key === 'Enter') addFilter($input.val() as string)
 95 |   })
 96 | 
 97 |   function refreshFilterDom() {
 98 |     const filters = player.localConfig.danmakuFilter
 99 | 
100 |     let html = ''
101 |     filters.forEach((filter, idx) => {
102 |       html += `<div class="ft-row">
103 |     <div class="ft-content">${filter}</div>
104 |     <div class="ft-op"><a key="delete" data-idx="${idx}">删除</a></div>
105 |     </div>`
106 |     })
107 |     $filter.find('.ft-body').empty().append(html)
108 |     $filter.find('[key=delete]').on('click', (e) => {
109 |       const idx = parseInt($(e.target).attr('data-idx') as string)
110 |       deleteFilter(idx)
111 |     })
112 |     $filter.find('#filter-count').text(filters.length)
113 |   }
114 | 
115 |   function deleteFilter(idx: number) {
116 |     player.localConfig.danmakuFilter.splice(idx, 1)
117 |     player.configSaveToLocal('danmakuFilter', player.localConfig.danmakuFilter)
118 |     refreshDanmaku()
119 |     refreshFilterDom()
120 |   }
121 | 
122 |   function addFilter(filter: string) {
123 |     const filters = player.localConfig.danmakuFilter
124 |     $input.val('')
125 |     if (!filter || filters.includes(filter)) return
126 | 
127 |     if (/^\/.*\/$/.test(filter)) {
128 |       try {
129 |         new RegExp(filter.slice(1, -1))
130 |       } catch (error) {
131 |         return
132 |       }
133 |     }
134 | 
135 |     filters.push(filter)
136 |     player.configSaveToLocal('danmakuFilter', filters)
137 |     refreshFilterDom()
138 |     refreshDanmaku()
139 |   }
140 | 
141 |   refreshFilterDom()
142 | }
143 | 


--------------------------------------------------------------------------------
/src/adapter/agefans/play.ts:
--------------------------------------------------------------------------------
  1 | import { sleep } from '../../utils/sleep'
  2 | import { local } from '../../utils/storage'
  3 | import { defineIframePlayer } from '../common/defineIframePlayer'
  4 | 
  5 | function calcSortDirection() {
  6 |   const $active = getActive()
  7 |   const $prev = $active.prev()
  8 |   const $next = $active.next()
  9 | 
 10 |   const prevText = $prev.text().match(/\d+/)?.[0]
 11 |   const nextText = $next.text().match(/\d+/)?.[0]
 12 |   const activeText = $active.text().match(/\d+/)?.[0]
 13 | 
 14 |   const prev = Number(prevText)
 15 |   const current = Number(activeText)
 16 |   const next = Number(nextText)
 17 | 
 18 |   if (prevText) {
 19 |     if (prev < current) {
 20 |       local.setItem('sortDirection', 'asc')
 21 |     } else {
 22 |       local.setItem('sortDirection', 'desc')
 23 |     }
 24 |   } else if (nextText) {
 25 |     if (next > current) {
 26 |       local.setItem('sortDirection', 'asc')
 27 |     } else {
 28 |       local.setItem('sortDirection', 'desc')
 29 |     }
 30 |   } else {
 31 |     local.setItem('sortDirection', 'asc')
 32 |   }
 33 |   return local.getItem('sortDirection') as 'asc' | 'desc'
 34 | }
 35 | 
 36 | function getActiveTabIndex() {
 37 |   const pathname = window.location.pathname
 38 |   const match = pathname.match(/play\/.*\/(\d+)\/(\d+)/)
 39 |   if (match) {
 40 |     const activeTab = match[1]
 41 |     return Number(activeTab) - 1
 42 |   }
 43 |   return null
 44 | }
 45 | 
 46 | function getSortButon() {
 47 |   return $('button:contains("更改排序")')
 48 | }
 49 | 
 50 | function rememberSortDirection() {
 51 |   const $btn = getSortButon()
 52 |   $btn.on('click', () => {
 53 |     setTimeout(() => {
 54 |       calcSortDirection()
 55 |       activeScrollIntoView()
 56 |     }, 100)
 57 |   })
 58 | }
 59 | 
 60 | function getSortDirection() {
 61 |   return local.getItem('sortDirection', 'asc') as 'asc' | 'desc'
 62 | }
 63 | 
 64 | function restoreSortDirection() {
 65 |   const sortDirection = getSortDirection()
 66 | 
 67 |   if (sortDirection === 'desc') {
 68 |     getSortButon().trigger('click')
 69 |   }
 70 | }
 71 | 
 72 | function activeScrollIntoView() {
 73 |   const $active = getActive()
 74 | 
 75 |   function getScrollParent() {
 76 |     let parent: HTMLElement | null = $active.parent()[0]
 77 |     while (parent && parent.tagName !== 'BODY') {
 78 |       const overflowY = getComputedStyle(parent).overflowY
 79 |       if (overflowY === 'auto' || overflowY === 'scroll') {
 80 |         return parent
 81 |       }
 82 |       parent = parent.parentElement
 83 |     }
 84 |     return document.body
 85 |   }
 86 | 
 87 |   const scrollEl = getScrollParent()
 88 |   const scrollRect = scrollEl.getBoundingClientRect()
 89 |   const activeRect = $active[0].getBoundingClientRect()
 90 | 
 91 |   // scrollEl scroll to $active position
 92 |   scrollEl.scrollTop += activeRect.top - scrollRect.top - 100
 93 | }
 94 | function insertFocusBtn() {
 95 |   const html = `
 96 |   <button id="k-focus" type="button" class="btn btn-sm btn-outline-light btn-playlist-order">聚焦</button>
 97 |   `
 98 | 
 99 |   $(html)
100 |     .on('click', async () => {
101 |       const idx = getActiveTabIndex()
102 |       if (idx != null) {
103 |         const $activeTab = $('.playlist-source-tab button[data-bs-toggle]').eq(
104 |           idx
105 |         )
106 | 
107 |         if (!$activeTab.hasClass('active')) {
108 |           $activeTab.trigger('click')
109 |           await sleep(100)
110 |         }
111 |       }
112 | 
113 |       activeScrollIntoView()
114 |     })
115 |     .prependTo('.playlist-source-tab .float-end')
116 | }
117 | 
118 | function getActive() {
119 |   return $('.video_detail_episode .video_detail_spisode_playing').parent()
120 | }
121 | function switchPart(next: boolean) {
122 |   const $active = getActive()
123 |   const sortDirection = getSortDirection()
124 | 
125 |   let $nextActive: JQuery<HTMLElement>
126 | 
127 |   if (sortDirection === 'asc') $nextActive = $active[next ? 'next' : 'prev']()
128 |   else $nextActive = $active[next ? 'prev' : 'next']()
129 | 
130 |   return $nextActive.find('a').get(0)?.href
131 | }
132 | 
133 | const iframePlayer = defineIframePlayer({
134 |   iframeSelector: '.video_play_wrapper iframe',
135 |   getActive,
136 |   setActive: (href) => {
137 |     $<HTMLAnchorElement>('.video_detail_episode a').each((_, el) => {
138 |       const $el = $(el)
139 |       if (el.href === href) {
140 |         $('.video_detail_spisode_playing').appendTo($el.parent())
141 |       }
142 |     })
143 |     $('#k-focus').trigger('click')
144 |   },
145 |   search: {
146 |     getSearchName: () =>
147 |       $('.video_detail_wrapper .cata_video_item .card-title').text(),
148 |     getEpisode: () => getActive().text(),
149 |   },
150 |   getEpisodeList: () => $('.video_detail_episode a'),
151 |   getSwitchEpisodeURL: (next) => switchPart(next),
152 | })
153 | 
154 | export function playModule() {
155 |   $<HTMLAnchorElement>('.video_detail_episode a').each((_, el) => {
156 |     if (el.href) el.href = el.href.replace('http://', 'https://')
157 |   })
158 |   iframePlayer.runInTop()
159 | 
160 |   rememberSortDirection()
161 |   restoreSortDirection()
162 |   insertFocusBtn()
163 |   activeScrollIntoView()
164 | }
165 | export function playModuleInIframe() {
166 |   iframePlayer.runInIframe()
167 | }
168 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/keybindings.ts:
--------------------------------------------------------------------------------
  1 | import { gm } from '../../../utils/storage'
  2 | import { Commands, KeyBinding, CustomKeyBinding } from './types'
  3 | 
  4 | const isMac = /macintosh|mac os x/i.test(navigator.userAgent)
  5 | 
  6 | const DefaultKeyBindings: KeyBinding[] = [
  7 |   { command: Commands.togglePlay, key: 'Space', description: '播放/暂停' },
  8 |   {
  9 |     command: Commands.backward5,
 10 |     key: 'ArrowLeft',
 11 |     description: '步退5s',
 12 |   },
 13 |   {
 14 |     command: Commands.forward5,
 15 |     key: 'ArrowRight',
 16 |     description: '步进5s',
 17 |   },
 18 |   {
 19 |     command: Commands.backward30,
 20 |     key: 'shift ArrowLeft',
 21 |     description: '步退30s',
 22 |   },
 23 |   {
 24 |     command: Commands.forward30,
 25 |     key: 'shift ArrowRight',
 26 |     description: '步进30s',
 27 |   },
 28 |   {
 29 |     command: Commands.backward60,
 30 |     key: 'alt ArrowLeft',
 31 |     description: '步退60s',
 32 |   },
 33 |   {
 34 |     command: Commands.forward60,
 35 |     key: 'alt ArrowRight',
 36 |     description: '步进60s',
 37 |   },
 38 |   {
 39 |     command: Commands.backward90,
 40 |     key: 'ctrl ArrowLeft',
 41 |     mac: 'meta ArrowLeft',
 42 |     description: '步退90s',
 43 |   },
 44 |   {
 45 |     command: Commands.forward90,
 46 |     key: 'ctrl ArrowRight',
 47 |     mac: 'meta ArrowRight',
 48 |     description: '步进90s',
 49 |   },
 50 |   {
 51 |     command: Commands.backwardCustom,
 52 |     key: 'shift J',
 53 |     description: '步退[记忆时间]',
 54 |   },
 55 |   { command: Commands.forwardCustom, key: 'J', description: '步进[记忆时间]' },
 56 |   {
 57 |     command: Commands.recordCustomSeekTime,
 58 |     key: 'K',
 59 |     description: '设置[记忆时间]',
 60 |   },
 61 |   { command: Commands.prevFrame, key: '', description: '上一帧' },
 62 |   { command: Commands.nextFrame, key: '', description: '下一帧' },
 63 |   { command: Commands.prev, key: 'P', description: '上一集' },
 64 |   { command: Commands.next, key: 'N', description: '下一集' },
 65 |   { command: Commands.toggleWidescreen, key: 'W', description: '宽屏' },
 66 |   {
 67 |     command: Commands.toggleFullscreen,
 68 |     key: 'F',
 69 |     description: '全屏',
 70 |   },
 71 |   {
 72 |     command: Commands.Escape,
 73 |     key: 'Escape',
 74 |     editable: false,
 75 |     description: '退出全屏/宽屏',
 76 |   },
 77 |   { command: Commands.restoreSpeed, key: 'Z', description: '原速播放' },
 78 |   { command: Commands.decreaseSpeed, key: 'X', description: '减速播放' },
 79 |   { command: Commands.increaseSpeed, key: 'C', description: '加速播放' },
 80 |   {
 81 |     command: Commands.temporaryIncreaseSpeed,
 82 |     key: 'V',
 83 |     description: '长按加速',
 84 |   },
 85 |   { command: Commands.togglePIP, key: 'I', description: '画中画' },
 86 |   {
 87 |     command: Commands.increaseVolume,
 88 |     key: 'ArrowUp',
 89 |     description: '增大音量',
 90 |   },
 91 |   {
 92 |     command: Commands.decreaseVolume,
 93 |     key: 'ArrowDown',
 94 |     description: '减小音量',
 95 |   },
 96 |   {
 97 |     command: Commands.toggleMute,
 98 |     key: 'M',
 99 |     description: '切换静音',
100 |   },
101 |   {
102 |     command: Commands.internal,
103 |     key: '?',
104 |     editable: false,
105 |     description: '显示帮助',
106 |   },
107 | ]
108 | 
109 | export class KeyBindings {
110 |   storageKey = 'user-custom-keybindings'
111 | 
112 |   private listener: (() => void)[] = []
113 |   private getCustomKeyBindings() {
114 |     return gm.getItem<CustomKeyBinding[]>(this.storageKey, [])
115 |   }
116 |   private setCustomKeyBindings(keyBindings: CustomKeyBinding[]) {
117 |     gm.setItem(this.storageKey, keyBindings)
118 |   }
119 | 
120 |   registerKeyBinding(keyBinding: KeyBinding) {
121 |     DefaultKeyBindings.push(keyBinding)
122 |     this.notify()
123 |   }
124 | 
125 |   setKeyBinding(command: string, key: string) {
126 |     let customKeyBindings = this.getCustomKeyBindings()
127 |     customKeyBindings = customKeyBindings.filter((o) => o.command !== command)
128 | 
129 |     if (key) {
130 |       customKeyBindings.push({ command, key })
131 |     }
132 | 
133 |     this.setCustomKeyBindings(customKeyBindings)
134 |     this.notify()
135 |   }
136 | 
137 |   getKeyBindings() {
138 |     const customKeyBindings = this.getCustomKeyBindings()
139 | 
140 |     return DefaultKeyBindings.map((keyBinding) => {
141 |       const customKeyBinding = customKeyBindings.find(
142 |         (o) => o.command === keyBinding.command
143 |       )
144 | 
145 |       const nextKeyBinding = { ...keyBinding, originKey: '', customKey: '' }
146 | 
147 |       if (isMac && nextKeyBinding.mac) {
148 |         nextKeyBinding.key = nextKeyBinding.mac
149 |       }
150 |       nextKeyBinding.originKey = nextKeyBinding.key
151 |       if (customKeyBinding) {
152 |         nextKeyBinding.key = customKeyBinding.key
153 |         nextKeyBinding.customKey = customKeyBinding.key
154 |       }
155 | 
156 |       return nextKeyBinding
157 |     })
158 |   }
159 |   getKeyBinding(command: string) {
160 |     const keyBindings = this.getKeyBindings()
161 |     return keyBindings.find((o) => o.command === command)
162 |   }
163 | 
164 |   getCommand(key: string) {
165 |     if (!key) return
166 |     const keyBindings = this.getKeyBindings()
167 |     return keyBindings.find((o) => o.key === key)?.command
168 |   }
169 | 
170 |   subscribe(cb: () => void) {
171 |     this.listener.push(cb)
172 |     return () => {
173 |       this.listener = this.listener.filter((fn) => fn !== cb)
174 |     }
175 |   }
176 |   notify() {
177 |     this.listener.forEach((fn) => fn())
178 |   }
179 | }
180 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/help/showHelp.ts:
--------------------------------------------------------------------------------
  1 | import { alert } from '../../../../utils/alert'
  2 | import { renderKey } from '../../../../utils/renderKey'
  3 | import { tabs } from '../../../../utils/tabs'
  4 | import { Shortcuts } from '../shortcuts'
  5 | import { normalizeKeyEvent } from '../utils'
  6 | import './index.scss'
  7 | 
  8 | function genIssueURL({ title, body }: { title: string; body: string }) {
  9 |   const url = new URL(
 10 |     `https://github.com/IronKinoko/agefans-enhance/issues/new`
 11 |   )
 12 |   url.searchParams.set('title', title)
 13 |   url.searchParams.set('body', body)
 14 |   return url.toString()
 15 | }
 16 | 
 17 | export const scriptInfo = (video: HTMLVideoElement | undefined) => {
 18 |   const githubIssueURL = genIssueURL({
 19 |     title: '🐛[Bug]',
 20 |     body: issueBody(video?.src),
 21 |   })
 22 | 
 23 |   return tabs([
 24 |     {
 25 |       name: '脚本信息',
 26 |       content: `
 27 |     <table class="k-table">
 28 |       <tbody>
 29 |       <tr><td>脚本版本</td><td>${process.env.APP_VERSION}</td></tr>
 30 |       <tr>
 31 |         <td>脚本作者</td>
 32 |         <td><a target="_blank" rel="noreferrer" href="https://github.com/IronKinoko">IronKinoko</a></td>
 33 |       </tr>
 34 |       <tr>
 35 |         <td>脚本链接</td>
 36 |         <td>
 37 |           <a target="_blank" rel="noreferrer" href="https://github.com/IronKinoko/agefans-enhance">GitHub 源码</a>
 38 |           <a target="_blank" rel="noreferrer" href="https://github.com/IronKinoko/agefans-enhance/releases">更新记录</a>
 39 |           <a target="_blank" rel="noreferrer" href="https://ironkinoko.github.io/agefans-enhance/">在线播放器</a>
 40 |         </td>
 41 |       </tr>
 42 |       <tr>
 43 |         <td>脚本反馈</td>
 44 |         <td>
 45 |           <a target="_blank" rel="noreferrer" href="${githubIssueURL}">GitHub Issues</a>
 46 |           <a target="_blank" rel="noreferrer" href="https://greasyfork.org/scripts/424023/feedback">Greasy Fork 反馈</a>
 47 |         </td>
 48 |       </tr>
 49 |       <tr>
 50 |         <td>特别鸣谢</td>
 51 |         <td>
 52 |           <a target="_blank" rel="noreferrer" href="https://www.dandanplay.com/">弹弹play</a>提供弹幕服务
 53 |         </td>
 54 |       </tr>
 55 |       ${
 56 |         video
 57 |           ? `<tr><td colspan="2" class="info-title">视频信息</td></tr>
 58 |          <tr><td>视频链接</td><td>${video.src}</td></tr>
 59 |          <tr><td>视频信息</td><td>${video.videoWidth} x ${video.videoHeight}</td></tr>`
 60 |           : ''
 61 |       }
 62 |       </tbody>
 63 |     </table>
 64 |     `,
 65 |     },
 66 |     {
 67 |       name: '快捷键',
 68 |       className: 'shortcuts-wrapper',
 69 |       content: () => {
 70 |         const $root = $(`
 71 |           <div class="shortcuts">
 72 |             ${alert('自定义按键立即生效，请使用英文输入法')}
 73 | 
 74 |             <table class="k-table">
 75 |               <thead>
 76 |                 <tr>
 77 |                   <th>动作</th>
 78 |                   <th>默认按键</th>
 79 |                   <th>自定义</th>
 80 |                 </tr>
 81 |               </thead>
 82 |               <colgroup>
 83 |                 <col style="width:130px"></col>
 84 |                 <col style="width:130px"></col>
 85 |                 <col></col>
 86 |               </colgroup>
 87 |               <tbody></tbody>
 88 |             </table>
 89 |           </div>
 90 |         
 91 |         `)
 92 |         const keyBindings = Shortcuts.keyBindings.getKeyBindings()
 93 | 
 94 |         keyBindings.forEach((kb) => {
 95 |           const $tr = $(`
 96 |           <tr>
 97 |             <td>${kb.description}</td>
 98 |             <td><span class="k-font-kbd">${renderKey(kb.originKey)}</span></td>
 99 |             <td>
100 |               <div class="shortcuts-input-wrapper">
101 |                 <input type="text" class="k-input k-font-kbd"><a>删除</a>
102 |               </div>
103 |             </td>
104 |           </tr>
105 |           `)
106 | 
107 |           if (kb.editable !== false) {
108 |             $tr
109 |               .find('input')
110 |               .val(renderKey(kb.customKey))
111 |               .on('keydown', function (e) {
112 |                 e.stopPropagation()
113 |                 e.preventDefault()
114 |                 const key = normalizeKeyEvent(e.originalEvent!)
115 |                 this.value = renderKey(key)
116 |                 Shortcuts.keyBindings.setKeyBinding(kb.command, key)
117 |               })
118 | 
119 |             $tr.find('a').on('click', function (e) {
120 |               $tr.find('input').val('')
121 |               Shortcuts.keyBindings.setKeyBinding(kb.command, '')
122 |             })
123 |           } else {
124 |             $tr.find('td').eq(2).html('不支持自定义')
125 |           }
126 | 
127 |           $root.find('tbody').append($tr)
128 |         })
129 | 
130 |         return $root
131 |       },
132 |     },
133 |     {
134 |       name: '实验性功能',
135 |       className: 'feature-wrapper',
136 |       content: () => `
137 |       <div>
138 |         ${alert('实验性功能可能存在问题，仅供尝试')}
139 | 
140 |         <ul class="features">
141 |           <li class="feature">
142 |             <div class="feature-title">播放本地视频</div>
143 |             <div class="feature-desc">将本地视频文件拖入到视频区域，常用于播放本地更高清的视频</div>
144 |           </li>
145 |           <li class="feature">
146 |             <div class="feature-title">支持导入 <a target="_blank" rel="noreferrer" href="https://github.com/xmcp/pakku.js">Pakku哔哩哔哩弹幕过滤器</a>生成的弹幕文件</div>
147 |             <div class="feature-desc">将 Pakku 生成的XML弹幕文件拖入到视频区域，会覆盖内置的弹幕数据</div>
148 |           </li>
149 |         <ul>
150 |       </div>
151 |       `,
152 |     },
153 |   ])
154 | }
155 | 
156 | export const issueBody = (src = '') => `# 文字描述
157 | <!-- 如果有需要额外描述，或者提意见可以写在下面空白处 -->
158 | 
159 | 
160 | # 网址链接
161 | ${window.location.href}
162 | 
163 | # 视频链接
164 | ${src}
165 | 
166 | # 环境
167 | userAgent: ${navigator.userAgent}
168 | 脚本版本: ${process.env.APP_VERSION}
169 | `
170 | 


--------------------------------------------------------------------------------
/src/adapter/common/defineIframePlayer.ts:
--------------------------------------------------------------------------------
  1 | import { renderHistory, logHis } from './history'
  2 | 
  3 | interface Config {
  4 |   iframeSelector: string
  5 |   /** 获取激活的节点 */
  6 |   getActive(): JQuery
  7 |   /** 根据href设置激活的节点 */
  8 |   setActive(href: string): void
  9 |   /** 获取上下集链接 */
 10 |   getSwitchEpisodeURL(next: boolean): string | undefined
 11 |   /** 监听player事件 */
 12 |   onPlayerMessage?(key: string, data: any, e: MessageEvent): void
 13 |   /** 获取剧集列表 用于修改 anchor 的点击表现 */
 14 |   getEpisodeList(): JQuery<HTMLAnchorElement>
 15 |   search: {
 16 |     /** 弹幕搜索用到 获取番剧标题 */
 17 |     getSearchName(): string | Promise<string>
 18 |     /** 弹幕搜索用到 获取番剧章节 */
 19 |     getEpisode(): string | Promise<string>
 20 |   }
 21 |   /** 内置的历史功能，可生成历史按钮，点击后展开观看历史记录 */
 22 |   history?: {
 23 |     creator: (renderHistory: () => void) => void
 24 |     getId: () => string | Promise<string>
 25 |   }
 26 | }
 27 | export function defineIframePlayer(config: Config) {
 28 |   const { iframeSelector, search } = config
 29 | 
 30 |   function createIframeReadyToChangeIframeSrc(url: string) {
 31 |     const iframe = document.createElement('iframe')
 32 |     iframe.className = 'ready-to-change-iframe-src'
 33 |     iframe.style.cssText =
 34 |       'position:fixed;left:0;top:0;z-index:9999;opacity:0;pointer-events:none;'
 35 |     iframe.src = url
 36 |     document.body.appendChild(iframe)
 37 |   }
 38 | 
 39 |   function setActive(url: string) {
 40 |     if (window.location.href !== url) {
 41 |       window.history.pushState(window.history.state, '', url)
 42 |     }
 43 |     config.setActive(url)
 44 |     createIframeReadyToChangeIframeSrc(url)
 45 |   }
 46 | 
 47 |   function createHistory() {
 48 |     if (config.history) {
 49 |       config.history.creator(renderHistory)
 50 |     }
 51 |   }
 52 | 
 53 |   function isFocusInputElement() {
 54 |     if (!document.activeElement) return false
 55 |     return ['input', 'textarea', 'select'].includes(
 56 |       document.activeElement.tagName.toLowerCase()
 57 |     )
 58 |   }
 59 | 
 60 |   function runInTop() {
 61 |     $(iframeSelector).replaceWith(
 62 |       $(iframeSelector).clone().attr({ allow: 'autoplay; fullscreen' })
 63 |     )
 64 | 
 65 |     window.addEventListener('keydown', (e) => {
 66 |       if (isFocusInputElement()) return
 67 |       if (window.getSelection()?.toString()) return
 68 |       if (e.ctrlKey || e.shiftKey || e.altKey || e.metaKey) return
 69 |       $(iframeSelector)[0].blur()
 70 |       $(iframeSelector)[0].focus()
 71 |       if (e.key === ' ') e.preventDefault()
 72 |     })
 73 | 
 74 |     window.addEventListener('popstate', () => {
 75 |       setActive(window.location.href)
 76 |     })
 77 | 
 78 |     config.getEpisodeList().each((_, el) => {
 79 |       el.classList.add('k-episode-anchor')
 80 |       el.addEventListener('click', (e) => {
 81 |         e.preventDefault()
 82 |         if ($('.ready-to-change-iframe-src').length) return
 83 | 
 84 |         if (!el.href) return
 85 |         setActive(el.href)
 86 |       })
 87 |     })
 88 | 
 89 |     window.addEventListener('message', async (e) => {
 90 |       if (!e.data.key) return
 91 |       switch (e.data.key) {
 92 |         case 'getSearchName': {
 93 |           e.source?.postMessage(
 94 |             {
 95 |               key: 'getSearchName',
 96 |               name: await search.getSearchName(),
 97 |             },
 98 |             { targetOrigin: '*' }
 99 |           )
100 |           break
101 |         }
102 | 
103 |         case 'getEpisode': {
104 |           e.source?.postMessage(
105 |             { key: 'getEpisode', name: await search.getEpisode() },
106 |             { targetOrigin: '*' }
107 |           )
108 |           break
109 |         }
110 | 
111 |         case 'openLink': {
112 |           window.open(e.data.url)
113 |           break
114 |         }
115 | 
116 |         case 'changeIframeSrc': {
117 |           const iframe = $<HTMLIFrameElement>(iframeSelector)[0]
118 |           iframe.contentWindow?.location.replace(e.data.url)
119 |           document.title = e.data.title
120 |           $('.ready-to-change-iframe-src').remove()
121 |           break
122 |         }
123 | 
124 |         case 'prev':
125 |         case 'next': {
126 |           if ($('.ready-to-change-iframe-src').length) return
127 |           const url = config.getSwitchEpisodeURL(e.data.key === 'next')
128 |           if (url) setActive(url)
129 |           break
130 |         }
131 |         case 'enterwidescreen': {
132 |           $('body').css('overflow', 'hidden')
133 |           $('body').addClass('widescreen')
134 |           $(iframeSelector).css({
135 |             position: 'fixed',
136 |             left: 0,
137 |             right: 0,
138 |             bottom: 0,
139 |             top: 0,
140 |             zIndex: 2147483648,
141 |           })
142 |           break
143 |         }
144 |         case 'exitwidescreen': {
145 |           $('body').css('overflow', '')
146 |           $('body').removeClass('widescreen')
147 |           $(iframeSelector).removeAttr('style')
148 |           break
149 |         }
150 |         case 'timeupdate': {
151 |           if (config.history) {
152 |             logHis(
153 |               {
154 |                 animeName: await search.getSearchName(),
155 |                 episodeName: await search.getEpisode(),
156 |                 id: await config.history.getId(),
157 |                 url: window.location.href,
158 |               },
159 |               e.data.video.currentTime
160 |             )
161 |           }
162 |           break
163 |         }
164 |       }
165 |       config.onPlayerMessage?.(e.data.key, e.data, e)
166 |     })
167 |   }
168 | 
169 |   function runInIframe() {
170 |     top?.postMessage(
171 |       {
172 |         key: 'changeIframeSrc',
173 |         url: $(iframeSelector).attr('src'),
174 |         title: document.title,
175 |       },
176 |       '*'
177 |     )
178 |   }
179 | 
180 |   return { runInTop, runInIframe, createHistory }
181 | }
182 | 


--------------------------------------------------------------------------------
/src/adapter/ntdm9/favorite.ts:
--------------------------------------------------------------------------------
  1 | import { local } from '../../utils/storage'
  2 | 
  3 | export type Favorite = {
  4 |   id: string
  5 |   title: string
  6 |   lastUpdate: string
  7 |   updateDesc?: string
  8 |   current: { name: string; url: string }
  9 | }
 10 | 
 11 | const favoriteKey = 'favorite.v2'
 12 | 
 13 | function getFavorite(id: string): Favorite | undefined
 14 | function getFavorite(): Favorite[]
 15 | function getFavorite(id?: string) {
 16 |   const favorites = local.getItem<Favorite[]>(favoriteKey, [])
 17 |   if (id) {
 18 |     return favorites.find((f) => f.id === id)
 19 |   }
 20 |   return favorites
 21 | }
 22 | 
 23 | function setFavorite(favorite: Favorite) {
 24 |   const favorites = getFavorite()
 25 |   const index = favorites.findIndex((f) => f.id === favorite.id)
 26 |   if (index === -1) {
 27 |     favorites.push(favorite)
 28 |   } else {
 29 |     favorites[index] = favorite
 30 |   }
 31 | 
 32 |   local.setItem(favoriteKey, favorites)
 33 | }
 34 | 
 35 | export function removeFavorite(id: string) {
 36 |   const favorites = getFavorite()
 37 |   const index = favorites.findIndex((f) => f.id === id)
 38 |   if (index !== -1) {
 39 |     favorites.splice(index, 1)
 40 |     local.setItem(favoriteKey, favorites)
 41 |   }
 42 | }
 43 | 
 44 | export function renderFavoriteList() {
 45 |   const favorites = getFavorite()
 46 |   const $root = $('.div_right.baseblock')
 47 |   const $content = $(`<div class="blockcontent">
 48 |     <ul id="anime_update"></ul>
 49 |   </div>`)
 50 | 
 51 |   $root.prepend(`<div class="blocktitle">订阅</div>`, $content)
 52 | 
 53 |   favorites.forEach((favorite) => {
 54 |     const update =
 55 |       $(
 56 |         `.mod .one_new_anime a[href$='/${favorite.id}.html'].one_new_anime_ji`
 57 |       ).text() ||
 58 |       $(
 59 |         `.div_left a[href$='/${favorite.id}.html'] > img + .anime_icon1_name1`
 60 |       ).text()
 61 | 
 62 |     if (update) {
 63 |       favorite.updateDesc = update
 64 |       updateFavoriteField(favorite.id, 'updateDesc', update)
 65 |     }
 66 |   })
 67 | 
 68 |   const daysInChinese = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
 69 |   let groups: { day: string; list: Favorite[] }[] = Array.from(
 70 |     { length: 7 },
 71 |     (_, idx) => ({
 72 |       day: daysInChinese[idx],
 73 |       list: favorites.filter(
 74 |         (item) => new Date(item.lastUpdate).getDay() === idx
 75 |       ),
 76 |     })
 77 |   )
 78 | 
 79 |   const day = new Date().getDay()
 80 |   groups = [
 81 |     ...groups.slice(0, day + 1).reverse(),
 82 |     ...groups.slice(day + 1).reverse(),
 83 |   ]
 84 |   groups
 85 |     .filter((o) => o.list.length > 0)
 86 |     .forEach(({ day, list }, index) => {
 87 |       const $ul = $(`<ul id="new_anime_page"></ul>`)
 88 |       list.forEach((favorite) => {
 89 |         const url = new URL(favorite.current.url, location.origin)
 90 |         url.searchParams.set('jumpToLast', '1')
 91 |         const lastUrl = url.toString()
 92 |         $ul.append(
 93 |           `
 94 | <li class="one_new_anime" style="display:flex; justify-content:space-between;">
 95 |   <a 
 96 |     class="one_new_anime_name" 
 97 |     href="${favorite.current.url}" 
 98 |     title="${favorite.title}"
 99 |   >${favorite.title}</a>
100 |   <a 
101 |     class="one_new_anime_ji" 
102 |     style="flex-shrink:0;margin:0" 
103 |     href="${favorite.current.url}"
104 |     title="跳转到${favorite.current.name}的播放页面"
105 |   >${favorite.current.name}</a>
106 |   <span>&nbsp;/&nbsp;</span>
107 |   <a 
108 |     class="one_new_anime_ji" 
109 |     style="flex-shrink:0;" 
110 |     href="${lastUrl}"
111 |     title="跳转到最后一集播放页面"
112 |   >${favorite.updateDesc || '-'}</a>
113 | </li>`
114 |         )
115 |       })
116 | 
117 |       $content
118 |         .find('#anime_update')
119 |         .append(
120 |           `<div style="margin-top:${index !== 0 ? 8 : 0}px;">${day}</div>`,
121 |           $ul
122 |         )
123 |     })
124 | 
125 |   if (!favorites.length) {
126 |     $content
127 |       .find('#anime_update')
128 |       .append('<div>订阅喜欢的番剧，在播放页面标题右侧添加订阅</div>')
129 |   }
130 | }
131 | 
132 | export function renderFavoriteBtn() {
133 |   const $btn = $(`<a href="javascript:void(0)" style="float:right;">订阅</a>`)
134 | 
135 |   const id = getCurrentPageFavoriteId()
136 | 
137 |   const updateLabel = () => {
138 |     $btn.text(getFavorite(id) ? '已订阅' : '订阅')
139 |   }
140 | 
141 |   $btn.on('click', () => {
142 |     if (getFavorite(id)) {
143 |       removeFavorite(id)
144 |     } else {
145 |       addCurrentPageFavorite()
146 |     }
147 |     updateLabel()
148 |   })
149 | 
150 |   updateLabel()
151 | 
152 |   $('#detailname').append($btn)
153 | }
154 | 
155 | function updateFavoriteField<K extends keyof Favorite>(
156 |   id: string,
157 |   field: K,
158 |   value: Favorite[K]
159 | ) {
160 |   const favorite = getFavorite(id)
161 |   if (!favorite) return
162 | 
163 |   favorite[field] = value
164 | 
165 |   setFavorite(favorite)
166 | }
167 | 
168 | function getCurrentPageFavoriteId() {
169 |   return location.pathname.match(/\/(\d+)-/)![1]
170 | }
171 | 
172 | function addCurrentPageFavorite() {
173 |   setFavorite(createCurrentPageFavorite())
174 | }
175 | 
176 | function createCurrentPageFavorite(): Favorite {
177 |   const id = getCurrentPageFavoriteId()
178 | 
179 |   const name = $('.active-play').text()
180 |   const url = location.pathname
181 |   const title = $('#detailname a:nth-child(1)').text()
182 |   const lastUpdate = $('.play_imform_kv .play_imform_tag:contains("更新时间")')
183 |     .next('.play_imform_val')
184 |     .text()
185 |   const updateDesc = $('.play_imform_kv .play_imform_tag:contains("播放状态")')
186 |     .next('.play_imform_val')
187 |     .text()
188 | 
189 |   return { id, title, updateDesc, lastUpdate, current: { name, url } }
190 | }
191 | 
192 | export function updateCurrentPageFavorite() {
193 |   const id = getCurrentPageFavoriteId()
194 | 
195 |   if (!getFavorite(id)) return
196 |   setFavorite(createCurrentPageFavorite())
197 | }
198 | 


--------------------------------------------------------------------------------
/src/player/plugins/shortcuts/commands.ts:
--------------------------------------------------------------------------------
  1 | import { clamp } from 'lodash-es'
  2 | import { Shortcuts } from './shortcuts'
  3 | import { CommandEvent, Commands } from './types'
  4 | import './help'
  5 | import { modal } from '../../../utils/modal'
  6 | 
  7 | function seekTime(duration: number): CommandEvent {
  8 |   return function () {
  9 |     const safeMaxTime = this.plyr.duration - 0.1
 10 |     this.currentTime = clamp(this.currentTime + duration, 0, safeMaxTime)
 11 | 
 12 |     this.message.info(`步${duration < 0 ? '退' : '进'}${Math.abs(duration)}s`)
 13 |   }
 14 | }
 15 | 
 16 | Shortcuts.registerCommand(Commands.forward5, seekTime(5))
 17 | Shortcuts.registerCommand(Commands.backward5, seekTime(-5))
 18 | 
 19 | Shortcuts.registerCommand(Commands.forward30, seekTime(30))
 20 | Shortcuts.registerCommand(Commands.backward30, seekTime(-30))
 21 | 
 22 | Shortcuts.registerCommand(Commands.forward60, seekTime(60))
 23 | Shortcuts.registerCommand(Commands.backward60, seekTime(-60))
 24 | 
 25 | Shortcuts.registerCommand(Commands.forward90, seekTime(90))
 26 | Shortcuts.registerCommand(Commands.backward90, seekTime(-90))
 27 | 
 28 | Shortcuts.registerCommand(Commands.forwardCustom, function (e) {
 29 |   seekTime(+this.localConfig.customSeekTime).call(this, e)
 30 | })
 31 | Shortcuts.registerCommand(Commands.backwardCustom, function (e) {
 32 |   seekTime(-this.localConfig.customSeekTime).call(this, e)
 33 | })
 34 | Shortcuts.registerCommand(
 35 |   Commands.recordCustomSeekTime,
 36 |   (() => {
 37 |     let open = false
 38 |     return function () {
 39 |       if (open) return
 40 |       open = true
 41 | 
 42 |       this.plyr.pause()
 43 |       modal({
 44 |         width: 250,
 45 |         title: '自定义跳转时间',
 46 |         content: `<label>
 47 |           <span>自定义跳转时间</span>
 48 |           <input id="k-customSeekTime" class="k-input-number" style="width:60px" type="number" value="${this.localConfig.customSeekTime}" />
 49 |           <span>秒</span>
 50 |         </label>
 51 |           `,
 52 |         afterClose: () => {
 53 |           open = false
 54 |           this.plyr.play()
 55 |         },
 56 |         handleOkOnEnter: true,
 57 |         onOk: () => {
 58 |           const $input = $('#k-customSeekTime')
 59 |           const value = $input.val()
 60 |           if (!value || isNaN(+value)) {
 61 |             this.message.info('请输入正确的数字')
 62 |             return
 63 |           }
 64 |           this.configSaveToLocal('customSeekTime', +value)
 65 |           this.message.info(
 66 |             `记录成功，自定义跳转时间为${this.localConfig.customSeekTime}s`
 67 |           )
 68 |         },
 69 |       })
 70 |     }
 71 |   })()
 72 | )
 73 | 
 74 | Shortcuts.registerCommand(Commands.prev, function () {
 75 |   this.trigger('prev')
 76 | })
 77 | Shortcuts.registerCommand(Commands.next, function () {
 78 |   this.trigger('next')
 79 | })
 80 | 
 81 | Shortcuts.registerCommand(Commands.toggleWidescreen, function () {
 82 |   if (this.plyr.fullscreen.active) return
 83 |   this.toggleWidescreen()
 84 | })
 85 | 
 86 | Shortcuts.registerCommand(Commands.togglePlay, function () {
 87 |   this.plyr.togglePlay()
 88 | })
 89 | 
 90 | Shortcuts.registerCommand(Commands.Escape, function () {
 91 |   if (this.plyr.fullscreen.active || !this.isWideScreen) return
 92 |   this.toggleWidescreen(false)
 93 | })
 94 | 
 95 | Shortcuts.registerCommand(
 96 |   Commands.restoreSpeed,
 97 |   (() => {
 98 |     let prevSpeed = 1
 99 |     return function () {
100 |       if (this.speed !== 1) {
101 |         prevSpeed = this.speed
102 |         this.speed = 1
103 |       } else {
104 |         if (this.speed !== prevSpeed) {
105 |           this.speed = prevSpeed
106 |         }
107 |       }
108 |     }
109 |   })()
110 | )
111 | 
112 | function changeSpeed(diff: number): CommandEvent {
113 |   return function () {
114 |     let idx = this.speedList.indexOf(this.speed)
115 | 
116 |     const newIdx = clamp(idx + diff, 0, this.speedList.length - 1)
117 |     if (newIdx === idx) return
118 |     const speed = this.speedList[newIdx]
119 |     this.speed = speed
120 |   }
121 | }
122 | Shortcuts.registerCommand(Commands.increaseSpeed, changeSpeed(1))
123 | Shortcuts.registerCommand(Commands.decreaseSpeed, changeSpeed(-1))
124 | 
125 | function createTemporaryIncreaseSpeed(): [CommandEvent, CommandEvent] {
126 |   let prevSpeed = 1
127 |   let isIncreasingSpeed = false
128 |   return [
129 |     function keydown(e) {
130 |       if (!e.repeat || isIncreasingSpeed) return
131 | 
132 |       isIncreasingSpeed = true
133 |       prevSpeed = this.speed
134 |       this.plyr.speed = 3
135 |       this.message.info('倍速播放中', 500)
136 |     },
137 |     function keyup(e) {
138 |       if (!isIncreasingSpeed) return
139 |       isIncreasingSpeed = false
140 |       this.plyr.speed = prevSpeed
141 |     },
142 |   ]
143 | }
144 | 
145 | Shortcuts.registerCommand(
146 |   Commands.temporaryIncreaseSpeed,
147 |   ...createTemporaryIncreaseSpeed()
148 | )
149 | 
150 | Shortcuts.registerCommand(Commands.togglePIP, function () {
151 |   this.plyr.pip = !this.plyr.pip
152 | })
153 | 
154 | Shortcuts.registerCommand(Commands.internal, function () {})
155 | 
156 | function changeFrame(diff: number): CommandEvent {
157 |   let fps = 30
158 |   let isSuspend = false
159 | 
160 |   return function () {
161 |     this.plyr.pause()
162 |     this.currentTime = clamp(
163 |       this.currentTime + diff / fps,
164 |       0,
165 |       this.plyr.duration
166 |     )
167 |     // 自动播放的话，canplay 事件会执行play函数，暂时挂起
168 |     if (this.localConfig.autoplay) {
169 |       if (!isSuspend) {
170 |         this.plyr.play = ((play) => {
171 |           isSuspend = true
172 |           return () => {
173 |             isSuspend = false
174 |             this.plyr.play = play
175 |           }
176 |         })(this.plyr.play)
177 |       }
178 |     }
179 | 
180 |     this.message.destroy()
181 |     this.message.info(`${diff > 0 ? '下' : '上'}一帧`)
182 |   }
183 | }
184 | Shortcuts.registerCommand(Commands.prevFrame, changeFrame(-1))
185 | Shortcuts.registerCommand(Commands.nextFrame, changeFrame(1))
186 | 
187 | Shortcuts.registerCommand(Commands.toggleFullscreen, function () {
188 |   this.plyr.fullscreen.toggle()
189 | })
190 | 
191 | Shortcuts.registerCommand(Commands.increaseVolume, function () {
192 |   this.plyr.increaseVolume(0.05)
193 |   this.message.info(`音量${Math.round(this.plyr.volume * 100)}%`)
194 | })
195 | Shortcuts.registerCommand(Commands.decreaseVolume, function () {
196 |   this.plyr.decreaseVolume(0.05)
197 |   this.message.info(`音量${Math.round(this.plyr.volume * 100)}%`)
198 | })
199 | 
200 | Shortcuts.registerCommand(Commands.toggleMute, function () {
201 |   this.plyr.muted = !this.plyr.muted
202 |   this.message.info(this.plyr.muted ? '静音' : '取消静音')
203 | })
204 | 


--------------------------------------------------------------------------------
/src/runtime/index.ts:
--------------------------------------------------------------------------------
  1 | import { memoize } from 'lodash-es'
  2 | import { opencc } from '../utils/opencc'
  3 | 
  4 | interface RegisterOpts {
  5 |   runInIframe?: boolean
  6 |   /** 仅包含 pathname + search */
  7 |   test: string | RegExp | (string | RegExp)[] | (() => boolean)
  8 |   setup?: Function
  9 |   run: Function
 10 | }
 11 | 
 12 | interface RegisteredItem {
 13 |   domains: (string | RegExp)[]
 14 |   opts: RegisterOpts[]
 15 |   search?: {
 16 |     name?: string
 17 |     search?: (cn: string, tw: string) => string | void
 18 |     getSearchName?: () => Promise<string> | string
 19 |     getEpisode?: () => Promise<string> | string
 20 |     getAnimeScope?: () => Promise<string> | string
 21 |     disabledInIframe?: boolean
 22 |   }
 23 | }
 24 | 
 25 | function createTest(target: string) {
 26 |   return (test: string | RegExp | (() => boolean)) =>
 27 |     typeof test === 'function'
 28 |       ? test()
 29 |       : typeof test === 'string'
 30 |       ? target.includes(test) || test === '*'
 31 |       : test.test(target)
 32 | }
 33 | class Runtime {
 34 |   constructor() {
 35 |     if (parent === self) {
 36 |       window.addEventListener('message', (e) => {
 37 |         if (e.data?.key === 'getLocationHref') {
 38 |           e.source?.postMessage(
 39 |             { key: 'getLocationHref', url: location.href },
 40 |             { targetOrigin: '*' }
 41 |           )
 42 |         }
 43 |       })
 44 | 
 45 |       window.addEventListener('message', (e) => {
 46 |         if (e.data?.key === 'getAnimeScope') {
 47 |           e.source?.postMessage(
 48 |             {
 49 |               key: 'getAnimeScope',
 50 |               animeScope:
 51 |                 this.getActiveRegister().search?.getAnimeScope?.() || '',
 52 |             },
 53 |             { targetOrigin: '*' }
 54 |           )
 55 |         }
 56 |       })
 57 |     }
 58 |   }
 59 | 
 60 |   getTopLocationHref = memoize(
 61 |     async () => {
 62 |       if (parent === self) return window.location.href
 63 | 
 64 |       return new Promise<string>((resolve) => {
 65 |         window.addEventListener('message', function once(e) {
 66 |           if (e.data?.key === 'getLocationHref') {
 67 |             window.removeEventListener('message', once)
 68 |             resolve(e.data.url)
 69 |           }
 70 |         })
 71 |         parent.postMessage({ key: 'getLocationHref' }, '*')
 72 |       })
 73 |     },
 74 |     () => window.location.href
 75 |   )
 76 | 
 77 |   getAnimeScope = memoize(
 78 |     async () => {
 79 |       if (parent === self)
 80 |         return this.getActiveRegister().search?.getAnimeScope?.() || ''
 81 | 
 82 |       return new Promise<string>((resolve) => {
 83 |         window.addEventListener('message', function once(e) {
 84 |           if (e.data?.key === 'getAnimeScope') {
 85 |             window.removeEventListener('message', once)
 86 |             resolve(e.data.animeScope)
 87 |           }
 88 |         })
 89 |         parent.postMessage({ key: 'getAnimeScope' }, '*')
 90 |       })
 91 |     },
 92 |     () => window.location.href
 93 |   )
 94 | 
 95 |   private list: RegisteredItem[] = [
 96 |     {
 97 |       domains: [],
 98 |       opts: [],
 99 |       search: {
100 |         name: '[BT]蜜柑计划',
101 |         search: (cn) => `https://mikanani.me/Home/Search?searchstr=${cn}`,
102 |       },
103 |     },
104 |   ]
105 |   register(item: RegisteredItem) {
106 |     this.list.push(item)
107 |   }
108 | 
109 |   async getSearchActions() {
110 |     const isInIframe = parent !== self
111 |     const searchs = this.list
112 |       .map((o) => o.search)
113 |       .filter(Boolean)
114 |       .filter((o) => !(isInIframe && o!.disabledInIframe)) as NonNullable<
115 |       RegisteredItem['search']
116 |     >[]
117 | 
118 |     const register = this.getActiveRegister()
119 | 
120 |     const info = await this.getCurrentVideoNameAndEpisode()
121 |     if (!info?.name) return []
122 |     let name = info.name
123 | 
124 |     return searchs
125 |       .filter((search) => search !== register.search && search.search)
126 |       .map((search) => ({
127 |         name: search.name,
128 |         search: () => {
129 |           const { cn, tw } = opencc(name)
130 |           const url = search.search!(
131 |             encodeURIComponent(cn),
132 |             encodeURIComponent(tw)
133 |           )
134 |           if (!url) return
135 |           if (isInIframe) parent.postMessage({ key: 'openLink', url }, '*')
136 |           else window.open(url)
137 |         },
138 |       }))
139 |   }
140 | 
141 |   async getCurrentVideoNameAndEpisode() {
142 |     const register = this.getActiveRegister()
143 |     if (!register.search?.getSearchName) return
144 |     let rawName = (await register.search.getSearchName()) || ''
145 |     let episode = (await register.search.getEpisode?.()) || ''
146 | 
147 |     let name = rawName
148 |       .replace(/第.季/, '')
149 |       .replace(/[<>《》''‘’""“”\[\]]/g, '')
150 |       .trim()
151 | 
152 |     episode =
153 |       // 取出数字
154 |       episode.match(/([0-9.]+)[集话]/)?.[1].replace(/^0+/, '') ||
155 |       // 如果没有数字 过滤中文等常见符号
156 |       episode.replace(/[第集话()（）]/g, '') ||
157 |       // fallback 返回全名
158 |       episode
159 | 
160 |     return { name, rawName, episode }
161 |   }
162 | 
163 |   private getActiveRegister() {
164 |     const registers = this.list.filter(({ domains }) =>
165 |       domains.some(createTest(location.origin))
166 |     )
167 | 
168 |     if (registers.length !== 1) {
169 |       console.log('[agefans-enhance]', window.location, registers)
170 |       throw new Error(`激活的域名应该就一个`)
171 |     }
172 | 
173 |     console.log('[agefans-enhance]', '激活的Register', registers[0])
174 |     return registers[0]
175 |   }
176 | 
177 |   private getActiveOpts() {
178 |     const register = this.getActiveRegister()
179 |     return register.opts.filter(({ test }) => {
180 |       const testArr = Array.isArray(test) ? test : [test]
181 |       return testArr.some(createTest(location.pathname + location.search))
182 |     })
183 |   }
184 | 
185 |   run() {
186 |     let setupList: Function[] = []
187 |     let runList: Function[] = []
188 | 
189 |     const opts = this.getActiveOpts()
190 | 
191 |     opts.forEach((opt) => {
192 |       const { run, setup, runInIframe } = opt
193 |       let needRun = runInIframe ? parent !== self : parent === self
194 |       if (needRun) {
195 |         console.log('[agefans-enhance]', '激活的opt', opt)
196 |         setup && setupList.push(setup)
197 |         runList.push(run)
198 |       }
199 |     })
200 | 
201 |     const init = () => {
202 |       setupList.forEach((setup) => setup())
203 |       runList.forEach((run) => run())
204 |     }
205 |     if (document.readyState !== 'loading') {
206 |       init()
207 |     } else {
208 |       window.addEventListener('DOMContentLoaded', init)
209 |     }
210 |   }
211 | }
212 | 
213 | export const runtime = new Runtime()
214 | 


--------------------------------------------------------------------------------
/src/player/index.scss:
--------------------------------------------------------------------------------
  1 | #k-player-wrapper {
  2 |   position: relative;
  3 |   width: 100%;
  4 |   height: 100%;
  5 |   background: #000;
  6 |   overflow: hidden;
  7 |   font-size: 14px;
  8 | 
  9 |   --k-player-error-background: url(./assets/NachoNeko.png);
 10 | 
 11 |   $k-player-tsuma-list: url(./assets/NachoNeko1.png),
 12 |     url(./assets/NachoNeko2.png);
 13 |   --k-player-tsuma-length: #{length($k-player-tsuma-list)};
 14 | 
 15 |   --plyr-line-height: 1;
 16 |   --plyr-tooltip-background: var(--k-player-background);
 17 |   --plyr-tooltip-color: var(--k-player-color);
 18 |   --plyr-range-thumb-background: url(./assets/Hennyano.png) no-repeat
 19 |     center/contain;
 20 |   --plyr-range-thumb-width: 18px;
 21 |   --plyr-range-thumb-height: 18px;
 22 |   --plyr-color-main: var(--k-player-primary-color);
 23 | 
 24 |   .plyr__captions {
 25 |     padding-bottom: 4.4vh;
 26 |     padding-bottom: max(20px, 4.4vh);
 27 |   }
 28 |   .plyr__caption {
 29 |     font-size: 2.4vw; // 你可以根据需要调整这个值
 30 |     color: white; // 确保字幕颜色与背景有足够的对比度
 31 |     --w: 2px;
 32 |     --b: 2px;
 33 |     --c: black;
 34 |     text-shadow: var(--w) var(--w) var(--b) var(--c),
 35 |       calc(-1 * var(--w)) calc(-1 * var(--w)) var(--b) var(--c),
 36 |       var(--w) calc(-1 * var(--w)) var(--b) var(--c),
 37 |       calc(-1 * var(--w)) var(--w) var(--b) var(--c);
 38 |     background: transparent;
 39 |     @media (max-width: 576px) {
 40 |       font-size: 3vw; // 在小屏幕上调整字体大小
 41 |     }
 42 |   }
 43 | 
 44 |   .plyr--full-ui.plyr--video input[type='range'] {
 45 |     cursor: pointer;
 46 |     &::-webkit-slider-thumb {
 47 |       transform: scale(0);
 48 |     }
 49 |     &:hover::-webkit-slider-thumb {
 50 |       transform: scale(1);
 51 |     }
 52 |     &:active::-webkit-slider-thumb {
 53 |       transition: all 0.1s linear;
 54 |       box-shadow: none;
 55 |     }
 56 |     $deg: 15deg;
 57 |     &.shake-0:active::-webkit-slider-thumb {
 58 |       transform: scale(1.3) rotate($deg);
 59 |     }
 60 |     &.shake-1:active::-webkit-slider-thumb {
 61 |       transform: scale(1.3) rotate(-$deg);
 62 |     }
 63 |   }
 64 | 
 65 |   &.k-player-widescreen {
 66 |     position: fixed;
 67 |     left: 0;
 68 |     top: 0;
 69 |     z-index: 10000;
 70 |   }
 71 | 
 72 |   .k-player-contianer {
 73 |     width: 100%;
 74 |     height: 100%;
 75 |   }
 76 | 
 77 |   .k-player-controls-spacer {
 78 |     flex: 1;
 79 |   }
 80 | 
 81 |   #k-player-loading,
 82 |   #k-player-error {
 83 |     position: absolute;
 84 |     left: 0;
 85 |     top: 0;
 86 |     right: 0;
 87 |     bottom: 0;
 88 |     z-index: 10;
 89 |     font-size: 66px;
 90 |     color: white;
 91 |     pointer-events: none;
 92 |     background: black;
 93 |   }
 94 | 
 95 |   .k-player-error-img {
 96 |     background: var(--k-player-error-background) no-repeat center/contain;
 97 |     width: 200px;
 98 |     height: 200px;
 99 |     opacity: 0.4;
100 |   }
101 |   .k-player-error-info {
102 |     text-align: center;
103 |     padding: 24px;
104 |     font-size: 18px;
105 |   }
106 | 
107 |   #k-player-pip {
108 |     position: absolute;
109 |     left: 0;
110 |     top: 0;
111 |     right: 0;
112 |     bottom: 0;
113 |     z-index: 10;
114 |     pointer-events: none;
115 |   }
116 |   .k-player-tsuma {
117 |     width: 200px;
118 |     height: 200px;
119 |     position: absolute;
120 |     bottom: 0;
121 |     right: 0;
122 |     background: no-repeat center/contain;
123 |     opacity: 0.1;
124 |     z-index: -1;
125 |     pointer-events: none;
126 | 
127 |     @each $bg in $k-player-tsuma-list {
128 |       $i: index($k-player-tsuma-list, $bg);
129 |       &[data-bg-idx='#{$i - 1}'] {
130 |         background-image: $bg;
131 |       }
132 |     }
133 |   }
134 | 
135 |   .k-player-center {
136 |     width: 100%;
137 |     height: 100%;
138 |     display: flex;
139 |     flex-direction: column;
140 |     align-items: center;
141 |     justify-content: center;
142 |   }
143 | 
144 |   #k-player-header {
145 |     transform: translateY(0);
146 |     transition: transform 0.3s;
147 |     position: absolute;
148 |     top: 0;
149 |     left: 0;
150 |     width: 100%;
151 |     padding: 8px;
152 |     text-align: right;
153 |     .k-player-question-icon {
154 |       font-size: 24px;
155 |       width: 1em;
156 |       height: 1em;
157 |       color: white;
158 |       cursor: pointer;
159 |     }
160 |   }
161 |   .plyr--hide-controls {
162 |     #k-player-header {
163 |       transform: translateY(-100%);
164 |     }
165 |   }
166 | 
167 |   .plyr__poster {
168 |     pointer-events: none;
169 |   }
170 | 
171 |   .plyr {
172 |     width: 100%;
173 |     height: 100%;
174 |   }
175 |   .plyr__control svg {
176 |     font-size: 18px;
177 |   }
178 |   video {
179 |     display: block;
180 |   }
181 |   .plyr__next svg {
182 |     transform: scale(1.7);
183 |   }
184 |   .plyr__widescreen svg {
185 |     transform: scale(1.3);
186 |   }
187 |   .plyr--hide-cursor {
188 |     cursor: none;
189 |   }
190 |   .plyr__control span:not(.plyr__tooltip) {
191 |     color: inherit;
192 |   }
193 | 
194 |   .plyr--hide-controls .k-player-progress {
195 |     opacity: 1;
196 |     transition: opacity 0.3s ease-in 0.2s;
197 |   }
198 |   .k-player-fullscreen {
199 |     .k-player-progress,
200 |     [data-plyr='widescreen'] {
201 |       display: none;
202 |     }
203 |   }
204 |   .k-player-progress {
205 |     opacity: 0;
206 |     transition: opacity 0.2s ease-out;
207 |     height: 2px;
208 |     width: 100%;
209 |     position: absolute;
210 |     bottom: 0;
211 |     .k-player-progress-current {
212 |       position: absolute;
213 |       left: 0;
214 |       top: 0;
215 |       height: 100%;
216 |       z-index: 2;
217 |       background-color: var(--k-player-primary-color);
218 |     }
219 |     .k-player-progress-buffer {
220 |       position: absolute;
221 |       left: 0;
222 |       top: 0;
223 |       z-index: 1;
224 |       height: 100%;
225 |       background-color: var(
226 |         --plyr-video-progress-buffered-background,
227 |         rgba(255, 255, 255, 0.25)
228 |       );
229 |     }
230 |   }
231 | 
232 |   .plyr__controls {
233 |     z-index: 20;
234 |     .plyr__controls__item:first-child {
235 |       margin-right: 0;
236 |     }
237 |     .plyr__controls__item.plyr__progress__container {
238 |       position: absolute;
239 |       top: 15px;
240 |       left: 10px;
241 |       right: 10px;
242 |       --plyr-range-track-height: 2px;
243 |       &:hover {
244 |         --plyr-range-track-height: 4px;
245 |       }
246 |     }
247 | 
248 |     .k-text-btn {
249 |       display: inline-block;
250 |       padding: 0 8px;
251 |       text-align: center;
252 |       &-text {
253 |         line-height: 32px;
254 |         user-select: none;
255 |       }
256 |     }
257 |   }
258 | 
259 |   @media (max-width: 576px) {
260 |     .plyr__controls {
261 |       padding-top: 30px;
262 |     }
263 |     [data-plyr='pip'],
264 |     [data-plyr='widescreen'],
265 |     .plyr__volume {
266 |       display: none;
267 |     }
268 |   }
269 | }
270 | 
271 | // loading
272 | .lds-spinner {
273 |   color: official;
274 |   display: inline-block;
275 |   position: relative;
276 |   width: 80px;
277 |   height: 80px;
278 | 
279 |   div {
280 |     transform-origin: 40px 40px;
281 |     animation: lds-spinner 1.2s linear infinite;
282 |     &::after {
283 |       content: ' ';
284 |       display: block;
285 |       position: absolute;
286 |       top: 3px;
287 |       left: 37px;
288 |       width: 6px;
289 |       height: 18px;
290 |       border-radius: 20%;
291 |       background: #fff;
292 |     }
293 |     $i: 1;
294 |     @while $i < 13 {
295 |       &:nth-child(#{$i}) {
296 |         transform: rotate(#{30 * ($i - 1)}deg);
297 |         animation-delay: #{-1.2 + $i * 0.1}s;
298 |       }
299 |       $i: $i + 1;
300 |     }
301 |   }
302 | }
303 | 
304 | @keyframes lds-spinner {
305 |   0% {
306 |     opacity: 1;
307 |   }
308 |   100% {
309 |     opacity: 0;
310 |   }
311 | }
312 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/index.scss:
--------------------------------------------------------------------------------
  1 | #k-player-danmaku {
  2 |   position: absolute;
  3 |   left: 0;
  4 |   top: 0;
  5 |   right: 0;
  6 |   bottom: 0;
  7 |   z-index: 10;
  8 |   pointer-events: none;
  9 |   font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
 10 |     Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 11 | 
 12 |   &-notification {
 13 |     line-height: 1.6;
 14 |     .title {
 15 |       text-align: center;
 16 |       font-weight: 500;
 17 |       font-size: 16px;
 18 |     }
 19 |     img {
 20 |       width: 40%;
 21 |       display: block;
 22 |       margin: 0 auto 8px;
 23 |     }
 24 |     a {
 25 |       color: var(--k-player-primary-color);
 26 |     }
 27 |     p {
 28 |       margin: 0;
 29 |     }
 30 |     p:not(:last-child) {
 31 |       margin-bottom: 8px;
 32 |     }
 33 |   }
 34 | 
 35 |   .danmaku {
 36 |     font-size: calc(
 37 |       var(--danmaku-font-size, 24px) * var(--danmaku-font-size-scale, 1)
 38 |     );
 39 |     font-family: SimHei, 'Microsoft JhengHei', Arial, Helvetica, sans-serif;
 40 |     font-weight: bold;
 41 |     text-shadow: black 1px 0px 1px, black 0px 1px 1px, black 0px -1px 1px,
 42 |       black -1px 0px 1px;
 43 |     line-height: 1.3;
 44 |   }
 45 |   @media (max-width: 576px) {
 46 |     .danmaku {
 47 |       --danmaku-font-size: 16px;
 48 |     }
 49 |   }
 50 | 
 51 |   &-overlay {
 52 |     width: 210px;
 53 |   }
 54 | 
 55 |   &-search-form {
 56 |     > * {
 57 |       font-size: 14px;
 58 |       box-sizing: border-box;
 59 |       text-align: left;
 60 |     }
 61 | 
 62 |     input,
 63 |     select {
 64 |       display: block;
 65 |       margin-top: 4px;
 66 |       width: 100%;
 67 |     }
 68 |     label {
 69 |       display: block;
 70 |       span {
 71 |         line-height: 1.4;
 72 |       }
 73 |     }
 74 |     label + label {
 75 |       margin-top: 8px;
 76 |     }
 77 | 
 78 |     .open-danmaku-list {
 79 |       cursor: pointer;
 80 |       transition: color 0.15s;
 81 |       &:hover * {
 82 |         color: var(--k-player-primary-color);
 83 |       }
 84 |     }
 85 | 
 86 |     .specific-thanks {
 87 |       color: #757575;
 88 |       font-size: 12px;
 89 |       position: absolute;
 90 |       left: 8px;
 91 |       bottom: 8px;
 92 |       user-select: none;
 93 |     }
 94 |   }
 95 |   &-setting-form {
 96 |     padding: 0;
 97 |     input {
 98 |       margin: 0;
 99 |     }
100 |   }
101 |   &-filter-form {
102 |     padding: 0;
103 |     .ft-input-wrapper {
104 |       display: flex;
105 |       align-items: center;
106 |       > div {
107 |         flex: 1;
108 |         input {
109 |           width: 100%;
110 |         }
111 |       }
112 | 
113 |       label {
114 |         margin-left: 8px;
115 |         border: 0;
116 |         color: white;
117 |         cursor: pointer;
118 |         transition: color 0.15s;
119 |         white-space: nowrap;
120 |         user-select: none;
121 |         &:hover {
122 |           color: var(--k-player-primary-color);
123 |         }
124 |       }
125 |     }
126 |   }
127 | 
128 |   &-filter-table {
129 |     margin-top: 8px;
130 |     .ft {
131 |       &-body {
132 |         height: 200px;
133 |         overflow: auto;
134 |         &::-webkit-scrollbar {
135 |           display: none;
136 |         }
137 |       }
138 |       &-row {
139 |         display: flex;
140 |         border-radius: 4px;
141 |         transition: all 0.15s;
142 |         &:hover {
143 |           background: var(--k-player-background-highlight);
144 |         }
145 |       }
146 |       &-content {
147 |         padding: 4px 8px;
148 |         flex: 1px;
149 |         min-width: 0;
150 |         overflow: hidden;
151 |         text-overflow: ellipsis;
152 |         white-space: nowrap;
153 |       }
154 |       &-op {
155 |         flex-shrink: 0;
156 |         padding: 4px 8px;
157 |       }
158 |     }
159 | 
160 |     a {
161 |       color: white;
162 |       cursor: pointer;
163 |       transition: color 0.15s;
164 |       user-select: none;
165 |       &:hover {
166 |         color: var(--k-player-primary-color);
167 |       }
168 |     }
169 |   }
170 | 
171 |   &-log {
172 |     position: absolute;
173 |     inset: 0;
174 |     padding: 8px;
175 |     overflow: auto;
176 |     .k-player-danmaku-log {
177 |       &-item {
178 |         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
179 |         padding-bottom: 4px;
180 |         margin-bottom: 4px;
181 |         line-height: 1.4;
182 |       }
183 | 
184 |       &-content {
185 |         padding: 4px 8px;
186 |         border-radius: 4px;
187 |         background: rgba(255, 255, 255, 0.2);
188 |         margin-top: 4px;
189 |       }
190 |       &-code {
191 |         white-space: pre-wrap;
192 |         word-wrap: break-word;
193 |         display: -webkit-box;
194 |         -webkit-line-clamp: 3;
195 |         line-clamp: 3;
196 |         -webkit-box-orient: vertical;
197 |         overflow: hidden;
198 |         text-overflow: ellipsis;
199 |         max-height: 60px;
200 |         font-size: 12px;
201 |       }
202 |     }
203 |   }
204 | }
205 | 
206 | #k-player-pbp {
207 |   position: absolute;
208 |   top: -17px;
209 |   height: 28px;
210 |   -webkit-appearance: none;
211 |   appearance: none;
212 |   left: 0;
213 |   position: absolute;
214 |   margin-left: calc(var(--plyr-range-thumb-height, 13px) * -0.5);
215 |   margin-right: calc(var(--plyr-range-thumb-height, 13px) * -0.5);
216 |   width: calc(100% + var(--plyr-range-thumb-height, 13px));
217 |   pointer-events: none;
218 | }
219 | #k-player-pbp-played-path {
220 |   color: var(--k-player-primary-color);
221 | }
222 | .plyr__controls__item.plyr__progress__container:hover #k-player-pbp {
223 |   top: -18px;
224 | }
225 | 
226 | .plyr__switch-danmaku .icon--pressed {
227 |   --color: var(--k-player-primary-color);
228 |   transition: 0.3s all ease;
229 | }
230 | .plyr__switch-danmaku:hover .icon--pressed {
231 |   --color: white;
232 | }
233 | 
234 | .k-popover-active .plyr__tooltip {
235 |   display: none;
236 | }
237 | 
238 | .k-player-controls-force-show.plyr {
239 |   .plyr__controls {
240 |     opacity: 1;
241 |     pointer-events: auto;
242 |     transform: translateY(0);
243 |   }
244 | }
245 | 
246 | .k-player-danmaku-list {
247 |   * {
248 |     box-sizing: border-box;
249 |     font-size: 14px;
250 |     line-height: normal;
251 |     font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
252 |       Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
253 |       sans-serif;
254 |   }
255 |   .k-modal-body {
256 |     padding: 0;
257 |   }
258 | 
259 |   &-wrapper {
260 |     height: 500px;
261 |     max-height: 80vh;
262 |     display: flex;
263 |     flex-direction: column;
264 |   }
265 | 
266 |   &-source-filter {
267 |     display: flex;
268 |     align-items: center;
269 |     white-space: nowrap;
270 |     padding: 16px;
271 |   }
272 |   &-source {
273 |     flex: 1;
274 |     min-width: 0;
275 |     display: flex;
276 |     flex-wrap: wrap;
277 |     gap: 8px;
278 |   }
279 | 
280 |   &-table-wrapper {
281 |     flex: 1;
282 |     min-height: 0;
283 |     overflow-y: scroll;
284 |     position: relative;
285 |     &::-webkit-scrollbar {
286 |       width: 8px;
287 |     }
288 |     &::-webkit-scrollbar-thumb {
289 |       background: rgba(0, 0, 0, 0.15);
290 |       border-radius: 4px;
291 |       &:hover {
292 |         background-color: rgba(0, 0, 0, 0.45);
293 |       }
294 |     }
295 |   }
296 |   &-table {
297 |     width: 100%;
298 |     border-spacing: 0;
299 |     border-collapse: separate;
300 |     table-layout: fixed;
301 | 
302 |     th,
303 |     td {
304 |       padding: 8px;
305 |       border-bottom: 1px solid #f1f1f1;
306 |       word-wrap: break-word;
307 |       word-break: break-all;
308 |       white-space: nowrap;
309 |     }
310 | 
311 |     th {
312 |       position: sticky;
313 |       background-color: white;
314 |       top: 0;
315 |       z-index: 1;
316 |     }
317 | 
318 |     th:nth-child(1) {
319 |       width: 55px;
320 |     }
321 |     td:nth-child(2) {
322 |       overflow: hidden;
323 |       text-overflow: ellipsis;
324 |     }
325 |     th:nth-child(3) {
326 |       width: 100px;
327 |     }
328 |   }
329 | }
330 | 


--------------------------------------------------------------------------------
/src/player/plugins/autoseek/autoseek.ts:
--------------------------------------------------------------------------------
  1 | import { get, isNil, set, throttle } from 'lodash-es'
  2 | import { modal } from '../../../utils/modal'
  3 | import { KPlayer } from '../../Kplayer'
  4 | import { Shortcuts } from '../shortcuts'
  5 | import T from './html.template.html'
  6 | import { local } from '../../../utils/storage'
  7 | 
  8 | declare module '../../KPlayer' {
  9 |   interface KPlayer {
 10 |     autoSeek: AutoSeek
 11 |   }
 12 | }
 13 | 
 14 | // 所有时间都是秒
 15 | type AutoSeekConfigItem = {
 16 |   enabled: boolean
 17 |   start?: number | string // 开始时间
 18 |   diff?: number // 跳过的时间
 19 | }
 20 | type AutoSeekConfig = {
 21 |   start: AutoSeekConfigItem
 22 |   end: AutoSeekConfigItem
 23 | }
 24 | 
 25 | enum Commands {
 26 |   autoSeekConfig = 'autoSeekConfig',
 27 | }
 28 | function bindFormEvent(formHTML: string, data: AutoSeekConfig) {
 29 |   const $form = $(formHTML)
 30 |   $form.find<HTMLInputElement>('input[name]').each((_, el) => {
 31 |     switch (el.getAttribute('type')) {
 32 |       case 'checkbox':
 33 |         el.checked = get(data, el.name, false)
 34 |         break
 35 |       case 'number':
 36 |       case 'text': {
 37 |         el.value = get(data, el.name, '')
 38 |         break
 39 |       }
 40 |       default:
 41 |         break
 42 |     }
 43 |   })
 44 |   return $form
 45 | }
 46 | 
 47 | function parseStartTime(value: string | number): number {
 48 |   if (typeof value === 'number') return value
 49 |   const [m, s] = value.split(':')
 50 |   return parseInt(m) * 60 + parseInt(s)
 51 | }
 52 | 
 53 | function getFormData(form: JQuery) {
 54 |   const data: any = {}
 55 |   form.find<HTMLInputElement>('input[name]').each((_, el) => {
 56 |     switch (el.getAttribute('type')) {
 57 |       case 'checkbox':
 58 |         set(data, el.name, el.checked)
 59 |         break
 60 |       case 'number': {
 61 |         const value = isNaN(parseInt(el.value)) ? undefined : parseInt(el.value)
 62 |         set(data, el.name, value)
 63 |       }
 64 |       case 'text': {
 65 |         const raw = el.value.trim()
 66 |         const isTime = /^\d+[：:]\d+$/.test(raw)
 67 |         if (isTime) {
 68 |           set(data, el.name, raw.replace(/[：:]/g, ':'))
 69 |         } else {
 70 |           const value = isNaN(parseInt(el.value))
 71 |             ? undefined
 72 |             : parseInt(el.value)
 73 |           set(data, el.name, value)
 74 |         }
 75 |       }
 76 |       default:
 77 |         break
 78 |     }
 79 |   })
 80 |   return data as AutoSeekConfig
 81 | }
 82 | 
 83 | Shortcuts.keyBindings.registerKeyBinding({
 84 |   command: Commands.autoSeekConfig,
 85 |   description: '设置跳过片段',
 86 |   key: 'G',
 87 | })
 88 | Shortcuts.registerCommand(
 89 |   Commands.autoSeekConfig,
 90 |   (function () {
 91 |     let open = false
 92 |     return function () {
 93 |       if (!this.autoSeek.scope) {
 94 |         this.message.info('该网站暂未适配自动跳过片段功能，敬请期待')
 95 |         return
 96 |       }
 97 | 
 98 |       if (open) return
 99 |       open = true
100 |       this.plyr.pause()
101 |       modal({
102 |         width: 350,
103 |         title: '跳过片段设置',
104 |         content: bindFormEvent(
105 |           T['k-autoseek-config'],
106 |           this.autoSeek.getConfig()
107 |         ),
108 |         afterClose: () => {
109 |           open = false
110 |           this.plyr.play()
111 |         },
112 |         handleOkOnEnter: true,
113 |         onOk: () => {
114 |           const config = getFormData($('#k-autoseek-config form'))
115 |           if (
116 |             config.start.enabled &&
117 |             (isNil(config.start.start) || isNil(config.start.diff))
118 |           ) {
119 |             config.start.enabled = false
120 |             delete config.start.start
121 |             delete config.start.diff
122 |           }
123 | 
124 |           if (
125 |             config.end.enabled &&
126 |             (isNil(config.end.start) || isNil(config.end.diff))
127 |           ) {
128 |             config.end.enabled = false
129 |             delete config.end.start
130 |             delete config.end.diff
131 |           }
132 | 
133 |           if (config.start.diff) {
134 |             config.start.diff = Math.abs(config.start.diff)
135 |           }
136 |           if (config.end.diff) {
137 |             config.end.diff = Math.abs(config.end.diff)
138 |           }
139 | 
140 |           this.autoSeek.setConfig(config)
141 |         },
142 |       })
143 |     }
144 |   })()
145 | )
146 | 
147 | const DefaultConfig: AutoSeekConfig = {
148 |   start: { enabled: false, start: 0, diff: 85 },
149 |   end: { enabled: false },
150 | }
151 | 
152 | class AutoSeek {
153 |   config = DefaultConfig
154 |   localStoreKey = 'k-autoSeek-config'
155 |   scope?: string
156 | 
157 |   constructor(private player: KPlayer) {
158 |     this.player.autoSeek = this
159 | 
160 |     this.player.getAnimeScope().then((scope) => {
161 |       this.init(scope)
162 |     })
163 |   }
164 | 
165 |   getConfig() {
166 |     if (!this.scope) throw new Error('AutoSeek scope is not set')
167 | 
168 |     const store = local.getItem<Record<string, AutoSeekConfig>>(
169 |       this.localStoreKey,
170 |       {}
171 |     )
172 | 
173 |     return store[this.scope] || DefaultConfig
174 |   }
175 |   setConfig(config: AutoSeekConfig) {
176 |     if (!this.scope) throw new Error('AutoSeek scope is not set')
177 | 
178 |     this.config = config
179 | 
180 |     local.setItem(this.localStoreKey, {
181 |       ...local.getItem(this.localStoreKey, {}),
182 |       [this.scope]: config,
183 |     })
184 | 
185 |     this.refresh()
186 |   }
187 | 
188 |   private init(scope: string) {
189 |     this.scope = scope
190 |     this.config = this.getConfig()
191 | 
192 |     this.player.on('loadedmetadata', () => {
193 |       this.refresh()
194 |     })
195 | 
196 |     let isSeeking = false
197 |     // 监听用户交互
198 |     const container = this.player.plyr.elements.controls
199 |     if (container) {
200 |       // 监听进度条相关的用户交互
201 |       const progressContainer = container.querySelector('.plyr__progress')
202 |       if (progressContainer) {
203 |         progressContainer.addEventListener('mousedown', () => {
204 |           isSeeking = true
205 |         })
206 |         progressContainer.addEventListener('mouseup', () => {
207 |           isSeeking = false
208 |         })
209 |         progressContainer.addEventListener('touchstart', () => {
210 |           isSeeking = true
211 |         })
212 |         progressContainer.addEventListener('touchend', () => {
213 |           isSeeking = false
214 |         })
215 |       }
216 |     }
217 | 
218 |     this.player.on(
219 |       'timeupdate',
220 |       throttle(() => {
221 |         const media = this.player.media
222 |         const currentTime = media.currentTime
223 |         const duration = media.duration
224 |         const safeMaxTime = duration - 0.1
225 | 
226 |         const enabled = this.config.start.enabled || this.config.end.enabled
227 |         if (
228 |           !enabled ||
229 |           isSeeking ||
230 |           // 避免在片尾时触发
231 |           currentTime >= duration - 3
232 |         )
233 |           return
234 | 
235 |         if (this.config.start.enabled) {
236 |           const start = parseStartTime(this.config.start.start || 0)
237 |           const diff = this.config.start.diff || 0
238 | 
239 |           if (currentTime >= start && currentTime <= start + diff) {
240 |             this.player.media.currentTime = Math.min(start + diff, safeMaxTime)
241 |           }
242 |         }
243 | 
244 |         if (this.config.end.enabled) {
245 |           const start = parseStartTime(this.config.end.start || 0)
246 |           const diff = this.config.end.diff || 0
247 | 
248 |           if (start <= 0) {
249 |             if (
250 |               currentTime >= start + duration - diff &&
251 |               currentTime <= start + duration
252 |             ) {
253 |               this.player.media.currentTime = Math.min(
254 |                 start + duration,
255 |                 safeMaxTime
256 |               )
257 |             }
258 |           } else {
259 |             if (currentTime >= start && currentTime <= start + diff) {
260 |               this.player.media.currentTime = Math.min(
261 |                 start + diff,
262 |                 safeMaxTime
263 |               )
264 |             }
265 |           }
266 |         }
267 |       }, 300)
268 |     )
269 |   }
270 | 
271 |   private refresh() {
272 |     const duration = this.player.media.duration
273 |     if (!duration) return
274 | 
275 |     $('#k-autoseek-overlay').remove()
276 | 
277 |     const enabled = this.config.start.enabled || this.config.end.enabled
278 |     if (!enabled) return
279 |     const $overlay = $(T['k-autoseek-overlay'])
280 | 
281 |     if (this.config.start.enabled) {
282 |       const start = parseStartTime(this.config.start.start || 0)
283 |       const $segment = $('<div class="k-autoseek-segment" />')
284 |       $segment.css({
285 |         left: `${(start / duration) * 100}%`,
286 |       })
287 |       $overlay.append($segment)
288 |     }
289 |     if (this.config.end.enabled) {
290 |       const start = parseStartTime(this.config.end.start || 0)
291 |       const diff = this.config.end.diff || 0
292 |       const $segment = $('<div class="k-autoseek-segment" />')
293 | 
294 |       if (start <= 0) {
295 |         $segment.css({
296 |           left: `${((start + duration - diff) / duration) * 100}%`,
297 |         })
298 |       } else {
299 |         $segment.css({
300 |           left: `${(start / duration) * 100}%`,
301 |         })
302 |       }
303 | 
304 |       $overlay.append($segment)
305 |     }
306 | 
307 |     this.player.plyr.elements.container
308 |       ?.querySelector('.plyr__progress')
309 |       ?.append($overlay[0])
310 |   }
311 | }
312 | 
313 | export function setup(player: KPlayer) {
314 |   new AutoSeek(player)
315 | }
316 | 


--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "compilerOptions": {
  3 |     /* Visit https://aka.ms/tsconfig.json to read more about this file */
  4 | 
  5 |     /* Projects */
  6 |     // "incremental": true,                              /* Enable incremental compilation */
  7 |     // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
  8 |     // "tsBuildInfoFile": "./",                          /* Specify the folder for .tsbuildinfo incremental compilation files. */
  9 |     // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects */
 10 |     // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
 11 |     // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
 12 | 
 13 |     /* Language and Environment */
 14 |     "target": "ESNext" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
 15 |     "lib": [
 16 |       "DOM",
 17 |       "DOM.Iterable",
 18 |       "ES2017"
 19 |     ] /* Specify a set of bundled library declaration files that describe the target runtime environment. */,
 20 |     // "jsx": "preserve",                                /* Specify what JSX code is generated. */
 21 |     // "experimentalDecorators": true,                   /* Enable experimental support for TC39 stage 2 draft decorators. */
 22 |     // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
 23 |     // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h' */
 24 |     // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
 25 |     // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using `jsx: react-jsx*`.` */
 26 |     // "reactNamespace": "",                             /* Specify the object invoked for `createElement`. This only applies when targeting `react` JSX emit. */
 27 |     // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
 28 |     // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
 29 | 
 30 |     /* Modules */
 31 |     "module": "ESNext" /* Specify what module code is generated. */,
 32 |     // "rootDir": "./",                                  /* Specify the root folder within your source files. */
 33 |     "moduleResolution": "node" /* Specify how TypeScript looks up a file from a given module specifier. */,
 34 |     // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
 35 |     // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
 36 |     // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
 37 |     // "typeRoots": [],                                  /* Specify multiple folders that act like `./node_modules/@types`. */
 38 |     // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
 39 |     // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
 40 |     // "resolveJsonModule": true,                        /* Enable importing .json files */
 41 |     // "noResolve": true,                                /* Disallow `import`s, `require`s or `<reference>`s from expanding the number of files TypeScript should add to a project. */
 42 | 
 43 |     /* JavaScript Support */
 44 |     // "allowJs": true /* Allow JavaScript files to be a part of your program. Use the `checkJS` option to get errors from these files. */,
 45 |     // "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
 46 |     // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from `node_modules`. Only applicable with `allowJs`. */
 47 | 
 48 |     /* Emit */
 49 |     // "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
 50 |     // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
 51 |     // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
 52 |     // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
 53 |     // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */
 54 |     // "outDir": "./",                                   /* Specify an output folder for all emitted files. */
 55 |     // "removeComments": true,                           /* Disable emitting comments. */
 56 |     "noEmit": true /* Disable emitting files from a compilation. */,
 57 |     // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
 58 |     // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types */
 59 |     // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
 60 |     // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
 61 |     // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
 62 |     // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
 63 |     // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
 64 |     // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
 65 |     // "newLine": "crlf",                                /* Set the newline character for emitting files. */
 66 |     // "stripInternal": true,                            /* Disable emitting declarations that have `@internal` in their JSDoc comments. */
 67 |     // "noEmitHelpers": true,                            /* Disable generating custom helper functions like `__extends` in compiled output. */
 68 |     // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
 69 |     // "preserveConstEnums": true,                       /* Disable erasing `const enum` declarations in generated code. */
 70 |     // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
 71 |     // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
 72 | 
 73 |     /* Interop Constraints */
 74 |     // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
 75 |     "allowSyntheticDefaultImports": true /* Allow 'import x from y' when a module doesn't have a default export. */,
 76 |     "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */,
 77 |     // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
 78 |     "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
 79 | 
 80 |     /* Type Checking */
 81 |     "strict": true /* Enable all strict type-checking options. */,
 82 |     // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied `any` type.. */
 83 |     // "strictNullChecks": true,                         /* When type checking, take into account `null` and `undefined`. */
 84 |     // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
 85 |     // "strictBindCallApply": true,                      /* Check that the arguments for `bind`, `call`, and `apply` methods match the original function. */
 86 |     // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
 87 |     // "noImplicitThis": true,                           /* Enable error reporting when `this` is given the type `any`. */
 88 |     // "useUnknownInCatchVariables": true,               /* Type catch clause variables as 'unknown' instead of 'any'. */
 89 |     // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
 90 |     // "noUnusedLocals": true,                           /* Enable error reporting when a local variables aren't read. */
 91 |     // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read */
 92 |     // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
 93 |     // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
 94 |     // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
 95 |     // "noUncheckedIndexedAccess": true,                 /* Include 'undefined' in index signature results */
 96 |     // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
 97 |     // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type */
 98 |     // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
 99 |     // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
100 | 
101 |     /* Completeness */
102 |     // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
103 |     "skipLibCheck": true /* Skip type checking all .d.ts files. */
104 |   }
105 | }
106 | 


--------------------------------------------------------------------------------
/src/player/plugins/danmaku/html.ts:
--------------------------------------------------------------------------------
  1 | import { popover } from '../../../utils/popover'
  2 | import { tabs } from '../../../utils/tabs'
  3 | import { KPlayer } from '../../Kplayer'
  4 | import { Commands } from './types'
  5 | 
  6 | export class DanmakuElements {
  7 |   constructor(private player: KPlayer) {
  8 |     this.$danmakuOverlay.attr('id', 'k-player-danmaku-overlay')
  9 |   }
 10 | 
 11 |   $danmakuOverlay = tabs([
 12 |     {
 13 |       name: '搜索',
 14 |       content: `<div id="k-player-danmaku-search-form">
 15 |       <label>
 16 |         <span>搜索番剧名称</span>
 17 |         <input type="text" id="animeName" class="k-input" />
 18 |       </label>
 19 |       <div style="min-height:24px; padding-top:4px">
 20 |         <span id="tips"></span>
 21 |       </div>
 22 |       <label>
 23 |         <span>番剧名称</span>
 24 |         <select id="animes" class="k-select"></select>
 25 |       </label>
 26 |       <label>
 27 |         <span>章节</span>
 28 |         <select id="episodes" class="k-select"></select>
 29 |       </label>
 30 |       <label>
 31 |         <span class="open-danmaku-list">
 32 |           <span>弹幕列表</span><small data-id="count"></small>
 33 |         </span>
 34 |       </label>
 35 |       
 36 |       <span class="specific-thanks">弹幕服务由 弹弹play 提供</span>
 37 |     </div>`,
 38 |     },
 39 |     {
 40 |       name: '设置',
 41 |       content: `
 42 |     <div id="k-player-danmaku-setting-form" class="k-settings-list">
 43 |       <label class="k-settings-item">
 44 |         <input type="checkbox" name="showDanmaku" />
 45 |         <span>显示弹幕(<k-shortcuts-tip command="${Commands.danmakuSwitch}"></k-shortcuts-tip>)</span>
 46 |         </label>
 47 |       <label class="k-settings-item">
 48 |         <input type="checkbox" name="showPbp" />
 49 |         <span>显示高能进度条</span>
 50 |       </label>
 51 |       <div class="k-settings-item">
 52 |         <label class="k-settings-item" title="启用后合并显示重复的弹幕">
 53 |           <input type="checkbox" name="danmakuMerge" />
 54 |           <span>合并弹幕</span>
 55 |         </label>
 56 |         <label class="k-settings-item" title="启用后当弹幕过多的时候可以重叠显示">
 57 |           <input type="checkbox" name="danmakuOverlap" />
 58 |           <span>重叠弹幕</span>
 59 |         </label>
 60 |       </div>
 61 |       <label class="k-settings-item">
 62 |         <span>透明度&#12288;</span>
 63 |         <input type="range" name="opacity" step="0.01" min="0" max="1" />
 64 |       </label>
 65 |       <label class="k-settings-item">
 66 |         <span>弹幕大小</span>
 67 |         <input type="range" name="danmakuFontSize" step="0.01" min="0.5" max="2" />
 68 |       </label>
 69 |       <label class="k-settings-item">
 70 |         <span>弹幕速度</span>
 71 |         <input type="range" name="danmakuSpeed" step="0.01" min="0.5" max="1.5" />
 72 |       </label>
 73 |       <label class="k-settings-item" title="基准为 24 分钟 3000 条弹幕">
 74 |         <span>弹幕密度</span>
 75 |         <input type="range" name="danmakuDensity" step="0.01" min="0.5" max="2" />
 76 |       </label>
 77 |       <label class="k-settings-item">
 78 |         <span>弹幕区域</span>
 79 |         <input type="range" name="danmakuScrollAreaPercent" step="0.01" min="0.25" max="1" />
 80 |       </label>
 81 |       <div class="k-settings-item" style="height:24px">
 82 |         <div>弹幕类型</div>
 83 |         <label class="k-settings-item" title="顶部弹幕">
 84 |           <input type="checkbox" name="danmakuMode" value="top"/>
 85 |           <span>顶</span>
 86 |         </label>
 87 |         <label class="k-settings-item" title="底部弹幕">
 88 |           <input type="checkbox" name="danmakuMode" value="bottom"/>
 89 |           <span>底</span>
 90 |         </label>
 91 |         <label class="k-settings-item" title="彩色弹幕">
 92 |           <input type="checkbox" name="danmakuMode" value="color" />
 93 |           <span>彩</span>
 94 |         </label>
 95 |       </div>
 96 |     </div>
 97 |     `,
 98 |     },
 99 |     {
100 |       name: '过滤',
101 |       content: `
102 |     <div id="k-player-danmaku-filter-form">
103 |       <div class="ft-input-wrapper">
104 |         <div>
105 |           <input type="text" name="filter-input" placeholder="可正则“/”开头“/”结尾" class="k-input"/>
106 |         </div>
107 |         <label id="k-player-danmaku-filter-import" title="导入B站弹幕过滤设置">
108 |           导入
109 |         </label>
110 |       </div>
111 | 
112 |       <div id="k-player-danmaku-filter-table">
113 |         <div class="ft-row" style="pointer-events:none;">
114 |           <div class="ft-content">内容(<span id="filter-count"></span>)</div>
115 |           <div class="ft-op">操作</div>
116 |         </div>
117 |         <div class="ft-body"></div>
118 |       </div>
119 |     </div>
120 |     `,
121 |     },
122 |     {
123 |       name: '日志',
124 |       content: `
125 |     <div id="k-player-danmaku-log"></div>
126 |     `,
127 |     },
128 |   ])
129 | 
130 |   $danmakuSwitch = $(`
131 | <button
132 |   class="plyr__controls__item plyr__control plyr__switch-danmaku plyr__custom"
133 |   type="button"
134 |   data-plyr="switch-danmaku"
135 |   aria-label="switch-danmaku"
136 |   >
137 |   <svg class="icon--not-pressed" focusable="false" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="bpx-svg-sprite-danmu-off"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.085 4.891l-.999-1.499a1.008 1.008 0 011.679-1.118l1.709 2.566c.54-.008 1.045-.012 1.515-.012h.13c.345 0 .707.003 1.088.007l1.862-2.59a1.008 1.008 0 011.637 1.177l-1.049 1.46c.788.02 1.631.046 2.53.078 1.958.069 3.468 1.6 3.74 3.507.088.613.13 2.158.16 3.276l.001.027c.01.333.017.63.025.856a.987.987 0 01-1.974.069c-.008-.23-.016-.539-.025-.881v-.002c-.028-1.103-.066-2.541-.142-3.065-.143-1.004-.895-1.78-1.854-1.813-2.444-.087-4.466-.13-6.064-.131-1.598 0-3.619.044-6.063.13a2.037 2.037 0 00-1.945 1.748c-.15 1.04-.225 2.341-.225 3.904 0 1.874.11 3.474.325 4.798.154.949.95 1.66 1.91 1.708a97.58 97.58 0 005.416.139.988.988 0 010 1.975c-2.196 0-3.61-.047-5.513-.141A4.012 4.012 0 012.197 17.7c-.236-1.446-.351-3.151-.351-5.116 0-1.64.08-3.035.245-4.184A4.013 4.013 0 015.92 4.96c.761-.027 1.483-.05 2.164-.069zm4.436 4.707h-1.32v4.63h2.222v.848h-2.618v1.078h2.431a5.01 5.01 0 013.575-3.115V9.598h-1.276a8.59 8.59 0 00.748-1.42l-1.089-.384a14.232 14.232 0 01-.814 1.804h-1.518l.693-.308a8.862 8.862 0 00-.814-1.408l-1.045.352c.297.396.572.847.825 1.364zm-4.18 3.564l.154-1.485h1.98V8.289h-3.2v.979h2.067v1.43H7.483l-.308 3.454h2.277c0 1.166-.044 1.925-.12 2.277-.078.352-.386.528-.936.528-.308 0-.616-.022-.902-.055l.297 1.067.062.004c.285.02.551.04.818.04 1.001-.066 1.562-.418 1.694-1.056.11-.638.176-1.903.176-3.795h-2.2zm7.458.11v-.858h-1.254v.858H15.8zm-2.376-.858v.858h-1.199v-.858h1.2zm-1.199-.946h1.2v-.902h-1.2v.902zm2.321 0v-.902H15.8v.902h-1.254zm3.517 10.594a4 4 0 100-8 4 4 0 000 8zm-.002-1.502a2.5 2.5 0 01-2.217-3.657l3.326 3.398a2.49 2.49 0 01-1.109.259zm2.5-2.5c0 .42-.103.815-.286 1.162l-3.328-3.401a2.5 2.5 0 013.614 2.239z"></path></svg>
138 |   <svg class="icon--pressed" focusable="false" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="bpx-svg-sprite-danmu-on"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.989 4.828c-.47 0-.975.004-1.515.012l-1.71-2.566a1.008 1.008 0 00-1.678 1.118l.999 1.5c-.681.018-1.403.04-2.164.068a4.013 4.013 0 00-3.83 3.44c-.165 1.15-.245 2.545-.245 4.185 0 1.965.115 3.67.35 5.116a4.012 4.012 0 003.763 3.363l.906.046c1.205.063 1.808.095 3.607.095a.988.988 0 000-1.975c-1.758 0-2.339-.03-3.501-.092l-.915-.047a2.037 2.037 0 01-1.91-1.708c-.216-1.324-.325-2.924-.325-4.798 0-1.563.076-2.864.225-3.904.14-.977.96-1.713 1.945-1.747 2.444-.087 4.465-.13 6.063-.131 1.598 0 3.62.044 6.064.13.96.034 1.71.81 1.855 1.814.075.524.113 1.962.141 3.065v.002c.01.342.017.65.025.88a.987.987 0 101.974-.068c-.008-.226-.016-.523-.025-.856v-.027c-.03-1.118-.073-2.663-.16-3.276-.273-1.906-1.783-3.438-3.74-3.507-.9-.032-1.743-.058-2.531-.078l1.05-1.46a1.008 1.008 0 00-1.638-1.177l-1.862 2.59c-.38-.004-.744-.007-1.088-.007h-.13zm.521 4.775h-1.32v4.631h2.222v.847h-2.618v1.078h2.618l.003.678c.36.026.714.163 1.01.407h.11v-1.085h2.694v-1.078h-2.695v-.847H16.8v-4.63h-1.276a8.59 8.59 0 00.748-1.42L15.183 7.8a14.232 14.232 0 01-.814 1.804h-1.518l.693-.308a8.862 8.862 0 00-.814-1.408l-1.045.352c.297.396.572.847.825 1.364zm-4.18 3.564l.154-1.485h1.98V8.294h-3.2v.98H9.33v1.43H7.472l-.308 3.453h2.277c0 1.166-.044 1.925-.12 2.277-.078.352-.386.528-.936.528-.308 0-.616-.022-.902-.055l.297 1.067.062.005c.285.02.551.04.818.04 1.001-.067 1.562-.419 1.694-1.057.11-.638.176-1.903.176-3.795h-2.2zm7.458.11v-.858h-1.254v.858h1.254zm-2.376-.858v.858h-1.199v-.858h1.2zm-1.199-.946h1.2v-.902h-1.2v.902zm2.321 0v-.902h1.254v.902h-1.254z"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M22.846 14.627a1 1 0 00-1.412.075l-5.091 5.703-2.216-2.275-.097-.086-.008-.005a1 1 0 00-1.322 1.493l2.963 3.041.093.083.007.005c.407.315 1 .27 1.354-.124l5.81-6.505.08-.102.005-.008a1 1 0 00-.166-1.295z" fill="var(--color)"></path></svg>
139 |   <span class="label--not-pressed plyr__tooltip">开启弹幕(<k-shortcuts-tip command="${Commands.danmakuSwitch}"></k-shortcuts-tip>)</span>
140 |   <span class="label--pressed plyr__tooltip">关闭弹幕(<k-shortcuts-tip command="${Commands.danmakuSwitch}"></k-shortcuts-tip>)</span>
141 | </button>`)
142 |   $danmakuSettingButton =
143 |     $(`<button class="plyr__controls__item plyr__control" type="button" data-plyr="danmaku-setting">
144 | <svg class="icon--not-pressed" focusable="false" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" id="bpx-svg-sprite-new-danmu-setting"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.645 4.881l1.06-1.473a.998.998 0 10-1.622-1.166L13.22 4.835a110.67 110.67 0 00-1.1-.007h-.131c-.47 0-.975.004-1.515.012L8.783 2.3A.998.998 0 007.12 3.408l.988 1.484c-.688.019-1.418.042-2.188.069a4.013 4.013 0 00-3.83 3.44c-.165 1.15-.245 2.545-.245 4.185 0 1.965.115 3.67.35 5.116a4.012 4.012 0 003.763 3.363c1.903.094 3.317.141 5.513.141a.988.988 0 000-1.975 97.58 97.58 0 01-5.416-.139 2.037 2.037 0 01-1.91-1.708c-.216-1.324-.325-2.924-.325-4.798 0-1.563.076-2.864.225-3.904.14-.977.96-1.713 1.945-1.747 2.444-.087 4.465-.13 6.063-.131 1.598 0 3.62.044 6.064.13.96.034 1.71.81 1.855 1.814.075.524.113 1.962.141 3.065v.002c.005.183.01.07.014-.038.004-.096.008-.189.011-.081a.987.987 0 101.974-.069c-.004-.105-.007-.009-.011.09-.002.056-.004.112-.007.135l-.002.01a.574.574 0 01-.005-.091v-.027c-.03-1.118-.073-2.663-.16-3.276-.273-1.906-1.783-3.438-3.74-3.507-.905-.032-1.752-.058-2.543-.079zm-3.113 4.703h-1.307v4.643h2.2v.04l.651-1.234c.113-.215.281-.389.482-.509v-.11h.235c.137-.049.283-.074.433-.074h1.553V9.584h-1.264a8.5 8.5 0 00.741-1.405l-1.078-.381c-.24.631-.501 1.23-.806 1.786h-1.503l.686-.305c-.228-.501-.5-.959-.806-1.394l-1.034.348c.294.392.566.839.817 1.35zm-1.7 5.502h2.16l-.564 1.068h-1.595v-1.068zm-2.498-1.863l.152-1.561h1.96V8.289H7.277v.969h2.048v1.435h-1.84l-.306 3.51h2.254c0 1.155-.043 1.906-.12 2.255-.076.348-.38.523-.925.523-.305 0-.61-.022-.893-.055l.294 1.056.061.005c.282.02.546.039.81.039.991-.065 1.547-.414 1.677-1.046.11-.631.175-1.883.175-3.757H8.334zm5.09-.8v.85h-1.188v-.85h1.187zm-1.188-.955h1.187v-.893h-1.187v.893zm2.322.007v-.893h1.241v.893h-1.241zm.528 2.757a1.26 1.26 0 011.087-.627l4.003-.009a1.26 1.26 0 011.094.63l1.721 2.982c.226.39.225.872-.001 1.263l-1.743 3a1.26 1.26 0 01-1.086.628l-4.003.009a1.26 1.26 0 01-1.094-.63l-1.722-2.982a1.26 1.26 0 01.002-1.263l1.742-3zm1.967.858a1.26 1.26 0 00-1.08.614l-.903 1.513a1.26 1.26 0 00-.002 1.289l.885 1.492c.227.384.64.62 1.086.618l2.192-.005a1.26 1.26 0 001.08-.615l.904-1.518a1.26 1.26 0 00.001-1.288l-.884-1.489a1.26 1.26 0 00-1.086-.616l-2.193.005zm2.517 2.76a1.4 1.4 0 11-2.8 0 1.4 1.4 0 012.8 0z"></path></svg>
145 | <span class="label--not-pressed plyr__tooltip">弹幕设置</span>
146 | </button>`)
147 |   $danmaku = popover({
148 |     target: this.$danmakuSettingButton,
149 |     overlay: this.$danmakuOverlay,
150 |     trigger: 'click',
151 |     onVisibleChange: (visible) => {
152 |       this.player.plyr.elements.container?.classList.toggle(
153 |         'k-player-controls-force-show',
154 |         visible
155 |       )
156 | 
157 |       if (visible) {
158 |         const dom = document.createElement('div')
159 |         dom.style.cssText = 'position: absolute; inset: 0; z-index: 10;'
160 |         dom.className = 'k-player-danmaku-overlay-video-prevent-click'
161 |         dom.addEventListener('click', (e) => {
162 |           e.stopPropagation()
163 |         })
164 |         this.player.plyr.elements.container?.prepend(dom)
165 |       } else {
166 |         this.player.plyr.elements.container
167 |           ?.querySelector('.k-player-danmaku-overlay-video-prevent-click')
168 |           ?.remove()
169 |       }
170 |     },
171 |   })
172 | 
173 |   $danmakuContainer = $('<div id="k-player-danmaku"></div>')
174 | 
175 |   $pbp = $(`
176 | <svg
177 |   viewBox="0 0 1000 100"
178 |   preserveAspectRatio="none"
179 |   id="k-player-pbp"
180 | >
181 |   <defs>
182 |     <clipPath id="k-player-pbp-curve-path" clipPathUnits="userSpaceOnUse">
183 |       <path d=""></path>
184 |     </clipPath>
185 |   </defs>
186 | 
187 |   <g
188 |     fill-opacity="0.2"
189 |     clip-path="url(#k-player-pbp-curve-path)"
190 |   >
191 |     <rect x="0" y="0" width="100%" height="100%" fill="rgb(255,255,255)"></rect>
192 |     <rect id="k-player-pbp-played-path" x="0" y="0" width="0" height="100%" fill="currentColor"></rect>
193 |   </g>
194 | </svg>
195 | `)
196 | 
197 |   $animeName = this.$danmaku.find('#animeName')
198 |   $animes = this.$danmaku.find('#animes')
199 |   $episodes = this.$danmaku.find('#episodes')
200 |   $openDanmakuList = this.$danmaku.find('.open-danmaku-list')
201 |   $tips = this.$danmaku.find('#tips')
202 |   $showDanmaku = this.$danmaku.find<HTMLInputElement>("[name='showDanmaku']")
203 |   $showPbp = this.$danmaku.find<HTMLInputElement>("[name='showPbp']")
204 |   $danmakuMerge = this.$danmaku.find<HTMLInputElement>("[name='danmakuMerge']")
205 |   $danmakuOverlap = this.$danmaku.find<HTMLInputElement>(
206 |     "[name='danmakuOverlap']"
207 |   )
208 |   $opacity = this.$danmaku.find<HTMLInputElement>("[name='opacity']")
209 |   $danmakuSpeed = this.$danmaku.find<HTMLInputElement>("[name='danmakuSpeed']")
210 |   $danmakuFontSize = this.$danmaku.find<HTMLInputElement>(
211 |     "[name='danmakuFontSize']"
212 |   )
213 |   $danmakuDensity = this.$danmaku.find<HTMLInputElement>(
214 |     "[name='danmakuDensity']"
215 |   )
216 |   $danmakuScrollAreaPercent = this.$danmaku.find<HTMLInputElement>(
217 |     "[name='danmakuScrollAreaPercent']"
218 |   )
219 |   $danmakuMode = this.$danmaku.find<HTMLInputElement>("[name='danmakuMode']")
220 |   $log = this.$danmakuOverlay.find('#k-player-danmaku-log')
221 | }
222 | 


--------------------------------------------------------------------------------