mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-23 05:41:20 -08:00
feat: update artplayer-plugin-hls-quality to version 3.0.0, add quality.svg and remove image.svg
This commit is contained in:
Harvey Zack committed
1 parent
666d1d8585
commit
4a172377b5
5 files changed
+91
-90
No files matched your search
@@ -145,20 +145,37 @@
|
||||
})({"hMiLQ":[function(require,module,exports) {
|
||||
var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
|
||||
parcelHelpers.defineInteropFlag(exports);
|
||||
var _imageSvg = require("bundle-text:./image.svg");
|
||||
var _imageSvgDefault = parcelHelpers.interopDefault(_imageSvg);
|
||||
parcelHelpers.export(exports, "default", ()=>artplayerPluginHlsQuality);
|
||||
var _qualitySvg = require("bundle-text:./quality.svg");
|
||||
var _qualitySvgDefault = parcelHelpers.interopDefault(_qualitySvg);
|
||||
function artplayerPluginHlsQuality(option) {
|
||||
return (art)=>{
|
||||
const { $video } = art.template;
|
||||
const { errorHandle } = art.constructor.utils;
|
||||
function update() {
|
||||
const hls = art.hls || window.hls;
|
||||
errorHandle(hls && hls.media === $video, 'Cannot find instance of HLS from "art.hls" or "window.hls"');
|
||||
const { $video } = art.template;
|
||||
const { errorHandle } = art.constructor.utils;
|
||||
function updateQuality(hls) {
|
||||
const auto = option.auto || "Auto";
|
||||
const title = option.title || "Quality";
|
||||
const getResolution = option.getResolution || ((level)=>(level.height || "Unknown ") + "P");
|
||||
const defaultLevel = hls.levels[hls.currentLevel];
|
||||
const defaultHtml = defaultLevel ? getResolution(defaultLevel) : auto;
|
||||
const selector = hls.levels.map((item, index)=>{
|
||||
return {
|
||||
html: getResolution(item),
|
||||
level: item.level || index,
|
||||
default: defaultLevel === item
|
||||
};
|
||||
}).sort((a, b)=>b.level - a.level);
|
||||
selector.push({
|
||||
html: auto,
|
||||
level: -1,
|
||||
default: defaultLevel === -1
|
||||
});
|
||||
const onSelect = (item)=>{
|
||||
hls.currentLevel = item.level;
|
||||
art.loading.show = true;
|
||||
art.notice.show = `${title}: ${item.html}`;
|
||||
return item.html;
|
||||
};
|
||||
if (option.control) art.controls.update({
|
||||
name: "hls-quality",
|
||||
position: "right",
|
||||
@@ -166,56 +183,39 @@ function artplayerPluginHlsQuality(option) {
|
||||
style: {
|
||||
padding: "0 10px"
|
||||
},
|
||||
selector: hls.levels.map((item, index)=>{
|
||||
return {
|
||||
html: getResolution(item),
|
||||
level: item.level || index,
|
||||
default: defaultLevel === item
|
||||
};
|
||||
}),
|
||||
onSelect (item) {
|
||||
hls.currentLevel = item.level;
|
||||
art.loading.show = true;
|
||||
return item.html;
|
||||
}
|
||||
selector: selector,
|
||||
onSelect: onSelect
|
||||
});
|
||||
if (option.setting) art.setting.update({
|
||||
name: "hls-quality",
|
||||
tooltip: defaultHtml,
|
||||
html: title,
|
||||
icon: (0, _imageSvgDefault.default),
|
||||
icon: (0, _qualitySvgDefault.default),
|
||||
width: 200,
|
||||
selector: hls.levels.map((item, index)=>{
|
||||
return {
|
||||
html: getResolution(item),
|
||||
level: item.level || index,
|
||||
default: defaultLevel === item
|
||||
};
|
||||
}),
|
||||
onSelect: function(item) {
|
||||
hls.currentLevel = item.level;
|
||||
art.loading.show = true;
|
||||
return item.html;
|
||||
}
|
||||
selector: selector,
|
||||
onSelect: onSelect
|
||||
});
|
||||
}
|
||||
function updateAudio(hls) {
|
||||
//
|
||||
}
|
||||
function update() {
|
||||
const hls = art.hls || window.hls;
|
||||
errorHandle(hls && hls.media === $video, 'Cannot find instance of HLS from "art.hls" or "window.hls"');
|
||||
updateQuality(hls);
|
||||
updateAudio(hls);
|
||||
}
|
||||
art.on("ready", update);
|
||||
art.on("restart", update);
|
||||
return {
|
||||
name: "artplayerPluginHlsQuality"
|
||||
name: "artplayerPluginHlsQuality",
|
||||
update
|
||||
};
|
||||
};
|
||||
}
|
||||
exports.default = artplayerPluginHlsQuality;
|
||||
artplayerPluginHlsQuality.env = "development";
|
||||
artplayerPluginHlsQuality.version = "1.0.2";
|
||||
artplayerPluginHlsQuality.build = "2023-04-23 09:44:07";
|
||||
if (typeof window !== "undefined") window["artplayerPluginHlsQuality"] = artplayerPluginHlsQuality;
|
||||
|
||||
},{"bundle-text:./image.svg":"1HFaU","@parcel/transformer-js/src/esmodule-helpers.js":"5dUr6"}],"1HFaU":[function(require,module,exports) {
|
||||
module.exports = "<?xml version=\"1.0\" standalone=\"no\"?>\n<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n<svg t=\"1666857514489\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"2580\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"24\" height=\"24\"><path d=\"M870.4 176 153.6 176C104.128 176 64 216.128 64 265.6l0 492.736c0 49.472 40.128 89.6 89.6 89.6L870.4 847.936c49.472 0 89.6-40.128 89.6-89.6L960 265.6C960 216.128 919.872 176 870.4 176zM870.4 668.8 825.6 668.8c0 0-29.696-65.792-89.6-89.6s-134.4 89.6-134.4 89.6S535.04 596.992 467.2 444.8C399.36 292.608 153.6 624 153.6 624l0-358.4L870.4 265.6 870.4 668.8zM668.8 489.6c37.056 0 67.2-30.144 67.2-67.264 0-37.056-30.144-67.2-67.2-67.2C631.68 355.2 601.6 385.344 601.6 422.4 601.6 459.52 631.68 489.6 668.8 489.6z\" p-id=\"2581\" fill=\"#ffffff\"></path>\n</svg>";
|
||||
|
||||
},{}],"5dUr6":[function(require,module,exports) {
|
||||
},{"@parcel/transformer-js/src/esmodule-helpers.js":"5dUr6","bundle-text:./quality.svg":"b53kH"}],"5dUr6":[function(require,module,exports) {
|
||||
exports.interopDefault = function(a) {
|
||||
return a && a.__esModule ? a : {
|
||||
default: a
|
||||
@@ -228,7 +228,7 @@ exports.defineInteropFlag = function(a) {
|
||||
};
|
||||
exports.exportAll = function(source, dest) {
|
||||
Object.keys(source).forEach(function(key) {
|
||||
if (key === "default" || key === "__esModule" || dest.hasOwnProperty(key)) return;
|
||||
if (key === "default" || key === "__esModule" || Object.prototype.hasOwnProperty.call(dest, key)) return;
|
||||
Object.defineProperty(dest, key, {
|
||||
enumerable: true,
|
||||
get: function() {
|
||||
@@ -245,6 +245,9 @@ exports.export = function(dest, destName, get) {
|
||||
});
|
||||
};
|
||||
|
||||
},{}],"b53kH":[function(require,module,exports) {
|
||||
module.exports = "<?xml version=\"1.0\" standalone=\"no\"?>\n<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n<svg t=\"1666857514489\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"2580\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"24\" height=\"24\"><path d=\"M870.4 176 153.6 176C104.128 176 64 216.128 64 265.6l0 492.736c0 49.472 40.128 89.6 89.6 89.6L870.4 847.936c49.472 0 89.6-40.128 89.6-89.6L960 265.6C960 216.128 919.872 176 870.4 176zM870.4 668.8 825.6 668.8c0 0-29.696-65.792-89.6-89.6s-134.4 89.6-134.4 89.6S535.04 596.992 467.2 444.8C399.36 292.608 153.6 624 153.6 624l0-358.4L870.4 265.6 870.4 668.8zM668.8 489.6c37.056 0 67.2-30.144 67.2-67.264 0-37.056-30.144-67.2-67.2-67.2C631.68 355.2 601.6 385.344 601.6 422.4 601.6 459.52 631.68 489.6 668.8 489.6z\" p-id=\"2581\" fill=\"#ffffff\"></path>\n</svg>";
|
||||
|
||||
},{}]},["hMiLQ"], "hMiLQ", "parcelRequire4dc0")
|
||||
|
||||
//# sourceMappingURL=index.js.map
|
||||
@@ -1 +1 @@
|
||||
{"mappings":"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","sources":["packages/artplayer-plugin-hls-quality/src/index.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-cdfe3d14efbab84d.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import image from 'bundle-text:./image.svg';\n\nexport default function artplayerPluginHlsQuality(option) {\n return (art) => {\n const { $video } = art.template;\n const { errorHandle } = art.constructor.utils;\n\n function update() {\n const hls = art.hls || window.hls;\n errorHandle(hls && hls.media === $video, 'Cannot find instance of HLS from \"art.hls\" or \"window.hls\"');\n const auto = option.auto || 'Auto';\n const title = option.title || 'Quality';\n const getResolution = option.getResolution || ((level) => (level.height || 'Unknown ') + 'P');\n const defaultLevel = hls.levels[hls.currentLevel];\n const defaultHtml = defaultLevel ? getResolution(defaultLevel) : auto;\n\n if (option.control) {\n art.controls.update({\n name: 'hls-quality',\n position: 'right',\n html: defaultHtml,\n style: { padding: '0 10px' },\n selector: hls.levels.map((item, index) => {\n return {\n html: getResolution(item),\n level: item.level || index,\n default: defaultLevel === item,\n };\n }),\n onSelect(item) {\n hls.currentLevel = item.level;\n art.loading.show = true;\n return item.html;\n },\n });\n }\n\n if (option.setting) {\n art.setting.update({\n name: 'hls-quality',\n tooltip: defaultHtml,\n html: title,\n icon: image,\n width: 200,\n selector: hls.levels.map((item, index) => {\n return {\n html: getResolution(item),\n level: item.level || index,\n default: defaultLevel === item,\n };\n }),\n onSelect: function (item) {\n hls.currentLevel = item.level;\n art.loading.show = true;\n return item.html;\n },\n });\n }\n }\n\n art.on('ready', update);\n art.on('restart', update);\n\n return {\n Line truncated
|
||||
{"mappings":"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","sources":["packages/artplayer-plugin-hls-quality/src/index.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-5cc0713c043de59f.js"],"sourcesContent":["import $quality from 'bundle-text:./quality.svg';\n\nexport default function artplayerPluginHlsQuality(option) {\n return (art) => {\n const { $video } = art.template;\n const { errorHandle } = art.constructor.utils;\n\n function updateQuality(hls) {\n const auto = option.auto || 'Auto';\n const title = option.title || 'Quality';\n\n const getResolution = option.getResolution || ((level) => (level.height || 'Unknown ') + 'P');\n const defaultLevel = hls.levels[hls.currentLevel];\n const defaultHtml = defaultLevel ? getResolution(defaultLevel) : auto;\n\n const selector = hls.levels\n .map((item, index) => {\n return {\n html: getResolution(item),\n level: item.level || index,\n default: defaultLevel === item,\n };\n })\n .sort((a, b) => b.level - a.level);\n\n selector.push({\n html: auto,\n level: -1,\n default: defaultLevel === -1,\n });\n\n const onSelect = (item) => {\n hls.currentLevel = item.level;\n art.loading.show = true;\n art.notice.show = `${title}: ${item.html}`;\n return item.html;\n };\n\n if (option.control) {\n art.controls.update({\n name: 'hls-quality',\n position: 'right',\n html: defaultHtml,\n style: { padding: '0 10px' },\n selector: selector,\n onSelect: onSelect,\n });\n }\n\n if (option.setting) {\n art.setting.update({\n name: 'hls-quality',\n tooltip: defaultHtml,\n html: title,\n icon: $quality,\n width: 200,\n selector: selector,\n onSelect: onSelect,\n });\n }\n }\n\n function updateAudio(hls) {\n //\n }\n\n function update() {\n const hls = art.hls || window.hls;\n errorHandle(hls && hls.media === $video, 'Cannot find instance of HLS from \"art.hls\" or \"window.hls\"');\n updateQuality(hls);\n updateAudio(hls);\n }\n\n art.on('ready', update);\n art.on('restart', update);\n\n return {\n Line truncated
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"license": "MIT",
|
||||
"version": "2.0.0",
|
||||
"version": "3.0.0",
|
||||
"name": "artplayer-plugin-hls-quality",
|
||||
"types": "types/artplayer-plugin-hls-quality.d.ts",
|
||||
"description": "Iframe plugin for ArtPlayer",
|
||||
@@ -21,4 +21,4 @@
|
||||
"video",
|
||||
"player"
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -1,53 +1,49 @@
|
||||
import image from 'bundle-text:./image.svg';
|
||||
|
||||
function checkVersion(art) {
|
||||
const {
|
||||
version,
|
||||
utils: { errorHandle },
|
||||
} = art.constructor;
|
||||
const arr = version.split('.').map(Number);
|
||||
const major = arr[0];
|
||||
const minor = arr[1] / 100;
|
||||
errorHandle(
|
||||
major + minor >= 5,
|
||||
`Artplayer.js@${version} is not compatible the artplayerPluginHlsQuality@${artplayerPluginHlsQuality.version}. Please update it to version Artplayer.js@5.x.x`,
|
||||
);
|
||||
}
|
||||
import $quality from 'bundle-text:./quality.svg';
|
||||
|
||||
export default function artplayerPluginHlsQuality(option) {
|
||||
return (art) => {
|
||||
checkVersion(art);
|
||||
|
||||
const { $video } = art.template;
|
||||
const { errorHandle } = art.constructor.utils;
|
||||
|
||||
function update() {
|
||||
const hls = art.hls || window.hls;
|
||||
errorHandle(hls && hls.media === $video, 'Cannot find instance of HLS from "art.hls" or "window.hls"');
|
||||
function updateQuality(hls) {
|
||||
const auto = option.auto || 'Auto';
|
||||
const title = option.title || 'Quality';
|
||||
|
||||
const getResolution = option.getResolution || ((level) => (level.height || 'Unknown ') + 'P');
|
||||
const defaultLevel = hls.levels[hls.currentLevel];
|
||||
const defaultHtml = defaultLevel ? getResolution(defaultLevel) : auto;
|
||||
|
||||
const selector = hls.levels
|
||||
.map((item, index) => {
|
||||
return {
|
||||
html: getResolution(item),
|
||||
level: item.level || index,
|
||||
default: defaultLevel === item,
|
||||
};
|
||||
})
|
||||
.sort((a, b) => b.level - a.level);
|
||||
|
||||
selector.push({
|
||||
html: auto,
|
||||
level: -1,
|
||||
default: defaultLevel === -1,
|
||||
});
|
||||
|
||||
const onSelect = (item) => {
|
||||
hls.currentLevel = item.level;
|
||||
art.loading.show = true;
|
||||
art.notice.show = `${title}: ${item.html}`;
|
||||
return item.html;
|
||||
};
|
||||
|
||||
if (option.control) {
|
||||
art.controls.update({
|
||||
name: 'hls-quality',
|
||||
position: 'right',
|
||||
html: defaultHtml,
|
||||
style: { padding: '0 10px' },
|
||||
selector: hls.levels.map((item, index) => {
|
||||
return {
|
||||
html: getResolution(item),
|
||||
level: item.level || index,
|
||||
default: defaultLevel === item,
|
||||
};
|
||||
}),
|
||||
onSelect(item) {
|
||||
hls.currentLevel = item.level;
|
||||
art.loading.show = true;
|
||||
return item.html;
|
||||
},
|
||||
selector: selector,
|
||||
onSelect: onSelect,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -56,29 +52,31 @@ export default function artplayerPluginHlsQuality(option) {
|
||||
name: 'hls-quality',
|
||||
tooltip: defaultHtml,
|
||||
html: title,
|
||||
icon: image,
|
||||
icon: $quality,
|
||||
width: 200,
|
||||
selector: hls.levels.map((item, index) => {
|
||||
return {
|
||||
html: getResolution(item),
|
||||
level: item.level || index,
|
||||
default: defaultLevel === item,
|
||||
};
|
||||
}),
|
||||
onSelect: function (item) {
|
||||
hls.currentLevel = item.level;
|
||||
art.loading.show = true;
|
||||
return item.html;
|
||||
},
|
||||
selector: selector,
|
||||
onSelect: onSelect,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function updateAudio(hls) {
|
||||
//
|
||||
}
|
||||
|
||||
function update() {
|
||||
const hls = art.hls || window.hls;
|
||||
errorHandle(hls && hls.media === $video, 'Cannot find instance of HLS from "art.hls" or "window.hls"');
|
||||
updateQuality(hls);
|
||||
updateAudio(hls);
|
||||
}
|
||||
|
||||
art.on('ready', update);
|
||||
art.on('restart', update);
|
||||
|
||||
return {
|
||||
name: 'artplayerPluginHlsQuality',
|
||||
update,
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
File renamed without changes.
Reference in new issue
Block a user