<%@ page session="false" %>
<section class="main signin">
    <div class="logo" ng-include src="'/html/header.html'"></div>
    <div class="title">
        <h1>JOIN</h1>
    </div>
    <div class="signin-providers" >
        <table>
            <tr>
                <td>
                <div class="provider-icon mail">
                    <button ng-class="{disabled:!agree}" ng-click="register('email')" ng-mouseenter="providerMailIcon = 'imageHover';" ng-mouseleave="providerMailIcon = '';">
                    <img ng-class="providerMailIcon" class="fadeInUp animated" src="../../img/mail.png" alt="Mail"></button>
                </div>
                <form action="/signin/facebook" method="POST">
	                <div class="provider-icon facebook">
	                    <button type="{{agree ? 'submit' : 'button'}}" ng-click="register('facebook')" ng-class="{disabled:!agree}" ng-mouseenter="providerFBIcon = 'imageHover'" ng-mouseleave="providerFBIcon = ''">
	                    <img ng-class="providerFBIcon" class="fadeInUp animated" src="img/facebook.png" alt="Facebook" /></button>
	                </div>
	                <input type="hidden" name="scope" value="email,publish_stream,offline_access" />
	            </form>
	            <%--
                <div class="provider-icon twitter last">
                    <button ng-class="{disabled:!agree || true}" ng-click="register('twitter')" ng-mouseenter="providerTwitterIcon = 'imageHover'" ng-mouseleave="providerTwitterIcon = ''">
                    <img ng-class="providerTwitterIcon" class="fadeInUp animated" src="img/twitter.png" alt="Twitter" /></button>
                </div>
                --%>
                </td>
            </tr>
            <tr>
                <td>
                    <div class="messageBox" ng-show="showTermsAlert && !!!agree">
                        <div class="errorMsg">
                            <span class="fadeInLeft animated">
                                * Please read and accept the Terms of Use Agreement before registering at MINDink.
                            </span>
                        </div>
                    </div>

                    <div class="mindink-checkbox">
                        <input type="checkbox" id="mindink-checkbox" name="check" ng-model="agree" >
                        <label for="mindink-checkbox"></label>
                        <span>I acknowledge that I have read and accept the <a class="link" ng-click="termsOpen()">Terms of Use Agreement</a>  and consent to the <a class="link" ng-click="privacyOpen()">Privacy Policy</a>.</span>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="signin-joining">
                    <span class="signin-joining-text">
                        Already have a MINDink account?
                        <a href="/signin" >SIGN IN</a>
                    </span>
                </td>
            </tr>
        </table>
    </div>
    <div class="footer" ng-include src="'/html/footer.html'"></div>

</section>