https://beverlywillett.com/assets/js/main.js

1jQuery(document).ready(function($) {
2	var formModal = $('.cd-user-modal'),
3		formLogin = formModal.find('#cd-login'),
4		formSignup = formModal.find('#cd-signup'),
5		formForgotPassword = formModal.find('#cd-reset-password'),
6		formModalTab = $('.cd-switcher'),
7		tabLogin = formModalTab.children('li').eq(0).children('a'),
8		tabSignup = formModalTab.children('li').eq(1).children('a'),
9		forgotPasswordLink = formLogin.find('.cd-form-bottom-message a'),
10		backToLoginLink = formForgotPassword.find('.cd-form-bottom-message a'),
11		footer = $('footer');
12
13	//open login-form form
14	footer.on('click', '.cd-signin', login_selected);
15
16	//$('.drBox').on('click', '.cd-signin', openProfile);
17	
18	//close modal
19	formModal.on('click', function(event){
20		if( $(event.target).is(formModal) || $(event.target).is('.cd-close-form') ) {
21			formModal.removeClass('is-visible');
22		}	
23	});
24	//close modal when clicking the esc keyboard button
25	$(document).keyup(function(event){
26    	if(event.which=='27'){
27    		formModal.removeClass('is-visible');
28	    }
29    });
30
31	//switch from a tab to another
32	formModalTab.on('click', function(event) {
33		event.preventDefault();
34		( $(event.target).is( tabLogin ) ) ? login_selected() : signup_selected();
35	});
36
37	//hide or show password
38	$('.hide-password').on('click', function(){
39		var togglePass= $(this),
40			passwordField = togglePass.prev('input');
41		
42		( 'password' == passwordField.attr('type') ) ? passwordField.attr('type', 'text') : passwordField.attr('type', 'password');
43		( 'Hide' == togglePass.text() ) ? togglePass.text('Show') : togglePass.text('Hide');
44		//focus and move cursor to the end of input field
45		passwordField.putCursorAtEnd();
46	});
47
48	//show forgot-password form 
49	forgotPasswordLink.on('click', function(event){
50		event.preventDefault();
51		forgot_password_selected();
52	});
53
54	//back to login from the forgot-password form
55	backToLoginLink.on('click', function(event){
56		event.preventDefault();
57		login_selected();
58	});
59
60	function login_selected(){
61		console.log('footer clicked');
62		//mainNav.children('ul').removeClass('is-visible');
63		formModal.addClass('is-visible');
64		formLogin.addClass('is-selected');
65		formSignup.removeClass('is-selected');
66		formForgotPassword.removeClass('is-selected');
67		tabLogin.addClass('selected');
68		tabSignup.removeClass('selected');
69	}
70
71	function openProfile(){
72		console.log('footer clicked');
73		//mainNav.children('ul').removeClass('is-visible');
74		formModal.addClass('is-visible');
75		formLogin.addClass('is-selected');
76		formSignup.removeClass('is-selected');
77		formForgotPassword.removeClass('is-selected');
78		tabLogin.addClass('selected');
79		tabSignup.removeClass('selected');
80	}
81
82	function signup_selected(){
83		//mainNav.children('ul').removeClass('is-visible');
84		formModal.addClass('is-visible');
85		formLogin.removeClass('is-selected');
86		formSignup.addClass('is-selected');
87		formForgotPassword.removeClass('is-selected');
88		tabLogin.removeClass('selected');
89		tabSignup.addClass('selected');
90	}
91
92	function forgot_password_selected(){
93		formLogin.removeClass('is-selected');
94		formSignup.removeClass('is-selected');
95		formForgotPassword.addClass('is-selected');
96	}
97
98	//REMOVE THIS - it's just to show error messages 
99	/*
100	formLogin.find('input[type="submit"]').on('click', function(event){
101		event.preventDefault();
102		formLogin.find('input[type="email"]').toggleClass('has-error').next('span').toggleClass('is-visible');
103	});
104	formSignup.find('input[type="submit"]').on('click', function(event){
105		event.preventDefault();
106		formSignup.find('input[type="email"]').toggleClass('has-error').next('span').toggleClass('is-visible');
107	});
108	 */
109
110
111	//IE9 placeholder fallback
112	//credits http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html
113	if(!Modernizr.input.placeholder){
114		$('[placeholder]').focus(function() {
115			var input = $(this);
116			if (input.val() == input.attr('placeholder')) {
117				input.val('');
118		  	}
119		}).blur(function() {
120		 	var input = $(this);
121		  	if (input.val() == '' || input.val() == input.attr('placeholder')) {
122				input.val(input.attr('placeholder'));
123		  	}
124		}).blur();
125		$('[placeholder]').parents('form').submit(function() {
126		  	$(this).find('[placeholder]').each(function() {
127				var input = $(this);
128				if (input.val() == input.attr('placeholder')) {
129			 		input.val('');
130				}
131		  	})
132		});
133	}
134	$('.confirmdelete').click(function(event) {
135	    return confirm('Are you sure you want to delete this?');
136	});
137});
138

139//credits http://css-tricks.com/snippets/jquery/move-cursor-to-end-of-textarea-or-input/
140jQuery.fn.putCursorAtEnd = function() {
141	return this.each(function() {
142    	// If this function exists...
143    	if (this.setSelectionRange) {
144      		// ... then use it (Doesn't work in IE)
145      		// Double the length because Opera is inconsistent about whether a carriage return is one character or two. Sigh.
146      		var len = $(this).val().length * 2;
147      		this.focus();
148      		this.setSelectionRange(len, len);
149    	} else {
150    		// ... otherwise replace the contents with itself
151    		// (Doesn't work in Google Chrome)
152      		$(this).val($(this).val());
153    	}
154	});
155};
156