slack_invite.html

<h4><i class="fa fa-lg fa-slack"></i>&nbsp;Enter your email to join our Slack community</h4>
<div id='div-slack-join' style='text-align:left;align-content:center;padding: 8px;'>
    <label for='emailaddr'>Email Address</label><br>
    <input style='line-height: 24px;margin-bottom:8px;' id='emailaddr' type='email'><br>
    <button class="cta-button dark" id="btn-join-slack">Join</button>
</div>
<div id='div-slack-result' style="display:hidden;font-weight:bold;margin: 24px;">
</div>

<script type="text/javascript">
    $(function(){
        $('#btn-join-slack').click(function(){
            var email = $('#emailaddr').val();
            $.ajax({
                type: "POST",
                url: "https://owaspadmin.azurewebsites.net/api/owasp_slack_add_user?code=aaanp3ICdjlaVHHoAnmO06EiDh9dgrCZfkjdTeoOQLVvdesivNWUjA==&email=" + encodeURIComponent(email),
                dataType: "json",
                success: function (result, status, xhr) {
                   if(result['ok']){
                    $("#div-slack-join").hide();
                    $("#div-slack-result").text("Thanks for joining!  Be on the lookout for an email with more information.");
                    $("#div-slack-result").show();
                   }else {
                    $("#div-slack-join").hide();
                    $("#div-slack-result").text("Oops!  Looks like something went wrong or you are already signed up.");
                    $("#div-slack-result").show();    
                   }
                },
                error: function (xhr, status, error) {
                   $("#div-slack-join").hide();
                   $("#div-slack-result").text("Oops!  Looks like something went wrong or you are already signed up.");
                   $("#div-slack-result").show();
                }
            });
        });
    });
</script>