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