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 { Log } from '../../utils/Log';
17import { ActionBarProp } from '../browserOperation/ActionBarProp';
18import { Action } from '../browserOperation/Action';
19import { ActionBarMode } from '../browserOperation/ActionBarMode';
20import { SingleTitle } from './SingleTitle';
21import { DetailTitle } from './DetailTitle';
22import { SelectionTitle } from './SelectionTitle';
23import { MenuPanel } from './MenuPanel';
24import { DetailMenuPanel } from './DetailMenuPanel';
25import { Constants } from '../../model/common/Constants';
26import { ActionBarButton } from './ActionBarButton';
27import { ScreenManager } from '../../model/common/ScreenManager';
28
29const TAG: string = 'common_ActionBar';
30
31// ActionBar，It consists of action on the left, title in the middle and menupanel on the right
32@Component
33export struct ActionBar {
34  @Link actionBarProp: ActionBarProp;
35  onMenuClicked: Function = (): void => {};
36  isVideoPage: boolean = false;
37  isFromPhotoBrowser: boolean = false;
38  @StorageLink('isHorizontal') isHorizontal: boolean = ScreenManager.getInstance().isHorizontal();
39  @Prop isNeedPlaceholder: boolean = false;
40
41  createArray(): ActionBarProp[] {
42    let actionBarProps: ActionBarProp[] = [];
43    actionBarProps.push(this.actionBarProp);
44    return actionBarProps;
45  }
46
47  build() {
48    Flex({
49      direction: FlexDirection.Row,
50      alignItems: ItemAlign.Center
51    }) {
52      if (this.isNeedPlaceholder && !(this.actionBarProp.getMode() === ActionBarMode.SELECTION_MODE)) {
53        Column() {
54        }
55        .padding({ left: Constants.NUMBER_40, top: Constants.NUMBER_48 })
56        .width(Constants.NUMBER_32)
57        .height(Constants.NUMBER_32)
58      }
59      if (!this.actionBarProp.getLeftAction().equals(Action.NONE)) {
60        ForEach(this.createArray(), (item: ActionBarProp) => {
61          ActionBarButton({
62            res: item.getLeftAction().iconRes,
63            action: item.getLeftAction(),
64            onMenuClicked: this.onMenuClicked,
65            isAutoTint: item.getLeftAction().isAutoTint,
66            colorMode: item.getColorMode(),
67            isFirst: true
68          })
69            .margin({
70              right: $r('app.float.actionbar_first_icon_margin')
71            })
72        }, (item: ActionBarProp) => {
73          return item.getLeftAction().actionID.toString()
74        })
75      }
76      if (this.actionBarProp.getMode() === ActionBarMode.DETAIL_MODE) {
77        DetailMenuPanel({ actionBarProp: this.actionBarProp, onMenuClicked: this.onMenuClicked, isLeft: true })
78      } else if (this.actionBarProp.getMode() === ActionBarMode.SELECTION_MODE) {
79        Stack({ alignContent: Alignment.Start }) {
80          SelectionTitle({ actionBarProp: $actionBarProp })
81        }.flexGrow(Constants.NUMBER_1)
82
83        MenuPanel({ actionBarProp: $actionBarProp, onMenuClicked: this.onMenuClicked })
84      } else if (this.actionBarProp.getMode() === ActionBarMode.TOP_MODE) {
85        Stack({ alignContent: Alignment.Start }) {
86          DetailTitle({ isVideoPage: this.isVideoPage })
87        }.flexGrow(Constants.NUMBER_1)
88
89        DetailMenuPanel({ actionBarProp: this.actionBarProp, onMenuClicked: this.onMenuClicked, isLeft: false })
90      } else {
91        Stack({ alignContent: Alignment.Start }) {
92          SingleTitle({ actionBarProp: $actionBarProp })
93        }.flexGrow(Constants.NUMBER_1)
94
95        MenuPanel({ actionBarProp: $actionBarProp, onMenuClicked: this.onMenuClicked })
96      }
97    }
98    .height(Constants.ActionBarHeight)
99    .zIndex(Constants.NUMBER_3)
100    .width(Constants.PERCENT_100)
101    .backgroundColor(this.isFromPhotoBrowser ? $r('app.color.transparent') : this.actionBarProp.getBackgroundColor())
102    .opacity(this.actionBarProp.getAlpha())
103    .padding({ left: $r('app.float.max_padding_start') })
104    .margin({
105      left: this.actionBarProp.getMode() === ActionBarMode.DETAIL_MODE && !this.isHorizontal
106        ? $r('app.float.album_set_page_action_bar_padding_left') : Constants.NUMBER_0
107    })
108  }
109}