1/* 2 * Copyright (C) 2022 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 { BaseStruct, dataFilterHandler, drawLoadingFrame, isFrameContainPoint } from './ProcedureWorkerCommon'; 17import { TraceRow } from '../../component/trace/base/TraceRow'; 18 19export class LtpoRender { 20 renderMainThread( 21 req: { 22 ltpoContext: CanvasRenderingContext2D; 23 useCache: boolean; 24 type: string; 25 }, 26 ltpoRow: TraceRow<LtpoStruct> 27 ): void { 28 let list = ltpoRow.dataListCache; 29 LtpoStruct.maxVal = 0; 30 for (let i = 0; i < list.length; i++) { 31 if (Number(list[i].value) > LtpoStruct.maxVal) LtpoStruct.maxVal = Number(list[i].value); 32 } 33 let filter = ltpoRow.dataListCache; 34 dataFilterHandler(list, filter, { 35 startKey: 'startTs', 36 durKey: 'dur', 37 startNS: TraceRow.range?.startNS ?? 0, 38 endNS: TraceRow.range?.endNS ?? 0, 39 totalNS: TraceRow.range?.totalNS ?? 0, 40 frame: ltpoRow.frame, 41 paddingTop: 5, 42 useCache: req.useCache || !(TraceRow.range?.refresh ?? false), 43 }); 44 req.ltpoContext.globalAlpha = 0.6; 45 drawLoadingFrame(req.ltpoContext, filter, ltpoRow); 46 req.ltpoContext.beginPath(); 47 let find = false; 48 for (let re of filter) { 49 if (ltpoRow.isHover && re.frame && isFrameContainPoint(re.frame, ltpoRow.hoverX, ltpoRow.hoverY)) { 50 LtpoStruct.hoverLtpoStruct = re; 51 find = true; 52 } 53 LtpoStruct.draw(req.ltpoContext, re); 54 if (!find && ltpoRow.isHover) { 55 LtpoStruct.hoverLtpoStruct = undefined; 56 } 57 req.ltpoContext.closePath(); 58 } 59 } 60} 61 62export class LtpoStruct extends BaseStruct { 63 static hoverLtpoStruct: LtpoStruct | undefined; 64 static selectLtpoStruct: LtpoStruct | undefined; 65 static maxVal: number | undefined; 66 dur: number | undefined; 67 name: string | undefined; 68 presentId: number | undefined; 69 ts: number | undefined; 70 fanceId: number | undefined; 71 fps: number | undefined; 72 startTs: number | undefined; 73 nextStartTs: string | number | undefined; 74 nextDur: number | undefined; 75 value: number | undefined; 76 pid: number | undefined; 77 itid: number | undefined; 78 startTime: number | undefined; 79 signaled: number | undefined; 80 nowTime: number | undefined; 81 cutTime: number | undefined; 82 cutSendDur: number | undefined; 83 84 static draw(ctx: CanvasRenderingContext2D, data: LtpoStruct): void { 85 if (data.frame) { 86 ctx.fillStyle = '#9933FA'; 87 if (data === LtpoStruct.hoverLtpoStruct || data === LtpoStruct.selectLtpoStruct) { 88 let drawHeight: number = 89 LtpoStruct.maxVal !== 0 90 ? Math.floor(((Number(data.value) || 0) * (data.frame.height || 0) * 1.0) / LtpoStruct.maxVal!) 91 : 0; 92 drawHeight = drawHeight < 1 ? 1 : drawHeight; 93 ctx.globalAlpha = 1.0; 94 ctx.fillRect(data.frame.x, data.frame.y + data.frame.height - drawHeight, data.frame.width, drawHeight); 95 ctx.lineWidth = 1; 96 ctx.strokeStyle = ' #0000FF'; 97 ctx.strokeRect(data.frame.x, data.frame.y + data.frame.height - drawHeight, data.frame.width, drawHeight); 98 } else { 99 ctx.globalAlpha = 0.6; 100 let drawHeight: number = 0; 101 if (LtpoStruct.maxVal !== 0) { 102 drawHeight = Math.floor(((Number(data.value) || 0) * (data.frame.height || 0)) / LtpoStruct.maxVal!); 103 } 104 drawHeight = drawHeight < 1 ? 1 : drawHeight; 105 ctx.fillRect(data.frame.x, data.frame.y + data.frame.height - drawHeight, data.frame.width, drawHeight); 106 } 107 } 108 } 109} 110