PluginProbe
weForms – Easy Drag & Drop Contact Form Builder For WordPress / 1.1.0
weForms – Easy Drag & Drop Contact Form Builder For WordPress v1.1.0
1.6.7 1.6.8 1.6.9 1.6.12 1.6.13 1.6.14 1.6.15 1.6.16 1.6.17 1.6.18 1.6.19 1.6.2 1.6.20 1.6.21 1.6.22 1.6.23 1.6.24 1.6.25 1.6.26 1.6.27 1.6.28 1.6.3 1.6.4 1.6.5 1.6.6 All 74 releases
weforms / assets / js / form-builder-components.js

form-builder-components.js in weForms – Easy Drag & Drop Contact Form Builder For WordPress 1.1.0, at assets/js/form-builder-components.js

301 lines 7.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* assets/js/utils/jquery-siaf-start.js */
2 ;(function($) {
3 'use strict';
4
5 /* ./assets/components/field-name/index.js */
6 Vue.component('field-name', {
7 template: '#tmpl-wpuf-field-name',
8
9 mixins: [
10 wpuf_mixins.option_field_mixin
11 ],
12
13 computed: {
14 value: {
15 get: function () {
16 return this.editing_form_field[this.option_field.name];
17 },
18
19 set: function (value) {
20 this.update_value(this.option_field.name, value);
21 }
22 }
23 },
24
25 methods: {
26 on_focusout: function (e) {
27 wpuf_form_builder.event_hub.$emit('field-text-focusout', e, this);
28 },
29 on_keyup: function (e) {
30 wpuf_form_builder.event_hub.$emit('field-text-keyup', e, this);
31 }
32 }
33 });
34
35 /* ./assets/components/form-name_field/index.js */
36 /**
37 * Field template: First Name
38 */
39 Vue.component('form-name_field', {
40 template: '#tmpl-wpuf-form-name_field',
41
42 mixins: [
43 wpuf_mixins.form_field_mixin
44 ]
45 });
46
47 /* ./assets/components/integration/index.js */
48 Vue.component('wpuf-integration', {
49 template: '#tmpl-wpuf-integration',
50
51 computed: {
52
53 integrations: function() {
54 return wpuf_form_builder.integrations;
55 },
56
57 hasIntegrations: function() {
58 return Object.keys(this.integrations).length;
59 },
60
61 store: function() {
62 return this.$store.state.integrations;
63 },
64
65 pro_link: function() {
66 return wpuf_form_builder.pro_link;
67 }
68 },
69
70 methods: {
71
72 getIntegration: function(id) {
73 return this.integrations[id];
74 },
75
76 getIntegrationSettings: function(id) {
77 // find settings in store, otherwise take from default integration settings
78 return this.store[id] || this.getIntegration(id).settings;
79 },
80
81 isActive: function(id) {
82 if ( !this.isAvailable(id) ) {
83 return false;
84 }
85
86 return this.getIntegrationSettings(id).enabled === true;
87 },
88
89 isAvailable: function(id) {
90 return ( this.integrations[id] && this.integrations[id].pro ) ? false : true;
91 },
92
93 toggleState: function(id, target) {
94 if ( ! this.isAvailable(id) ) {
95 this.alert_pro_feature( id );
96 return;
97 }
98
99 // toggle the enabled state
100 var settings = this.getIntegrationSettings(id);
101
102 settings.enabled = !this.isActive(id);
103
104 this.$store.commit('updateIntegration', {
105 index: id,
106 value: settings
107 });
108
109 $(target).toggleClass('checked');
110 },
111
112 alert_pro_feature: function (id) {
113 var title = this.getIntegration(id).title;
114
115 swal({
116 title: '<i class="fa fa-lock"></i> ' + title + ' <br>' + this.i18n.is_a_pro_feature,
117 text: this.i18n.pro_feature_msg,
118 type: '',
119 showCancelButton: true,
120 cancelButtonText: this.i18n.close,
121 confirmButtonColor: '#46b450',
122 confirmButtonText: this.i18n.upgrade_to_pro
123 }).then(function (is_confirm) {
124 if (is_confirm) {
125 window.open(wpuf_form_builder.pro_link, '_blank');
126 }
127
128 }, function() {});
129 },
130
131 showHide: function(target) {
132 $(target).closest('.wpuf-integration').toggleClass('collapsed');
133 },
134 }
135 });
136
137 /* ./assets/components/integration-erp/index.js */
138 Vue.component('wpuf-integration-erp', {
139 template: '#tmpl-wpuf-integration-erp',
140 mixins: [wpuf_mixins.integration_mixin],
141
142 methods: {
143 insertValue: function(type, field, property) {
144 var value = ( field !== undefined ) ? '{' + type + ':' + field + '}' : '{' + type + '}';
145
146 this.settings.fields[property] = value;
147 }
148 }
149 });
150 /* ./assets/components/integration-slack/index.js */
151 Vue.component('wpuf-integration-slack', {
152 template: '#tmpl-wpuf-integration-slack',
153 mixins: [wpuf_mixins.integration_mixin]
154 });
155 /* ./assets/components/merge-tags/index.js */
156 Vue.component('wpuf-merge-tags', {
157 template: '#tmpl-wpuf-merge-tags',
158 props: {
159 field: String,
160 filter: {
161 type: String,
162 default: null
163 }
164 },
165
166 data: function() {
167 return {
168 type: null,
169 };
170 },
171
172 mounted: function() {
173
174 // hide if clicked outside
175 $('body').on('click', function(event) {
176 if ( !$(event.target).closest('.wpuf-merge-tag-wrap').length) {
177 $(".wpuf-merge-tags").hide();
178 }
179 });
180 },
181
182 computed: {
183 form_fields: function () {
184 var template = this.filter,
185 fields = this.$store.state.form_fields;
186
187 if (template !== null) {
188 return fields.filter(function(item) {
189 return item.template === template;
190 });
191 }
192
193 // remove the action/hidden fields
194 return fields.filter(function(item) {
195 return !_.contains( [ 'action_hook', 'custom_hidden_field'], item.template );
196 });
197 },
198 },
199
200 methods: {
201 toggleFields: function(event) {
202 $(event.target).parent().siblings('.wpuf-merge-tags').toggle('fast');
203 },
204
205 insertField: function(type, field) {
206 this.$emit('insert', type, field, this.field);
207 }
208 }
209 });
210 /* ./assets/components/modal/index.js */
211 Vue.component('wpuf-modal', {
212 template: '#tmpl-wpuf-modal',
213 props: {
214 show: Boolean,
215 onClose: Function
216 },
217
218 mounted: function () {
219 var self = this;
220
221 $('body').on( 'keydown', function(e) {
222 if (self.show && e.keyCode === 27) {
223 self.closeModal();
224 }
225 });
226 },
227
228 methods: {
229 closeModal: function() {
230 if ( typeof this.onClose !== 'undefined' ) {
231 this.onClose();
232 } else {
233 this.$emit('hideModal');
234 }
235 }
236 }
237 });
238 /* ./assets/components/template-modal/index.js */
239 Vue.component('wpuf-template-modal', {
240 template: '#tmpl-wpuf-template-modal',
241
242 props: {
243 show: Boolean,
244 onClose: Function,
245 },
246
247 data: function() {
248 return {
249 loading: false,
250 category: 'all',
251 };
252 },
253
254 methods: {
255
256 blankForm: function(target) {
257 this.createForm( 'blank', target );
258 },
259
260 createForm: function(form, target) {
261 var self = this;
262
263 // already on a request?
264 if ( self.loading ) {
265 return;
266 }
267
268 self.loading = true;
269
270 $(target).addClass('updating-message');
271
272 wp.ajax.send( 'weforms_contact_form_template', {
273 data: {
274 template: form,
275 _wpnonce: weForms.nonce
276 },
277
278 success: function(response) {
279 self.$router.push({
280 name: 'edit',
281 params: { id: response.id }
282 });
283 },
284
285 error: function(error) {
286
287 },
288
289 complete: function() {
290 self.loading = false;
291
292 $(target).removeClass('updating-message');
293 }
294 });
295 }
296 }
297 });
298
299 /* assets/js/utils/jquery-siaf-end.js */
300 })(jQuery);
301