Untitled

<!DOCTYPE html>
<html>
    <head>
        <title>Page Title</title>
    </head>


    <body>
     <h1>Title</h1>

        <div id="logo">
            <p>Logo</p>
        </div>

       <ul style="list-style-type:none">
            <li class="button">encode</li>
            <li class="button">decode</li>
        </ul>

    <textarea id="input" rows="25" cols="35"></textarea>

     <textarea id="output" rows="25" cols="35"></textarea>


        <textarea type="text" id="keyword" name="keyword" value="Ssadadsad"></textarea>


    <button id="encrypt" onclick="isEncrypted()">encode</button>
    <button id="decrypt" onclick="isDecrypted()">decode</button>


    </body>


    <script>
        var input;
        var keyword;
        var size= "";
        var test1= "";
        var output="";
        var test2=0;
        var test3;
        var test4;
        var test5;
        var test6;

        var alphabet =["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"]

        function encrypt()
        {

            for (i = 0; i < input.length; i++)
            {
                test5 = input.charAt(i);
                test6 = keyword.charAt(test2);

                test3 = alphabet.findIndex(arrayIn);
                test4 = alphabet.findIndex(arrayKey);
                if(input.charAt(i)!=" ")
                {

                    if(test3+test4>25)
                    {
                        test1=(test3+test4)-26;
                        size+=alphabet[test1];
                    }

                    else
                    {
                        test1=test4+test3;

                        size+=alphabet[test1];


                    }
                    test2++;
                    if(test2>=keyword.length)
                    {
                        test2=0;
                    }
                }

                else
                {
                    size+=" ";
                }

            }
        }


        function decrypt()
        {
            for (i = 0; i < input.length; i++)
            {


              test5 = input.charAt(i);
              test6 = keyword.charAt(test2);

                if(input.charAt(i)!=" ")
                {
                    test3 = alphabet.findIndex(arrayIn);
                    test4 = alphabet.findIndex(arrayKey);


                    if(test3>=test4)
                    {
                        test1=test3-test4;
                        size+=alphabet[test1];
                    }

                    else
                    {
                        test1=test4-test3;
                        test1= 26-test1;
                        size+=alphabet[test1];


                    }
                    test2++;
                    if(test2>=keyword.length)
                    {
                        test2=0;
                    }
                }

                else
                {
                    size+=" ";
                }
            }
        }

         function arrayIn(element)
        {

            return element==test5;
        }

        function arrayKey(asdas)
        {
            return asdas==test6;
        }


        function isEncrypted()
        {
           input = document.getElementById("input").value;
              keyword = document.getElementById("keyword").value;

            test2=0;
            size="";
             encrypt();

             document.getElementById("output").innerHTML = size;

        }
        function isDecrypted()
        {
           input = document.getElementById("input").value;
              keyword = document.getElementById("keyword").value;

            test2=0;
            size="";
           decrypt();


            document.getElementById("output").innerHTML = size;
        }
    </script>

</html>