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 { DateUtil } from '../../utils/DateUtil'; 18import { UserFileManagerAccess } from '../../access/UserFileManagerAccess'; 19import { ColumnSize, ScreenManager } from '../../model/common/ScreenManager'; 20import { Constants } from '../../model/common/Constants'; 21import { DetailsDialogComponent } from '../DetailsDialogComponent'; 22 23const TAG: string = 'common_DetailsDialog'; 24 25@Observed 26export class MediaDetails { 27 mediaType: number 28 height: number 29 width: number 30 size: number 31 duration: number 32 title: string 33 dateTaken: number 34 uri: string 35 displayName: string 36 dateModified: number 37} 38 39@CustomDialog 40export struct DetailsDialog { 41 static readonly INTERNAL_PREFIX_NUM = 3; 42 static readonly EXTERNAL_PREFIX_NUM = 2; 43 @StorageLink('isHorizontal') isHorizontal: boolean = ScreenManager.getInstance().isHorizontal(); 44 @StorageLink('isSidebar') isSidebar: boolean = ScreenManager.getInstance().isSidebar(); 45 @StorageLink('leftBlank') leftBlank: [number, number, number, number] 46 = [0, ScreenManager.getInstance().getStatusBarHeight(), 0, ScreenManager.getInstance().getNaviBarHeight()]; 47 sizeConvert = 1024; 48 controller: CustomDialogController; 49 dataTime: string; 50 @Consume mediaDetails: MediaDetails; 51 @Consume isDistributedAlbum: boolean; 52 @State refresh: boolean = false; 53 private isPcDevice: boolean = AppStorage.Get('deviceType') === Constants.PC_DEVICE_TYPE; 54 onWindowSizeChangeCallBack = () => this.updateDialogSize(); 55 56 aboutToAppear() { 57 let localizedDate = DateUtil.getLocalizedDate(this.mediaDetails.dateTaken); 58 let localizedTime = DateUtil.getLocalizedTime(this.mediaDetails.dateTaken); 59 this.dataTime = `${localizedDate} ${localizedTime}`; 60 let self = this; 61 62 ScreenManager.getInstance().on(ScreenManager.ON_WIN_SIZE_CHANGED, this.onWindowSizeChangeCallBack); 63 } 64 65 aboutToDisappear(): void { 66 Log.info(TAG, 'aboutToDisappear'); 67 ScreenManager.getInstance().off(ScreenManager.ON_WIN_SIZE_CHANGED, this.onWindowSizeChangeCallBack); 68 this.onWindowSizeChangeCallBack = null; 69 } 70 71 getResolution(height: number, width: number): string { 72 return `${width}x${height}`; 73 } 74 75 getTitle() { 76 Log.info(TAG, 'getTitle'); 77 if (this.mediaDetails.title) { 78 return this.mediaDetails.title; 79 } 80 let index = this.mediaDetails.displayName.lastIndexOf('.'); 81 return this.mediaDetails.displayName.substr(0, index); 82 } 83 84 getSize(size: number): string { 85 Log.info(TAG, `file size is: ${size}`); 86 if (size / (this.sizeConvert * this.sizeConvert) > 1) { 87 return `${(size / (this.sizeConvert * this.sizeConvert)).toFixed(2)}MB`; 88 } else { 89 return `${(size / this.sizeConvert).toFixed(2)}KB`; 90 } 91 } 92 93 updateDialogSize() { 94 this.refresh = !this.refresh; 95 } 96 97 build() { 98 Column() { 99 if (this.refresh && false) { 100 Column() 101 } 102 Row() { 103 Text($r('app.string.details')) 104 .key('DetailsBigTitle') 105 .fontSize($r('sys.float.ohos_id_text_size_dialog_tittle')) 106 .fontWeight(FontWeight.Medium) 107 .fontColor($r('sys.color.ohos_id_color_text_primary')) 108 }.alignItems(VerticalAlign.Center) 109 .height($r('app.float.dialog_title_height')) 110 111 DetailsDialogComponent({ 112 title: $r('app.string.title'), 113 content: this.getTitle(), 114 keyForAutoTest: Constants.KEY_FOR_AUTO_TEST_TITLE 115 }) 116 DetailsDialogComponent({ 117 title: $r('app.string.time'), 118 content: this.dataTime, 119 keyForAutoTest: Constants.KEY_FOR_AUTO_TEST_TIME 120 }) 121 DetailsDialogComponent({ 122 title: $r('app.string.size'), 123 content: `${this.getSize(this.mediaDetails.size)}`, 124 keyForAutoTest: Constants.KEY_FOR_AUTO_TEST_SIZE 125 }) 126 DetailsDialogComponent({ 127 title: $r('app.string.resolution'), 128 content: this.getResolution(this.mediaDetails.height, this.mediaDetails.width), 129 isLast: this.mediaDetails.mediaType != UserFileManagerAccess.MEDIA_TYPE_VIDEO && this.isDistributedAlbum, 130 keyForAutoTest: Constants.KEY_FOR_AUTO_TEST_RESOLUTION 131 }) 132 if (this.mediaDetails.mediaType == UserFileManagerAccess.MEDIA_TYPE_VIDEO) { 133 DetailsDialogComponent({ 134 title: $r('app.string.duration'), 135 content: DateUtil.getFormattedDuration(this.mediaDetails.duration), 136 isLast: this.isDistributedAlbum != null && this.isDistributedAlbum, 137 keyForAutoTest: Constants.KEY_FOR_AUTO_TEST_DURATION 138 }) 139 } 140 141 Stack({ alignContent: Alignment.Top }) { 142 Button() { 143 Text($r('app.string.detail_dialog_confirm')) 144 .fontSize($r('sys.float.ohos_id_text_size_button1')) 145 .fontColor($r('app.color.color_control_highlight')) 146 .width('100%') 147 .textAlign(TextAlign.Center) 148 .fontWeight(FontWeight.Medium) 149 } 150 .key('DetailsDialogConfirm') 151 .backgroundColor(this.isPcDevice ? $r('sys.color.ohos_id_color_button_normal') : $r('app.color.transparent')) 152 .height($r('app.float.details_dialog_button_height')) 153 .onClick(() => { 154 this.controller.close() 155 }) 156 .margin({ 157 left: $r('app.float.dialog_single_button_indent_margin'), 158 right: $r('app.float.dialog_single_button_indent_margin') 159 }) 160 }.width('100%') 161 .height($r('app.float.details_dialog_button_area_height')) 162 } 163 .borderRadius($r('sys.float.ohos_id_corner_radius_default_l')) 164 .width(this.isPcDevice ? $r('app.float.pc_dialog_width') : ScreenManager.getInstance() 165 .getColumnsWidth(ColumnSize.COLUMN_FOUR)) 166 .backgroundColor($r('app.color.white')) 167 .margin({ 168 right: $r('app.float.dialog_window_margin'), 169 left: $r('app.float.dialog_window_margin'), 170 bottom: this.isHorizontal || this.isSidebar ? 0 : Constants.DIALOG_BOTTOM_OFFSET + this.leftBlank[3] 171 }) 172 .padding({ left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') }) 173 .alignItems(HorizontalAlign.Start) 174 .shadow({ 175 radius: $r('app.float.dialog_defult_shadow_m_radio'), 176 color: $r('app.color.dialog_defult_shadow_m_color'), 177 offsetX: $r('app.float.dialog_defult_shadow_m_offsetX'), 178 offsetY: $r('app.float.dialog_defult_shadow_m_offsetY') 179 }) 180 } 181} 182