http://www.pennrettig.com/include/js/site_styles/default/201501/contactForm.js

1formBehavior.addForm({
2	el:document.getElementById('tqcf'),
3	action:document.getElementById('tqcf').dataset.action,
4	recaptcha:true,
5	alerts:document.getElementById('cf-accessible-alert'),
6	submit:{
7		el:document.querySelector('.contact-form-button'),
8		type:'jsonp',
9		success:function(){
10			const $ty = document.getElementById('cf-success')
11
12			$ty.classList.add('hidden-transition')
13			$ty.classList.remove('hidden')
14
15			setTimeout(function(){
16				$ty.setAttribute('aria-hidden','false')
17				$ty.classList.remove('hidden-transition')
18			},1)
19
20			setTimeout(function(){
21				$ty.classList.add('hidden-transition')
22
23				setTimeout(function(){
24					$ty.setAttribute('aria-hidden','true')
25					$ty.classList.remove('hidden-transition')
26					$ty.classList.add('hidden')
27				},800)
28			},15000)
29
30			if (this.resetFields)
31				this.resetFields()
32			
33			$ty.scrollIntoView({behavior: 'auto', block: 'center', inline: 'center'})
34		}
35	},
36	fields:[
37		{
38			el:document.getElementById('form-cf-name'),
39			label:'Name',
40			validation:{
41				empty:{
42					message:'Name is required',
43				}
44			}
45		},
46		{
47			el:document.getElementById('form-cf-email'),
48			label:'Email',
49			validation:{
50				empty:{
51					message:'Email is required',
52				},
53				patterns:[
54					{
55						regex:/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
56						message:'Please enter a valid email'	
57					}
58				]
59			}
60		},
61		{
62			el:document.getElementById('form-cf-phone'),
63			label:'Phone',
64			validation:{
65				patterns:[
66					{
67						regex:/^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/,
68						message:'Please enter a valid phone number. Allowed characters: 0-9,-,(),space'
69					}
70				]
71			}
72		},
73		{
74			el:document.getElementById('form-cf-message'),
75			label:'Message',
76			counter:{
77				max:1500,
78				el:document.getElementById('form-cf-message-count'),
79				text:'{count} characters remaining',
80				message:'The message length has reached to its maximum limit'
81			},
82			validation:{
83				empty:{
84					message:'Message is required'
85				}
86			}
87		}
88	]
89})