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 { Log } from '../../utils/Log';
17import { Dispatch, OhCombinedState } from '../../redux/store';
18import { getStore } from '../../redux/store';
19import { Action } from '../../redux/actions/Action';
20
21class StateStruct {
22  mode:string = '';
23}
24
25class BigTextDispatcher {
26  private mDispatch: Dispatch = (data) => data;
27
28  public setDispatch(dispatch: Dispatch) {
29    this.mDispatch = dispatch;
30  }
31
32  public updateShowBigTextFlag(flag: boolean): void {
33    this.mDispatch(Action.updateShowBigTextFlag(flag));
34  }
35
36  public updateUiState(state: boolean): void {
37    this.mDispatch(Action.uiState(state));
38  }
39}
40
41@Component
42export struct BigText {
43  private TAG: string = '[BigText]:'
44  private modeResource: Record<string, Resource> = {
45    'MULTI': $r('app.string.multi_mode'),
46    'PHOTO': $r('app.string.photo_mode'),
47    'VIDEO': $r('app.string.video_mode')
48  }
49  @State state: StateStruct = new StateStruct()
50  @State bigTextOpacity: number = 0
51  private mAction: BigTextDispatcher = new BigTextDispatcher();
52
53  public aboutToAppear() {
54    Log.info(`${this.TAG} aboutToAppear E`)
55    getStore().subscribe((state: OhCombinedState) => {
56      this.state = {
57        mode: state.modeReducer.mode
58      };
59    }, (dispatch: Dispatch) => {
60      this.mAction.setDispatch(dispatch);
61    });
62    Log.info(`${this.TAG} aboutToAppear X`)
63  }
64
65  public aboutToDisappear(): void {
66  }
67
68  build() {
69    Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
70      Text(this.modeResource[this.state.mode])
71        .fontSize(60)
72        .fontColor(Color.White)
73        .fontWeight(300)
74        .textAlign(TextAlign.Center)
75        .width('100%')
76        .opacity(this.bigTextOpacity)
77        .onAppear(() => {
78          animateTo({ duration: 150,
79            curve: Curve.Sharp,
80            delay: 0,
81            onFinish: () => {
82              animateTo({ duration: 150,
83                curve: Curve.Sharp,
84                delay: 1000,
85                onFinish: () => {
86                  this.mAction.updateShowBigTextFlag(false)
87                  this.mAction.updateUiState(true)
88                }
89              }, () => {
90                this.bigTextOpacity = 0
91              })
92            }
93          }, () => {
94            this.bigTextOpacity = 1
95          })
96        })
97    }
98    .width('100%')
99    .height('96vp')
100  }
101}