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 { BaseElement, element } from '../../../base-ui/BaseElement'; 17import '../../../base-ui/select/LitAllocationSelect'; 18 19import '../../../base-ui/switch/lit-switch'; 20import { LitAllocationSelect } from '../../../base-ui/select/LitAllocationSelect'; 21import { SpRecordTrace } from '../SpRecordTrace'; 22import { Cmd } from '../../../command/Cmd'; 23import { LitRadioBox } from '../../../base-ui/radiobox/LitRadioBox'; 24import { SpCheckDesBox } from './SpCheckDesBox'; 25import LitSwitch from '../../../base-ui/switch/lit-switch'; 26import { SpApplication } from '../../SpApplication'; 27import { SpArkTsHtml } from './SpArkTs.html'; 28import { LitSelectV } from '../../../base-ui/select/LitSelectV'; 29 30@element('sp-ark-ts') 31export class SpArkTs extends BaseElement { 32 private processInput: LitSelectV | undefined | null; 33 private spCheckDesBox: SpCheckDesBox | undefined | null; 34 private radioBox: LitRadioBox | undefined | null; 35 private interval: HTMLInputElement | undefined | null; 36 private memorySwitch: LitSwitch | undefined | null; 37 private cpuSwitch: LitSwitch | undefined | null; 38 public litSwitch: LitSwitch | undefined | null; 39 private snapshotRadioBox: LitRadioBox | undefined | null; 40 private timelineRadioBox: LitRadioBox | undefined | null; 41 private snapshotCheckBox: SpCheckDesBox | undefined | null; 42 private timelineCheckBox: SpCheckDesBox | undefined | null; 43 44 set startSamp(jsHeapStart: boolean) { 45 if (jsHeapStart) { 46 this.setAttribute('startSamp', ''); 47 } else { 48 this.removeAttribute('startSamp'); 49 } 50 } 51 52 get startSamp(): boolean { 53 return this.hasAttribute('startSamp'); 54 } 55 56 get process(): string { 57 if (this.processInput!.value.length > 0) { 58 return this.processInput!.value; 59 } 60 return ''; 61 } 62 63 get radioBoxType(): number { 64 let memorySwitch = this.shadowRoot?.querySelector('#memory-switch'); 65 let type: string; 66 if (memorySwitch!.getAttribute('checked') !== null) { 67 this.radioBox = this.shadowRoot?.querySelector('lit-radio[checked]'); 68 type = this.radioBox?.getAttribute('type') || ''; 69 } else { 70 type = '-1'; 71 } 72 return Number(type); 73 } 74 75 get grabNumeric(): boolean { 76 if (this.radioBoxType === 0) { 77 this.spCheckDesBox = this.shadowRoot?.querySelector('#snapshot'); 78 let isChecked = this.spCheckDesBox?.getAttribute('checked'); 79 return isChecked === 'true'; 80 } else { 81 return false; 82 } 83 } 84 85 get grabAllocations(): boolean { 86 if (this.radioBoxType === 1) { 87 this.spCheckDesBox = this.shadowRoot?.querySelector('#timeline'); 88 let isChecked = this.spCheckDesBox?.getAttribute('checked'); 89 return isChecked === 'true'; 90 } else { 91 return false; 92 } 93 } 94 95 get intervalValue(): number { 96 if (this.radioBoxType === 0) { 97 return Number(this.interval!.value); 98 } else { 99 return 0; 100 } 101 } 102 103 get grabCpuProfiler(): boolean { 104 let isChecked = this.cpuSwitch?.getAttribute('checked'); 105 return isChecked !== null; 106 } 107 108 get intervalCpuValue(): number { 109 let interval = this.shadowRoot?.querySelector<HTMLInputElement>('#cpuInterval'); 110 if (interval) { 111 return Number(interval!.value); 112 } else { 113 return 0; 114 } 115 } 116 117 get isStartArkts(): boolean { 118 return this.litSwitch!.checked; 119 } 120 121 get isStartCpuProfiler(): boolean { 122 return this.cpuSwitch!.checked; 123 } 124 125 get isStartMemoryProfiler(): boolean { 126 return this.memorySwitch!.checked; 127 } 128 129 initElements(): void { 130 this.interval = this.shadowRoot?.querySelector('#interval'); 131 this.processInput = this.shadowRoot?.querySelector<LitSelectV>('lit-select-v'); 132 let processInput = this.processInput?.shadowRoot?.querySelector('input') as HTMLDivElement; 133 this.cpuSwitch = this.shadowRoot?.querySelector('#cpu-switch') as LitSwitch; 134 processInput!.addEventListener('mousedown', () => { 135 if (this.startSamp && (SpRecordTrace.serialNumber === '')) { 136 this.processInput!.dataSource([], ''); 137 } 138 }); 139 processInput!.addEventListener('mouseup', () => { 140 if (this.startSamp) { 141 if (SpRecordTrace.serialNumber === '') { 142 this.processInput!.dataSource([], ''); 143 } else { 144 if (SpRecordTrace.useExtend) { 145 Cmd.getPackage().then((processList) => { 146 if (processList.length > 0) { 147 this.processInput!.dataSource(processList, '', true); 148 } else { 149 this.processInput!.dataSource([], ''); 150 } 151 }); 152 } else { 153 Cmd.getDebugProcess().then((processList) => { 154 if (processList.length > 0) { 155 this.processInput!.dataSource(processList, '', true); 156 } else { 157 this.processInput!.dataSource([], ''); 158 } 159 }); 160 } 161 } 162 processInput!.removeAttribute('readonly'); 163 } else { 164 processInput!.setAttribute('readonly', 'readonly'); 165 return; 166 } 167 }); 168 this.litSwitch = this.shadowRoot?.querySelector('lit-switch') as LitSwitch; 169 this.memorySwitch = this.shadowRoot?.querySelector('#memory-switch') as LitSwitch; 170 this.cpuSwitch = this.shadowRoot?.querySelector('#cpu-switch') as LitSwitch; 171 this.snapshotRadioBox = this.shadowRoot?.querySelector('#heapsnapshot') as LitRadioBox; 172 this.timelineRadioBox = this.shadowRoot?.querySelector('#allcotimeline') as LitRadioBox; 173 this.snapshotCheckBox = this.shadowRoot?.querySelector('#snapshot') as SpCheckDesBox; 174 this.timelineCheckBox = this.shadowRoot?.querySelector('#timeline') as SpCheckDesBox; 175 this.disable(); 176 this.memoryDisable(); 177 } 178 179 intervalFocusoutHandler = (): void => { 180 if (this.interval!.value === '') { 181 this.interval!.value = '10'; 182 } 183 }; 184 185 litSwitchChangeHandler = (event: Event): void => { 186 // @ts-ignore 187 let detail = event.detail; 188 this.dispatchEvent(new CustomEvent('showTip', {})); 189 if (!SpRecordTrace.useExtend) { 190 setTimeout(() => { 191 this.litSwitch!.checked = false; 192 this.disable(); 193 this.memoryDisable(); 194 }, 500); 195 return; 196 } 197 198 if (detail.checked) { 199 this.unDisable(); 200 this.unMemoryDisable(); 201 } else { 202 this.disable(); 203 this.memoryDisable(); 204 } 205 }; 206 207 memorySwitchChangeHandler = (event: Event): void => { 208 // @ts-ignore 209 let detail = event.detail; 210 if (detail.checked) { 211 this.unMemoryDisable(); 212 } else { 213 if (!this.cpuSwitch?.checked) { 214 this.litSwitch!.checked = false; 215 this.disable(); 216 } 217 this.memoryDisable(); 218 } 219 }; 220 221 cpuSwitchChangeHandler = (event: Event): void => { 222 // @ts-ignore 223 let detail = event.detail; 224 let interval = this.shadowRoot?.querySelectorAll<HTMLInputElement>('#cpuInterval'); 225 if (!detail.checked && !this.memorySwitch?.checked) { 226 this.litSwitch!.checked = false; 227 this.disable(); 228 } else if (detail.checked) { 229 interval!.forEach((item) => { 230 item.disabled = false; 231 item.style.background = 'var(--dark-background5,#FFFFFF)'; 232 }); 233 } else { 234 interval!.forEach((item) => { 235 item.disabled = true; 236 item.style.color = '#b7b7b7'; 237 item.style.background = 'var(--dark-background1,#f5f5f5)'; 238 }); 239 this.litSwitch!.checked = true; 240 this.startSamp = true; 241 } 242 }; 243 244 snapshotRadioBoxChangeHandler = (event: Event): void => { 245 if (event) { 246 this.snapshotCheckBox!.disabled = false; 247 this.timelineCheckBox!.checked = false; 248 this.timelineCheckBox!.disabled = true; 249 } 250 }; 251 252 timelineRadioBoxChangeHandler = (event: Event): void => { 253 if (event) { 254 this.snapshotCheckBox!.checked = false; 255 this.snapshotCheckBox!.disabled = true; 256 this.timelineCheckBox!.disabled = false; 257 } 258 }; 259 260 public memoryDisable(): void { 261 let interval = this.shadowRoot?.querySelectorAll<HTMLInputElement>('#interval'); 262 interval!.forEach((item) => { 263 item.disabled = true; 264 item.style.color = '#b7b7b7'; 265 item.style.background = 'var(--dark-background1,#f5f5f5)'; 266 }); 267 let radioBoxes = this.shadowRoot?.querySelectorAll<LitRadioBox>('lit-radio'); 268 radioBoxes!.forEach((item) => { 269 item.disabled = true; 270 item.checked = false; 271 }); 272 let checkBoxes = this.shadowRoot?.querySelectorAll<SpCheckDesBox>('check-des-box'); 273 checkBoxes!.forEach((item) => { 274 item.disabled = true; 275 item.checked = false; 276 }); 277 } 278 279 private unMemoryDisable(): void { 280 let interval = this.shadowRoot?.querySelectorAll<HTMLInputElement>('#interval'); 281 interval!.forEach((item) => { 282 item.disabled = false; 283 item.style.background = 'var(--dark-background5,#FFFFFF)'; 284 }); 285 let radioBoxes = this.shadowRoot?.querySelectorAll<LitRadioBox>('lit-radio'); 286 radioBoxes!.forEach((item) => { 287 item.disabled = false; 288 }); 289 radioBoxes![0].checked = true; 290 let checkBoxes = this.shadowRoot?.querySelectorAll<SpCheckDesBox>('check-des-box'); 291 checkBoxes!.forEach((item) => { 292 item.disabled = false; 293 }); 294 checkBoxes![0].checked = true; 295 checkBoxes![1].disabled = true; 296 } 297 298 public disable(): void { 299 this.startSamp = false; 300 this.processInput!.setAttribute('disabled', ''); 301 let heapConfigs = this.shadowRoot?.querySelectorAll<HTMLInputElement>('.select'); 302 heapConfigs!.forEach((item) => { 303 item.disabled = true; 304 }); 305 let switches = this.shadowRoot?.querySelectorAll<LitSwitch>('.switch'); 306 switches!.forEach((item) => { 307 item.disabled = true; 308 item.checked = false; 309 }); 310 let interval = this.shadowRoot?.querySelectorAll<HTMLInputElement>('.inputstyle'); 311 interval!.forEach((item) => { 312 item.disabled = true; 313 item.style.color = '#b7b7b7'; 314 item.style.background = 'var(--dark-background1,#f5f5f5)'; 315 }); 316 } 317 318 private unDisable(): void { 319 this.startSamp = true; 320 this.processInput!.removeAttribute('disabled'); 321 let heapConfigs = this.shadowRoot?.querySelectorAll<HTMLInputElement>('.select'); 322 heapConfigs!.forEach((item) => { 323 item.disabled = false; 324 }); 325 let switches = this.shadowRoot?.querySelectorAll<LitSwitch>('.switch'); 326 switches!.forEach((item) => { 327 item.disabled = false; 328 item.checked = true; 329 }); 330 let interval = this.shadowRoot?.querySelectorAll<HTMLInputElement>('.inputstyle'); 331 interval!.forEach((item) => { 332 item.disabled = false; 333 item.style.background = 'var(--dark-background5,#FFFFFF)'; 334 }); 335 } 336 337 connectedCallback(): void { 338 let traceMode = this.shadowRoot!.querySelector('#traceMode') as HTMLDivElement; 339 let isLongTrace = SpApplication.isLongTrace; 340 if (isLongTrace) { 341 traceMode!.style.display = 'block'; 342 } else { 343 traceMode!.style.display = 'none'; 344 } 345 this.interval!.addEventListener('focusout', this.intervalFocusoutHandler); 346 this.litSwitch!.addEventListener('change', this.litSwitchChangeHandler); 347 this.memorySwitch!.addEventListener('change', this.memorySwitchChangeHandler); 348 this.cpuSwitch!.addEventListener('change', this.cpuSwitchChangeHandler); 349 this.snapshotRadioBox!.addEventListener('click', this.snapshotRadioBoxChangeHandler); 350 this.timelineRadioBox!.addEventListener('click', this.timelineRadioBoxChangeHandler); 351 } 352 353 disconnectedCallback(): void { 354 super.disconnectedCallback(); 355 this.interval!.removeEventListener('focusout', this.intervalFocusoutHandler); 356 this.litSwitch!.removeEventListener('change', this.litSwitchChangeHandler); 357 this.memorySwitch!.removeEventListener('change', this.memorySwitchChangeHandler); 358 this.cpuSwitch!.removeEventListener('change', this.cpuSwitchChangeHandler); 359 this.snapshotRadioBox!.removeEventListener('click', this.snapshotRadioBoxChangeHandler); 360 this.timelineRadioBox!.removeEventListener('click', this.timelineRadioBoxChangeHandler); 361 } 362 363 initHtml(): string { 364 return SpArkTsHtml; 365 } 366} 367