diff --git a/CHANGELOG.md b/CHANGELOG.md index 50bb809..ee5b176 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # Changelog +## Unreleased + +- `createCameraEffectMiddleware(effect)` for React Native: a camera-track middleware for `useCamera().setCameraTrackMiddleware`, so an effect can be switched on from any screen without a provider or a hook. +- The TypeGPU segmentation model is fetched and parsed once per URL and shared by later sessions, so switching an effect on again or restarting the camera does not reload it. +- `typeGpuPersonSegmentation({ loadModel })` supplies the model bytes for platforms that cannot `fetch` the model URL, such as an asset embedded in an Android release build. + ## 0.1.2 - Background blur: the person no longer bleeds into the blurred background (no halo), the outline is a smooth ramp that hugs the body, and similar-coloured background next to the person is no longer left sharp. diff --git a/README.md b/README.md index 8420830..77cb1c4 100644 --- a/README.md +++ b/README.md @@ -38,28 +38,33 @@ const effect = useBackgroundImage({ `@fishjam-cloud/video-effects/fishjam-react-native` runs an effect on the camera track Fishjam already publishes, through `useCamera`'s camera-track middleware. No separate camera and no custom track: the app keeps using `useCamera`, and remote peers keep seeing `peer.cameraTrack`. -```tsx -import { useBackgroundBlur } from "@fishjam-cloud/video-effects/background-blur"; -import { useFishjamCameraEffect } from "@fishjam-cloud/video-effects/fishjam-react-native"; +```ts +import { createBackgroundBlurEffect } from "@fishjam-cloud/video-effects/background-blur"; +import { createCameraEffectMiddleware } from "@fishjam-cloud/video-effects/fishjam-react-native"; import { typeGpuPersonSegmentation } from "@fishjam-cloud/video-effects/segmentation/typegpu"; const segmentation = typeGpuPersonSegmentation({ modelUrl }); +export const backgroundBlur = createCameraEffectMiddleware( + createBackgroundBlurEffect(() => ({ segmentation, radius: 24 })), +); +``` -function BackgroundBlur({ enabled }: { enabled: boolean }) { - const blur = useBackgroundBlur({ segmentation, radius: 24 }); - const { status, error } = useFishjamCameraEffect(enabled ? blur : null); - return null; -} +```tsx +const { currentCameraMiddleware, setCameraTrackMiddleware } = useCamera(); +const isBlurOn = currentCameraMiddleware === backgroundBlur; +