2021-02-16 19:11:12 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
<title>Achievements Project</title>
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="/static/styles/theme.css" />
|
|
|
|
|
<link rel="stylesheet" href="/static/styles/common.css" />
|
2021-02-18 22:21:23 +00:00
|
|
|
<link rel="stylesheet" href="/static/styles/user.css" />
|
2021-02-16 19:11:12 +00:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="navbar">
|
|
|
|
|
<template data-template="navbar: List<Basic>">
|
|
|
|
|
<div id="navbar-section-${section}" class="navbar-section">
|
|
|
|
|
<template data-template="navbar-section-${section}: List<Basic>">
|
|
|
|
|
<div id="navbar-item-${item}" class="navbar-item" data-page-name="${item}">
|
|
|
|
|
${title}
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="content-body">
|
|
|
|
|
<div id="profile-page" class="page">
|
|
|
|
|
<div class="page-subsection">
|
|
|
|
|
<div class="page-header">
|
|
|
|
|
<p class="page-header-text">Profile</p>
|
|
|
|
|
<div class="page-header-separator"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2021-02-18 07:15:09 +00:00
|
|
|
<div id="importing">
|
|
|
|
|
<p id="importing-text">Contemplating...</p>
|
|
|
|
|
<img id="importing-loading" class="ap-loading" src="/static/res/loading.svg" alt="Loading Symbol" />
|
|
|
|
|
</div>
|
2021-02-16 19:11:12 +00:00
|
|
|
<template data-template="profile-page">
|
|
|
|
|
<div id="profile-section-1">
|
2021-02-19 20:49:24 +00:00
|
|
|
<div id="profile-left">
|
|
|
|
|
<div id="profile-info" class="page-subsection">
|
|
|
|
|
<div class="page-subsection-wrapper">
|
|
|
|
|
<div class="page-subheader">
|
|
|
|
|
<div id="profile-info-name" class="page-subheader-flex">
|
|
|
|
|
<p id="profile-info-username-text" class="page-subheader-text">${username}</p>
|
|
|
|
|
<input id="profile-info-username-field" class="page-subheader-text" value="${username}"/>
|
|
|
|
|
<span id="info-edit-stack" class="profile-edit-stack">
|
|
|
|
|
<img class="profile-edit page-subheader-icon" src="/static/res/edit.svg" alt="Edit Platforms" />
|
|
|
|
|
<img class="profile-edit-hover page-subheader-icon" src="/static/res/edit-hover.svg" alt="Edit Platforms" />
|
|
|
|
|
</span>
|
|
|
|
|
<span id="info-save-stack" class="profile-save-stack">
|
|
|
|
|
<img class="profile-save page-subheader-icon" src="/static/res/save.svg" alt="Save Platforms" />
|
|
|
|
|
<img class="profile-save-hover page-subheader-icon" src="/static/res/save-hover.svg" alt="Edit Platforms" />
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="page-subheader-separator"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="profile-info-pfp-border" class="page-subsection-chunk">
|
|
|
|
|
<div id="profile-info-pfp">
|
|
|
|
|
<img id="profile-info-pfp-img" class="lazy-img" data-src="/api/user/${id}/image" alt="User's Profile Picture" />
|
|
|
|
|
<div id="profile-info-pfp-vignette"></div>
|
|
|
|
|
<img id="profile-info-pfp-upload" src="/static/res/upload.svg" alt="Upload Image" />
|
|
|
|
|
<img id="profile-info-pfp-upload-hover" src="/static/res/upload-hover.svg" alt="Upload Image" />
|
|
|
|
|
<img id="profile-info-pfp-upload-invalid" src="/static/res/upload-invalid.svg" alt="Invalid Image" />
|
|
|
|
|
</div>
|
2021-02-16 19:11:12 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2021-02-19 20:49:24 +00:00
|
|
|
</div>
|
|
|
|
|
<div id="profile-platforms" class="page-subsection">
|
|
|
|
|
<div class="page-subsection-wrapper">
|
|
|
|
|
<div class="page-subheader">
|
|
|
|
|
<div class="page-subheader-flex">
|
|
|
|
|
<p class="page-subheader-text">Platforms</p>
|
|
|
|
|
<span id="platform-edit-stack" class="profile-edit-stack">
|
|
|
|
|
<img id="platform-edit" class="profile-edit page-subheader-icon" src="/static/res/edit.svg" alt="Edit Platforms" />
|
|
|
|
|
<img id="platform-edit-hover" class="profile-edit-hover page-subheader-icon" src="/static/res/edit-hover.svg" alt="Edit Platforms" />
|
|
|
|
|
</span>
|
|
|
|
|
<span id="platform-save-stack" class="profile-save-stack">
|
|
|
|
|
<img id="platform-save" class="profile-save page-subheader-icon" src="/static/res/save.svg" alt="Save Platforms" />
|
|
|
|
|
<img id="platform-save-hover" class="profile-save-hover page-subheader-icon" src="/static/res/save-hover.svg" alt="Edit Platforms" />
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="page-subheader-separator"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="profile-list page-subsection-chunk">
|
|
|
|
|
<template data-template="profile-platforms-list: List<Basic>">
|
|
|
|
|
<div class="profile-entry ${connected}">
|
|
|
|
|
${img}
|
|
|
|
|
<p class="profile-entry-text platform-name">${name}</p>
|
|
|
|
|
<div id="platform-${platform_id}" class="platform-remove-stack">
|
|
|
|
|
<img class="platform-remove" src="/static/res/cancel.svg" alt="Cancel" />
|
|
|
|
|
<img class="platform-remove-hover" src="/static/res/cancel-hover.svg" alt="Cancel" />
|
|
|
|
|
</div>
|
|
|
|
|
${add}
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
2021-02-16 19:11:12 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="profile-stats" class="page-subsection">
|
|
|
|
|
<div id="profile-stats-numeric">
|
|
|
|
|
<div id="profile-completion" class="page-subsection-wrapper">
|
|
|
|
|
<div class="page-subheader">
|
|
|
|
|
<p class="page-subheader-text">Avg. Completion</p>
|
|
|
|
|
<div class="page-subheader-separator"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="profile-completion-stack">
|
|
|
|
|
<img id="profile-completion-background" src="/static/res/completion.svg">
|
|
|
|
|
<canvas id="profile-completion-canvas"></canvas>
|
|
|
|
|
<p id="profile-completion-text">${average}</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="profile-perfect" class="page-subsection-wrapper">
|
|
|
|
|
<div class="page-subheader">
|
|
|
|
|
<p class="page-subheader-text">Perfect Games</p>
|
|
|
|
|
<div class="page-subheader-separator"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<p id="profile-perfect-text">${perfect}</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="profile-hardest" class="page-subsection-wrapper">
|
|
|
|
|
<div class="page-subheader">
|
|
|
|
|
<p class="page-subheader-text">Noteworthy Achievements</p>
|
|
|
|
|
<div class="page-subheader-separator"></div>
|
|
|
|
|
</div>
|
2021-02-19 20:49:24 +00:00
|
|
|
<div class="list-page-list">
|
|
|
|
|
<div class="list-page-header">
|
|
|
|
|
<p class="list-page-entry-icon"></p>
|
|
|
|
|
<p id="achievement-header-name" class="list-page-entry-text achievement-name">Name</p>
|
|
|
|
|
<p id="achievement-header-completion" class="list-page-entry-text achievement-completion">Completion %</p>
|
|
|
|
|
</div>
|
|
|
|
|
<template data-template="profile-noteworthy-list: List<Basic>">
|
|
|
|
|
<div class="list-page-entry achievement" data-id="${achievement_id}">
|
|
|
|
|
<img class="list-page-entry-icon lazy-img" data-src="/api/achievement/${achievement_id}/image" alt="Achievement Icon"></img>
|
|
|
|
|
<p class="list-page-entry-text achievement-name">${achievement_name}</p>
|
|
|
|
|
<p class="list-page-entry-text achievement-completion">${completion}</p>
|
2021-02-16 19:11:12 +00:00
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2021-02-19 20:49:24 +00:00
|
|
|
</div>
|
|
|
|
|
<div id="profile-section-2">
|
2021-02-16 19:11:12 +00:00
|
|
|
<div id="profile-ratings" class="page-subsection">
|
|
|
|
|
<div class="page-subsection-wrapper">
|
|
|
|
|
<div class="page-subheader">
|
|
|
|
|
<p class="page-subheader-text">Ratings</p>
|
|
|
|
|
<div class="page-subheader-separator"></div>
|
|
|
|
|
</div>
|
2021-02-19 20:49:24 +00:00
|
|
|
<div class="page-subsection-chunk">
|
|
|
|
|
<div class="list-page-list">
|
|
|
|
|
<div class="list-page-header">
|
|
|
|
|
<p class="list-page-entry-icon"></p>
|
|
|
|
|
<p class="list-page-entry-text rating-achievement">Achievement</p>
|
|
|
|
|
<p class="list-page-entry-text rating-difficulty">Difficulty</p>
|
|
|
|
|
<p class="list-page-entry-text rating-quality">Quality</p>
|
|
|
|
|
<p class="list-page-entry-text rating-review">Review</p>
|
|
|
|
|
</div>
|
|
|
|
|
<template data-template="rating-list: List<Basic>">
|
|
|
|
|
<div class="list-page-entry rating" data-id="${achievement_id}">
|
|
|
|
|
<img class="list-page-entry-icon lazy-img" data-src="/api/achievement/${achievement_id}/image" alt="Achievement Image"></img>
|
|
|
|
|
<p class="list-page-entry-text rating-achievement">${rating_achievement}</p>
|
|
|
|
|
<p class="list-page-entry-text rating-difficulty">${rating_difficulty}</p>
|
|
|
|
|
<p class="list-page-entry-text rating-quality">${rating_quality}</p>
|
|
|
|
|
<p class="list-page-entry-text rating-review">${rating_review}</p>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2021-02-16 19:11:12 +00:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<script src="/static/scripts/template.js"></script>
|
|
|
|
|
<script src="/static/scripts/common.js"></script>
|
2021-02-18 22:21:23 +00:00
|
|
|
<script src="/static/scripts/user.js"></script>
|
2021-02-16 19:11:12 +00:00
|
|
|
</body>
|
|
|
|
|
</html>
|
