1/*
2 * Copyright (c) 2022-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 router from '@ohos.router';
17import {
18  Action,
19  ActionBarMode,
20  ActionBarProp,
21  BroadCast,
22  BroadCastConstants,
23  BroadCastManager,
24  Constants,
25  Log,
26  MediaItem,
27  BrowserConstants as PhotoConstants,
28  ScreenManager,
29  UiUtil
30} from '@ohos/common';
31import {
32  ActionBar,
33  PhotoItem
34} from '@ohos/common/CommonComponents';
35
36const TAG: string = 'DefaultPhotoPage';
37
38// Default Photo Page
39@Entry
40@Component
41export struct DefaultPhotoPage {
42  @Provide pageFrom: number = Constants.ENTRY_FROM.NORMAL;
43  @State broadCast: BroadCast = new BroadCast();
44  @Provide('transitionIndex') currentIndex: number = Constants.NUMBER_0;
45  @Provide moreMenuList: Action[] = [];
46  @State actionBarProp: ActionBarProp = new ActionBarProp();
47  @StorageLink('isSplitMode') isSplitMode: boolean = ScreenManager.getInstance().isSplitMode();
48  @StorageLink('isHorizontal') isHorizontal: boolean = ScreenManager.getInstance().isHorizontal();
49  @StorageLink('leftBlank') leftBlank: number[] =
50    [0, ScreenManager.getInstance().getStatusBarHeight(), 0, ScreenManager.getInstance().getNaviBarHeight()];
51  defaultMediaItem: MediaItem | undefined = undefined;
52  @StorageLink('statusBarHeight') statusBarHeight: number = 0;
53  @State backgroundColorResource: Resource = $r('app.color.default_background_color');
54  @State isShowBar: boolean = true;
55  private appBroadCast: BroadCast = BroadCastManager.getInstance().getBroadCast();
56  private readonly FORM_BG_WIDTH = 1152;
57  private readonly FORM_BG_HEIGHT = 768;
58  @State isRunningAnimation: boolean = false;
59  @State isOnSwiperAnimation: boolean = false;
60  @Provide hidePopup: boolean = false;
61  private onToggleBarsFunc: Function = (): void => this.onToggleBars();
62  private hideBarsFunc: Function = (): void => this.hideBars();
63
64  onMenuClicked(action: Action) {
65    Log.info(TAG, `onMenuClicked, action: ${action.actionID}`);
66    if (action.actionID === Action.BACK.actionID) {
67      router.replaceUrl({
68        url: 'pages/index',
69      });
70    }
71  }
72
73  aboutToAppear(): void {
74    if (!this.isShowBar) {
75      ScreenManager.getInstance().setSystemUi(true);
76    }
77    this.defaultMediaItem = this.getDefaultMediaItem();
78    this.actionBarProp
79      .setLeftAction(Action.BACK)
80      .setMode(ActionBarMode.STANDARD_MODE);
81    this.broadCast.on(PhotoConstants.TOGGLE_BAR, this.onToggleBarsFunc);
82    this.broadCast.on(PhotoConstants.HIDE_BARS, this.hideBarsFunc);
83  }
84
85  onPageShow() {
86    this.appBroadCast.emit(BroadCastConstants.THIRD_ROUTE_PAGE, []);
87  }
88
89  onToggleBars() {
90    if (this.isShowBar) {
91      this.hideBars();
92    } else {
93      this.showBars();
94    }
95    Log.info(TAG, `Toggle bars, isShowBar: ${this.isShowBar}`);
96  }
97
98  showBars(): void {
99    if (!this.isShowBar) {
100      this.isShowBar = true;
101      this.backgroundColorResource = $r('app.color.default_background_color');
102      ScreenManager.getInstance().setSystemUi(true);
103    }
104  }
105
106  hideBars(): void {
107    if (this.isShowBar) {
108      this.isShowBar = false;
109
110      this.backgroundColorResource = $r('app.color.black');
111      ScreenManager.getInstance().setSystemUi(false);
112    }
113  }
114
115  aboutToDisappear(): void {
116    if (this.broadCast) {
117      this.broadCast.off(PhotoConstants.TOGGLE_BAR, this.onToggleBarsFunc);
118      this.broadCast.off(PhotoConstants.HIDE_BARS, this.hideBarsFunc);
119    }
120  }
121
122  getDefaultMediaItem(): MediaItem {
123    return new MediaItem()
124  }
125
126  build() {
127    Stack({ alignContent: Alignment.TopStart }) {
128      PhotoItem({
129        item: this.defaultMediaItem,
130        mPosition: 1,
131        thumbnail: 'common/pic/form_bg.png',
132        transitionTag: 'default_id',
133        broadCast: $broadCast,
134        isRunningAnimation: $isRunningAnimation,
135        isOnSwiperAnimation: $isOnSwiperAnimation,
136        isDefaultFA: true
137      })
138      Column() {
139        ActionBar({ actionBarProp: $actionBarProp, onMenuClicked: (action: Action): void =>
140        this.onMenuClicked(action), isNeedPlaceholder: false })
141      }
142      .visibility(this.isShowBar ? Visibility.Visible : Visibility.Hidden)
143      .padding({
144        top: this.isHorizontal ? Constants.NUMBER_0 : px2vp(this.statusBarHeight)
145      })
146    }
147    .backgroundColor(this.backgroundColorResource)
148    .padding({
149      top: this.leftBlank[1],
150      bottom: this.leftBlank[3]
151    })
152  }
153}
154