Skip to content

Commit 2ece48e

Browse files
scribble component clean up
1 parent abc7e62 commit 2ece48e

File tree

2 files changed

+31
-50
lines changed

2 files changed

+31
-50
lines changed

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/scribble/v1/scribble/clientlibs/site/js/scribbleview.js

Lines changed: 25 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,6 @@
1717

1818
(function() {
1919
"use strict";
20-
21-
2220
const PNGGeneratorUtil = (() => {
2321
// Helper function to initialize CRC table
2422
const initCrcTable = () => {
@@ -113,8 +111,6 @@
113111
};
114112
})();
115113

116-
117-
118114
/**
119115
* class definition for GeoLocationQueryRequest
120116
* encapsulated success and error handlers
@@ -133,7 +129,6 @@
133129
scribbleContainer: `.${Scribble.bemBlock}__container`,
134130
scribbleContainerPanel: `.${Scribble.bemBlock}__panel`,
135131
keyboardSignBox: `.${Scribble.bemBlock}__keyboard-sign-box`,
136-
scribbleContainerCaption: `.${Scribble.bemBlock}__caption`,
137132
scribbleControlPanel: `.${Scribble.bemBlock}__controlpanel`,
138133
geoCanvasRight: `.${Scribble.bemBlock}__geocanvasright`,
139134
canvasSignedContainer: `.${Scribble.bemBlock}__canvas-signed-container`,
@@ -242,10 +237,6 @@
242237
return document.querySelector(Scribble.selectors.scribbleContainerPanel);
243238
}
244239

245-
getScribbleContainerCaption() {
246-
return document.querySelector(Scribble.selectors.scribbleContainerCaption);
247-
}
248-
249240
getKeyboardSignBox() {
250241
return document.querySelector(Scribble.selectors.keyboardSignBox);
251242
}
@@ -479,6 +470,7 @@
479470
e.stopPropagation();
480471
this.context.lineWidth=brush;
481472
this.toggleBrushList();
473+
// this.handleBrush(e);
482474
})
483475
this.getBrushList().append(divel);
484476
});
@@ -582,38 +574,38 @@
582574
});
583575
}
584576

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-
605577
toggleBrushList(event) {
606578
var brushList = this.getBrushList();
607-
var brushButton = this.getBrush();
608579
if(getComputedStyle(brushList).display === 'none') {
609580
brushList.style.display = 'block';
610581
} else {
611582
brushList.style.display = 'none';
612583
}
613584
}
614585

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+
}
617609
}
618610

619611
closeEditModal() {
@@ -632,25 +624,14 @@
632624
this.initializeCanvas();
633625
}
634626
initScribbleModal() {
635-
const eraserIcon = this.getClearControl();
636-
const textSignIcon = this.getTextSignControl();
637627
const controlPanel = this.getScribbleControlPanel();
638628
const toggleBrushListIcon = this.getBrush();
639629
const brushList = this.getBrushList();
640-
const closeEditModal = this.getScribbleCloseButton();
641630
const keyboardSignBox = this.getKeyboardSignBox();
642-
const saveButton = this.getSaveControl();
643-
const geoLocationIcon = this.getGeoLocationIcon();
644631

645632
this.renderBrushList();
646633

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));
654635

655636
keyboardSignBox.addEventListener('input', (event) => {
656637
if (event?.target?.value) {

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/scribble/v1/scribble/scribble.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -64,16 +64,16 @@
6464
</div>
6565
<div class="cmp-adaptiveform-scribble__controlpanel">
6666
<div class="cmp-adaptiveform-scribble__controls">
67-
<button type="button" class="cmp-adaptiveform-scribble__control-brush cmp-adaptiveform-scribble__button" tabindex="0" aria-label="brushes" title="brushes"></button>
67+
<button type="button" class="cmp-adaptiveform-scribble__control-brush cmp-adaptiveform-scribble__button" tabindex="0" aria-label="brushes"></button>
6868
<div class="cmp-adaptiveform-scribble__brushlist"></div>
69-
<button type="button" class="cmp-adaptiveform-scribble__control-clear cmp-adaptiveform-scribble__button" tabindex="0" aria-label="clear" title="clear" ></button>
70-
<button type="button" class="cmp-adaptiveform-scribble__control-geo cmp-adaptiveform-scribble__button" tabindex="0" aria-label="geolocation" title="geolocation" ></button>
71-
<button type="button" class="cmp-adaptiveform-scribble__control-text cmp-adaptiveform-scribble__button" tabindex="0" aria-label="typeYourName" title="typeYourName"></button>
69+
<button type="button" class="cmp-adaptiveform-scribble__control-clear cmp-adaptiveform-scribble__button" tabindex="0" aria-label="clearSign" ></button>
70+
<button type="button" class="cmp-adaptiveform-scribble__control-geo cmp-adaptiveform-scribble__button" tabindex="0" aria-label="geolocation" ></button>
71+
<button type="button" class="cmp-adaptiveform-scribble__control-text cmp-adaptiveform-scribble__button" tabindex="0" aria-label="textSign"></button>
7272
<div class="cmp-adaptiveform-scribble__control-message"></div>
7373
</div>
7474
<div class="cmp-adaptiveform-scribble__controlpanel__controls">
75-
<button class="cmp-adaptiveform-scribble__button-close" tabindex="0" type="button" aria-label="Close">Close</button>
76-
<button class="cmp-adaptiveform-scribble__control-submit" tabindex="0" type="button" aria-label="Save">Save</button>
75+
<button class="cmp-adaptiveform-scribble__button-close" tabindex="0" type="button" aria-label="close">Close</button>
76+
<button class="cmp-adaptiveform-scribble__control-submit" tabindex="0" type="button" aria-label="save">Save</button>
7777
</div>
7878
</div>
7979
</div>

0 commit comments

Comments
 (0)