/**
 * Plugin Template frontend js.
 *
 *  @package WordPress Plugin Template/JS
 */

const form = `
<div class="modal-bg">
    <div id="modal">
        <span>Kirjaudu Mandoon<a href="#close" id="closelogin">&#215;</a></span>
        <form>
            <input id="email" name="email" type="textbox" placeholder="sähköposti" required>
            <input id="password" name="password" type="password" placeholder="salasana" required>
<!--            <a id="forgot-link" href="#">Salasana unohtui?</a>-->
            <div id="loginerror" ></div>
            <button name="submit" id="mandologin" type="submit">Kirjaudu</button>
        </form>
    </div>
</div>
`

//const loginUrl = 'http://localhost:9292/api/login2';
const loginUrl = '/api/login2';


jQuery(document).ready(
    function (e) {
        console.log('Hello World!!');
        jQuery('.loginbutton').click(function () {
            console.log('onclick');
            jQuery('body').append(jQuery.parseHTML(form));

            jQuery('#closelogin').click((e) => {
                e.preventDefault();
                console.log('onclose');
                jQuery('.modal-bg').remove();
                return false;
            });

            jQuery('#modal').css('display', 'block');
            jQuery('.modal-bg').fadeIn();
            jQuery('#mandologin').click((e) => {
                e.preventDefault();
                let $form = jQuery( '#modal' ),
                    email = $form.find( "input[name='email']" ).val(),
                    password = $form.find( "input[name='password']" ).val();
                let data = {email: email, password: password, origin: 'mandologin'}
                console.log('data', data);
                let ret = jQuery.post(loginUrl, data);
                ret.done((data) => {
                    console.log('ret', data);
                    let rd = JSON.parse(data);
                    if (rd.status === 'ok') {
                        console.log('success');
                        window.location = rd.redirect;
                    } else {
                        jQuery('#loginerror').text('Sähköpostiosoite ja salasana eivät kelpaa.');
                    }
                })
            });
        });
    }
);
