diff --git a/docs/uncompiled/artplayer-plugin-chapter/index.js b/docs/uncompiled/artplayer-plugin-chapter/index.js index d4df93f4a..54a72eb35 100644 --- a/docs/uncompiled/artplayer-plugin-chapter/index.js +++ b/docs/uncompiled/artplayer-plugin-chapter/index.js @@ -179,6 +179,7 @@ function artplayerPluginChapter(option = {}) { } else setStyle($title, "display", "none"); } function update(chapters = []) { + removeClass($player, "artplayer-plugin-chapter"); if (!Array.isArray(chapters)) return; if (!chapters.length) return; if (!art.duration) return; @@ -224,8 +225,7 @@ function artplayerPluginChapter(option = {}) { $played: query(".art-progress-played", $chapter) }; }); - if ($chapters.length) addClass($player, "artplayer-plugin-chapter"); - else removeClass($player, "artplayer-plugin-chapter"); + addClass($player, "artplayer-plugin-chapter"); art.emit("setBar", "loaded", art.loaded || 0); } art.on("setBar", (type, percentage, event)=>{ diff --git a/docs/uncompiled/artplayer-plugin-chapter/index.js.map b/docs/uncompiled/artplayer-plugin-chapter/index.js.map index 63aad37a8..c601ef6e8 100644 --- a/docs/uncompiled/artplayer-plugin-chapter/index.js.map +++ b/docs/uncompiled/artplayer-plugin-chapter/index.js.map @@ -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(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
\n
\n
\n
\n
\n
\n
\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, '
');\n const $title = append($inner, '
');\n\n function showTitle({ $chapter, width }) {\n const title = $chapter.dataset.title.trim();\n if (title) {\n setStyle($title, 'display', 'flex');\n $title.innerText = title;\n const titleWidth = $title.clientWidth;\n if (width <= titleWidth / 2) {\n setStyle($title, 'left', 0);\n } else if (width > $inner.clientWidth - titleWidth / 2) {\n setStyle($title, 'left', `${$inner.clientWidth - titleWidth}px`);\n } else {\n setStyle($title, 'left', `${width - titleWidth / 2}px`);\n }\n } else {\n setStyle($title, 'display', 'none');\n }\n }\n\n function update(chapters = []) {\n if (!Array.isArray(chapters)) return;\n if (!chapters.length) return;\n if (!art.duration) return;\n\n chapters = chapters.sort((a, b) => a.start - b.start);\n\n for (let i = 0; i < chapters.length; i++) {\n const chapter = chapters[i];\n const nextChapter = chapters[i + 1];\n\n if (\n typeof chapter.start !== 'number' ||\n typeof chapter.end !== 'number' ||\n typeof chapter.title !== 'string'\n ) {\n throw new Error('Illegal chapter data type');\n }\n\n if (chapter.start < 0 || chapter.end > art.duration || chapter.start >= chapter.end) {\n throw new Error('Illegal chapter time point');\n }\n\n if (nextChapter && chapter.end > nextChapter.start) {\n throw new Error('Illegal chapter time point');\n }\n }\n\n if (chapters[0].start > 0) {\n chapters.unshift({ start: 0, end: chapters[0].start, title: '' });\n }\n\n if (chapters[chapters.length - 1].end < art.duration) {\n chapters.push({ start: chapters[chapters.length - 1].end, end: art.duration, title: '' });\n }\n\n for (let i = 0; i < chapters.length - 1; i++) {\n if (chapters[i].end !== chapters[i + 1].start) {\n chapters.splice(i + 1, 0, {\n start: chapters[i].end,\n end: chapters[i + 1].start,\n title: '',\n });\n }\n }\n\n $control.innerText = '';\n $chapters = chapters.map((chapter) => {\n const $chapter = append($control, html);\n const start = clamp(chapter.start, 0, art.duration);\n const end = clamp(chapter.end, 0, art.duration);\n const duration = end - start;\n const percentage = duration / art.duration;\n $chapter.dataset.start = start;\n $chapter.dataset.end = end;\n $chapter.dataset.duration = duration;\n $chapter.dataset.title = chapter.title.trim();\n $chapter.style.width = `${percentage * 100}%`;\n\n return {\n $chapter,\n $hover: query('.art-progress-hover', $chapter),\n $loaded: query('.art-progress-loaded', $chapter),\n $played: query('.art-progress-played', $chapter),\n };\n });\n\n if ($chapters.length) {\n addClass($player, 'artplayer-plugin-chapter');\n } else {\n removeClass($player, 'artplayer-plugin-chapter');\n }\n\n art.emit('setBar', 'loaded', art.loaded || 0);\n }\n\n art.on('setBar', (type, percentage, event) => {\n if (!$chapters.length) return;\n\n for (let i = 0; i < $chapters.length; i++) {\n const { $chapter, $loaded, $played, $hover } = $chapters[i];\n\n const $target = {\n hover: $hover,\n loaded: $loaded,\n played: $played,\n }[type];\n\n if (!$target) return;\n\n const width = $control.clientWidth * percentage;\n const currentTime = art.duration * percentage;\n const duration = parseFloat($chapter.dataset.duration);\n const start = parseFloat($chapter.dataset.start);\n const end = parseFloat($chapter.dataset.end);\n\n if (currentTime < start) {\n setStyle($target, 'width', 0);\n }\n\n if (currentTime > end) {\n setStyle($target, 'width', '100%');\n }\n\n if (currentTime >= start && currentTime <= end) {\n const percentage = (currentTime - start) / duration;\n setStyle($target, 'width', `${percentage * 100}%`);\n\n if (isMobile) {\n if (type === 'played' && event) {\n showTitle({ $chapter, width });\n clearTimeout(titleTimer);\n titleTimer = setTimeout(() => {\n setStyle($title, 'display', 'none');\n }, 500);\n }\n } else {\n if (type === 'hover') {\n showTitle({ $chapter, width });\n }\n }\n }\n }\n });\n\n if (!isMobile) {\n art.proxy($progress, 'mouseleave', () => {\n if (!$chapters.length) return;\n setStyle($title, 'display', 'none');\n });\n }\n\n art.once('video:loadedmetadata', () => update(option.chapters));\n\n return {\n name: 'artplayerPluginChapter',\n update: (chapters) => update(chapters),\n };\n };\n}\n\nif (typeof document !== 'undefined') {\n const id = 'artplayer-plugin-chapter';\n const $style = document.getElementById(id);\n if ($style) {\n $style.textContent = style;\n } else {\n const $style = document.createElement('style');\n $style.id = id;\n $style.textContent = style;\n document.head.appendChild($style);\n }\n}\n\nif (typeof window !== 'undefined') {\n window['artplayerPluginChapter'] = artplayerPluginChapter;\n}\n","module.exports = \"644995735844259b\";","exports.interopDefault = function (a) {\n return a && a.__esModule ? a : {default: a};\n};\n\nexports.defineInteropFlag = function (a) {\n Object.defineProperty(a, '__esModule', {value: true});\n};\n\nexports.exportAll = function (source, dest) {\n Object.keys(source).forEach(function (key) {\n if (\n key === 'default' ||\n key === '__esModule' ||\n Object.prototype.hasOwnProperty.call(dest, key)\n ) {\n return;\n }\n\n Object.defineProperty(dest, key, {\n enumerable: true,\n get: function () {\n return source[key];\n },\n });\n });\n\n return dest;\n};\n\nexports.export = function (dest, destName, get) {\n Object.defineProperty(dest, destName, {\n enumerable: true,\n get: get,\n });\n};\n"],"names":[],"version":3,"file":"index.js.map","sourceRoot":"../../../"} \ No newline at end of file +{"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
\n
\n
\n
\n
\n
\n
\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, '
');\n const $title = append($inner, '
');\n\n function showTitle({ $chapter, width }) {\n const title = $chapter.dataset.title.trim();\n if (title) {\n setStyle($title, 'display', 'flex');\n $title.innerText = title;\n const titleWidth = $title.clientWidth;\n if (width <= titleWidth / 2) {\n setStyle($title, 'left', 0);\n } else if (width > $inner.clientWidth - titleWidth / 2) {\n setStyle($title, 'left', `${$inner.clientWidth - titleWidth}px`);\n } else {\n setStyle($title, 'left', `${width - titleWidth / 2}px`);\n }\n } else {\n setStyle($title, 'display', 'none');\n }\n }\n\n function update(chapters = []) {\n removeClass($player, 'artplayer-plugin-chapter');\n\n if (!Array.isArray(chapters)) return;\n if (!chapters.length) return;\n if (!art.duration) return;\n\n chapters = chapters.sort((a, b) => a.start - b.start);\n\n for (let i = 0; i < chapters.length; i++) {\n const chapter = chapters[i];\n const nextChapter = chapters[i + 1];\n\n if (\n typeof chapter.start !== 'number' ||\n typeof chapter.end !== 'number' ||\n typeof chapter.title !== 'string'\n ) {\n throw new Error('Illegal chapter data type');\n }\n\n if (chapter.start < 0 || chapter.end > art.duration || chapter.start >= chapter.end) {\n throw new Error('Illegal chapter time point');\n }\n\n if (nextChapter && chapter.end > nextChapter.start) {\n throw new Error('Illegal chapter time point');\n }\n }\n\n if (chapters[0].start > 0) {\n chapters.unshift({ start: 0, end: chapters[0].start, title: '' });\n }\n\n if (chapters[chapters.length - 1].end < art.duration) {\n chapters.push({ start: chapters[chapters.length - 1].end, end: art.duration, title: '' });\n }\n\n for (let i = 0; i < chapters.length - 1; i++) {\n if (chapters[i].end !== chapters[i + 1].start) {\n chapters.splice(i + 1, 0, {\n start: chapters[i].end,\n end: chapters[i + 1].start,\n title: '',\n });\n }\n }\n\n $control.innerText = '';\n $chapters = chapters.map((chapter) => {\n const $chapter = append($control, html);\n const start = clamp(chapter.start, 0, art.duration);\n const end = clamp(chapter.end, 0, art.duration);\n const duration = end - start;\n const percentage = duration / art.duration;\n $chapter.dataset.start = start;\n $chapter.dataset.end = end;\n $chapter.dataset.duration = duration;\n $chapter.dataset.title = chapter.title.trim();\n $chapter.style.width = `${percentage * 100}%`;\n\n return {\n $chapter,\n $hover: query('.art-progress-hover', $chapter),\n $loaded: query('.art-progress-loaded', $chapter),\n $played: query('.art-progress-played', $chapter),\n };\n });\n\n addClass($player, 'artplayer-plugin-chapter');\n art.emit('setBar', 'loaded', art.loaded || 0);\n }\n\n art.on('setBar', (type, percentage, event) => {\n if (!$chapters.length) return;\n\n for (let i = 0; i < $chapters.length; i++) {\n const { $chapter, $loaded, $played, $hover } = $chapters[i];\n\n const $target = {\n hover: $hover,\n loaded: $loaded,\n played: $played,\n }[type];\n\n if (!$target) return;\n\n const width = $control.clientWidth * percentage;\n const currentTime = art.duration * percentage;\n const duration = parseFloat($chapter.dataset.duration);\n const start = parseFloat($chapter.dataset.start);\n const end = parseFloat($chapter.dataset.end);\n\n if (currentTime < start) {\n setStyle($target, 'width', 0);\n }\n\n if (currentTime > end) {\n setStyle($target, 'width', '100%');\n }\n\n if (currentTime >= start && currentTime <= end) {\n const percentage = (currentTime - start) / duration;\n setStyle($target, 'width', `${percentage * 100}%`);\n\n if (isMobile) {\n if (type === 'played' && event) {\n showTitle({ $chapter, width });\n clearTimeout(titleTimer);\n titleTimer = setTimeout(() => {\n setStyle($title, 'display', 'none');\n }, 500);\n }\n } else {\n if (type === 'hover') {\n showTitle({ $chapter, width });\n }\n }\n }\n }\n });\n\n if (!isMobile) {\n art.proxy($progress, 'mouseleave', () => {\n if (!$chapters.length) return;\n setStyle($title, 'display', 'none');\n });\n }\n\n art.once('video:loadedmetadata', () => update(option.chapters));\n\n return {\n name: 'artplayerPluginChapter',\n update: (chapters) => update(chapters),\n };\n };\n}\n\nif (typeof document !== 'undefined') {\n const id = 'artplayer-plugin-chapter';\n const $style = document.getElementById(id);\n if ($style) {\n $style.textContent = style;\n } else {\n const $style = document.createElement('style');\n $style.id = id;\n $style.textContent = style;\n document.head.appendChild($style);\n }\n}\n\nif (typeof window !== 'undefined') {\n window['artplayerPluginChapter'] = artplayerPluginChapter;\n}\n","module.exports = \"644995735844259b\";","exports.interopDefault = function (a) {\n return a && a.__esModule ? a : {default: a};\n};\n\nexports.defineInteropFlag = function (a) {\n Object.defineProperty(a, '__esModule', {value: true});\n};\n\nexports.exportAll = function (source, dest) {\n Object.keys(source).forEach(function (key) {\n if (\n key === 'default' ||\n key === '__esModule' ||\n Object.prototype.hasOwnProperty.call(dest, key)\n ) {\n return;\n }\n\n Object.defineProperty(dest, key, {\n enumerable: true,\n get: function () {\n return source[key];\n },\n });\n });\n\n return dest;\n};\n\nexports.export = function (dest, destName, get) {\n Object.defineProperty(dest, destName, {\n enumerable: true,\n get: get,\n });\n};\n"],"names":[],"version":3,"file":"index.js.map","sourceRoot":"../../../"} \ No newline at end of file diff --git a/packages/artplayer-plugin-chapter/src/index.js b/packages/artplayer-plugin-chapter/src/index.js index 6ebc58d86..2835ac190 100644 --- a/packages/artplayer-plugin-chapter/src/index.js +++ b/packages/artplayer-plugin-chapter/src/index.js @@ -42,6 +42,8 @@ export default function artplayerPluginChapter(option = {}) { } function update(chapters = []) { + removeClass($player, 'artplayer-plugin-chapter'); + if (!Array.isArray(chapters)) return; if (!chapters.length) return; if (!art.duration) return; @@ -108,12 +110,7 @@ export default function artplayerPluginChapter(option = {}) { }; }); - if ($chapters.length) { - addClass($player, 'artplayer-plugin-chapter'); - } else { - removeClass($player, 'artplayer-plugin-chapter'); - } - + addClass($player, 'artplayer-plugin-chapter'); art.emit('setBar', 'loaded', art.loaded || 0); }