1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
|
<?php ! defined( 'ABSPATH' ) && exit(); ?><!-- GENERIC FIELD --> <script type="text/ng-template" id="field-component-template"> <div class="totalpoll-containable-list-item" ng-class="{'active': !$ctrl.isCollapsed()}"> <div class="totalpoll-containable-list-item-toolbar"> <div class="totalpoll-containable-list-item-toolbar-collapse" ng-click="$ctrl.toggleCollapsed()"> <span class="totalpoll-containable-list-item-toolbar-collapse-text">{{ $ctrl.index + 1 }}</span> <span class="dashicons dashicons-arrow-up" ng-if="!$ctrl.isCollapsed()"></span> <span class="dashicons dashicons-arrow-down" ng-if="$ctrl.isCollapsed()"></span> </div> <?php /** * Fires before field preview toolbar. * * @since 4.0.0 */ do_action( 'totalpoll/actions/before/admin/editor/fields/toolbar/preview', $this ); ?> <div class="totalpoll-containable-list-item-toolbar-preview" dnd-handle ng-click="$ctrl.toggleCollapsed()"> <span class="totalpoll-containable-list-item-toolbar-preview-text"> {{ $ctrl.item.label || '<?php echo esc_js( __( 'Untitled', 'totalpoll' ) ); ?>' }} <?php /** * Fires after field preview toolbar text. * * @since 4.0.0 */ do_action( 'totalpoll/actions/editor/fields/toolbar/preview/text', $this ); ?> </span> <span class="totalpoll-containable-list-item-toolbar-preview-type"> <span ng-if="$ctrl.item.type === 'text'"><?php _e( 'Text', 'totalpoll' ); ?></span> <span ng-if="$ctrl.item.type === 'textarea'"><?php _e( 'Textarea', 'totalpoll' ); ?></span> <span ng-if="$ctrl.item.type === 'select'"><?php _e( 'Select', 'totalpoll' ); ?></span> <span ng-if="$ctrl.item.type === 'checkbox'"><?php _e( 'Checkbox', 'totalpoll' ); ?></span> <span ng-if="$ctrl.item.type === 'radio'"><?php _e( 'Radio', 'totalpoll' ); ?></span> <span ng-if="$ctrl.item.validations.filled.enabled"><?php _e( 'Required', 'totalpoll' ); ?></span> <?php /** * Fires after field preview toolbar type. * * @since 4.0.0 */ do_action( 'totalpoll/actions/editor/fields/toolbar/preview/type', $this ); ?> </span> </div> <?php /** * Fires after field preview toolbar. * * @since 4.0.0 */ do_action( 'totalpoll/actions/after/admin/editor/fields/toolbar/preview', $this ); ?>
<?php /** * Fires before field delete button. * * @since 4.0.0 */ do_action( 'totalpoll/actions/before/admin/editor/fields/toolbar/delete', $this ); ?> <div class="totalpoll-containable-list-item-toolbar-delete"> <button class="button button-danger button-small" type="button" ng-click="$ctrl.onDelete()"> <?php _e( 'Delete', 'totalpoll' ); ?> </button> </div> <?php /** * Fires after field delete button. * * @since 4.0.0 */ do_action( 'totalpoll/actions/after/admin/editor/fields/toolbar/delete', $this ); ?> </div> <div class="totalpoll-containable-list-item-editor" ng-hide="$ctrl.isCollapsed()"> <div class="totalpoll-tabs-container"> <div class="totalpoll-tabs"> <?php /** * Fires before field tabs content. * * @since 4.0.0 */ do_action( 'totalpoll/actions/before/admin/editor/fields/tabs', $this ); ?> <div class="totalpoll-tabs-item active" tab-switch="editor>form>{{$ctrl.prefix('basic','>')}}"> <?php _e( 'Basic', 'totalpoll' ); ?> </div> <div class="totalpoll-tabs-item" tab-switch="editor>form>{{$ctrl.prefix('validations','>')}}"> <?php _e( 'Validations', 'totalpoll' ); ?> </div> <div class="totalpoll-tabs-item" tab-switch="editor>form>{{$ctrl.prefix('html','>')}}"> <?php _e( 'HTML', 'totalpoll' ); ?> </div> <?php /** * Fires after field tabs content. * * @since 4.0.0 */ do_action( 'totalpoll/actions/after/admin/editor/fields/tabs', $this ); ?> </div> <div class="totalpoll-tabs-content" ng-include="'field-type-' + $ctrl.item.type + '-template'">
</div> </div> </div> </div> </script> <!-- BASIC: LABEL --> <script type="text/ng-template" id="field-basic-label-template"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="{{$ctrl.prefix('-label')}}"> <?php _e( 'Label', 'totalpoll' ); ?> </label> <input id="{{$ctrl.prefix('-label')}}" class="widefat" type="text" placeholder="<?php _e( 'Field label', 'totalpoll' ); ?>" ng-model="$ctrl.item.label" ng-blur="$ctrl.generateName()"> </div> </script> <!-- BASIC: NAME --> <script type="text/ng-template" id="field-basic-name-template"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="{{$ctrl.prefix('-name')}}"> <?php _e( 'Name', 'totalpoll' ); ?> </label> <input id="{{$ctrl.prefix('-name')}}" class="widefat" type="text" placeholder="<?php _e( 'Field name', 'totalpoll' ); ?>" ng-model="$ctrl.item.name"> </div> </script> <!-- BASIC: DEFAULT VALUE --> <script type="text/ng-template" id="field-basic-default-value-template"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="{{$ctrl.prefix('-default-value')}}"> <?php _e( 'Default value', 'totalpoll' ); ?> </label> <input id="{{$ctrl.prefix('-default-value')}}" class="widefat" type="text" placeholder="<?php _e( 'Field default value', 'totalpoll' ); ?>" ng-if="$ctrl.item.type === 'text' || $ctrl.item.type === 'radio'" ng-model="$ctrl.item.defaultValue"> <textarea id="{{$ctrl.prefix('-default-value')}}" class="widefat" placeholder="<?php _e( 'Field default value', 'totalpoll' ); ?>" ng-if="$ctrl.item.type === 'textarea' || $ctrl.item.type === 'select' || $ctrl.item.type === 'checkbox'" ng-model="$ctrl.item.defaultValue"></textarea> <p class="totalpoll-feature-tip" ng-if="$ctrl.item.type === 'select' || $ctrl.item.type === 'checkbox'"> <?php _e( 'Default value per line.', 'totalpoll' ); ?> </p> </div> </script> <!-- BASIC: OPTIONS --> <script type="text/ng-template" id="field-basic-options-template"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="field-{{field.uid}}-options"> <?php _e( 'Options', 'totalpoll' ); ?> </label> <textarea id="field-{{field.uid}}-options" class="widefat" type="text" placeholder="<?php _e( 'option_key:Option label', 'totalpoll' ); ?>" ng-model="$ctrl.item.options" rows="6"></textarea> <p class="totalpoll-feature-tip"> <?php _e( 'Option per line.', 'totalpoll' ); ?> </p> <p class="totalpoll-feature-tip"> <?php _e( 'Option format is "option : label"', 'totalpoll' ); ?> </p> </div> </script> <!-- BASIC: MULTIPLE SELECTION --> <script type="text/ng-template" id="field-basic-multiple-values-template"> <div class="totalpoll-settings-item"> <div class="totalpoll-settings-field"> <label> <input type="checkbox" name="" ng-model="$ctrl.item.attributes.multiple"> <?php _e( 'Allow multiple values', 'totalpoll' ); ?> </label> </div> </div> </script> <!-- VALIDATION: FILLED --> <script type="text/ng-template" id="field-validations-filled-template"> <div class="totalpoll-settings-field"> <label> <input type="checkbox" name="" ng-checked="$ctrl.item.validations.filled.enabled" ng-model="$ctrl.item.validations.filled.enabled"> <?php _e( 'Filled (required)', 'totalpoll' ); ?> </label> </div> </script> <!-- VALIDATION: EMAIL --> <script type="text/ng-template" id="field-validations-email-template"> <div class="totalpoll-settings-field"> <label> <input type="checkbox" name="" ng-checked="$ctrl.item.validations.email.enabled" ng-model="$ctrl.item.validations.email.enabled"> <?php _e( 'Email', 'totalpoll' ); ?> </label> </div> </script> <!-- VALIDATION: UNIQUE --> <script type="text/ng-template" id="field-validations-unique-template"> <div class="totalpoll-settings-field"> <label> <input type="checkbox" name="" ng-checked="$ctrl.item.validations.unique.enabled" ng-model="$ctrl.item.validations.unique.enabled"> <?php _e( 'Unique', 'totalpoll' ); ?> <span class="totalpoll-feature-details" tooltip="<?php _e( 'This field value must be unique in entries table.', 'totalpoll' ); ?>">?</span> </label> </div> </script> <!-- VALIDATION: FILTER --> <script type="text/ng-template" id="field-validations-filter-template"> <div class="totalpoll-settings-field"> <label> <input type="checkbox" name="" ng-checked="$ctrl.item.validations.filter.enabled" ng-model="$ctrl.item.validations.filter.enabled"> <?php _e( 'Filter by list', 'totalpoll' ); ?> </label> </div> <div class="totalpoll-settings-item-advanced" ng-class="{active: $ctrl.item.validations.filter.enabled}"> <table class="wp-list-table widefat striped" ng-controller="RepeaterCtrl as $repeater" ng-init="$repeater.items = $ctrl.item.validations.filter.rules = ($ctrl.item.validations.filter.rules || [])"> <thead> <tr> <th class="totalpoll-width-15"> <?php _e( 'Type', 'totalpoll' ); ?> </th> <th class="widefat"> <?php _e( 'Value', 'totalpoll' ); ?> </th> <th></th> </tr> </thead> <tbody> <tr ng-repeat="item in $repeater.items track by $index"> <td> <select class="totalpoll-settings-field-input widefat" ng-model="item.type"> <option value="allow"> <?php _e( 'Allow', 'totalpoll' ); ?> </option> <option value="deny"> <?php _e( 'Deny', 'totalpoll' ); ?> </option> </select> </td> <td> <input type="text" class="totalpoll-settings-field-input widefat" ng-model="item.value" placeholder="<?php _e( '* means wildcard.', 'totalpoll' ); ?>"> </td> <td> <div class="button-group"> <button type="button" class="button button-icon" ng-click="$repeater.moveUp($index)" ng-disabled="$index === 0"> <span class="dashicons dashicons-arrow-up-alt2"></span> </button> <button type="button" class="button button-icon" ng-click="$repeater.moveDown($index)" ng-disabled="$index === $repeater.items.length - 1"> <span class="dashicons dashicons-arrow-down-alt2"></span> </button> <button type="button" class="button button-danger" ng-click="$repeater.deleteItem($index)"> <?php _e( 'Delete', 'totalpoll' ); ?> </button> </div> </td> </tr> </tbody> <tfoot> <tr> <td colspan="3"> <div class="textright"> <button type="button" class="button button-primary" ng-click="$repeater.addItem({type: 'allow'})"> <?php _e( 'Add new value', 'totalpoll' ); ?> </button> </div> </td> </tr> </tfoot> </table> </div> </script> <!-- VALIDATION: REGEX --> <script type="text/ng-template" id="field-validations-regex-template"> <div class="totalpoll-settings-field"> <label> <input type="checkbox" name="" ng-checked="$ctrl.item.validations.regex.enabled" ng-model="$ctrl.item.validations.regex.enabled"> <?php _e( 'Regular Expression', 'totalpoll' ); ?> </label> </div> <div class="totalpoll-settings-item-advanced" ng-class="{active: $ctrl.item.validations.regex.enabled}"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="field-{{$ctrl.item.uid}}-validations-regex-against"> <?php _e( 'Expression', 'totalpoll' ); ?> <span class="totalpoll-feature-details" tooltip="<?php _e( 'Run user input against a regular expression.', 'totalpoll' ); ?>">?</span> </label> <input id="field-{{$ctrl.item.uid}}-validations-regex-pattern" type="text" class="totalpoll-settings-field-input widefat" ng-model="$ctrl.item.validations.regex.pattern"> <p class="totalpoll-feature-tip"> <?php _e( 'Must be a valid regular expression.', 'totalpoll' ); ?> </p> </div> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="field-{{$ctrl.item.uid}}-validations-regex-error-message"> <?php _e( 'Error message', 'totalpoll' ); ?> <span class="totalpoll-feature-details" tooltip="<?php _e( 'This message will be shown if the validation failed.', 'totalpoll' ); ?>">?</span> </label> <input id="field-{{$ctrl.item.uid}}-validations-regex-error-message" type="text" ng-model="$ctrl.item.validations.regex.errorMessage" class="totalpoll-settings-field-input widefat"> <p class="totalpoll-feature-tip" ng-non-bindable> <?php _e( '{{label}} for a field label.', 'totalpoll' ); ?> </p> </div> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label"> <?php _e( 'Comparison', 'totalpoll' ); ?> </label> <label> <input type="radio" name="" ng-model="$ctrl.item.validations.regex.type" ng-checked="$ctrl.item.validations.regex.type == 'match'" value="match"> <?php _e( 'Must match', 'totalpoll' ); ?> </label> <label> <input type="radio" name="" ng-model="$ctrl.item.validations.regex.type" ng-checked="$ctrl.item.validations.regex.type == 'notmatch'" value="notmatch"> <?php _e( 'Must not match', 'totalpoll' ); ?> </label> </div> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label"> <?php _e( 'Modifiers', 'totalpoll' ); ?> </label> <label> <input type="checkbox" name="" ng-model="$ctrl.item.validations.regex.modifiers['i']" value="i"> <?php _e( 'Case Insensitive', 'totalpoll' ); ?> </label> <label> <input type="checkbox" name="" ng-model="$ctrl.item.validations.regex.modifiers['m']" value="m"> <?php _e( 'Multiline', 'totalpoll' ); ?> </label> <label> <input type="checkbox" name="" ng-model="$ctrl.item.validations.regex.modifiers['u']" value="u"> <?php _e( 'Unicode Support', 'totalpoll' ); ?> </label> </div> </div> </script> <!-- HTML: FIELD CLASS --> <script type="text/ng-template" id="field-html-css-class-template"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="{{$ctrl.prefix('-class')}}"> <?php _e( 'Field CSS classes', 'totalpoll' ); ?> </label> <input id="{{$ctrl.prefix('-class')}}" class="widefat" type="text" placeholder="<?php _e( 'Field classes', 'totalpoll' ); ?>" ng-model="$ctrl.item.attributes.class"> </div> </script> <!-- HTML: FIELD TEMPLATE --> <script type="text/ng-template" id="field-html-template-template"> <div class="totalpoll-settings-field"> <label class="totalpoll-settings-field-label" for="{{$ctrl.prefix('-template')}}"> <?php _e( 'Template', 'totalpoll' ); ?> </label> <input id="{{$ctrl.prefix('-template')}}" class="widefat" type="text" placeholder="<?php _e( 'Field template', 'totalpoll' ); ?>" ng-model="$ctrl.item.template"> <p></p> <div class="button-group"> <button type="button" class="button button-small" ng-click="$ctrl.item.template = '<?php echo esc_attr( '<div class="totalpoll-form-field totalpoll-column-full">{{label}}{{field}}<div class="totalpoll-form-field-errors">{{errors}}</div></div>' ); ?>'"> <?php _e( 'full column', 'totalpoll' ); ?> </button> <button type="button" class="button button-small" ng-click="$ctrl.item.template = '<?php echo esc_attr( '<div class="totalpoll-form-field totalpoll-column-half">{{label}}{{field}}<div class="totalpoll-form-field-errors">{{errors}}</div></div>' ); ?>'"> <?php _e( '1/2 column', 'totalpoll' ); ?> </button> <button type="button" class="button button-small" ng-click="$ctrl.item.template = '<?php echo esc_attr( '<div class="totalpoll-form-field totalpoll-column-third">{{label}}{{field}}<div class="totalpoll-form-field-errors">{{errors}}</div></div>' ); ?>'"> <?php _e( '1/3 column', 'totalpoll' ); ?> </button> </div> <p class="totalpoll-feature-tip" ng-non-bindable> <?php _e( '{{label}} for field label.', 'totalpoll' ); ?> </p> <p class="totalpoll-feature-tip" ng-non-bindable> <?php _e( '{{errors}} for field errors.', 'totalpoll' ); ?> </p> <p class="totalpoll-feature-tip" ng-non-bindable> <?php _e( '{{field}} for field input.', 'totalpoll' ); ?> </p> </div> </script>
|