From 7aa51e889a13fa43faba080d46204a1900ddb1a3 Mon Sep 17 00:00:00 2001
From: Baoshuo <i@baoshuo.ren>
Date: Sun, 25 Sep 2022 10:44:33 +0800
Subject: [PATCH] refactor: hack detail page with bs5

---
 web/app/controllers/hack.php       |  28 +++++++-
 web/app/controllers/submission.php |   2 +-
 web/app/libs/uoj-html-lib.php      | 102 +++++++++++++++++++++++++----
 3 files changed, 117 insertions(+), 15 deletions(-)

diff --git a/web/app/controllers/hack.php b/web/app/controllers/hack.php
index d152c68..a60cc87 100644
--- a/web/app/controllers/hack.php
+++ b/web/app/controllers/hack.php
@@ -12,6 +12,11 @@
 	if (!validateUInt($_GET['id']) || !($hack = queryHack($_GET['id']))) {
 		become404Page();
 	}
+
+	if (!isset($_COOKIE['bootstrap4'])) {
+		$REQUIRE_LIB['bootstrap5'] = '';
+	}
+
 	$submission = querySubmission($hack['submission_id']);	
 	$problem = queryProblemBrief($submission['problem_id']);
 	$problem_extra_config = getProblemExtraConfig($problem);
@@ -62,17 +67,27 @@
 	}
 	?>
 <?php
-	$REQUIRE_LIB['shjs'] = "";
+	if (isset($REQUIRE_LIB['bootstrap5'])) {
+		$REQUIRE_LIB['hljs'] = '';
+	} else {
+		$REQUIRE_LIB['shjs'] = '';
+	}
 	?>
 <?php echoUOJPageHeader(UOJLocale::get('problems::hack').' #'.$hack['id']) ?>
 
-<?php echoHackListOnlyOne($hack, array(), $myUser) ?>
+<h1 class="h3">
+	<?= UOJLocale::get('problems::hack').' #'.$hack['id'] ?>
+</h1>
+
+<?php echoHackListOnlyOne($hack, array('id_hidden' => ''), $myUser) ?>
 <?php if ($should_show_all_details): ?>
-	<div class="card border-info">
+	<div class="card border-info mb-3">
 		<div class="card-header bg-info">
 			<h4 class="card-title"><?= UOJLocale::get('details') ?></h4>
 		</div>
+		<?php if (!isset($REQUIRE_LIB['bootstrap5'])): ?>
 		<div class="card-body">
+		<?php endif ?>
 			<?php echoJudgementDetails($hack['details'], $styler, 'details') ?>
 			<?php if ($should_show_details_to_me): ?>
 				<?php if ($styler->fade_all_details): ?>
@@ -80,9 +95,16 @@
 					<?php echoHackDetails($hack['details'], 'final_details') ?>
 				<?php endif ?>
 			<?php endif ?>
+		<?php if (!isset($REQUIRE_LIB['bootstrap5'])): ?>
 		</div>
+		<?php endif ?>
 	</div>
 <?php endif ?>
+
+<h2 class="h3">
+	<?= UOJLocale::get('problems::submission').' #'.$submission['id'] ?>
+</h2>
+
 <?php echoSubmissionsListOnlyOne($submission, array(), $myUser) ?>
 <?php if ($should_show_content): ?>
 	<?php echoSubmissionContent($submission, getProblemSubmissionRequirement($problem)) ?>
diff --git a/web/app/controllers/submission.php b/web/app/controllers/submission.php
index 0038156..ed2e678 100644
--- a/web/app/controllers/submission.php
+++ b/web/app/controllers/submission.php
@@ -154,7 +154,7 @@
 	<?= UOJLocale::get('problems::submission').' #'.$submission['id'] ?>
 </h1>
 
-<?php echoSubmissionsListOnlyOne($submission, array(), $myUser) ?>
+<?php echoSubmissionsListOnlyOne($submission, array('id_hidden' => ''), $myUser) ?>
 
 <?php if ($should_show_content): ?>
 	<?php echoSubmissionContent($submission, getProblemSubmissionRequirement($problem)) ?>
diff --git a/web/app/libs/uoj-html-lib.php b/web/app/libs/uoj-html-lib.php
index 3e56dcc..ea3664a 100644
--- a/web/app/libs/uoj-html-lib.php
+++ b/web/app/libs/uoj-html-lib.php
@@ -299,12 +299,28 @@ function echoSubmission($submission, $config, $user) {
 		echo '<td>';
 		if ($status == 'Judged') {
 			if ($submission['score'] == null) {
-				echo '<a href="/submission/', $submission['id'], '" class="small">', $submission['result_error'], '</a>';
+				echo '<a ';
+		
+				if (isset($REQUIRE_LIB['bootstrap5'])) {
+					echo ' class="text-decoration-none small" ';
+				} else {
+					echo ' class="small" ';
+				}
+		
+				echo ' href="/submission/', $submission['id'], '">', $submission['result_error'], '</a>';
 			} else {
 				echo '<a href="/submission/', $submission['id'], '" class="uoj-score">', $submission['score'], '</a>';
 			}
 		} else {
-			echo '<a href="/submission/', $submission['id'], '" class="small">', $status, '</a>';
+			echo '<a ';
+		
+			if (isset($REQUIRE_LIB['bootstrap5'])) {
+				echo ' class="text-decoration-none small" ';
+			} else {
+				echo ' class="small" ';
+			}
+	
+			echo ' href="/submission/', $submission['id'], '">', $status, '</a>';
 		}
 		echo '</td>';
 	}
@@ -757,7 +773,13 @@ class JudgementDetailsPrinter {
 				echo htmlspecialchars($test_info);
 				echo '</div>';
 			} else {
-				echo '<div class="col-sm-4">';
+				if (isset($REQUIRE_LIB['bootstrap5'])) {
+					echo '<div class="col-sm-4 uoj-status-text">';
+
+					echo $this->styler->getTestInfoIcon($test_info);
+				} else {
+					echo '<div class="col-sm-4">';
+				}
 				echo htmlspecialchars($test_info);
 				echo '</div>';
 			}
@@ -994,6 +1016,19 @@ class HackDetailsStyler {
 			return 'card-uoj-wrong';
 		}
 	}
+	public function getTestInfoIcon($test_info) {
+		if ($test_info == 'Accepted' || $test_info == 'Extra Test Passed') {
+			return '<i class="bi bi-check-lg"></i> ';
+		} elseif ($test_info == 'Time Limit Exceeded') {
+			return '<i class="bi bi-clock"></i> ';
+		} elseif ($test_info == 'Acceptable Answer') {
+			return '<i class="bi bi-dash-square"></i> ';
+		} elseif ($test_info == 'Wrong Answer') {
+			return '<i class="bi bi-x-lg"></i> ';
+		} else {
+			return '<i class="bi bi-slash-circle"></i> ';
+		}
+	}
 	public function shouldFadeDetails($info) {
 		return $this->fade_all_details;
 	}
@@ -1008,6 +1043,8 @@ function echoCustomTestSubmissionDetails($submission_details, $name) {
 	echoJudgementDetails($submission_details, new CustomTestSubmissionDetailsStyler(), $name);
 }
 function echoHackDetails($hack_details, $name) {
+	global $REQUIRE_LIB;
+	
 	echoJudgementDetails($hack_details, new HackDetailsStyler(), $name);
 }
 
@@ -1015,10 +1052,22 @@ function echoHack($hack, $config, $user) {
 	$problem = queryProblemBrief($hack['problem_id']);
 	echo '<tr>';
 	if (!isset($config['id_hidden'])) {
-		echo '<td><a href="/hack/', $hack['id'], '">#', $hack['id'], '</a></td>';
+		echo '<td><a ';
+		
+		if (isset($REQUIRE_LIB['bootstrap5'])) {
+			echo ' class="text-decoration-none" ';
+		}
+
+		echo ' href="/hack/', $hack['id'], '">#', $hack['id'], '</a></td>';
 	}
 	if (!isset($config['submission_hidden'])) {
-		echo '<td><a href="/submission/', $hack['submission_id'], '">#', $hack['submission_id'], '</a></td>';
+		echo '<td><a ';
+		
+		if (isset($REQUIRE_LIB['bootstrap5'])) {
+			echo ' class="text-decoration-none" ';
+		}
+
+		echo ' href="/submission/', $hack['submission_id'], '">#', $hack['submission_id'], '</a></td>';
 	}
 	if (!isset($config['problem_hidden'])) {
 		if ($hack['contest_id']) {
@@ -1035,13 +1084,37 @@ function echoHack($hack, $config, $user) {
 	}
 	if (!isset($config['result_hidden'])) {
 		if ($hack['judge_time'] == null) {
-			echo '<td><a href="/hack/', $hack['id'], '">Waiting</a></td>';
+			echo '<td><a ';
+		
+			if (isset($REQUIRE_LIB['bootstrap5'])) {
+				echo ' class="text-decoration-none" ';
+			}
+	
+			echo ' href="/hack/', $hack['id'], '">Waiting</a></td>';
 		} elseif ($hack['success'] == null) {
-			echo '<td><a href="/hack/', $hack['id'], '">Judging</a></td>';
+			echo '<td><a ';
+		
+			if (isset($REQUIRE_LIB['bootstrap5'])) {
+				echo ' class="text-decoration-none" ';
+			}
+	
+			echo ' href="/hack/', $hack['id'], '">Judging</a></td>';
 		} elseif ($hack['success']) {
-			echo '<td><a href="/hack/', $hack['id'], '" class="uoj-status" data-success="1"><strong>Success!</strong></a></td>';
+			echo '<td><a href="/hack/', $hack['id'], '" class="uoj-status ';
+		
+			if (isset($REQUIRE_LIB['bootstrap5'])) {
+				echo ' text-decoration-none ';
+			}
+	
+			echo ' " data-success="1"><strong>Success!</strong></a></td>';
 		} else {
-			echo '<td><a href="/hack/', $hack['id'], '" class="uoj-status" data-success="0"><strong>Failed.</strong></a></td>';
+			echo '<td><a href="/hack/', $hack['id'], '" class="uoj-status ';
+		
+			if (isset($REQUIRE_LIB['bootstrap5'])) {
+				echo ' text-decoration-none ';
+			}
+	
+			echo ' " data-success="0"><strong>Failed.</strong></a></td>';
 		}
 	} else {
 		echo '<td>Hidden</td>';
@@ -1055,8 +1128,15 @@ function echoHack($hack, $config, $user) {
 	echo '</tr>';
 }
 function echoHackListOnlyOne($hack, $config, $user) {
-	echo '<div class="table-responsive">';
-	echo '<table class="table table-bordered table-text-center">';
+	global $REQUIRE_LIB;
+	
+	if (isset($REQUIRE_LIB['bootstrap5'])) {
+		echo '<div class="card mb-3">';
+		echo '<table class="table text-center uoj-table mb-0">';
+	} else {
+		echo '<div class="table-responsive">';
+		echo '<table class="table table-bordered table-text-center">';
+	}
 	echo '<thead>';
 	echo '<tr>';
 	if (!isset($config['id_hidden'])) {