@{
    ViewData["Title"] = "AccountLogin";
    Layout = "~/Views/Shared/_HomeLayout.cshtml";
}

@using (Html.BeginForm("AccountLogin", "Login", FormMethod.Post))
{
    <div class="section-white">
        <div class="app-content container center-layout py-5">
            <div class="content-wrapper">
                <div class="content-body">
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-12 col-sm-12">
                            <div class="account-login_container">
                                <div class="card px-2 pt-2 mb-0">
                                    <div class="card-header">
                                        <div class="card-title text-center">
                                            <img src="~/images/logotext76.png" alt="branding logo">
                                        </div>
                                    </div>
                                    <div class="card-content">
                                        <div class="card-body">
                                            <div class="pb-2 text-center">
                                                <h5>High performance trading platform that's fully loaded for serious traders.</h5>
                                                <h5><a href="@Url.Action("OpenAccount", "Login")" class="link-alt">Don't have an account?</a></h5>
                                            </div>
                                            <div class="form-horizontal">
                                                <fieldset class="form-group position-relative has-icon-left">
                                                    <input type="text" class="form-control" name="username" id="username" placeholder="Username" required />
                                                    <div class="form-control-position">
                                                        <i class="ft-user"></i>
                                                    </div>
                                                </fieldset>
                                                <fieldset class="form-group position-relative has-icon-left">
                                                    <input type="password" class="form-control" name="userpassword" id="userpassword" placeholder="Password" required />
                                                    <div class="form-control-position">
                                                        <i class="fa fa-key"></i>
                                                    </div>
                                                </fieldset>
                                                <div class="form-group row">
                                                    <div class="col-md-6 col-6 text-left">
                                                        <fieldset>
                                                            <input type="checkbox" id="rememberme" name="rememberme" value="true" class="chk-remember">
                                                            <label for="rememberme"> Remember Me</label>
                                                        </fieldset>
                                                    </div>
                                                    <div class="col-md-6 col-6 text-right"><a href="@Url.Action("ForgetPassword", "Login")" class="card-link">Forgot Password?</a></div>
                                                    @if (ViewBag.ValidateUser != "Success")
                                                    {
                                                        <div class="col-12 text-danger error-message my-2">
                                                            <span>@ViewBag.ValidateUser</span>
                                                        </div>
                                                    }
                                                </div>  
                                                <div class="row">
                                                    <div class="col-md-5 col-sm-12 mt-1">
                                                        <button type="submit" class="btn btn-primary btn-block"><i class="ft-unlock"></i> Login</button>
                                                    </div>
                                                </div>
                                                <br />
                                                <div class="pb-2 text-center">
                                                    <h5>--- Or ---</h5>
                                                    <p>Login with your favorite provider below</p>
                                                    <div class="g-signin2" data-onsuccess="onSignIn"></div>
                                                    <br />
                                                    <!-- LinkedIn signin button -->
                                                    @*<script type="in/Login" data-onAuth=""></script>*@


                                                    <!--<a href="#" onclick="signOut();">Sign out (DELETE ME AFTER FEATURE IS COMPLETE)</a>-->
                                                    
                                                    <a id="linkedin-button" class="btn btn-block btn-social btn-linkedin">
                                                        <i class="fa fa-linkedin"></i> Sign in with Linkedin
                                                    </a>
                                                    <br />
                                                    <fb:login-button scope="public_profile,email"
                                                                     onlogin="checkLoginState">
                                                    </fb:login-button>
                                                    <br />
                                                    <br />
                                                    <a id="instagram-button" class="btn btn-block btn-social btn-instagram">
                                                        <i class="fa fa-instagram"></i> Sign in with Instagram
                                                    </a>
                                                    <br />
                                                    <br />
                                                    <a id="twitter-button" class="btn btn-block btn-social btn-twitter">
                                                        <i class="fa fa-twitter"></i> Sign in with Twitter
                                                    </a>

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-12 col-sm-12 mt-xl-5 mt-lg-5 mt-md-5 mt-sm-3 mt-xs-3 mt-3 px-3 px-xl-3 px-lg-3 px-md-3 px-sm-0 px-xs-0 text-dark">
                            <h1>Welcome Back</h1>
                            <h2>Earn up to 1.5% interest on your balances</h2>
                            <p class="font-medium-1">
                                Learn how you can reduce your trading costs and earn interest
                                on your account balances with our Active Trader Program.
                            </p>
                            <p class="font-medium-1">
                                <a href="#" class="link-alt">Learn More</a>
                            </p>
                            <h2>NEW Developer Account</h2>
                            <p class="font-medium-1">Designed for high volume currency traders. View multiple levels of real time pricing of EForT.com's order book and trade on prices sourced from global banks and top tier liquidity providers - with no additional mark up.</p>
                            <p class="font-medium-1"><a href="#" class="link-alt">Learn More</a></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
}