Package Exports
- trtc-electron-plugin-xmagic
- trtc-electron-plugin-xmagic/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (trtc-electron-plugin-xmagic) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
trtc-electron-plugin-xmagic
This is a plugin used to integrate Tencent Effect SDK into Tencent TRTC Electron SDK.
Prerequrement
OS
- Windows 7+(Bettor Windows 10+)
- MacOS 10.15+(Better MacOS 13+)
Environment & 3rd library
Use
install SDK & library
npm install trtc-electron-sdk
npm install trtc-electron-plugin-xmagic
construct Xmagic effect constants and tool function
// beauty.js
import {
buildLibPath,
buildInitParam,
buildSegmentationConstant,
buildMotionConstant,
} from 'trtc-electron-plugin-xmagic';
export {
XmagicBeautyCategory as TUIBeautyCategory,
XmagicBasicBeautyConstant as TUIBasicBeautyConstant,
XmagicFaceBeautyConstant as TUIFaceBeautyConstant,
XmagicBodyBeautyConstant as TUIBodyBeautyConstant,
} from 'trtc-electron-plugin-xmagic';
// To do
function async getAppPath() {
// get app path from Electron main process use app.getAppPath()
}
export async function getBeautyPluginLibPath() {
const appPath = await getAppPath();
return buildLibPath(appPath);
}
export async function getBeautyInitParam() {
const appPath = await getAppPath();
const initParam = buildInitParam({
appPath,
licenseURL: "", // Get from https://www.tencentcloud.com/products/x-magic
licenseKey: "",
});
return initParam;
}
// Virtual backgroud image
const virtualBackgroundImages = {
blackboard: {
imgPath: "", // image path in you web project
bgPath: "",
},
ellipse: {
imgPath: "", // image path in you web project
bgPath: "",
},
};
// Virtual background and blur constants
const TUISegmentationConstant = {}
let hasGeneratedFullPath4Segmentation = false;
export async function getTUISegmentationBeautyConstant() {
const appPath = await getAppPath();
if (hasGeneratedFullPath4Segmentation) {
return TUISegmentationConstant;
}
const segmenttationConstant = buildSegmentationConstant(appPath);
TUISegmentationConstant.empty = {
...segmenttationConstant.empty,
imgPath: "",
bgPath: "",
};
TUISegmentationConstant.blur = {
...segmenttationConstant.blur,
imgPath: "",
bgPath: "",
};
Reflect.ownKeys(virtualBackgroundImages).forEach((key) => {
const item = virtualBackgroundImages[key];
Object.assign(item, {
...segmenttationConstant.virtual,
})
if (item.imgPath) {
if (location.href.startsWith("http")) {
// development
item.bgPath = window.path
.join(appPath, "/public", item.imgPath)
.replaceAll("\\", "/");
} else {
// production
item.bgPath = window.path
.join(appPath, "/dist", item.imgPath)
.replaceAll("\\", "/");
}
}
TUISegmentationConstant[key] = item;
});
hasGeneratedFullPath4Segmentation = true;
return TUISegmentationConstant;
}
const TUIMotionBeautyConstant = {};
let hasGeneratedFullPath4Motion = false;
export async function getTUIMotionBeautyConstant() {
const appPath = await getAppPath();
if (hasGeneratedFullPath4Motion) {
return TUIMotionBeautyConstant;
}
const motionBeautyConstant = buildMotionConstant(appPath);
Object.assign(TUIMotionBeautyConstant, motionBeautyConstant);
hasGeneratedFullPath4Motion = true;
return TUIMotionBeautyConstant;
}Start beauty effect
// Room.vue script
import TRTCCloud, { TRTCPluginType, TRTCVideoPixelFormat } from 'trtc-electron-sdk';
import {
getBeautyPluginLibPath,
getBeautyInitParam,
TUIBeautyCategory,
TUIBasicBeautyConstant,
TUIFaceBeautyConstant,
TUIBodyBeautyConstant,
getTUISegmentationBeautyConstant,
getTUIMotionBeautyConstant
} from "./beauty";
const trtcCloud = TRTCCloud.getTRTCShareInstance();
const startBeauty = () {
// Enable beauty effect
trtcCloud.setPluginParams(TRTCPluginType.TRTCPluginTypeVideoProcess, {
enable: true,
pixelFormat: TRTCVideoPixelFormat.TRTCVideoPixelFormat_I420
});
// Regist beauty plugin callback
trtcCloud.setPluginCallback((pluginId, errorCode, msg) => {
console.log(`plugin info: ${pluginId}, errorCode: ${errorCode}, msg: ${msg}`);
});
const currentCamera = trtcCloud.getCurrentCameraDevice(); // Make sure your PC has a camera
if (currentCamera) {
const libPath = await getBeautyPluginLibPath();
beautyPlugin = trtcCloud.addPlugin({
id: `${currentCamera.deviceId}-${new Date().getTime()}`, // ID shoud be unique globally
path: libPath,
type: TRTCPluginType.TRTCPluginTypeVideoProcess,
});
const initParam = await getBeautyInitParam();
beautyPlugin.setParameter(JSON.stringify(initParam));
beautyPlugin.enable();
const beautySetting = {
beautySetting: [
{ category: TUIBeautyCategory.Beauty, effKey: TUIBasicBeautyConstant.BEAUTY_WHITEN.effKey, effValue: "0.5", },
{ category: TUIBeautyCategory.Beauty, effKey: TUIBasicBeautyConstant.BEAUTY_SMOOTH.effKey, effValue: "0.4", },
{ category: TUIBeautyCategory.Beauty, effKey: TUIBasicBeautyConstant.BEAUTY_ROSY.effKey, effValue: "0.3",},
{ category: TUIBeautyCategory.Beauty, effKey: TUIFaceBeautyConstant.BEAUTY_FACE_NATURE.effKey, effValue: "0.8"},
{ category: TUIBeautyCategory.Beauty, effKey: TUIFaceBeautyConstant.BEAUTY_FACE_V.effKey, effValue: "0",},
{ category: TUIBeautyCategory.Beauty, effKey: TUIFaceBeautyConstant.BEAUTY_ENLARGE_EYE.effKey, effValue: "1",},
{ category: TUIBeautyCategory.BodyBeauty, effKey: TUIBodyBeautyConstant.BODY_THIN_SHOULDER_STRENGTH.effKey, effValue: "0.7",},
{ category: TUIBeautyCategory.BodyBeauty, effKey: TUIBodyBeautyConstant.BODY_SLIM_HEAD_STRENGTH.effKey, effValue: "0.61",},
{
category: TUIBeautyCategory.Segmentation,
effKey: TUISegmentationConstant["blackboard"].effKey,
resPath: TUISegmentationConstant["blackboard"].resPath,
bgPath: TUISegmentationConstant["blackboard"].bgPath,
}
]
};
// wait before the library finished loading and initializing
setTimeout(() => {
const jsonParam = JSON.stringify(beautySetting);
beautyPlugin.setParameter(jsonParam);
}, 100);
}
}Build configuration for electron-builder
// electron builder configuration related
"build": {
"win": {
"target": ["nsis","zip"],
"extraFiles": [
{
"from": "node_modules/trtc-electron-sdk/build/Release/",
"to": "./resources",
"filter": [
"**/*"
]
},
{
"from": "node_modules/trtc-electron-plugin-xmagic/plugin/XMagic/win/${arch}/platforms/",
"to": "./platforms",
"filter": [
"**/*"
]
},
{
"from": "node_modules/trtc-electron-plugin-xmagic/plugin/XMagic/win/${arch}/",
"to": "./resources/app/plugin/XMagic/win/${arch}/",
"filter": [
"**/*"
]
},
{
"from": "node_modules/trtc-electron-plugin-xmagic/plugin/XMagic/win/res/",
"to": "./resources/app/plugin/XMagic/win/res/",
"filter": [
"**/*"
]
}
]
},
"mac": {
"target": ["dmg"],
"extraFiles": [
{
"from": "node_modules/trtc-electron-sdk/build/Release/${arch}/trtc_electron_sdk.node",
"to": "./Resources"
},
{
"from": "node_modules/trtc-electron-sdk/build/mac-framework/${arch}/",
"to": "./Frameworks"
},
{
"from": "node_modules/trtc-electron-plugin-xmagic/plugin/XMagic/mac/",
"to": "./Resources/app/plugin/XMagic/mac/"
}
]
},
}