()
| 568 | } |
| 569 | |
| 570 | const draw = () => { |
| 571 | if (sharpenOverlay) { |
| 572 | sharpenOverlay.width = video ? video.clientWidth : |
| 573 | animation ? animation.clientWidth : 0 |
| 574 | sharpenOverlay.height = video ? video.clientHeight : |
| 575 | animation ? animation.clientHeight : 0 |
| 576 | if (sharpen !== 0) { |
| 577 | const sharpenOpacity = sharpen / 5 |
| 578 | sharpenOverlay.style.filter = `blur(4px) invert(1) contrast(75%)` |
| 579 | sharpenOverlay.style.mixBlendMode = "overlay" |
| 580 | sharpenOverlay.style.opacity = `${sharpenOpacity}` |
| 581 | sharpenCtx?.clearRect(0, 0, sharpenOverlay.width, sharpenOverlay.height) |
| 582 | sharpenCtx?.drawImage(frame, 0, 0, sharpenOverlay.width, sharpenOverlay.height) |
| 583 | } else { |
| 584 | sharpenOverlay.style.filter = "none" |
| 585 | sharpenOverlay.style.mixBlendMode = "normal" |
| 586 | sharpenOverlay.style.opacity = "0" |
| 587 | } |
| 588 | } |
| 589 | if (pixelateCanvas) { |
| 590 | pixelateCanvas.width = video ? video.clientWidth |
| 591 | : animation ? animation.clientWidth : 0 |
| 592 | pixelateCanvas.height = video ? video.clientHeight |
| 593 | : animation ? animation.clientHeight : 0 |
| 594 | |
| 595 | pixelateCtx?.clearRect(0, 0, pixelateCanvas.width, pixelateCanvas.height) |
| 596 | |
| 597 | if (pixelate !== 1) { |
| 598 | const bufferCanvas = document.createElement("canvas") |
| 599 | const bufferCtx = bufferCanvas.getContext("2d")! |
| 600 | |
| 601 | const pixelWidth = Math.max(1, Math.floor(pixelateCanvas.width / pixelate)) |
| 602 | const pixelHeight = Math.max(1, Math.floor(pixelateCanvas.height / pixelate)) |
| 603 | |
| 604 | bufferCanvas.width = pixelWidth |
| 605 | bufferCanvas.height = pixelHeight |
| 606 | |
| 607 | bufferCtx.drawImage(frame, 0, 0, pixelWidth, pixelHeight) |
| 608 | pixelateCtx!.imageSmoothingEnabled = false |
| 609 | pixelateCtx!.drawImage(bufferCanvas, 0, 0, pixelWidth, pixelHeight, |
| 610 | 0, 0, pixelateCanvas.width, pixelateCanvas.height) |
| 611 | pixelateCtx!.imageSmoothingEnabled = true |
| 612 | if (animation && !animationData) { |
| 613 | pixelateCanvas.style.opacity = "1" |
| 614 | animation.style.opacity = "0" |
| 615 | } |
| 616 | if (video && !videoData) { |
| 617 | pixelateCanvas.style.opacity = "1" |
| 618 | video.style.opacity = "0" |
| 619 | } |
| 620 | |
| 621 | } else { |
| 622 | pixelateCtx!.drawImage(frame, 0, 0, pixelateCanvas.width, pixelateCanvas.height) |
| 623 | if (animation && !animationData) { |
| 624 | pixelateCanvas.style.opacity = "0" |
| 625 | animation.style.opacity = "0" |
| 626 | } |
| 627 | if (video && !videoData) { |
no outgoing calls
no test coverage detected