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

feat: remove unused style file and integrate TensorFlow body segmentation for danmuku mask functionality

Browse Source
This commit is contained in:
Harvey Zack committed 2024-10-07 23:49:33 +08:00
1 parent d9bdc9bdeb
commit ef56482911
5 files changed
+78463 -40
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

docs/uncompiled/artplayer-plugin-danmuku-mask/index.js
+78339 -19
View File
File diff suppressed because it is too large. Load diff
docs/uncompiled/artplayer-plugin-danmuku-mask/index.js.map
+1 -1
View File
@@ -1 +1 @@
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CAEwB;AAFxB;;AAEe,SAAS,2BAA2B,MAAM;IACrD,OAAO,CAAC;QACJ,OAAO;YACH,MAAM;QACV;IACJ;AACJ;AAEA,IAAI,OAAO,aAAa,aAAa;IACjC,MAAM,KAAK;IACX,MAAM,SAAS,SAAS,cAAc,CAAC;IACvC,IAAI,QACA,OAAO,WAAW,GAAG,CAAA,GAAA,yBAAK,AAAD;SACtB;QACH,MAAM,SAAS,SAAS,aAAa,CAAC;QACtC,OAAO,EAAE,GAAG;QACZ,OAAO,WAAW,GAAG,CAAA,GAAA,yBAAK,AAAD;QACzB,SAAS,IAAI,CAAC,WAAW,CAAC;IAC9B;AACJ;AAEA,IAAI,OAAO,WAAW,aAClB,MAAM,CAAC,6BAA6B,GAAG;;;ACxB3C,OAAO,OAAO,GAAG;;;ACAjB,QAAQ,cAAc,GAAG,SAAU,CAAC;IAClC,OAAO,KAAK,EAAE,UAAU,GAAG,IAAI;QAAC,SAAS;IAAC;AAC5C;AAEA,QAAQ,iBAAiB,GAAG,SAAU,CAAC;IACrC,OAAO,cAAc,CAAC,GAAG,cAAc;QAAC,OAAO;IAAI;AACrD;AAEA,QAAQ,SAAS,GAAG,SAAU,MAAM,EAAE,IAAI;IACxC,OAAO,IAAI,CAAC,QAAQ,OAAO,CAAC,SAAU,GAAG;QACvC,IACE,QAAQ,aACR,QAAQ,gBACR,OAAO,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,MAE3C;QAGF,OAAO,cAAc,CAAC,MAAM,KAAK;YAC/B,YAAY;YACZ,KAAK;gBACH,OAAO,MAAM,CAAC,IAAI;YACpB;QACF;IACF;IAEA,OAAO;AACT;AAEA,QAAQ,MAAM,GAAG,SAAU,IAAI,EAAE,QAAQ,EAAE,GAAG;IAC5C,OAAO,cAAc,CAAC,MAAM,UAAU;QACpC,YAAY;QACZ,KAAK;IACP;AACF","sources":["packages/artplayer-plugin-danmuku-mask/src/index.js","node_modules/@parcel/runtime-js/lib/bundles/runtime-4813196337716b1e.js","node_modules/@parcel/transformer-js/src/esmodule-helpers.js"],"sourcesContent":["import style from 'bundle-text:./style.less';\n\nexport default function artplayerPluginDanmukuMask(option) {\n return (art) => {\n return {\n name: 'artplayerPluginDanmukuMask',\n };\n };\n}\n\nif (typeof document !== 'undefined') {\n const id = 'artplayer-plugin-danmuku-mask';\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['artplayerPluginDanmukuMask'] = artplayerPluginDanmukuMask;\n}\n","module.exports = \"830a33c473447305\";","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":"../../../"}
{"mappings":"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 truncated
packages/artplayer-plugin-danmuku-mask/package.json
+9 -2
View File
@@ -20,5 +20,12 @@
"html5",
"video",
"player"
]
}
],
"dependencies": {
"@mediapipe/selfie_segmentation": "^0.1.1675465747",
"@tensorflow-models/body-segmentation": "^1.0.2",
"@tensorflow/tfjs-backend-webgl": "^4.21.0",
"@tensorflow/tfjs-converter": "^4.21.0",
"@tensorflow/tfjs-core": "^4.21.0"
}
}
packages/artplayer-plugin-danmuku-mask/src/index.js
+114 -15
View File
@@ -1,26 +1,125 @@
import style from 'bundle-text:./style.less';
import * as tf from '@tensorflow/tfjs-core';
import '@tensorflow/tfjs-backend-webgl';
import * as bodySegmentation from '@tensorflow-models/body-segmentation';
export default function artplayerPluginDanmukuMask(option) {
export default function artplayerPluginDanmukuMask(option = {}) {
return (art) => {
const {
template: { $player, $video, $danmuku },
} = art;
let segmenter = null;
let canvas = null;
let ctx = null;
let animationFrameId = null;
async function initSegmenter() {
await tf.setBackend('webgl');
const model = bodySegmentation.SupportedModels.MediaPipeSelfieSegmentation;
const segmenterConfig = {
runtime: 'mediapipe', // or 'tfjs'
solutionPath: 'https://cdn.jsdelivr.net/npm/@mediapipe/selfie_segmentation',
modelType: 'general',
};
segmenter = await bodySegmentation.createSegmenter(model, segmenterConfig);
}
function createCanvas() {
canvas = document.createElement('canvas');
ctx = canvas.getContext('2d');
canvas.style.position = 'absolute';
canvas.style.top = '0';
canvas.style.left = '0';
canvas.style.width = '100%';
canvas.style.height = '100%';
canvas.style.pointerEvents = 'none';
$player.appendChild(canvas);
}
async function segmentBody() {
if ($video.paused || $video.ended) {
animationFrameId = requestAnimationFrame(segmentBody);
return;
}
try {
canvas.width = $video.videoWidth;
canvas.height = $video.videoHeight;
const segmentation = await segmenter.segmentPeople($video);
if (!segmentation) {
animationFrameId = requestAnimationFrame(segmentBody);
return;
}
const foregroundColor = { r: 0, g: 0, b: 0, a: 0 };
const backgroundColor = { r: 0, g: 0, b: 0, a: 255 };
const drawContour = false;
const foregroundThreshold = 0.6;
const mask = await bodySegmentation.toBinaryMask(
segmentation,
foregroundColor,
backgroundColor,
drawContour,
foregroundThreshold,
);
const opacity = 1;
const maskBlurAmount = 3;
await bodySegmentation.drawMask(canvas, $video, mask, opacity, maskBlurAmount);
$danmuku.style.webkitMaskImage = `url(${canvas.toDataURL()})`;
$danmuku.style.maskImage = `url(${canvas.toDataURL()})`;
} catch (error) {
console.error('Error in segmentBody:', error);
}
animationFrameId = requestAnimationFrame(segmentBody);
}
async function startSegmentation() {
if (!segmenter) {
await initSegmenter();
}
if (!canvas) {
createCanvas();
}
// Wait for the video element to be ready
await new Promise((resolve) => {
if ($video.readyState >= 2) {
resolve();
} else {
$video.onloadeddata = resolve;
}
});
segmentBody();
}
function stopSegmentation() {
if (animationFrameId) {
cancelAnimationFrame(animationFrameId);
animationFrameId = null;
}
}
art.on('ready', startSegmentation);
art.on('destroy', stopSegmentation);
return {
name: 'artplayerPluginDanmukuMask',
start: startSegmentation,
stop: stopSegmentation,
};
};
}
if (typeof document !== 'undefined') {
const id = 'artplayer-plugin-danmuku-mask';
const $style = document.getElementById(id);
if ($style) {
$style.textContent = style;
} else {
const $style = document.createElement('style');
$style.id = id;
$style.textContent = style;
document.head.appendChild($style);
}
}
if (typeof window !== 'undefined') {
window['artplayerPluginDanmukuMask'] = artplayerPluginDanmukuMask;
}
packages/artplayer-plugin-danmuku-mask/src/style.less
-3
View File
@@ -1,3 +0,0 @@
.artplayer-plugin-danmuku-mask {
//
}