x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-08 19:06:15 -08:00
Code Issues Packages Projects Releases Wiki Activity

Optimize setBar event and update chapter display in artplayer-plugin-chapter

Browse Source
This commit is contained in:
Harvey Zack committed 2024-06-03 00:35:47 +08:00
1 parent 94e34320e0
commit 2e72e0cec2
4 files changed
+69 -61
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

docs/uncompiled/artplayer-plugin-chapter/index.js
+27 -25
View File
@@ -148,7 +148,7 @@ parcelHelpers.defineInteropFlag(exports);
parcelHelpers.export(exports, "default", ()=>artplayerPluginChapter);
var _styleLess = require("bundle-text:./style.less");
var _styleLessDefault = parcelHelpers.interopDefault(_styleLess);
function artplayerPluginChapter({ chapters = [] }) {
function artplayerPluginChapter(option = {}) {
return (art)=>{
const { $player } = art.template;
const { setStyle, append, clamp, query, isMobile, addClass, removeClass } = art.constructor.utils;
@@ -174,6 +174,29 @@ function artplayerPluginChapter({ chapters = [] }) {
else if (width > $inner.clientWidth - titleWidth / 2) setStyle($title, "left", `${$inner.clientWidth - titleWidth}px`);
else setStyle($title, "left", `${width - titleWidth / 2}px`);
}
function update(chapters = []) {
$control.innerText = "";
$chapters = chapters.map((chapter)=>{
const $chapter = append($control, html);
const start = clamp(chapter.start, 0, art.duration);
const end = clamp(chapter.end, 0, art.duration);
const duration = end - start;
const percentage = duration / art.duration;
$chapter.dataset.start = start;
$chapter.dataset.end = end;
$chapter.dataset.duration = duration;
$chapter.dataset.title = chapter.title.trim();
$chapter.style.width = `${percentage * 100}%`;
return {
$chapter,
$hover: query(".art-progress-hover", $chapter),
$loaded: query(".art-progress-loaded", $chapter),
$played: query(".art-progress-played", $chapter)
};
});
if ($chapters.length) addClass($player, "artplayer-plugin-chapter");
else removeClass($player, "artplayer-plugin-chapter");
}
art.on("setBar", (type, percentage, event)=>{
if (!$chapters.length) return;
for(let i = 0; i < $chapters.length; i++){
@@ -223,31 +246,10 @@ function artplayerPluginChapter({ chapters = [] }) {
setStyle($title, "display", "none");
});
}
art.on("video:loadedmetadata", ()=>{
$control.innerText = "";
$chapters = chapters.map((chapter)=>{
const $chapter = append($control, html);
const start = clamp(chapter.start, 0, art.duration);
const end = clamp(chapter.end, 0, art.duration);
const duration = end - start;
const percentage = duration / art.duration;
$chapter.dataset.start = start;
$chapter.dataset.end = end;
$chapter.dataset.duration = duration;
$chapter.dataset.title = chapter.title.trim();
$chapter.style.width = `${percentage * 100}%`;
return {
$chapter,
$hover: query(".art-progress-hover", $chapter),
$loaded: query(".art-progress-loaded", $chapter),
$played: query(".art-progress-played", $chapter)
};
});
if ($chapters.length) addClass($player, "artplayer-plugin-chapter");
else removeClass($player, "artplayer-plugin-chapter");
});
art.once("video:loadedmetadata", ()=>update(option.chapters));
return {
name: "artplayerPluginChapter"
name: "artplayerPluginChapter",
update: (chapters)=>update(chapters)
};
};
}
docs/uncompiled/artplayer-plugin-chapter/index.js.map
+1 -1
View File
@@ -1 +1 @@
{"mappings":"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","sources":["packages/artplayer-plugin-chapter/src/index.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-e8c48f234731c5ef.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import style from 'bundle-text:./style.less';\n\nexport default function artplayerPluginChapter({ chapters = [] }) {\n return (art) => {\n const { $player } = art.template;\n const { setStyle, append, clamp, query, isMobile, addClass, removeClass } = art.constructor.utils;\n\n const html = `\n <div class=\"art-chapter\">\n <div class=\"art-chapter-inner\">\n <div class=\"art-progress-hover\"></div>\n <div class=\"art-progress-loaded\"></div>\n <div class=\"art-progress-played\"></div>\n </div>\n </div>\n `;\n\n let titleTimer = null;\n let $chapters = [];\n\n const $progress = art.query('.art-control-progress');\n const $inner = art.query('.art-control-progress-inner');\n const $control = append($inner, '<div class=\"art-chapters\"></div>');\n const $title = append($inner, '<div class=\"art-chapter-title\"></div>');\n\n function showTitle({ $chapter, width }) {\n $title.innerText = $chapter.dataset.title || '';\n const titleWidth = $title.clientWidth;\n if (wiLine truncated
{"mappings":"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","sources":["packages/artplayer-plugin-chapter/src/index.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-e8c48f234731c5ef.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import style from 'bundle-text:./style.less';\n\nexport default function artplayerPluginChapter(option = {}) {\n return (art) => {\n const { $player } = art.template;\n const { setStyle, append, clamp, query, isMobile, addClass, removeClass } = art.constructor.utils;\n\n const html = `\n <div class=\"art-chapter\">\n <div class=\"art-chapter-inner\">\n <div class=\"art-progress-hover\"></div>\n <div class=\"art-progress-loaded\"></div>\n <div class=\"art-progress-played\"></div>\n </div>\n </div>\n `;\n\n let titleTimer = null;\n let $chapters = [];\n\n const $progress = art.query('.art-control-progress');\n const $inner = art.query('.art-control-progress-inner');\n const $control = append($inner, '<div class=\"art-chapters\"></div>');\n const $title = append($inner, '<div class=\"art-chapter-title\"></div>');\n\n function showTitle({ $chapter, width }) {\n $title.innerText = $chapter.dataset.title || '';\n Line truncated
packages/artplayer-plugin-chapter/src/index.js
+33 -30
View File
@@ -1,6 +1,6 @@
import style from 'bundle-text:./style.less';
export default function artplayerPluginChapter({ chapters = [] }) {
export default function artplayerPluginChapter(option = {}) {
return (art) => {
const { $player } = art.template;
const { setStyle, append, clamp, query, isMobile, addClass, removeClass } = art.constructor.utils;
@@ -35,6 +35,36 @@ export default function artplayerPluginChapter({ chapters = [] }) {
}
}
function update(chapters = []) {
$control.innerText = '';
$chapters = chapters.map((chapter) => {
const $chapter = append($control, html);
const start = clamp(chapter.start, 0, art.duration);
const end = clamp(chapter.end, 0, art.duration);
const duration = end - start;
const percentage = duration / art.duration;
$chapter.dataset.start = start;
$chapter.dataset.end = end;
$chapter.dataset.duration = duration;
$chapter.dataset.title = chapter.title.trim();
$chapter.style.width = `${percentage * 100}%`;
return {
$chapter,
$hover: query('.art-progress-hover', $chapter),
$loaded: query('.art-progress-loaded', $chapter),
$played: query('.art-progress-played', $chapter),
};
});
if ($chapters.length) {
addClass($player, 'artplayer-plugin-chapter');
} else {
removeClass($player, 'artplayer-plugin-chapter');
}
}
art.on('setBar', (type, percentage, event) => {
if (!$chapters.length) return;
@@ -97,38 +127,11 @@ export default function artplayerPluginChapter({ chapters = [] }) {
});
}
art.on('video:loadedmetadata', () => {
$control.innerText = '';
$chapters = chapters.map((chapter) => {
const $chapter = append($control, html);
const start = clamp(chapter.start, 0, art.duration);
const end = clamp(chapter.end, 0, art.duration);
const duration = end - start;
const percentage = duration / art.duration;
$chapter.dataset.start = start;
$chapter.dataset.end = end;
$chapter.dataset.duration = duration;
$chapter.dataset.title = chapter.title.trim();
$chapter.style.width = `${percentage * 100}%`;
return {
$chapter,
$hover: query('.art-progress-hover', $chapter),
$loaded: query('.art-progress-loaded', $chapter),
$played: query('.art-progress-played', $chapter),
};
});
if ($chapters.length) {
addClass($player, 'artplayer-plugin-chapter');
} else {
removeClass($player, 'artplayer-plugin-chapter');
}
});
art.once('video:loadedmetadata', () => update(option.chapters));
return {
name: 'artplayerPluginChapter',
update: (chapters) => update(chapters),
};
};
}
packages/artplayer-plugin-chapter/types/artplayer-plugin-chapter.d.ts
Vendored
+8 -5
View File
@@ -3,16 +3,19 @@ import type Artplayer from 'artplayer';
export = artplayerPluginChapter;
export as namespace artplayerPluginChapter;
type Chapters = {
start: number;
end: number;
title: string;
}[];
type Option = {
chapters?: {
start: number;
end: number;
title: string;
}[];
chapters?: Chapters;
};
type Result = {
name: 'artplayerPluginChapter';
update: (chapters: Chapters) => void;
};
declare const artplayerPluginChapter: (option: Option) => (art: Artplayer) => Result;