// CONTROLLER FUNCTION(S)
                            // get user string from the page
                            function getString() {
                                let userString = document.getElementById("userString").value;
                                document.getElementById("alert").classList.add("invisible");
                            
                                // check for palindrome, if valid input
                                if (validateString(userString)) {
                                    let inputString = simplifyString(userString);
                                    let outputString = reverseString(inputString);
                            
                                    // check for palindrom
                                    let returnObj = checkPalindrome(inputString, outputString);
                            
                                    // display output message 
                                    displayString(returnObj);
                                }
                            }
                            
                            
                            
                            // LOGIC FUNCTION(S)
                            function validateString(inputString) {
                                let output = true;
                            
                                // strip out space a non-letters
                                inputString = simplifyString(inputString); 
                            
                                // check if string is empty or has only white spaces
                                if (inputString.length === 0 || !inputString.trim()) {
                                    alert("Please enter a string to check!")
                                    output = false;
                                }
                            
                                return output;
                            }
                            
                            
                            // remove whitespace, upper case, and special characters
                            function simplifyString(inputString){
                                let simpleString = "";
                            
                                simpleString = inputString.toLowerCase();
                                simpleString = simpleString.replace(/[^a-z0-9]/g,"");
                                simpleString = simpleString.replaceAll(/\s+/g,"");
                            
                                return simpleString;
                            }
                            
                            // reverse string
                            function reverseString(inputString) {
                                let revString = [];
                            
                                // reverse the string using a for loop
                                for ( let i = inputString.length -1; i >=0; i--) {
                                    revString += inputString[i];
                                }
                            
                                return revString;
                            }
                            
                            // check for palindrome
                            function checkPalindrome(inputString, reverseString) {
                                let returnObj = {};
                            
                                if (inputString == reverseString) {
                                    returnObj.msg = `YES! Palindrome found!`;
                                }
                                else
                                {
                                    returnObj.msg = `Sorry! No palindrome found.`;
                                }
                            
                                returnObj.reversed = reverseString;
                            
                                return returnObj;
                            }
                            
                            
                            // VIEW FUNCTION(S)
                            // Display the output string to the user
                            function displayString(returnObj) {
                                // write message to page
                                document.getElementById("alertHeader").innerHTML = returnObj.msg;
                                document.getElementById("msg").innerHTML = `Your phrase reversed is: ${returnObj.reversed}`;
                            
                                // show the alert box
                                document.getElementById("alert").classList.remove("invisible");
                            }
                        
                    

The Code is structured into six functions.

getString

getString retrieves the user input string from the page. It utilises getElementById to get this string. A class of "invisible" is added to the alert div, so that the div is no visible when text is being updated or if the input is not valid. The input string is validated with validateString, and if valid, the remaining code in getString will run. A new string is declared, which is set to the output of the simplifyString method, where the input string is stripped to a basic string without spaces. Another new string is declared which is the output of the reverseString method, where the input is the previous new string (output of simplifyString). The checkPalindrome function is then called and set to a new object variable, which is then fed into the displayString function.

validateString

The user input string is fed into this function, which checks to see if the string length is equal to 0 or formed entirely of white spaces. If either of these conditions evaluate to true, then a boolean variable named output is set to false, and an alert box notifies the user to input a string. The output variable is then returned.

simplifyString

This method converts the input string to lowercase, removes all non-alphanumeric characters, and removes whitespace.

reverseString

reverseString returns a string value which is the reverse of the string fed into the function. This is achieved with a 'for' loop which runs backwards from the last index of the input array to 0 (last index is the array length -1, since js array indices start from 0). On each iteration of the loop, the char is added to a new array called revString, which is returned after the loop completes.

checkPalindrome

This method accepts two inputs (simplified user input string, and reversed string), and checks to see if these 2 strings are equal, by using an 'if statement'. Depending on the output, the .msg parameter of a new object is set accordingly, and then the .reversed parameter of the new object is assigned. The object is then returned from the function containing 2 parameters (2 strings).

displayString

The displayString function accepts an object input, which should contain 2 properties (.msg and .reversed). The object contains strings which are used to inform the user as to whether the palindrome check was successful and the reversed string of the user input. The alert div then has the class of "invisible" removed so that the output is visible to the user.