Merge pull request #213 from RolandBende/ctf7refactor

refactor: Removed individual ctf7 event listeners
duracelltomi · Feb 20, 2022 · 2baf6c0 · 2baf6c0
2 parents 9b5344a + df03a72
commit 2baf6c0
Showing 1 changed file with 34 additions and 49 deletions.
diff --git a/js/gtm4wp-contact-form-7-tracker.js b/js/gtm4wp-contact-form-7-tracker.js
@@ -15,52 +15,37 @@ function gtm4wp_prepare_cf7_data( eventdata ) {
 	return cf7data;
 }
 
-document.addEventListener('wpcf7submit', function(event) {
-	const cf7data = gtm4wp_prepare_cf7_data( event );
-
-	window[ gtm4wp_datalayer_name ].push({
-		'event': 'gtm4wp.contactForm7Submitted',
-		'gtm4wp.cf7formid': cf7data.formid,
-		'gtm4wp.cf7inputs': cf7data.inputs
-	});
-});
-
-document.addEventListener('wpcf7mailsent', function(event) {
-	const cf7data = gtm4wp_prepare_cf7_data( event );
-
-	window[ gtm4wp_datalayer_name ].push({
-		'event': 'gtm4wp.contactForm7MailSent',
-		'gtm4wp.cf7formid': cf7data.formid,
-		'gtm4wp.cf7inputs': cf7data.inputs
-	});
-});
-
-document.addEventListener('wpcf7mailfailed', function(event) {
-	const cf7data = gtm4wp_prepare_cf7_data( event );
-
-	window[ gtm4wp_datalayer_name ].push({
-		'event': 'gtm4wp.contactForm7MailFailed',
-		'gtm4wp.cf7formid': cf7data.formid,
-		'gtm4wp.cf7inputs': cf7data.inputs
-	});
-});
-
-document.addEventListener('wpcf7spam', function(event) {
-	const cf7data = gtm4wp_prepare_cf7_data( event );
-
-	window[ gtm4wp_datalayer_name ].push({
-		'event': 'gtm4wp.contactForm7SpamDetected',
-		'gtm4wp.cf7formid': cf7data.formid,
-		'gtm4wp.cf7inputs': cf7data.inputs
-	});
-});
-
-document.addEventListener('wpcf7invalid', function(event) {
-	const cf7data = gtm4wp_prepare_cf7_data( event );
-
-	window[ gtm4wp_datalayer_name ].push({
-		'event': 'gtm4wp.contactForm7InvalidInput',
-		'gtm4wp.cf7formid': cf7data.formid,
-		'gtm4wp.cf7inputs': cf7data.inputs
-	});
-});
+/**
+ * Contact Form 7 DOM and Google Tag Manager for WordPress data layer event pairs
+ * @see https://contactform7.com/dom-events/
+ * @const
+ * @type {Object}
+ */
+const gtm4wp_ctf7_event_pairs = {
+    wpcf7invalid: 'gtm4wp.contactForm7InvalidInput',
+    wpcf7spam: 'gtm4wp.contactForm7SpamDetected',
+    wpcf7mailsent: 'gtm4wp.contactForm7MailSent',
+    wpcf7mailfailed: 'gtm4wp.contactForm7MailFailed',
+    wpcf7submit: 'gtm4wp.contactForm7Submitted',
+};
+
+/**
+ * Handle Contact Form 7 DOM events
+ * If CTF7 event fired push a data layer event with form data(id, inputs)
+ * @param {Object} w Window
+ * @param {Object} d Document
+ * @param {Object} p CTF7 - GTM4WP event pairs
+ * @return void
+ */
+(function ( w, d, p ) {
+    for ( let ctf7event in p ) {
+        d.addEventListener( ctf7event, function( event ) {
+            const cf7data = gtm4wp_prepare_cf7_data( event );
+            w[ gtm4wp_datalayer_name ].push({
+                'event': p[ ctf7event ],
+                'formid': cf7data.formid,
+                'inputs': cf7data.inputs
+            });
+        });
+    }
+}( window, document, gtm4wp_ctf7_event_pairs ));