{extend name='user/layout_sidebar'/}

{block name='page_title'}{:lang('user_bind')}{/block}

{block name='content'}
    <div class="wntheme-cont-right">
        <div class="wntheme-rb-head wntheme-hidden-xs clearfix">
            <h2 class="wntheme-rb-title">{:lang('bind')} {if condition="$ac eq 'phone'"}{:lang('phone')}{else/}{:lang('email')}{/if}</h2>
        </div>
        <div class="wntheme-cont-list">
            <div class="wntheme-list-wrap">
                <form id="fm" name="fm" method="post" action="">
                    <input type="hidden" name="ac" value="{$ac}">
                    <p><span>{if condition="$ac eq 'phone'"}{:lang('phone')}{else/}{:lang('email')}{/if}</span><input type="text" name="to" class="wntheme-input-w3" placeholder="{:lang('enter_phone_or_email')}" value=""><a href="javascript:void(0)" class="wntheme-text-wntheme" type="button" id="btn_bind_send" value="{:lang('get_verification_code')}">{:lang('get_verification_code')}</a></p>
                    <p><span>{:lang('verification_code')}</span><input type="text" name="code" value="" placeholder="{:lang('enter_verification_code')}"></p>
                    <input type="button" id="btn_submit" class="wntheme-btn-submit wntheme-bg-wntheme" value="{:lang('confirm_binding')}">
                </form>
            </div>
        </div>
    </div>
{/block}

{block name='footer_scripts'}
    <script type="text/javascript">
        var countdown = 60;
        function settime(val) {
            if (countdown == 0) {
                val.removeAttribute("disabled");
                val.value = "{:lang('get_verification_code')}";
                countdown = 60;
                return true;
            } else {
                val.setAttribute("disabled", true);
                val.value = "{:lang('resend')}(" + countdown + ")";
                countdown--;
            }
            setTimeout(function () {settime(val)}, 1000)
        }

        $('#btn_bind_send').click(function () {
            var ac = $('input[name="ac"]').val();
            var to = $('input[name="to"]').val();
            if (ac == 'email') {
                var pattern = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
                var ex = pattern.test(to);
                if (!ex) {
                    alert("{:lang('email_format_incorrect')}");
                    return;
                }
            }
            else if (ac == 'phone') {
                //中國內地號碼
                //var pattern = /^[1][0-9]{10}$/;
                //全球號碼
                var pattern = /^\+(?:[0-9] ?){6,14}[0-9]$/;
                var ex = pattern.test(to);
                if (!ex) {
                    alert("{:lang('phone_format_incorrect')}");
                    return;
                }
            }
            else {
                alert("{:lang('parameter_error')}");
                return;
            }

            settime(this);
            var data = $("#fm").serialize();

            $.ajax({
                url: "{:url('user/bindmsg')}",
                type: "post",
                dataType: "json",
                data: data,
                beforeSend: function () {
                    //开启loading
                },
                success: function (r) {
                    alert(r.msg);
                },
                complete: function () {
                    //结束loading
                }
            });
        });

        $("#btn_submit").click(function () {
            var ac = $('input[name="ac"]').val();
            var to = $('input[name="to"]').val();

            if (ac == 'email') {
                var pattern = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
                var ex = pattern.test(to);
                if (!ex) {
                    alert("{:lang('email_format_incorrect')}");
                    return;
                }
            }
            else if (ac == 'phone') {
                //中國內地號碼
                //var pattern = /^[1][0-9]{10}$/;
                //全球號碼
                var pattern = /^\+(?:[0-9] ?){6,14}[0-9]$/;
                var ex = pattern.test(to);
                if (!ex) {
                    alert("{:lang('phone_format_incorrect')}");
                    return;
                }
            }
            else {
                alert("{:lang('parameter_error')}");
                return;
            }

            var code = $('input[name="code"]').val();
            if (code == '') {
                alert("{:lang('enter_verification_code')}");
                return;
            }
            var data = $("#fm").serialize();

            $.ajax({
                url: "{:url('user/bind')}",
                type: "post",
                dataType: "json",
                data: data,
                beforeSend: function () {
                    //开启loading
                    //$(".loading_box").css("display","block");
                    $("#btn_submit").css("background", "#fd6a6a").val("{:lang('loading')}");
                },
                success: function (r) {
                    alert(r.msg);
                    if (r.code == 1) {
                        location.href = "{:mac_url('user/info')}";
                    }
                },
                complete: function () {
                    //结束loading
                    //$(".loading_box").css("display","none");
                    $("#btn_submit").css("background", "#fa4646").val("{:lang('submit')}");
                }
            });
        });
    </script>
{/block}