|
17 | 17 |
|
18 | 18 | (function() { |
19 | 19 | "use strict"; |
20 | | - |
21 | | - |
22 | 20 | const PNGGeneratorUtil = (() => { |
23 | 21 | // Helper function to initialize CRC table |
24 | 22 | const initCrcTable = () => { |
|
113 | 111 | }; |
114 | 112 | })(); |
115 | 113 |
|
116 | | - |
117 | | - |
118 | 114 | /** |
119 | 115 | * class definition for GeoLocationQueryRequest |
120 | 116 | * encapsulated success and error handlers |
|
133 | 129 | scribbleContainer: `.${Scribble.bemBlock}__container`, |
134 | 130 | scribbleContainerPanel: `.${Scribble.bemBlock}__panel`, |
135 | 131 | keyboardSignBox: `.${Scribble.bemBlock}__keyboard-sign-box`, |
136 | | - scribbleContainerCaption: `.${Scribble.bemBlock}__caption`, |
137 | 132 | scribbleControlPanel: `.${Scribble.bemBlock}__controlpanel`, |
138 | 133 | geoCanvasRight: `.${Scribble.bemBlock}__geocanvasright`, |
139 | 134 | canvasSignedContainer: `.${Scribble.bemBlock}__canvas-signed-container`, |
|
242 | 237 | return document.querySelector(Scribble.selectors.scribbleContainerPanel); |
243 | 238 | } |
244 | 239 |
|
245 | | - getScribbleContainerCaption() { |
246 | | - return document.querySelector(Scribble.selectors.scribbleContainerCaption); |
247 | | - } |
248 | | - |
249 | 240 | getKeyboardSignBox() { |
250 | 241 | return document.querySelector(Scribble.selectors.keyboardSignBox); |
251 | 242 | } |
|
479 | 470 | e.stopPropagation(); |
480 | 471 | this.context.lineWidth=brush; |
481 | 472 | this.toggleBrushList(); |
| 473 | + // this.handleBrush(e); |
482 | 474 | }) |
483 | 475 | this.getBrushList().append(divel); |
484 | 476 | }); |
|
582 | 574 | }); |
583 | 575 | } |
584 | 576 |
|
585 | | - dialogCallback(button_val, arg1) { |
586 | | - switch(button_val){ |
587 | | - // case "ok": |
588 | | - // this.handleOk(); |
589 | | - // break; |
590 | | - // case "Cancel": |
591 | | - // this.handleCancel(); |
592 | | - // break; |
593 | | - // case "geolocation": |
594 | | - // this.calculateGeolocation(); |
595 | | - // break; |
596 | | - case "brushes": |
597 | | - this.handleBrush(arg1); |
598 | | - break; |
599 | | - case "Text": |
600 | | - this.handleText(); |
601 | | - break; |
602 | | - } |
603 | | - } |
604 | | - |
605 | 577 | toggleBrushList(event) { |
606 | 578 | var brushList = this.getBrushList(); |
607 | | - var brushButton = this.getBrush(); |
608 | 579 | if(getComputedStyle(brushList).display === 'none') { |
609 | 580 | brushList.style.display = 'block'; |
610 | 581 | } else { |
611 | 582 | brushList.style.display = 'none'; |
612 | 583 | } |
613 | 584 | } |
614 | 585 |
|
615 | | - imageClick(event) { |
616 | | - this.dialogCallback(event.srcElement.title); |
| 586 | + controlPanelClickHandler(event) { |
| 587 | + const ariaLabel = event.target.getAttribute('aria-label'); |
| 588 | + switch(ariaLabel){ |
| 589 | + case 'save': |
| 590 | + this.submitSign(); |
| 591 | + break; |
| 592 | + case 'close': |
| 593 | + this.closeEditModal(); |
| 594 | + break; |
| 595 | + case 'clearSign': |
| 596 | + this.eraseSignature(); |
| 597 | + break; |
| 598 | + case 'textSign': |
| 599 | + this.enableSignatureTextBox(); |
| 600 | + break; |
| 601 | + case 'geolocation': |
| 602 | + this.handleGeoLocation(); |
| 603 | + break; |
| 604 | + case 'brushes': |
| 605 | + this.handleBrush(event); |
| 606 | + this.toggleBrushList(); |
| 607 | + break; |
| 608 | + } |
617 | 609 | } |
618 | 610 |
|
619 | 611 | closeEditModal() { |
|
632 | 624 | this.initializeCanvas(); |
633 | 625 | } |
634 | 626 | initScribbleModal() { |
635 | | - const eraserIcon = this.getClearControl(); |
636 | | - const textSignIcon = this.getTextSignControl(); |
637 | 627 | const controlPanel = this.getScribbleControlPanel(); |
638 | 628 | const toggleBrushListIcon = this.getBrush(); |
639 | 629 | const brushList = this.getBrushList(); |
640 | | - const closeEditModal = this.getScribbleCloseButton(); |
641 | 630 | const keyboardSignBox = this.getKeyboardSignBox(); |
642 | | - const saveButton = this.getSaveControl(); |
643 | | - const geoLocationIcon = this.getGeoLocationIcon(); |
644 | 631 |
|
645 | 632 | this.renderBrushList(); |
646 | 633 |
|
647 | | - this.addEventListeners(controlPanel, 'click', this.imageClick.bind(this)); |
648 | | - this.addEventListeners(saveButton, 'click', this.submitSign.bind(this)); |
649 | | - this.addEventListeners(geoLocationIcon, 'click', this.handleGeoLocation.bind(this), true); |
650 | | - this.addEventListeners(eraserIcon, 'click', this.eraseSignature.bind(this), true); |
651 | | - this.addEventListeners(textSignIcon, 'click', this.enableSignatureTextBox.bind(this), true); |
652 | | - this.addEventListeners(toggleBrushListIcon, 'click', this.toggleBrushList.bind(this)); |
653 | | - this.addEventListeners(closeEditModal, 'mousedown', this.closeEditModal.bind(this)); |
| 634 | + this.addEventListeners(controlPanel, 'click', this.controlPanelClickHandler.bind(this)); |
654 | 635 |
|
655 | 636 | keyboardSignBox.addEventListener('input', (event) => { |
656 | 637 | if (event?.target?.value) { |
|
0 commit comments