window.mrp_v2_ready( function() {

	var $signup = null;
	var $login = null;
	
	var $signupRoot = _gmrp.$("#mrp-vow-signup-root").first();
	var $loginRoot = _gmrp.$("#mrp-vow-login-root").first();
	
	window.VowLoginFormInline = _gmrp.VowLoginForm.extend( {
		name : "VowLoginInline",
		
		init: function( options ) {			
			this._super( options );
			
			this.popupHelper = this.helper;
			var _this = this;
			this.helper = {
				setup: function() {},
				onClose : function() {},
				close: function() {},
				offClose : function(arg) {
					//return _this.popupHelper.offClose(arg)
				},
				removePopup : function() {},
				removeElement: function() {},
				show: function( $form ) {
					$form.removeClass( "mrp-popup" );
					$form.addClass( "inline-vow-form" );
					$form.find( ".mrp-form-error br" ).remove();
					$form.find( ".mrp-vow-login-form-link" ).remove();
					$form.find( ".mrp-form-button-cancel" ).remove();
					$login = $form;

					// give a good class to the button for blocks
					if( $loginRoot.closest(".block-layout").length > 0 ) {
						$form.find( "button" ).removeClass("btn btn-primary").addClass( "button" );
					}

					$loginRoot.empty().append( $form );

				}
			}
			_gmrp.$(document).on( "mrp.vow.status.changed", function() {
				var loggedIn = window.mrp_vowLoggedIn;
				if( loggedIn ) {
					_this.redirect( $login );
				}
				else {
					_this.unhideForm();
				}
			});
			
			_gmrp.$(document).on( "mrp.popup.close", function() {
				_this.unhideForm();
			});
		},
		unhideForm: function() {
			$login.find( ".mrp-form-field-error" ).remove();
			$login.show();
			$loginRoot.find( ".mrp-vow-spinner").remove();
			//$loginRoot.find( ".mrp-vow-login-success").remove();
		},
		scrollToForm: function() {
			window.scrollTo( {
				top: $loginRoot.offset().top - 100,
				left: 0,
				behavior: "smooth"
			});
		},
		submitForm: function($form) {
			this._super( $form );
			this.scrollToForm();
			$login.hide();
			$loginRoot.append( this.progress() );
		},
		formLoaded : function( data, status, $xhr ) {
			var r1 = /\<success\>(.+?)\<\/success\>/i.exec( data );
			if( r1 && r1[1] ) {
				this.redirect( $login );
				return;
			}
			this._super( data, status, $xhr );
		},
		redirect : function( $form ) {
			var _this = this;
			this.unhideForm();
			$form.find( "form.mrp-vow-login-form" ).hide();
			$form.find( ".mrp-vow-login-success" ).remove();
			var $ty = _gmrp.$( "<div class='mrp-vow-login-success'><h3></h3></div>" );
			$ty.find( "h3" ).text( "Login successful, finishing..." );
			
			$ty.insertBefore( $form.find( "form.mrp-vow-login-form" ) );
			setTimeout( function() {
				window.location = _this.options.targetPage;
			}, 1000 );
		},
		progress: function() {
			return '<div class="mrp-vow-spinner"></div>';
		},
		renderVowLinkBar : function() {
			this._super();
			this.$form.find( ".mrp-vow-login-form-link" ).remove();
		},
	});

	window.VowSignupFormInline = _gmrp.VowSignupForm.extend( {
		name : "VowSignupInline",
		
		init: function( options ) {			
			this._super( options );
			
			this.popupHelper = this.helper;
			var _this = this;
			this.helper = {
				setup: function() {},
				onClose : function() {},
				close: function() {},
				offClose : function(arg) {
					return _this.popupHelper.offClose(arg)
				},
				removePopup : function() {},
				removeElement: function() {},
				show: function( $form ) {
					$form.removeClass( "mrp-popup" );
					$form.addClass( "inline-vow-form" );
					$form.find( ".mrp-form-error br" ).remove();
					$form.find( ".mrp-vow-signup-form-link" ).remove();
					$form.find( ".mrp-form-button-cancel" ).remove();
					$form.on( "mrp.vow.signup.tos.stopped", function() {
						_this.scrollToForm();
					});
					$form.on( "mrp.vow.signup.tos.back", function() {
						_this.scrollToForm();
					});
					$signup = $form;
					// give a good class to the button for blocks
					if( $signupRoot.closest(".block-layout").length > 0 ) {
						$form.find( "button" ).removeClass("btn btn-primary").addClass( "button" );
					}
					$signupRoot.empty().append( $form );					
				}
			}
			
			_gmrp.$(document).on( "mrp.vow.status.changed", function() {
				var loggedIn = window.mrp_vowLoggedIn;
				if( loggedIn ) {
					_this.redirect( $signup );
				}
				else {
					_this.unhideForm();
				}
			});
			
			_gmrp.$(document).on( "mrp.popup.close", function() {
				_this.unhideForm();
			});
		},
		unhideForm: function() {
			$signup.find( ".mrp-form-field-error" ).remove();
			$signup.show();
			$signupRoot.find( ".mrp-vow-spinner").remove();
			//$signupRoot.find( ".mrp-vow-signup-thank-you").remove();
		},
		progress: function() {
			return '<div class="mrp-vow-spinner"></div>';
		},
		renderVowLinkBar : function() {
			this._super();
			this.$form.find( ".mrp-vow-signup-form-link" ).remove();
		},
		scrollToForm: function() {
			window.scrollTo( {
				top: $signupRoot.offset().top - 100,
				left: 0,
				behavior: "smooth"
			});
		},
		submitForm: function($form) {
			this._super( $form );
			this.scrollToForm();
			$signup.hide();
			$signupRoot.append( this.progress() );
		},
		formLoaded : function( data, status, $xhr ) {
			this._super( data, status, $xhr );
//			var r1 = /\<auto-verify\>(.+?)\<\/auto-verify\>/i.exec( data );
//			if( r1 && r1[1] ) {
//				if( $signup ) {
//					this.thankYou( $signup );
//					$signupRoot.empty().append( $signup );
//				}
//				return;
//			}
			var r2 = /\<ready-to-confirm\>(.+?)\<\/ready-to-confirm\>/i.exec( data );
			if( r2 && r2[1] ) {
				if( $signup ) {
					this.thankYou( $signup );
					//$signupRoot.empty().append( $signup );
				}
				return;
			}
		},
		thankYou : function( $form ) {
			$form.find( "form.mrp-vow-signup-form" ).hide();
			$form.find( ".mrp-vow-signup-thank-you" ).remove();
			var $ty = _gmrp.$( "<div class='mrp-vow-signup-thank-you'><h3></h3><p></p></div>" );
			$ty.find( "h3" ).text( "Thank you for signing up. Please check your email for " +
				"instructions to verify your account" );
			$ty.find( "p" ).text( "Please make sure to check Promotions and/or Spam folder and " +
				"move the message to your Inbox to ensure that future messages are delivered " +
				"without issues" );
			
			$ty.insertBefore( $form.find( "form.mrp-vow-signup-form" ) );
		},
		redirect : function( $form ) {
			var _this = this;
			$form.find( "form.mrp-vow-signup-form" ).hide();
			$form.find( ".mrp-vow-signup-thank-you" ).remove();
			var $ty = _gmrp.$( "<div class='mrp-vow-signup-thank-you'><h3></h3><p></p></div>" );
			$ty.find( "h3" ).text( "Thank you! You are all set, finishing..." );
			
			$ty.insertBefore( $form.find( "form.mrp-vow-signup-form" ) );
			setTimeout( function() {
				window.location = _this.options.targetPage;
			}, 1000 );
		}
	});
	
	var fromPage = null;
	try {
		var parsedUrl = new URL(window.location.href);
		fromPage = parsedUrl.searchParams.get("from" ) || null;
		console.log( 'from page', fromPage );
	}
	catch( e ) {
		
	}
	
	
	if( $signupRoot.length > 0 ) {
		var accountId = $signupRoot.attr( "data-account" );
		var targetPage = fromPage || $signupRoot.attr( "data-target-page" );
		if( $signupRoot.attr( "custom-redirect-page" )) {
			targetPage = $signupRoot.attr( "custom-redirect-page" );
		}
		
		if( !accountId || !targetPage ) {
			console.error( "MRP VOW INLINE FORMS: no data-account or data-target-page provided on #mrp-vow-signup-root" );
			return;
		}
		new window.VowSignupFormInline({
			accountId: accountId,
			targetPage: targetPage
		}).open();
	}
	else if( $loginRoot.length > 0 ) {
		var accountId = $loginRoot.attr( "data-account" );
		var targetPage = fromPage || $loginRoot.attr( "data-target-page" );

		if( $loginRoot.attr( "custom-redirect-page" )) {
			targetPage = $loginRoot.attr( "custom-redirect-page" );
		}

		if( !accountId || !targetPage ) {
			console.error( "MRP VOW INLINE FORMS: no data-account or data-target-page provided on #mrp-vow-signup-root" );
			return;
		}
		new window.VowLoginFormInline({
			accountId: accountId,
			targetPage: targetPage
		}).open();
	}
	
	
});