diff --git a/.github/workflows/publish.yaml b/.github/workflows/publish.yaml index eac5b86e..7d1be2a9 100644 --- a/.github/workflows/publish.yaml +++ b/.github/workflows/publish.yaml @@ -26,7 +26,7 @@ jobs: uses: actions/checkout@v4 - name: Log in to container registry - uses: docker/login-action@3d58c274f17dffee475a5520cbe67f0a882c4dbb + uses: docker/login-action@83a00bc1ab5ded6580f31df1c49e6aaa932d840d with: registry: ${{ env.REGISTRY }} username: ${{ github.actor }} @@ -54,7 +54,7 @@ jobs: tar --numeric-owner --transform "s/dist/element-call-${TARBALL_VERSION}/" -cvzf element-call-${TARBALL_VERSION}.tar.gz dist - name: Upload - uses: actions/upload-artifact@4c0ff1c489dca52fedb26375d7d8fe7bd9233f19 + uses: actions/upload-artifact@ef09cdac3e2d3e60d8ccadda691f4f1cec5035cb env: GITHUB_TOKEN: ${{ github.token }} with: diff --git a/package.json b/package.json index caad6b09..f9089e0b 100644 --- a/package.json +++ b/package.json @@ -100,9 +100,8 @@ "@types/request": "^2.48.8", "@types/sdp-transform": "^2.4.5", "@types/uuid": "9", - "@typescript-eslint/eslint-plugin": "^6.1.0", - "@typescript-eslint/parser": "^6.1.0", - "@vitest/coverage-v8": "^1.2.2", + "@typescript-eslint/eslint-plugin": "^7.0.0", + "@typescript-eslint/parser": "^7.0.0", "babel-loader": "^9.0.0", "babel-plugin-transform-vite-meta-env": "^1.0.3", "eslint": "^8.14.0", diff --git a/public/locales/en-GB/app.json b/public/locales/en-GB/app.json index 9dca0a19..0acb3006 100644 --- a/public/locales/en-GB/app.json +++ b/public/locales/en-GB/app.json @@ -143,6 +143,7 @@ "unmute_microphone_button_label": "Unmute microphone", "version": "Version: {{version}}", "video_tile": { + "change_fit_contain": "Crop to fit", "exit_full_screen": "Exit full screen", "full_screen": "Full screen", "mute_for_me": "Mute for me", diff --git a/src/room/RoomAuthView.tsx b/src/room/RoomAuthView.tsx index 2b17e54a..272b82e4 100644 --- a/src/room/RoomAuthView.tsx +++ b/src/room/RoomAuthView.tsx @@ -41,6 +41,8 @@ export const RoomAuthView: FC = () => { // @ts-ignore (e) => { e.preventDefault(); + setLoading(true); + const data = new FormData(e.target); const dataForDisplayName = data.get("displayName"); const displayName = diff --git a/src/state/TileViewModel.ts b/src/state/TileViewModel.ts index 791d28a3..b059c42c 100644 --- a/src/state/TileViewModel.ts +++ b/src/state/TileViewModel.ts @@ -167,6 +167,12 @@ export class UserMediaTileViewModel extends BaseTileViewModel { */ public readonly videoEnabled: StateObservable; + private readonly _cropVideo = new BehaviorSubject(true); + /** + * Whether the tile video should be contained inside the tile or be cropped to fit. + */ + public readonly cropVideo = state(this._cropVideo); + public constructor( id: string, member: RoomMember | undefined, @@ -205,6 +211,10 @@ export class UserMediaTileViewModel extends BaseTileViewModel { this._locallyMuted.next(!this._locallyMuted.value); } + public toggleFitContain(): void { + this._cropVideo.next(!this._cropVideo.value); + } + public setLocalVolume(value: number): void { this._localVolume.next(value); } diff --git a/src/video-grid/VideoTile.module.css b/src/video-grid/VideoTile.module.css index 9e30c6e1..b4da6e5e 100644 --- a/src/video-grid/VideoTile.module.css +++ b/src/video-grid/VideoTile.module.css @@ -73,7 +73,7 @@ borders don't support gradients */ .videoTile video { inline-size: 100%; block-size: 100%; - object-fit: cover; + object-fit: contain; background-color: var(--cpd-color-bg-subtle-primary); /* This transform is a no-op, but it forces Firefox to use a different rendering path, one that actually clips the corners of