Skip to content

Commit 3834323

Browse files
JuliaRadzhabovaJuliaRadzhabova
committed
[PDF] Add button field options
1 parent 43d7385 commit 3834323

File tree

3 files changed

+183
-19
lines changed

3 files changed

+183
-19
lines changed

‎apps/pdfeditor/main/app/template/FormSettings.template

+49-11
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,12 @@
2222
<div id="form-combo-btn-layout" style="width: 100%;"></div>
2323
</td>
2424
</tr>
25+
<tr>
26+
<td class="padding-small form-button">
27+
<label class="input-label"><%= scope.textBehavior %></label>
28+
<div id="form-combo-behavior" style="width: 100%;"></div>
29+
</td>
30+
</tr>
2531
</table>
2632
<table cols="2" role="presentation">
2733
<tr class="form-list-common">
@@ -132,34 +138,71 @@
132138
</tr>
133139
</table>
134140
<table cols="1" role="presentation">
135-
<tr class="form-image">
141+
<tr class="form-button">
136142
<td class="padding-small">
137143
<div class="separator horizontal"></div>
138144
</td>
139145
</tr>
140-
<tr class="form-image">
146+
<tr>
147+
<td class="padding-small form-button">
148+
<label class="input-label"><%= scope.textState %></label>
149+
<div id="form-combo-state" style="width: 100%;"></div>
150+
</td>
151+
</tr>
152+
<tr class="form-button-text">
153+
<td class="padding-small">
154+
<label class="input-label"><%= scope.textLabel %></label>
155+
<div id="form-txt-label"></div>
156+
</td>
157+
</tr>
158+
</table>
159+
<table cols="2" class="form-image" style="width: 100%;">
160+
<tr>
161+
<td style="vertical-align: top">
162+
<label class="input-label" style=""><%= scope.textIcon %></label>
163+
<div id="form-btn-replace" style="width: 90px;"></div>
164+
</td>
165+
<td rowspan="2">
166+
<div class="texture-img float-right" style="width: 90px; height: 80px;">
167+
<div id="form-icon-img" style="width: 50px;height: 50px;"></div>
168+
</div>
169+
</td>
170+
</tr>
171+
<tr>
172+
<td style="vertical-align: bottom">
173+
<div id="form-btn-clear" style="width: 90px;"></div>
174+
</td>
175+
</tr>
176+
</table>
177+
<table cols="1" class="form-image" role="presentation">
178+
<tr>
179+
<td class="padding-small">
180+
<div class="separator horizontal"></div>
181+
</td>
182+
</tr>
183+
<tr>
141184
<td>
142185
<label class="header padding-small"><%= scope.textPlacement %></label>
143186
</td>
144187
</tr>
145-
<tr class="form-image">
188+
<tr>
146189
<td class="padding-small">
147190
<label class="input-label"><%= scope.textScale %></label>
148191
<div id="form-combo-scale" style="width: 100%;"></div>
149192
</td>
150193
</tr>
151-
<tr class="form-image">
194+
<tr>
152195
<td class="padding-small">
153196
<label class="input-label"><%= scope.textHowScale %></label>
154197
<div id="form-combo-how-scale" style="width: 100%;"></div>
155198
</td>
156199
</tr>
157-
<tr class="form-image">
200+
<tr>
158201
<td class="padding-large">
159202
<div id="form-chb-fit"></div>
160203
</td>
161204
</tr>
162-
<tr class="form-image">
205+
<tr>
163206
<td class="padding-large">
164207
<div id="form-cnt-position" style="width: 100%;">
165208
<div class="row">
@@ -175,11 +218,6 @@
175218
</div>
176219
</td>
177220
</tr>
178-
<!-- <tr class="form-image">-->
179-
<!-- <td class="padding-large">-->
180-
<!-- <div id="form-button-replace" style="width:100%;"></div>-->
181-
<!-- </td>-->
182-
<!-- </tr>-->
183221
</table>
184222
<table cols="2" role="presentation">
185223
<tr>

‎apps/pdfeditor/main/app/view/FormSettings.js

+122-7
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,8 @@ define([
6868

6969
this._state = {
7070
DisabledControls: undefined,
71-
LockDelete: undefined
71+
LockDelete: undefined,
72+
ButtonCaption: {}
7273
};
7374
this.spinners = [];
7475
this.lockedControls = [];
@@ -94,6 +95,7 @@ define([
9495
this.CheckSettings = el.find('.form-checkbox');
9596
this.RadioOnlySettings = el.find('.form-radiobox');
9697
this.ButtonSettings = el.find('.form-button');
98+
this.ButtonTextOnlySettings = el.find('.form-button-text');
9799
this.ImageOnlySettings = el.find('.form-image');
98100
},
99101

@@ -474,6 +476,57 @@ define([
474476
this.cmbLayout.on('selected', this.onLayoutChanged.bind(this));
475477
this.lockedControls.push(this.cmbLayout);
476478

479+
this.cmbBehavior = new Common.UI.ComboBox({
480+
el: $markup.findById('#form-combo-behavior'),
481+
cls: 'input-group-nr',
482+
menuStyle: 'min-width: 100%;',
483+
editable: false,
484+
data: [{ displayValue: this.textNone, value: AscPDF.BUTTON_HIGHLIGHT_TYPES.none },
485+
{ displayValue: this.textPush, value: AscPDF.BUTTON_HIGHLIGHT_TYPES.push },
486+
{ displayValue: this.textOutline, value: AscPDF.BUTTON_HIGHLIGHT_TYPES.outline },
487+
{ displayValue: this.textInvert, value: AscPDF.BUTTON_HIGHLIGHT_TYPES.invert }],
488+
dataHint: '1',
489+
dataHintDirection: 'bottom',
490+
dataHintOffset: 'big'
491+
});
492+
this.cmbBehavior.setValue(AscPDF.BUTTON_HIGHLIGHT_TYPES.none);
493+
this.cmbBehavior.on('selected', this.onBehaviorChanged.bind(this));
494+
this.lockedControls.push(this.cmbBehavior);
495+
496+
this.cmbState = new Common.UI.ComboBox({
497+
el: $markup.findById('#form-combo-state'),
498+
cls: 'input-group-nr',
499+
menuStyle: 'min-width: 100%;',
500+
editable: false,
501+
data: [{ displayValue: this.textNormal, value: AscPDF.APPEARANCE_TYPES.normal },
502+
{ displayValue: this.textDown, value: AscPDF.APPEARANCE_TYPES.mouseDown },
503+
{ displayValue: this.textHover, value: AscPDF.APPEARANCE_TYPES.rollover }],
504+
dataHint: '1',
505+
dataHintDirection: 'bottom',
506+
dataHintOffset: 'big'
507+
});
508+
this.cmbState.setValue(AscPDF.APPEARANCE_TYPES.normal);
509+
this.cmbState.on('selected', this.onStateChanged.bind(this));
510+
this.lockedControls.push(this.cmbState);
511+
512+
this.txtLabel = new Common.UI.InputField({
513+
el : $markup.findById('#form-txt-label'),
514+
allowBlank : true,
515+
validateOnChange: false,
516+
validateOnBlur: false,
517+
style : 'width: 100%;',
518+
value : '',
519+
dataHint : '1',
520+
dataHintDirection: 'left',
521+
dataHintOffset: 'small'
522+
});
523+
this.lockedControls.push(this.txtLabel);
524+
this.txtLabel.on('changed:after', this.onLabelChanged.bind(this));
525+
this.txtLabel.on('inputleave', function(){ me.fireEvent('editcomplete', me);});
526+
this.txtLabel.cmpEl.on('focus', 'input.form-control', function() {
527+
setTimeout(function(){me.txtLabel._input && me.txtLabel._input.select();}, 1);
528+
});
529+
477530
this.chFit = new Common.UI.CheckBox({
478531
el: $markup.findById('#form-chb-fit'),
479532
labelText: this.textFitBounds,
@@ -819,6 +872,34 @@ define([
819872
}
820873
},
821874

875+
onBehaviorChanged: function(combo, record) {
876+
if (this.api && !this._noApply) {
877+
this._state.Behavior = undefined;
878+
this.api.SetButtonFieldBehavior(record.value);
879+
this.fireEvent('editcomplete', this);
880+
}
881+
},
882+
883+
onStateChanged: function(combo, record) {
884+
if (this.api && !this._noApply) {
885+
this._state.State = record.value;
886+
if (this._originalSpecProps) {
887+
this._originalSpecProps.asc_putCurrentState(record.value);
888+
this._state.ButtonLabel = this._state.ButtonCaption[record.value];
889+
this.txtLabel.setValue(this._state.ButtonLabel || '');
890+
}
891+
}
892+
},
893+
894+
onLabelChanged: function(input, newValue, oldValue, e) {
895+
this._state.ButtonLabel = undefined;
896+
if (this.api && !this._noApply && (newValue!==oldValue)) {
897+
this.api.SetButtonFieldLabel(newValue, this._state.State);
898+
if (!e.relatedTarget || (e.relatedTarget.localName != 'input' && e.relatedTarget.localName != 'textarea') || !/form-control/.test(e.relatedTarget.className))
899+
this.fireEvent('editcomplete', this);
900+
}
901+
},
902+
822903
onChFit: function(field, newValue, oldValue, eOpts){
823904
if (this.api && !this._noApply) {
824905
this.api.SetButtonFieldFitBounds(field.getValue()==='checked');
@@ -1087,13 +1168,43 @@ define([
10871168
// this.labelFormName.text(props.is_Signature() ? this.textSignature : this.textImage);
10881169
this.labelFormName.text(this.textButton);
10891170
if (specProps) {
1090-
val = specProps.asc_getLayout();
1091-
if (this._state.Layout!==val) {
1092-
this.cmbLayout.setValue(val, '');
1093-
this._state.Layout=val;
1171+
var layout = specProps.asc_getLayout();
1172+
if (this._state.Layout!==layout) {
1173+
this.cmbLayout.setValue(layout, '');
1174+
this._state.Layout=layout;
1175+
}
1176+
1177+
val = specProps.asc_getBehavior();
1178+
if (this._state.Behavior!==val) {
1179+
this.cmbBehavior.setValue(val, '');
1180+
this._state.Behavior=val;
1181+
this.cmbState.setDisabled(val!==AscPDF.BUTTON_HIGHLIGHT_TYPES.push || this._state.DisabledControls);
1182+
}
1183+
if (this._state.Behavior===AscPDF.BUTTON_HIGHLIGHT_TYPES.push) {
1184+
val = specProps.asc_getCurrentState();
1185+
if (this._state.State!==val) {
1186+
this.cmbState.setValue(val, '');
1187+
this._state.State=val;
1188+
}
1189+
this._state.ButtonCaption = {};
1190+
this._state.ButtonCaption[AscPDF.APPEARANCE_TYPES.normal] = specProps.asc_getNormalCaption();
1191+
this._state.ButtonCaption[AscPDF.APPEARANCE_TYPES.mouseDown] = specProps.asc_getDownCaption();
1192+
this._state.ButtonCaption[AscPDF.APPEARANCE_TYPES.rollover] = specProps.asc_getHoverCaption();
1193+
} else {
1194+
this._state.State = AscPDF.APPEARANCE_TYPES.normal;
1195+
this.cmbState.setValue(this._state.State);
1196+
this._state.ButtonCaption = {};
1197+
this._state.ButtonCaption[this._state.State] = specProps.asc_getNormalCaption();
1198+
}
1199+
1200+
if (layout!==AscPDF.Api.Types.position.iconOnly) {
1201+
if (this._state.ButtonLabel !== this._state.ButtonCaption[this._state.State]) {
1202+
this._state.ButtonLabel = this._state.ButtonCaption[this._state.State];
1203+
this.txtLabel.setValue(this._state.ButtonLabel || '');
1204+
}
10941205
}
10951206

1096-
if (val!==AscPDF.Api.Types.position.textOnly) {
1207+
if (layout!==AscPDF.Api.Types.position.textOnly) {
10971208
val = specProps.asc_getScaleWhen();
10981209
if (this._state.Scale!==val) {
10991210
this.cmbScale.setValue(val, '');
@@ -1276,6 +1387,8 @@ define([
12761387
this.chMaxChars.setDisabled(isComb || this._state.DisabledControls);
12771388
this.spnMaxChars.setDisabled(isComb || this.chMaxChars.getValue()!=='checked' || this._state.DisabledControls);
12781389
this.cmbHowScale.setDisabled(this._state.Scale === AscPDF.Api.Types.scaleWhen.never || this._state.DisabledControls);
1390+
this.cmbState.setDisabled(this._state.Behavior!==AscPDF.BUTTON_HIGHLIGHT_TYPES.push || this._state.DisabledControls);
1391+
12791392
},
12801393

12811394
showHideControls: function(type, specProps) {
@@ -1285,7 +1398,8 @@ define([
12851398
isCheck = type === AscPDF.FIELD_TYPES.checkbox,
12861399
isRadio = type === AscPDF.FIELD_TYPES.radiobutton,
12871400
isButton = type === AscPDF.FIELD_TYPES.button,
1288-
isImage = isButton && (specProps.asc_getLayout()!==AscPDF.Api.Types.position.textOnly);
1401+
isImage = isButton && (specProps.asc_getLayout()!==AscPDF.Api.Types.position.textOnly),
1402+
isButtonText = isButton && (specProps.asc_getLayout()!==AscPDF.Api.Types.position.iconOnly);
12891403
this.PlaceholderSettings.toggleClass('hidden', !(isCombobox || isText));
12901404
this.AutofitSettings.toggleClass('hidden', !(isCombobox || isText));
12911405
this.ListSettings.toggleClass('hidden', !(isCombobox || isListbox));
@@ -1296,6 +1410,7 @@ define([
12961410
this.RadioOnlySettings.toggleClass('hidden', !isRadio);
12971411
this.ButtonSettings.toggleClass('hidden', !isButton);
12981412
this.ImageOnlySettings.toggleClass('hidden', !isImage);
1413+
this.ButtonTextOnlySettings.toggleClass('hidden', !isButtonText);
12991414
}
13001415

13011416
}, PDFE.Views.FormSettings || {}));

‎apps/pdfeditor/main/locale/en.json

+12-1
Original file line numberDiff line numberDiff line change
@@ -1426,7 +1426,7 @@
14261426
"PDFE.Views.FormSettings.textLayout": "Layout",
14271427
"PDFE.Views.FormSettings.textScale": "When to scale",
14281428
"PDFE.Views.FormSettings.textHowScale": "Scale",
1429-
"PDFE.Views.FormSettings.textSelectImage": "Select Image",
1429+
"PDFE.Views.FormSettings.textSelect": "Select",
14301430
"PDFE.Views.FormSettings.textTextOnly": "Label only",
14311431
"PDFE.Views.FormSettings.textIconOnly": "Icon only",
14321432
"PDFE.Views.FormSettings.textIconTop": "Icon top, label bottom",
@@ -1442,6 +1442,17 @@
14421442
"PDFE.Views.FormSettings.textNever": "Never",
14431443
"PDFE.Views.FormSettings.textTooBig": "Image is too big",
14441444
"PDFE.Views.FormSettings.textTooSmall": "Image is too small",
1445+
"PDFE.Views.FormSettings.textIcon": "Icon",
1446+
"PDFE.Views.FormSettings.textLabel": "Label",
1447+
"PDFE.Views.FormSettings.textState": "State",
1448+
"PDFE.Views.FormSettings.textNone": "None",
1449+
"PDFE.Views.FormSettings.textPush": "Push",
1450+
"PDFE.Views.FormSettings.textOutline": "Outline",
1451+
"PDFE.Views.FormSettings.textInvert": "Invert",
1452+
"PDFE.Views.FormSettings.textBehavior": "Behavior",
1453+
"PDFE.Views.FormSettings.textNormal": "Up",
1454+
"PDFE.Views.FormSettings.textDown": "Down",
1455+
"PDFE.Views.FormSettings.textHover": "Rollover",
14451456
"PDFE.Views.FormsTab.capBtnCheckBox": "Checkbox",
14461457
"PDFE.Views.FormsTab.capBtnComboBox": "Combo Box",
14471458
"PDFE.Views.FormsTab.capBtnDownloadForm": "Download As PDF",

0 commit comments

Comments
 (0)