1/* 2 * Copyright (c) 2023 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16import display from '@ohos.display' 17 18import { Action } from '@ohos/common/src/main/ets/default/redux/actions/Action' 19import { EventBus } from '@ohos/common/src/main/ets/default/worker/eventbus/EventBus' 20import { EventBusManager } from '@ohos/common/src/main/ets/default/worker/eventbus/EventBusManager' 21import { Log } from '@ohos/common/src/main/ets/default/utils/Log' 22import { getStore, OhCombinedState } from '@ohos/common/src/main/ets/default/redux/store' 23 24let localState = (state: OhCombinedState) => { 25 return { 26 recordingTime: state.RecordReducer.recordingTime, 27 recordingTimeDisplay: state.RecordReducer.recordingTimeDisplay, 28 isRecordingPaused: state.RecordReducer.isRecordingPaused, 29 isRecordingSpotVisible: state.RecordReducer.isRecordingSpotVisible, 30 } 31} 32 33let localDispatcher = (dispatch) => { 34 return { 35 updateRecordingTime: (recordingTime: number) => { 36 dispatch(Action.updateRecordingTime(recordingTime)) 37 }, 38 updateSmallVideoTimerVisible: (visible: boolean) => { 39 dispatch(Action.updateSmallVideoTimerVisible(visible)) 40 }, 41 updateBigVideoTimerVisible: (visible: boolean) => { 42 dispatch(Action.updateBigVideoTimerVisible(visible)) 43 }, 44 updateRecordingSpotVisible: (visible: boolean) => { 45 dispatch(Action.updateRecordingSpotVisible(visible)) 46 }, 47 updateRecordingTimeDisplay: (timeDisplay: string) => { 48 dispatch(Action.updateRecordingTimeDisplay(timeDisplay)) 49 } 50 } 51} 52 53class StateStruct { 54 recordingTime 55 recordingTimeDisplay 56 isRecordingPaused 57 isRecordingSpotVisible 58 updateRecordingTime: Function 59 updateSmallVideoTimerVisible: Function 60 updateBigVideoTimerVisible: Function 61 updateRecordingSpotVisible: Function 62 updateRecordingTimeDisplay: Function 63} 64 65@Component 66export struct BigVideoTimer { 67 private TAG: string = '[BigVideoTimer]' 68 private timer: number = 0 69 private timerTick: number = 0 70 private appEventBus: EventBus = EventBusManager.getInstance().getEventBus() 71 @State state: StateStruct = new StateStruct() 72 73 private async onRecordPausedBig(data) { 74 Log.info(`${this.TAG} onRecordPaused timer id: ${this.timer} E`) 75 clearInterval(this.timer) 76 Log.info(`${this.TAG} onRecordPaused X`) 77 } 78 79 private async onRecordResumedBig(data) { 80 Log.info(`${this.TAG} onRecordResumed E`) 81 if (this.state.recordingTime <= 2) { 82 this.setIntervalTimer() 83 } 84 Log.info(`${this.TAG} onRecordResumed X`) 85 } 86 87 aboutToAppear(): void { 88 Log.info(`${this.TAG} aboutToAppear E`) 89 getStore().connect(localState, localDispatcher)(this.state) 90 this.setIntervalTimer() 91 this.appEventBus.on(Action.ACTION_RECORD_PAUSE, this.onRecordPausedBig.bind(this)) 92 this.appEventBus.on(Action.ACTION_RECORD_RESUME, this.onRecordResumedBig.bind(this)) 93 Log.info(`${this.TAG} aboutToAppear X`) 94 } 95 96 aboutToDisappear(): void { 97 Log.info(`${this.TAG} aboutToDisappear E`) 98 this.appEventBus.off(Action.ACTION_RECORD_PAUSE, this.onRecordPausedBig.bind(this)) 99 this.appEventBus.off(Action.ACTION_RECORD_RESUME, this.onRecordResumedBig.bind(this)) 100 Log.info(`${this.TAG} clearInterval timer id: ${this.timer}`) 101 clearInterval(this.timer) 102 Log.info(`${this.TAG} aboutToDisappear X`) 103 } 104 105 private setIntervalTimer() { 106 clearInterval(this.timer) 107 this.timer = setInterval(() => { 108 this.timerTick++ 109 if (this.timerTick % 2 === 0) { 110 this.state.updateRecordingTime(this.state.recordingTime + 1) 111 let shownSec = '00' 112 let shownMin = '00' 113 let sec = this.state.recordingTime % 60 114 if (sec < 10) { 115 shownSec = `0${sec}` 116 } else { 117 shownSec = `${sec}` 118 } 119 let minute = Math.floor(this.state.recordingTime / 60) 120 if (minute < 10) { 121 shownMin = `0${minute}` 122 } else { 123 shownMin = `${minute}` 124 } 125 this.state.updateRecordingTimeDisplay(`${shownMin}:${shownSec}`) 126 if (this.state.recordingTime > 2) { 127 clearInterval(this.timer) 128 this.state.updateSmallVideoTimerVisible(true) 129 this.state.updateBigVideoTimerVisible(false) 130 } 131 } 132 this.state.updateRecordingSpotVisible(!this.state.isRecordingSpotVisible) 133 }, 500) 134 } 135 136 build() { 137 Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 138 Text('').layoutWeight(1) 139 if (this.state.isRecordingPaused) { 140 Image($r('app.media.ic_video_recording')).width(12).height(12).fillColor(Color.White) 141 } else { 142 if (this.state.isRecordingSpotVisible) { 143 Column() { 144 } 145 .width(12) 146 .height(12) 147 .backgroundColor('#FF0000') 148 .borderRadius(6) 149 .visibility(Visibility.Visible) 150 } else { 151 Column() { 152 } 153 .width(12) 154 .height(12) 155 .backgroundColor('#FF0000') 156 .borderRadius(6) 157 .visibility(Visibility.Hidden) 158 } 159 } 160 Text(`${this.state.recordingTimeDisplay}`) 161 .margin({ left: 8, right: 8 }) 162 .fontSize('50fp') 163 .fontWeight(300) 164 .fontColor('#FFFFFF') 165 .textAlign(TextAlign.Center) 166 Text('').width(12).height(12) 167 Text('').layoutWeight(1) 168 }.width('100%').height(96) 169 } 170}