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 deviceInfo from '@ohos.deviceInfo';
17import { Action } from '@ohos/common/src/main/ets/default/redux/actions/Action';
18import { EventBusManager } from '@ohos/common/src/main/ets/default/worker/eventbus/EventBusManager';
19import { Dispatch, OhCombinedState } from '@ohos/common/src/main/ets/default/redux/store';
20import { getStore } from '@ohos/common/src/main/ets/default/redux/store';
21import { Log } from '@ohos/common/src/main/ets/default/utils/Log';
22import { SettingManager } from '@ohos/common/src/main/ets/default/setting/SettingManager';
23import { SettingItem } from '@ohos/common/src/main/ets/default/featurecommon/settingview/phone/SettingItem';
24import { SettingListModel } from '@ohos/common/src/main/ets/default/featurecommon/settingview/model/SettingListModel';
25import { SettingGroupItem } from '@ohos/common/src/main/ets/default/featurecommon/settingview/model/SettingData';
26
27class StateStruct {
28  isCloseFlag: boolean = false;
29  mode: string = '';
30  zoomRatio: number = 1;
31}
32
33class SettingViewDispatcher {
34  private mDispatch: Dispatch = (data) => data;
35
36  public setDispatch(dispatch: Dispatch) {
37    this.mDispatch = dispatch;
38  }
39
40  public closeDialog(isCloseFlag: boolean): void {
41    this.mDispatch(Action.closeDialog(isCloseFlag));
42  }
43
44  public hideSettingView(): void {
45    this.mDispatch(Action.showSettingView(false));
46  }
47
48  public changeXComponentSize(xComponentWidth: number, xComponentHeight: number): void {
49    this.mDispatch(Action.changeXComponentSize(xComponentWidth, xComponentHeight));
50  }
51
52  public assistiveGridView(isViewShow: number): void {
53    this.mDispatch(Action.assistiveGridView(isViewShow));
54  }
55
56  public reStartPreview(zoomRatio: number): void {
57    this.mDispatch(Action.reStartPreview(zoomRatio));
58  }
59}
60
61class SizeStruct {
62  width: number = 0;
63  height: number = 0;
64}
65
66@Component
67export struct SettingView {
68  private TAG: string = '[SettingView]:'
69  private settingManager = SettingManager.getInstance()
70  @State checkNameList: Array<string> = ['4:3', '[16:9] 720p']
71  @State closeFlag: boolean = false
72  @State tempGutter: number = 12; //列间距
73  @State tempMargin: number = 12; //两侧间距
74  @State settingsList: SettingGroupItem[] = new SettingListModel().getSettingList()
75  @State state: StateStruct = new StateStruct()
76  private mEventBus = EventBusManager.getInstance().getEventBus()
77  private WH_100_100: string = "100%";
78  private mAction: SettingViewDispatcher = new SettingViewDispatcher();
79
80  aboutToAppear(): void {
81    Log.info(`${this.TAG} aboutToAppear invoke E`)
82    getStore().subscribe((state: OhCombinedState) => {
83      this.state = {
84        isCloseFlag: state.settingReducer.isCloseFlag,
85        mode: state.modeReducer.mode,
86        zoomRatio: state.zoomReducer.zoomRatio
87      };
88    }, (dispatch: Dispatch) => {
89      this.mAction.setDispatch(dispatch);
90    });
91    this.mEventBus.on('AspectRatio', (data: SizeStruct) => this.aspectRatioChange(data));
92    this.mEventBus.on('Resolution', (data: SizeStruct) => this.resolutionChange(data));
93    this.mEventBus.on('AssistiveGrid', (data: number) => this.assistiveGridChange(data));
94    Log.info(`${this.TAG} aboutToAppear invoke X`)
95  }
96
97  aboutToDisappear(): void {
98    Log.info(`${this.TAG} aboutToDisappear E`)
99    this.mEventBus.off('AspectRatio', (data: SizeStruct) => this.aspectRatioChange(data));
100    this.mEventBus.off('Resolution', (data: SizeStruct) => this.resolutionChange(data));
101    this.mEventBus.off('AssistiveGrid', (data: number) => this.assistiveGridChange(data));
102  }
103
104  onBackPress(): boolean {
105    Log.info(`${this.TAG} onBackPress invoke X`)
106    if (this.state.isCloseFlag) {
107      this.closeFlag = !this.closeFlag
108    } else {
109      this.mAction.hideSettingView()
110    }
111    return true;
112  }
113
114  private aspectRatioChange(xComponentSize: SizeStruct): void {
115    if (this.state.mode != 'VIDEO') {
116      this.mAction.changeXComponentSize(xComponentSize.width, xComponentSize.height)
117      this.mAction.reStartPreview(this.state.zoomRatio)
118    }
119  }
120
121  private resolutionChange(xComponentSize: SizeStruct): void {
122    if (this.state.mode == 'VIDEO') {
123      this.mAction.changeXComponentSize(xComponentSize.width, xComponentSize.height)
124      this.mAction.reStartPreview(this.state.zoomRatio)
125    }
126  }
127
128  private assistiveGridChange(mAssistiveGrid: number): void {
129    this.mAction.assistiveGridView(mAssistiveGrid)
130  }
131
132  build() {
133    Flex({ direction: FlexDirection.Column }) {
134      Row() {
135        Image($r('app.media.ic_public_back'))
136          .width(24)
137          .height(24)
138          .fillColor($r('app.color.settings_ic_public_back_FFFFFF'))
139          .onClick(() => {
140            this.mAction.hideSettingView()
141          })
142        Text($r('app.string.settings'))
143          .margin({ left: $r('sys.float.ohos_id_elements_margin_horizontal_l') })
144          .fontColor($r('app.color.settings_ic_public_back_FFFFFF'))
145          .fontSize($r('sys.float.ohos_id_text_size_headline8'))
146          .fontWeight(FontWeight.Medium)
147      }
148      .padding({ left: 24 })
149      .width(this.WH_100_100)
150      .height(56)
151      .margin({ top: deviceInfo.deviceType !== 'default' ? 25 : 0 })
152
153      Scroll() {
154        Column() {
155          GridContainer({ columns: 4, gutter: this.tempGutter, margin: this.tempMargin }) {
156            List() {
157              ForEach(this.settingsList, (item: SettingGroupItem, index: number) => {
158                ListItem() {
159                  SettingItem({
160                    settingsList: $settingsList,
161                    closeFlag: $closeFlag,
162                    item: item,
163                    index: index
164                  })
165                }
166              })
167            }
168          }
169
170          Row() {
171            Button({ type: ButtonType.Normal, stateEffect: true }) {
172              Text($r('app.string.restore_defaults'))
173                .fontSize($r('sys.float.ohos_id_text_size_button1'))
174                .fontColor($r('app.color.font_color_FFFFFF'))
175                .fontWeight(FontWeight.Regular)
176                .textAlign(TextAlign.Center)
177            }
178            .borderRadius(30)
179            .backgroundColor($r('app.color.background_color_333333'))
180            .height(40)
181            .width('52%')
182            .onClick(() => {
183              this.settingManager.restoreValues(this.state.mode)
184              this.mAction.hideSettingView()
185            })
186          }
187          .margin({ top: $r('sys.float.ohos_id_text_paragraph_margin_l') })
188        }
189      }
190      .width(this.WH_100_100)
191      .flexShrink(1)
192      .edgeEffect(EdgeEffect.Spring)
193    }
194    .height(this.WH_100_100)
195    .backgroundColor(Color.Black)
196  }
197}