Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Button widget annotations: implement reference testing

Browse Source 
Moreover, ensure that the read-only state is respected and improve CSS
names.
This commit is contained in:
Tim van der Meij 2016-12-15 22:15:38 +01:00
parent ba012c7a68
commit 0c9a06c020
6 changed files with 58 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/display/annotation_layer.js
View File

@ -563,9 +563,10 @@ var CheckboxWidgetAnnotationElement =
* @returns {HTMLSectionElement}
*/
render: function CheckboxWidgetAnnotationElement_render() {
this.container.className = 'checkboxWidgetAnnotation';
this.container.className = 'buttonWidgetAnnotation checkBox';
var element = document.createElement('input');
element.disabled = this.data.readOnly;
element.type = 'checkbox';
element.id = this.data.fieldName;
if (this.data.fieldValue && this.data.fieldValue !== 'Off') {
@ -604,10 +605,11 @@ var RadioButtonWidgetAnnotationElement =
* @returns {HTMLSectionElement}
*/
render: function RadioButtonWidgetAnnotationElement_render() {
this.container.className = 'radioButtonWidgetAnnotation';
this.container.className = 'buttonWidgetAnnotation radioButton';
var element = document.createElement('input');
var id = this.data.fieldName + '.' + this.data.buttonValue;
element.disabled = this.data.readOnly;
element.type = 'radio';
element.id = id;
element.name = this.data.fieldName;

23
test/annotation_layer_test.css
View File

@ -45,7 +45,9 @@
.annotationLayer .textWidgetAnnotation input,
.annotationLayer .textWidgetAnnotation textarea,
.annotationLayer .choiceWidgetAnnotation select {
.annotationLayer .choiceWidgetAnnotation select,
.annotationLayer .buttonWidgetAnnotation.checkBox label,
.annotationLayer .buttonWidgetAnnotation.radioButton label {
background-color: rgba(0, 54, 255, 0.13);
border: 1px solid transparent;
box-sizing: border-box;
@ -64,7 +66,9 @@
.annotationLayer .textWidgetAnnotation input[disabled],
.annotationLayer .textWidgetAnnotation textarea[disabled],
.annotationLayer .choiceWidgetAnnotation select[disabled] {
.annotationLayer .choiceWidgetAnnotation select[disabled],
.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled] + label,
.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] + label {
background: none;
border: 1px solid transparent;
}
@ -75,6 +79,21 @@
padding-right: 0;
}
.annotationLayer .buttonWidgetAnnotation.checkBox label,
.annotationLayer .buttonWidgetAnnotation.radioButton label {
position: absolute;
}
.annotationLayer .buttonWidgetAnnotation.checkBox input,
.annotationLayer .buttonWidgetAnnotation.radioButton input {
position: absolute;
left: -9999px;
}
.annotationLayer .buttonWidgetAnnotation.radioButton label {
border-radius: 50%;
}
.annotationLayer .popupAnnotation {
display: block !important;
}

1
test/pdfs/.gitignore vendored
View File

@ -266,5 +266,6 @@
!annotation-fileattachment.pdf
!annotation-text-widget.pdf
!annotation-choice-widget.pdf
!annotation-button-widget.pdf
!zero_descent.pdf
!operator-in-TJ-array.pdf

BIN
test/pdfs/annotation-button-widget.pdf Normal file
View File

Binary file not shown.

14
test/test_manifest.json
View File

@ -3312,6 +3312,20 @@
"type": "eq",
"forms": true
},
{ "id": "annotation-button-widget-annotations",
"file": "pdfs/annotation-button-widget.pdf",
"md5": "5cf23adfff84256d9cfe261bea96dade",
"rounds": 1,
"type": "eq",
"annotations": true
},
{ "id": "annotation-button-widget-forms",
"file": "pdfs/annotation-button-widget.pdf",
"md5": "5cf23adfff84256d9cfe261bea96dade",
"rounds": 1,
"type": "eq",
"forms": true
},
{ "id": "issue6108",
"file": "pdfs/issue6108.pdf",
"md5": "8961cb55149495989a80bf0487e0f076",

34
web/annotation_layer_builder.css
View File

@ -62,7 +62,9 @@
.annotationLayer .textWidgetAnnotation input[disabled],
.annotationLayer .textWidgetAnnotation textarea[disabled],
.annotationLayer .choiceWidgetAnnotation select[disabled] {
.annotationLayer .choiceWidgetAnnotation select[disabled],
.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled] + label,
.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] + label {
background: none;
border: 1px solid transparent;
cursor: not-allowed;
@ -97,8 +99,8 @@
width: 115%;
}
.annotationLayer .checkboxWidgetAnnotation label,
.annotationLayer .radioButtonWidgetAnnotation label {
.annotationLayer .buttonWidgetAnnotation.checkBox label,
.annotationLayer .buttonWidgetAnnotation.radioButton label {
background-color: rgba(0, 54, 255, 0.13);
border: 1px solid transparent;
box-sizing: border-box;
@ -108,34 +110,34 @@
width: 100%;
}
.annotationLayer .checkboxWidgetAnnotation input,
.annotationLayer .radioButtonWidgetAnnotation input {
.annotationLayer .buttonWidgetAnnotation.checkBox input,
.annotationLayer .buttonWidgetAnnotation.radioButton input {
position: absolute;
left: -9999px;
}
.annotationLayer .radioButtonWidgetAnnotation label {
.annotationLayer .buttonWidgetAnnotation.radioButton label {
border-radius: 50%;
}
.annotationLayer .checkboxWidgetAnnotation label:hover,
.annotationLayer .radioButtonWidgetAnnotation label:hover,
.annotationLayer .checkboxWidgetAnnotation label:focus,
.annotationLayer .radioButtonWidgetAnnotation label:focus,
.annotationLayer .checkboxWidgetAnnotation input:focus + label,
.annotationLayer .radioButtonWidgetAnnotation input:focus + label {
.annotationLayer .buttonWidgetAnnotation.checkBox label:hover,
.annotationLayer .buttonWidgetAnnotation.checkBox label:focus,
.annotationLayer .buttonWidgetAnnotation.checkBox input:focus + label,
.annotationLayer .buttonWidgetAnnotation.radioButton label:hover,
.annotationLayer .buttonWidgetAnnotation.radioButton label:focus,
.annotationLayer .buttonWidgetAnnotation.radioButton input:focus + label {
border: 1px solid #000;
}
.annotationLayer .checkboxWidgetAnnotation input:checked + label:before,
.annotationLayer .radioButtonWidgetAnnotation input:checked + label:before {
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked + label:before,
.annotationLayer .buttonWidgetAnnotation.radioButton input:checked + label:before {
content: '';
left: 50%;
top: 50%;
position: absolute;
}
.annotationLayer .checkboxWidgetAnnotation input:checked + label:before {
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked + label:before {
border-bottom: 1px solid #000;
border-left: 1px solid #000;
height: 25%;
@ -147,7 +149,7 @@
width: 60%;
}
.annotationLayer .radioButtonWidgetAnnotation input:checked + label:before {
.annotationLayer .buttonWidgetAnnotation.radioButton input:checked + label:before {
background-color: #000;
border-radius: 50%;
height: 50%;