From a01782732d1610aa82f9af10341ec0fd18af1a02 Mon Sep 17 00:00:00 2001 From: Harvey Zack Date: Mon, 21 Oct 2024 17:32:48 +0800 Subject: [PATCH] Refactor Control class to update control option variables and element references --- docs/assets/example/dash.control.js | 4 +-- .../artplayer-plugin-dash-control/index.js | 29 +++++++++-------- .../index.js.map | 2 +- .../src/index.js | 31 +++++++++++-------- 4 files changed, 37 insertions(+), 29 deletions(-) diff --git a/docs/assets/example/dash.control.js b/docs/assets/example/dash.control.js index aca70d14c..52c2a95c7 100644 --- a/docs/assets/example/dash.control.js +++ b/docs/assets/example/dash.control.js @@ -6,7 +6,7 @@ var art = new Artplayer({ container: '.artplayer-app', - url: 'https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd', + url: 'https://media.axprod.net/TestVectors/v7-Clear/Manifest_1080p.mpd', setting: true, plugins: [ artplayerPluginDashControl({ @@ -27,7 +27,7 @@ var art = new Artplayer({ // Show audios in setting setting: true, // Get the audio name from track - getName: (track) => track.name, + getName: (track) => track.lang, // I18n title: 'Audio', auto: 'Auto', diff --git a/docs/uncompiled/artplayer-plugin-dash-control/index.js b/docs/uncompiled/artplayer-plugin-dash-control/index.js index aac0720e8..0f6aaf941 100644 --- a/docs/uncompiled/artplayer-plugin-dash-control/index.js +++ b/docs/uncompiled/artplayer-plugin-dash-control/index.js @@ -162,14 +162,14 @@ function artplayerPluginDashControl(option = {}) { return (art)=>{ const { $video } = art.template; const { errorHandle } = art.constructor.utils; - function updateQuality(dashPlayer) { - const qualities = dashPlayer.getBitrateInfoListFor("video"); + function updateQuality(dash) { + const qualities = dash.getBitrateInfoListFor("video"); if (!qualities.length) return; const config = option.quality || {}; const auto = config.auto || "Auto"; const title = config.title || "Quality"; const getName = config.getName || ((level)=>`${level.height}p`); - const currentQuality = dashPlayer.getQualityFor("video"); + const currentQuality = dash.getQualityFor("video"); const defaultLevel = qualities[currentQuality]; const defaultHtml = defaultLevel ? getName(defaultLevel) : auto; const selector = uniqBy(qualities.map((item, index)=>{ @@ -182,10 +182,10 @@ function artplayerPluginDashControl(option = {}) { selector.push({ html: auto, value: "auto", - default: dashPlayer.getSettings().streaming.abr.autoSwitchBitrate["video"] + default: dash.getSettings().streaming.abr.autoSwitchBitrate["video"] }); const onSelect = (item)=>{ - if (item.value === "auto") dashPlayer.updateSettings({ + if (item.value === "auto") dash.updateSettings({ streaming: { abr: { autoSwitchBitrate: { @@ -195,7 +195,7 @@ function artplayerPluginDashControl(option = {}) { } }); else { - dashPlayer.updateSettings({ + dash.updateSettings({ streaming: { abr: { autoSwitchBitrate: { @@ -204,7 +204,7 @@ function artplayerPluginDashControl(option = {}) { } } }); - dashPlayer.setQualityFor("video", item.value); + dash.setQualityFor("video", item.value); } art.notice.show = `${title}: ${item.html}`; art.emit("artplayerPluginDashControl:quality", item); @@ -240,23 +240,26 @@ function artplayerPluginDashControl(option = {}) { } }); } - function updateAudio(dashPlayer) { - const audioTracks = dashPlayer.getTracksFor("audio"); + function updateAudio(dash) { + const audioTracks = dash.getTracksFor("audio"); if (!audioTracks.length) return; + console.log("audioTracks", audioTracks); const config = option.audio || {}; + const auto = config.auto || "Auto"; const title = config.title || "Audio"; const getName = config.getName || ((track)=>track.lang || track.id); - const currentTrack = dashPlayer.getCurrentTrackFor("audio"); - const defaultHtml = currentTrack ? getName(currentTrack) : "Default"; + const currentTrack = dash.getCurrentTrackFor("audio"); + console.log("currentTrack", currentTrack); + const defaultHtml = currentTrack ? getName(currentTrack) : auto; const selector = uniqBy(audioTracks.map((item)=>{ return { html: getName(item), value: item.id, - default: currentTrack && currentTrack.id === item.id + default: currentTrack === item }; }), "html"); const onSelect = (item)=>{ - dashPlayer.setCurrentTrack(audioTracks.find((track)=>track.id === item.value)); + dash.setCurrentTrack(audioTracks.find((track)=>track.id === item.value)); art.loading.show = true; art.notice.show = `${title}: ${item.html}`; art.emit("artplayerPluginDashControl:audio", item); diff --git a/docs/uncompiled/artplayer-plugin-dash-control/index.js.map b/docs/uncompiled/artplayer-plugin-dash-control/index.js.map index 1ebdbbd31..b9332a88e 100644 --- a/docs/uncompiled/artplayer-plugin-dash-control/index.js.map +++ b/docs/uncompiled/artplayer-plugin-dash-control/index.js.map @@ -1 +1 @@ -{"mappings":"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","sources":["packages/artplayer-plugin-dash-control/src/index.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-d9842915446976aa.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-fd32f05dba0c94f1.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import $quality from 'bundle-text:./quality.svg';\nimport $audio from 'bundle-text:./audio.svg';\n\nfunction uniqBy(array, property) {\n const seen = new Map();\n return array.filter((item) => {\n const key = item[property];\n if (key === undefined) {\n return true;\n }\n return !seen.has(key) && seen.set(key, 1);\n });\n}\n\nexport default function artplayerPluginDashControl(option = {}) {\n return (art) => {\n const { $video } = art.template;\n const { errorHandle } = art.constructor.utils;\n\n function updateQuality(dashPlayer) {\n const qualities = dashPlayer.getBitrateInfoListFor('video');\n if (!qualities.length) return;\n\n const config = option.quality || {};\n const auto = config.auto || 'Auto';\n const title = config.title || 'Quality';\n const getName = config.getName || ((level) => `${level.height}p`);\n const currentQuality = dashPlayer.getQualityFor('video');\n const defaultLevel = qualities[currentQuality];\n const defaultHtml = defaultLevel ? getName(defaultLevel) : auto;\n\n const selector = uniqBy(\n qualities.map((item, index) => {\n return {\n html: getName(item, index),\n value: index,\n default: currentQuality === index,\n };\n }),\n 'html',\n ).sort((a, b) => b.value - a.value);\n\n selector.push({\n html: auto,\n value: 'auto',\n default: dashPlayer.getSettings().streaming.abr.autoSwitchBitrate['video'],\n });\n\n const onSelect = (item) => {\n if (item.value === 'auto') {\n dashPlayer.updateSettings({\n streaming: {\n abr: {\n autoSwitchBitrate: {\n video: true,\n },\n },\n },\n });\n } else {\n dashPlayer.updateSettings({\n streaming: {\n abr: {\n autoSwitchBitrate: {\n video: false,\n },\n },\n },\n });\n dashPlayer.setQualityFor('video', item.value);\n }\n art.notice.show = `${title}: ${item.html}`;\n art.emit('artplayerPluginDashControl:quality', item);\n return item.html;\n };\n\n if (config.control) {\n art.controls.update({\n name: 'dash-quality',\n position: 'right',\n html: defaultHtml,\n style: { padding: '0 10px' },\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:quality', (item) => {\n art.controls.check(item);\n });\n },\n });\n }\n\n if (config.setting) {\n art.setting.update({\n name: 'dash-quality',\n tooltip: defaultHtml,\n html: title,\n icon: $quality,\n width: 200,\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:quality', (item) => {\n art.setting.check(item);\n });\n },\n });\n }\n }\n\n function updateAudio(dashPlayer) {\n const audioTracks = dashPlayer.getTracksFor('audio');\n if (!audioTracks.length) return;\n\n const config = option.audio || {};\n const title = config.title || 'Audio';\n const getName = config.getName || ((track) => track.lang || track.id);\n const currentTrack = dashPlayer.getCurrentTrackFor('audio');\n const defaultHtml = currentTrack ? getName(currentTrack) : 'Default';\n\n const selector = uniqBy(\n audioTracks.map((item) => {\n return {\n html: getName(item),\n value: item.id,\n default: currentTrack && currentTrack.id === item.id,\n };\n }),\n 'html',\n );\n\n const onSelect = (item) => {\n dashPlayer.setCurrentTrack(audioTracks.find((track) => track.id === item.value));\n art.loading.show = true;\n art.notice.show = `${title}: ${item.html}`;\n art.emit('artplayerPluginDashControl:audio', item);\n return item.html;\n };\n\n if (config.control) {\n art.controls.update({\n name: 'dash-audio',\n position: 'right',\n html: defaultHtml,\n style: { padding: '0 10px' },\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:audio', (item) => {\n art.controls.check(item);\n });\n },\n });\n }\n\n if (config.setting) {\n art.setting.update({\n name: 'dash-audio',\n tooltip: defaultHtml,\n html: title,\n icon: $audio,\n width: 200,\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:audio', (item) => {\n art.setting.check(item);\n });\n },\n });\n }\n }\n\n function update() {\n errorHandle(art.dash?.getVideoElement() === $video, 'Cannot find instance of DASH from \"art.dash\"');\n updateQuality(art.dash);\n updateAudio(art.dash);\n }\n\n art.on('ready', update);\n art.on('restart', update);\n\n return {\n name: 'artplayerPluginDashControl',\n update,\n };\n };\n}\n\nif (typeof window !== 'undefined') {\n window['artplayerPluginDashControl'] = artplayerPluginDashControl;\n}\n","module.exports = \"3f2eca634b03c631\";","module.exports = \"5373c3b31536e9b3\";","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-dash-control/src/index.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-d9842915446976aa.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-fd32f05dba0c94f1.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import $quality from 'bundle-text:./quality.svg';\nimport $audio from 'bundle-text:./audio.svg';\n\nfunction uniqBy(array, property) {\n const seen = new Map();\n return array.filter((item) => {\n const key = item[property];\n if (key === undefined) {\n return true;\n }\n return !seen.has(key) && seen.set(key, 1);\n });\n}\n\nexport default function artplayerPluginDashControl(option = {}) {\n return (art) => {\n const { $video } = art.template;\n const { errorHandle } = art.constructor.utils;\n\n function updateQuality(dash) {\n const qualities = dash.getBitrateInfoListFor('video');\n if (!qualities.length) return;\n\n const config = option.quality || {};\n const auto = config.auto || 'Auto';\n const title = config.title || 'Quality';\n const getName = config.getName || ((level) => `${level.height}p`);\n const currentQuality = dash.getQualityFor('video');\n const defaultLevel = qualities[currentQuality];\n const defaultHtml = defaultLevel ? getName(defaultLevel) : auto;\n\n const selector = uniqBy(\n qualities.map((item, index) => {\n return {\n html: getName(item, index),\n value: index,\n default: currentQuality === index,\n };\n }),\n 'html',\n ).sort((a, b) => b.value - a.value);\n\n selector.push({\n html: auto,\n value: 'auto',\n default: dash.getSettings().streaming.abr.autoSwitchBitrate['video'],\n });\n\n const onSelect = (item) => {\n if (item.value === 'auto') {\n dash.updateSettings({\n streaming: {\n abr: {\n autoSwitchBitrate: {\n video: true,\n },\n },\n },\n });\n } else {\n dash.updateSettings({\n streaming: {\n abr: {\n autoSwitchBitrate: {\n video: false,\n },\n },\n },\n });\n dash.setQualityFor('video', item.value);\n }\n art.notice.show = `${title}: ${item.html}`;\n art.emit('artplayerPluginDashControl:quality', item);\n return item.html;\n };\n\n if (config.control) {\n art.controls.update({\n name: 'dash-quality',\n position: 'right',\n html: defaultHtml,\n style: { padding: '0 10px' },\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:quality', (item) => {\n art.controls.check(item);\n });\n },\n });\n }\n\n if (config.setting) {\n art.setting.update({\n name: 'dash-quality',\n tooltip: defaultHtml,\n html: title,\n icon: $quality,\n width: 200,\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:quality', (item) => {\n art.setting.check(item);\n });\n },\n });\n }\n }\n\n function updateAudio(dash) {\n const audioTracks = dash.getTracksFor('audio');\n if (!audioTracks.length) return;\n\n console.log('audioTracks', audioTracks);\n\n const config = option.audio || {};\n const auto = config.auto || 'Auto';\n const title = config.title || 'Audio';\n const getName = config.getName || ((track) => track.lang || track.id);\n const currentTrack = dash.getCurrentTrackFor('audio');\n console.log('currentTrack', currentTrack);\n\n const defaultHtml = currentTrack ? getName(currentTrack) : auto;\n\n const selector = uniqBy(\n audioTracks.map((item) => {\n return {\n html: getName(item),\n value: item.id,\n default: currentTrack === item,\n };\n }),\n 'html',\n );\n\n const onSelect = (item) => {\n dash.setCurrentTrack(audioTracks.find((track) => track.id === item.value));\n art.loading.show = true;\n art.notice.show = `${title}: ${item.html}`;\n art.emit('artplayerPluginDashControl:audio', item);\n return item.html;\n };\n\n if (config.control) {\n art.controls.update({\n name: 'dash-audio',\n position: 'right',\n html: defaultHtml,\n style: { padding: '0 10px' },\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:audio', (item) => {\n art.controls.check(item);\n });\n },\n });\n }\n\n if (config.setting) {\n art.setting.update({\n name: 'dash-audio',\n tooltip: defaultHtml,\n html: title,\n icon: $audio,\n width: 200,\n selector: selector,\n onSelect: onSelect,\n mounted: () => {\n art.on('artplayerPluginDashControl:audio', (item) => {\n art.setting.check(item);\n });\n },\n });\n }\n }\n\n function update() {\n errorHandle(art.dash?.getVideoElement() === $video, 'Cannot find instance of DASH from \"art.dash\"');\n updateQuality(art.dash);\n updateAudio(art.dash);\n }\n\n art.on('ready', update);\n art.on('restart', update);\n\n return {\n name: 'artplayerPluginDashControl',\n update,\n };\n };\n}\n\nif (typeof window !== 'undefined') {\n window['artplayerPluginDashControl'] = artplayerPluginDashControl;\n}\n","module.exports = \"3f2eca634b03c631\";","module.exports = \"5373c3b31536e9b3\";","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-dash-control/src/index.js b/packages/artplayer-plugin-dash-control/src/index.js index 7c8866c1a..253e25ea4 100644 --- a/packages/artplayer-plugin-dash-control/src/index.js +++ b/packages/artplayer-plugin-dash-control/src/index.js @@ -17,15 +17,15 @@ export default function artplayerPluginDashControl(option = {}) { const { $video } = art.template; const { errorHandle } = art.constructor.utils; - function updateQuality(dashPlayer) { - const qualities = dashPlayer.getBitrateInfoListFor('video'); + function updateQuality(dash) { + const qualities = dash.getBitrateInfoListFor('video'); if (!qualities.length) return; const config = option.quality || {}; const auto = config.auto || 'Auto'; const title = config.title || 'Quality'; const getName = config.getName || ((level) => `${level.height}p`); - const currentQuality = dashPlayer.getQualityFor('video'); + const currentQuality = dash.getQualityFor('video'); const defaultLevel = qualities[currentQuality]; const defaultHtml = defaultLevel ? getName(defaultLevel) : auto; @@ -43,12 +43,12 @@ export default function artplayerPluginDashControl(option = {}) { selector.push({ html: auto, value: 'auto', - default: dashPlayer.getSettings().streaming.abr.autoSwitchBitrate['video'], + default: dash.getSettings().streaming.abr.autoSwitchBitrate['video'], }); const onSelect = (item) => { if (item.value === 'auto') { - dashPlayer.updateSettings({ + dash.updateSettings({ streaming: { abr: { autoSwitchBitrate: { @@ -58,7 +58,7 @@ export default function artplayerPluginDashControl(option = {}) { }, }); } else { - dashPlayer.updateSettings({ + dash.updateSettings({ streaming: { abr: { autoSwitchBitrate: { @@ -67,7 +67,7 @@ export default function artplayerPluginDashControl(option = {}) { }, }, }); - dashPlayer.setQualityFor('video', item.value); + dash.setQualityFor('video', item.value); } art.notice.show = `${title}: ${item.html}`; art.emit('artplayerPluginDashControl:quality', item); @@ -108,29 +108,34 @@ export default function artplayerPluginDashControl(option = {}) { } } - function updateAudio(dashPlayer) { - const audioTracks = dashPlayer.getTracksFor('audio'); + function updateAudio(dash) { + const audioTracks = dash.getTracksFor('audio'); if (!audioTracks.length) return; + console.log('audioTracks', audioTracks); + const config = option.audio || {}; + const auto = config.auto || 'Auto'; const title = config.title || 'Audio'; const getName = config.getName || ((track) => track.lang || track.id); - const currentTrack = dashPlayer.getCurrentTrackFor('audio'); - const defaultHtml = currentTrack ? getName(currentTrack) : 'Default'; + const currentTrack = dash.getCurrentTrackFor('audio'); + console.log('currentTrack', currentTrack); + + const defaultHtml = currentTrack ? getName(currentTrack) : auto; const selector = uniqBy( audioTracks.map((item) => { return { html: getName(item), value: item.id, - default: currentTrack && currentTrack.id === item.id, + default: currentTrack === item, }; }), 'html', ); const onSelect = (item) => { - dashPlayer.setCurrentTrack(audioTracks.find((track) => track.id === item.value)); + dash.setCurrentTrack(audioTracks.find((track) => track.id === item.value)); art.loading.show = true; art.notice.show = `${title}: ${item.html}`; art.emit('artplayerPluginDashControl:audio', item);