|  | @@ -15,6 +15,9 @@
 | 
		
	
		
			
			| 15 | 15 |      @vite(['resources/css/app.css'])
 | 
		
	
		
			
			| 16 | 16 |  </head>
 | 
		
	
		
			
			| 17 | 17 |  <body class="antialiased font-serif">
 | 
		
	
		
			
			|  | 18 | +    <div role="alert" class="alert alert-success hidden z-40 fixed w-1/2 top-3 right-3">
 | 
		
	
		
			
			|  | 19 | +        <span></span>
 | 
		
	
		
			
			|  | 20 | +    </div>
 | 
		
	
		
			
			| 18 | 21 |      <audio id="player" autoplay="autoplay" loop>
 | 
		
	
		
			
			| 19 | 22 |          <source src="{{asset('assets/background-musicv2.mp3')}}" type="audio/mp3">
 | 
		
	
		
			
			| 20 | 23 |      </audio>
 | 
		
	
	
		
			
			|  | @@ -77,33 +80,19 @@
 | 
		
	
		
			
			| 77 | 80 |                type: 'POST',
 | 
		
	
		
			
			| 78 | 81 |                data: formData,
 | 
		
	
		
			
			| 79 | 82 |                success: function(response) {
 | 
		
	
		
			
			| 80 |  | -                if ('{{ session('success') }}') {
 | 
		
	
		
			
			| 81 |  | -                    showSuccessMessage('{{ session('success') }}');
 | 
		
	
		
			
			| 82 |  | -                }
 | 
		
	
		
			
			| 83 | 83 |                  $('#RSVPForm')[0].reset();
 | 
		
	
		
			
			|  | 84 | +                var alertContainer = $('.alert-success');
 | 
		
	
		
			
			|  | 85 | +                alertContainer.find('span').text(response.message); // Set message text
 | 
		
	
		
			
			|  | 86 | +                alertContainer.fadeIn().removeClass('hidden'); // Show the alert
 | 
		
	
		
			
			|  | 87 | +                setTimeout(function() {
 | 
		
	
		
			
			|  | 88 | +                    alertContainer.fadeOut().addClass('hidden'); // Hide the alert after 5 seconds
 | 
		
	
		
			
			|  | 89 | +                }, 3000);
 | 
		
	
		
			
			| 84 | 90 |                },
 | 
		
	
		
			
			| 85 | 91 |                error: function(xhr, status, error) {
 | 
		
	
		
			
			| 86 | 92 |                  console.error('Error submitting form:', error);
 | 
		
	
		
			
			| 87 | 93 |                }
 | 
		
	
		
			
			| 88 | 94 |              });
 | 
		
	
		
			
			| 89 | 95 |            });
 | 
		
	
		
			
			| 90 |  | -    
 | 
		
	
		
			
			| 91 |  | -          function showSuccessMessage(message) {
 | 
		
	
		
			
			| 92 |  | -                // Create a dynamic success message element
 | 
		
	
		
			
			| 93 |  | -                var successAlert = $('<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative" role="alert">' +
 | 
		
	
		
			
			| 94 |  | -                    '<span class="block sm:inline">' + message + '</span>' +
 | 
		
	
		
			
			| 95 |  | -                    '</div>');
 | 
		
	
		
			
			| 96 |  | -    
 | 
		
	
		
			
			| 97 |  | -                // Append the message to a suitable container in your HTML (e.g., modal, form, or body)
 | 
		
	
		
			
			| 98 |  | -                $('#alert-success').append(successAlert);
 | 
		
	
		
			
			| 99 |  | -    
 | 
		
	
		
			
			| 100 |  | -                // Automatically remove the message after 3 seconds
 | 
		
	
		
			
			| 101 |  | -                setTimeout(function() {
 | 
		
	
		
			
			| 102 |  | -                    successAlert.fadeOut('slow', function() {
 | 
		
	
		
			
			| 103 |  | -                        $(this).remove();
 | 
		
	
		
			
			| 104 |  | -                    });
 | 
		
	
		
			
			| 105 |  | -                }, 3000); // 3 seconds
 | 
		
	
		
			
			| 106 |  | -            }
 | 
		
	
		
			
			| 107 | 96 |          });
 | 
		
	
		
			
			| 108 | 97 |      </script>
 | 
		
	
		
			
			| 109 | 98 |  </body>
 |