const btnLoginPage = document.querySelector('.btn-login');
const btnUserProfile = document.querySelector('.btn-userProfile');
const btnLogout = document.querySelector('.btn-logout');

function getCookie(name) {
    const value = `; ${document.cookie}`;
    const parts = value.split(`; ${name}=`);
    if (parts.length === 2) return parts.pop().split(';').shift();
  }

function renderView() {
    let token = getCookie('jwt_token');
    if(!token) {
        return;
    }
    // axios.defaults.withCredentials = false;
    axios({
        method: 'post',
        url: 'http://www.choozmo.com:8887/user_profile',
        headers: { 
            'accept': 'text/html',
            'Authorization': `Bearer ${token}`
         }
    }).then(res => {
        console.log(res.data);
        const userInfo = res.data;
        const str = `<img src="static/img/undraw_male_avatar_323b.svg" alt="">
            <p class="card-profile-txt">User Profile</p>
            <p class="card-profile-cnt">${userInfo.user_info.userName}</p>
            <p class="card-profile-cnt">${userInfo.user_info.email}</p>
            <div class="d-flex justify-content-around">
                <div>
                    <p>已使用</p>
                    <p><strong>${userInfo.user_info.total_sec}</strong>秒</p>
                </div>
                <div>
                    <p>未使用</p>
                    <p><strong>${userInfo.user_info.left_sec}</strong>秒</p>
                </div>
            </div>`;
            $('.card-profile').html(str);
    }).catch(err => {
        console.log(err);
    })
}

renderView();

function checkLogin() {
    let token = getCookie('jwt_token');
    if(token) {
        btnLoginPage.style.display = 'none';
        btnLogout.style.display = 'block';
        btnUserProfile.style.display = 'block';
    } else {
        window.location.href = 'login.html';
        btnLoginPage.style.display = 'block';
        btnLogout.style.display = 'none';
        btnUserProfile.style.display = 'none';
    }
}


checkLogin();