aboutsummaryrefslogtreecommitdiffstats
path: root/templates
diff options
context:
space:
mode:
authorGravatar Gareth Coles <[email protected]>2018-06-17 21:31:00 +0000
committerGravatar Gareth Coles <[email protected]>2018-06-17 21:31:00 +0000
commitdc2a5013fb93141f50dc92b4b8cc4d6004b8e814 (patch)
tree07a3c381d9b58890c14049f8a23e8154b33e0003 /templates
parent[Wiki] Quick-fix for broken editor (diff)
Backend for team assignment
Diffstat (limited to 'templates')
-rw-r--r--templates/staff/jams/index.html2
-rw-r--r--templates/staff/jams/teams/view.html358
2 files changed, 359 insertions, 1 deletions
diff --git a/templates/staff/jams/index.html b/templates/staff/jams/index.html
index bb6a3c21..74292204 100644
--- a/templates/staff/jams/index.html
+++ b/templates/staff/jams/index.html
@@ -106,7 +106,7 @@
<a class="uk-button uk-button-secondary uk-width-expand" href="{{ url_for("staff.jams.participants", jam=jam.number) }}">
<i class="uk-icon fa-fw far fa-user"></i> &nbsp;Participants
</a>
- <a class="uk-button uk-button-primary uk-width-expand" href="# TODO">
+ <a class="uk-button uk-button-primary uk-width-expand" href="{{ url_for("staff.jams.teams", jam=jam.number) }}">
<i class="uk-icon fa-fw far fa-users"></i> &nbsp;Teams
</a>
</div>
diff --git a/templates/staff/jams/teams/view.html b/templates/staff/jams/teams/view.html
new file mode 100644
index 00000000..48bc3c61
--- /dev/null
+++ b/templates/staff/jams/teams/view.html
@@ -0,0 +1,358 @@
+{% extends "main/base.html" %}
+{% block title %}Staff | Jams | Teams{% endblock %}
+{% block og_title %}Staff | Jams | Teams{% endblock %}
+{% block og_description %}Manage Teams{% endblock %}
+{% block content %}
+ <div class="uk-flex">
+ <div class="uk-flex-column uk-padding-small uk-background-muted" id="member-answers-sidebar">
+ <h3 class="uk-text-center" id="user-info-hint">Hover a user to show their information here</h3>
+
+ <div id="visible-user-info">
+
+ </div>
+ <div id="hidden-user-info" hidden>
+ {% for participant in jam.participants %}
+ <div class="user-info" id="user-info-{{ participant.user_id }}">
+ <img src="{{ participant.avatar }}" class="uk-border-circle avatar" />
+ <div class="uk-text-center">
+ <strong>{{ participant.username }}#{{ participant.discriminator }}</strong>
+ </div>
+ <div class="uk-text-center">
+ <span class="uk-text-muted">{{ participant.user_id }}</span>
+ </div>
+ <div class="uk-text-center">
+ <i class="uk-icon far fa-fw fa-clock"></i> {{ participant.profile.timezone }} |
+ <a href="https://gitlab.com/{{ participant.profile.gitlab_username }}">
+ <i class="uk-icon fab fa-fw fa-gitlab"></i> {{ participant.profile.gitlab_username }}
+ </a>
+ </div>
+ <hr class="uk-divider-icon" />
+
+ {% for answer in participant.answers %}
+ <strong>{{ questions[answer.question].title }}</strong>
+ <br/>
+ <span class="fira-code">{{ answer.value }}</span>
+ <br/>
+ <br/>
+ {% endfor %}
+ </div>
+ {% endfor %}
+ </div>
+ </div>
+ <div class="uk-section uk-flex-column uk-flex-stretch">
+ <h1>Code Jam {{ jam.number }}: Teams</h1>
+
+ <a class="uk-button uk-button-default" href="{{ url_for("staff.jams.index") }}"><i class="uk-icon fa-fw far fa-arrow-left"></i> &nbsp;Back</a>
+
+ {% if teams %}
+ <button class="uk-button uk-button-primary" id="init-button" disabled><i class="uk-icon fa-fw far fa-play"></i> &nbsp;Generate Teams</button>
+ {% else %}
+ <button class="uk-button uk-button-primary" id="init-button"><i class="uk-icon fa-fw far fa-play"></i> &nbsp;Generate Teams</button>
+ {% endif %}
+
+ <button class="uk-button uk-button-secondary" id="add-button"><i class="uk-icon fa-fw far fa-plus"></i> &nbsp;Add Team</button>
+ <br />
+ <br />
+ <div class="uk-hidden hidden-participants" hidden>
+ {% for participant in jam.participants %}
+ {% if participant.user_id not in assigned %}
+ <div class="uk-margin-small-bottom uk-margin-small-right uk-margin-small-top uk-margin-small-left" id="participant-line-{{ participant.user_id }}" title="{{ participant.user_id }}">
+ <span class="participant-handle" draggable="true" data-user-id="{{ participant.user_id }}">
+ <img class="uk-icon-image uk-border-circle" draggable="false" src="{{ participant.avatar }}" />
+ {{ participant.username }}#{{ participant.discriminator }} ({{ participant.profile.timezone }})
+ </span>
+ </div>
+ {% endif %}
+ {% endfor %}
+ </div>
+ <div class="uk-flex uk-flex-row uk-flex-wrap" id="participant-handles">
+ {% for participant in jam.participants %}
+ <div class="participant-handle uk-margin-small-bottom uk-margin-small-right uk-margin-small-top uk-margin-small-left" id="participant-{{ participant.user_id }}" title="{{ participant.profile.timezone }} - {{ participant.user_id }}" draggable="true" data-user-id="{{ participant.user_id }}">
+ <div class="uk-card uk-card-primary uk-card-small">
+ <div class="uk-card-body">
+ <img class="uk-icon-image uk-border-circle" draggable="false" src="{{ participant.avatar }}" />
+ {{ participant.username }}#{{ participant.discriminator }}
+ </div>
+ </div>
+ </div>
+ {% endfor %}
+ </div>
+
+ {% if not teams %}
+ <p id="no-teams-paragraph">No teams found.</p>
+
+ <div class="uk-flex uk-flex-row uk-flex-stretch uk-flex-wrap uk-flex-center" id="team-targets">
+ </div>
+ {% else %}
+ <p id="no-teams-paragraph" hidden="hidden">No teams found.</p>
+
+ <div class="uk-flex uk-flex-row uk-flex-stretch uk-flex-wrap uk-flex-center" id="team-targets">
+ {% for id, team in teams.items() %}
+ <div class="team-handle uk-margin-small-bottom uk-margin-small-right uk-margin-small-top uk-margin-small-left" id="team-{{ team.id }}" data-team-id="{{ team.id }}">
+ <div class="uk-card uk-card-default uk-card-small">
+ <div class="uk-card-header">
+ <h3 class="uk-card-title">{{ team.name }}</h3>
+ </div>
+ <div class="uk-card-body team-target" data-team-id="{{ team.id }}">
+ <p>Drop users here to assign them</p>
+
+ {% for user_id in team.members %}
+ <div class="uk-margin-small-bottom uk-margin-small-right uk-margin-small-top uk-margin-small-left" id="participant-line-{{ user_id }}" title="{{ participants[user_id].user_id }}">
+ <span class="participant-handle" draggable="true" data-user-id="{{ participants[user_id].user_id }}">
+ <img class="uk-icon-image uk-border-circle" draggable="false" src="{{ participants[user_id].avatar }}" />
+ {{ participants[user_id].username }}#{{ participants[user_id].discriminator }} ({{ participants[user_id].profile.timezone }})
+ </span>
+ </div>
+ {% endfor %}
+ </div>
+ <div class="uk-card-footer uk-text-right">
+ <button class="team-reroll-button uk-button uk-button-primary uk-button-small" data-team-id="{{ team.id }}">
+ <i class="uk-icon fa-fw far fa-dice"></i>
+ </button>
+ <button class="team-delete-button uk-button uk-button-danger uk-button-small" data-team-id="{{ team.id }}">
+ <i class="uk-icon fa-fw far fa-trash"></i>
+ </button>
+ </div>
+ </div>
+ </div>
+ {% endfor %}
+ </div>
+ {% endif %}
+ </div>
+ </div>
+
+ <script type="application/javascript">
+ "use strict";
+ const jam = parseInt("{{ jam.number }}");
+ const actions = new JamActions("{{ url_for("staff.jams.action") }}", "{{ csrf_token() }}");
+
+ $("#init-button").on(
+ "click",
+ () => actions.generate_teams(jam, (result, data) => {
+ if (result) {
+ data.teams.forEach( (team) => {
+ let elem = `
+ <div class="team-handle uk-margin-small-bottom uk-margin-small-right uk-margin-small-top uk-margin-small-left" id="team-${team.id}" data-team-id="${team.id}">
+ <div class="uk-card uk-card-default uk-card-small">
+ <div class="uk-card-header">
+ <h3 class="uk-card-title">${team.name}</h3>
+ </div>
+ <div class="uk-card-body team-target" data-team-id="${team.id}">
+ <p>Drop users here to assign them</p>
+ </div>
+ <div class="uk-card-footer uk-text-right">
+ <button class="team-reroll-button uk-button uk-button-primary uk-button-small" data-team-id="${team.id}">
+ <i class="uk-icon fa-fw far fa-dice"></i>
+ </button>
+ <button class="team-delete-button uk-button uk-button-danger uk-button-small" data-team-id="${team.id}">
+ <i class="uk-icon fa-fw far fa-trash"></i>
+ </button>
+ </div>
+ </div>
+ </div>`;
+
+ $("#team-targets").append(elem);
+ assign_handlers();
+ });
+
+ $("#init-button").prop('disabled', true);
+
+ UIkit.notification({
+ "message": `Generated ${data.teams.length} teams`,
+ "status": "success",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ } else {
+ console.log(data);
+
+ UIkit.notification({
+ "message": "Failed to generate teams",
+ "status": "danger",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ }
+ })
+ );
+
+ $("#add-button").on(
+ "click",
+ () => actions.create_team(jam, (result, data) => {
+ if (result) {
+ let team = data.team;
+ let elem = `
+ <div class="team-handle uk-margin-small-bottom uk-margin-small-right uk-margin-small-top uk-margin-small-left" id="team-${team.id}" data-team-id="${team.id}">
+ <div class="uk-card uk-card-default uk-card-small">
+ <div class="uk-card-header">
+ <h3 class="uk-card-title">${team.name}</h3>
+ </div>
+ <div class="uk-card-body team-target" data-team-id="${team.id}">
+ <p>Drop users here to assign them</p>
+ </div>
+ <div class="uk-card-footer uk-text-right">
+ <button class="team-reroll-button uk-button uk-button-primary uk-button-small" data-team-id="${team.id}">
+ <i class="uk-icon fa-fw far fa-dice"></i>
+ </button>
+ <button class="team-delete-button uk-button uk-button-danger uk-button-small" data-team-id="${team.id}">
+ <i class="uk-icon fa-fw far fa-trash"></i>
+ </button>
+ </div>
+ </div>
+ </div>`;
+
+ $("#team-targets").append(elem);
+ assign_handlers();
+
+ UIkit.notification({
+ "message": `Created team: ${team.name}`,
+ "status": "success",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ } else {
+ console.log(data);
+
+ UIkit.notification({
+ "message": "Failed to create team",
+ "status": "danger",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ }
+ })
+ );
+
+ $(".participant-handle").on(
+ "dragstart",
+ (e) => {
+ e.originalEvent.dataTransfer.setData(
+ "pydis/member",
+ e.target.getAttribute("data-user-id")
+ );
+ }
+ ).on(
+ "mouseenter",
+ (e) => {
+ $("#user-info-hint").prop("hidden", true);
+ $(".user-info").appendTo("#hidden-user-info");
+
+ console.log(e.target);
+ let target = e.target;
+ let member = target.getAttribute("data-user-id");
+
+ if (member === null) {
+ target = e.target.parentNode.parentNode;
+ member = target.getAttribute("data-user-id");
+ }
+
+ console.log(member);
+
+ $(`#user-info-${member}`).appendTo("#visible-user-info");
+ }
+ );
+
+ function drag_over(e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ e.originalEvent.dropEffect = "move";
+ }
+
+ function drop(e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ let member = e.originalEvent.dataTransfer.getData("pydis/member");
+
+ if (!member) {
+ return;
+ }
+
+ let target = e.target;
+
+ if (target.tagName === "p" || target.tagName === "P") {
+ target = target.parentNode;
+ }
+
+ let team = target.getAttribute("data-team-id");
+
+ $(`#participant-line-${member}`).appendTo(target);
+ actions.set_team_member(jam, member, team, (result, data) => {
+ if (result) {
+ UIkit.notification({
+ "message": `Team assigned successfully`,
+ "status": "success",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ } else {
+ console.log(data);
+
+ UIkit.notification({
+ "message": "Failed to assign user to team",
+ "status": "danger",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ }
+ });
+ }
+
+ function reroll_team(e) {
+ let team = this.getAttribute("data-team-id");
+
+ actions.reroll_team(team, (result, data) => {
+ if (result) {
+ $(`#team-${team}`).find("h3").text(data.name);
+
+ UIkit.notification({
+ "message": `Team rerolled: ${data.name}`,
+ "status": "success",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ } else {
+ console.log(data);
+
+ UIkit.notification({
+ "message": "Failed to reroll team",
+ "status": "danger",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ }
+ })
+ }
+
+ function delete_team(e) {
+ let team = this.getAttribute("data-team-id");
+
+ actions.delete_team(team, (result, data) => {
+ if (result) {
+ let target = $(`#team-${team}`);
+
+ target.find(".team-target").children("div").appendTo(".hidden-participants");
+ target.remove();
+ } else {
+ console.log(data);
+
+ UIkit.notification({
+ "message": "Failed to delete team",
+ "status": "danger",
+ "pos": "bottom-center",
+ "timeout": 5000
+ });
+ }
+ })
+ }
+
+ function assign_handlers() {
+ $(".team-target").off("dragover").off("drop").on("dragover", drag_over).on("drop", drop);
+ $(".team-reroll-button").off("click").on("click", reroll_team);
+ $(".team-delete-button").off("click").on("click", delete_team);
+ }
+
+ assign_handlers();
+ </script>
+{% endblock %}