<view class="doubleroom-container">
    <rtc-room
        id="doubleRoom"
        class="rtc-room"
        enable-camera="{{enableCamera}}"
        enable-auto-focus="{{enableAutoFocus}}"
        enable-zoom="{{enableZoom}}"
        device-position="{{devicePosition}}"
        enable-mic="{{enableMic}}"
        enable-agc="{{enableAgc}}"
        enable-ans="{{enableAns}}"
        bitrate="{{bitrate}}"
        video-width="{{videoWidth}}"
        video-height="{{videoHeight}}"
        enable-remote-mirror="{{enableRemoteMirror}}"
        local-mirror="{{localMirror}}"
        sound-mode="{{soundMode}}"
        bindstatechange="handleStateChange"
        binderror="handleError">
        <rtc-room-item
            id="localView"
            type="local"
            user-id="{{localUserId}}"
            data-key="local"
            class="{{isLocalMainView ? 'main-view' : 'small-view'}}"
            bindtap="toggleMainView">
            <view class="loading" s-if="{{streamList.length === 0}}">
                <image
                    src="https://b.bdstatic.com/searchbox/icms/searchbox/img/loading-icon.png"
                    class="rotate-img">
                </image>
                <view class="loading-text">等待接听...</view>
            </view>
            <view s-if="{{!enableCamera}}" class="camera-off-container">
                <image
                    class="camera-off-image"
                    src="https://b.bdstatic.com/searchbox/icms/searchbox/img/off-camera.png">
                </image>
                <view class="camera-off-text">本地摄像头未打开</view>
            </view>
        </rtc-room-item>
        <rtc-room-item
            id="remoteView"
            s-if="streamList.length !== 0"
            type="remote"
            user-id="{{streamList[0].userId}}"
            data-key="remote"
            class="{{isLocalMainView ? 'small-view' : 'main-view'}}"
            bindtap="toggleMainView">
        </rtc-room-item>
    </rtc-room>
    <view class="handle-btns">
        <view class="btn-normal {{enableMic ? '' : 'btn-active'}}" bindtap="toggleAudio">
            <image
                class="btn-image"
                src="{{enableMic
                    ? 'https://b.bdstatic.com/searchbox/icms/searchbox/img/audio-off.png'
                    : 'https://b.bdstatic.com/searchbox/icms/searchbox/img/audio-on.png'
                    }} ">
            </image>
        </view>
        <view class="btn-normal {{soundMode === 'ear' ? 'btn-active' : ''}}" bindtap="toggleSoundMode">
            <image
                class="btn-image"
                src="{{soundMode === 'ear'
                    ? 'https://b.bdstatic.com/searchbox/icms/searchbox/img/speaker-off.png'
                    : 'https://b.bdstatic.com/searchbox/icms/searchbox/img/speaker-on.png'}} ">
            </image>
        </view>
        <view class="btn-normal btn-hangup" bindtap="hangUp">
            <image
                class="btn-image"
                src="https://b.bdstatic.com/searchbox/icms/searchbox/img/hangup.png">
            </image>
        </view>
        <view class="btn-normal {{enableCamera ? '' : 'btn-active'}}" bindtap="toggleVideo">
            <image
                class="btn-image"
                src="{{enableCamera
                    ? 'https://b.bdstatic.com/searchbox/icms/searchbox/img/camera-off.png'
                    : 'https://b.bdstatic.com/searchbox/icms/searchbox/img/camera-on.png'}} ">
            </image>
        </view>
        <view class="btn-normal" bindtap="switchCamera" >
            <image
                class="btn-image"
                src="https://b.bdstatic.com/searchbox/icms/searchbox/img/switch.png">
            </image>
        </view>
    </view>
    <view class="top-mask"></view>
    <view class="bottom-mask"></view>
</view>