Refactor web UI to use HTML frames layout
Replace single-page layout with a frameset: left navigation frame with repo dropdown and page links, right content frame showing the selected page. Split the repo page into separate sub-pages: branches, changes, remote, and manage. Uses <frameset> for maximum compatibility with ancient browsers (Netscape 2+, IE 3+). Clone and delete forms target _top to reload the full frameset when the repo list changes. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title th:text="'Branches - ' + ${name}">Branches</title>
|
||||
</head>
|
||||
<body>
|
||||
<h2>Branches</h2>
|
||||
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>Current branch:</td>
|
||||
<td><b th:text="${currentBranch}"></b></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<h3>Switch Branch</h3>
|
||||
<form method="post" th:action="@{/repo/{name}/checkout(name=${name})}">
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>
|
||||
<select name="branch">
|
||||
<option th:each="b : ${branches}" th:value="${b}" th:text="${b}" th:selected="${b == currentBranch}"></option>
|
||||
</select>
|
||||
</td>
|
||||
<td><input type="submit" value="Checkout"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
|
||||
<h3>Create New Branch</h3>
|
||||
<form method="post" th:action="@{/repo/{name}/new-branch(name=${name})}">
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td><input type="text" name="branch" size="20"></td>
|
||||
<td><input type="submit" value="Create"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,41 +1,10 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title th:text="'WebGit - ' + ${name}">WebGit - repo</title>
|
||||
<title th:text="'Changes - ' + ${name}">Changes</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1><a href="/">WebGit</a></h1>
|
||||
<h2 th:text="${name}">repo</h2>
|
||||
|
||||
<h3>Branch</h3>
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>Current branch:</td>
|
||||
<td><b th:text="${currentBranch}"></b></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>
|
||||
<form method="post" th:action="@{/repo/{name}/checkout(name=${name})}">
|
||||
Switch to:
|
||||
<select name="branch">
|
||||
<option th:each="b : ${branches}" th:value="${b}" th:text="${b}" th:selected="${b == currentBranch}"></option>
|
||||
</select>
|
||||
<input type="submit" value="Checkout">
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="post" th:action="@{/repo/{name}/new-branch(name=${name})}">
|
||||
New branch: <input type="text" name="branch" size="20">
|
||||
<input type="submit" value="Create">
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<hr>
|
||||
<h2>Changes</h2>
|
||||
|
||||
<h3>Modified Files (unstaged)</h3>
|
||||
<form method="post" th:action="@{/repo/{name}/stage(name=${name})}" th:if="${!#lists.isEmpty(modifiedFiles)}">
|
||||
@@ -81,30 +50,5 @@ New branch: <input type="text" name="branch" size="20">
|
||||
</table>
|
||||
</form>
|
||||
|
||||
<hr>
|
||||
|
||||
<h3>Remote</h3>
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>
|
||||
<form method="post" th:action="@{/repo/{name}/push(name=${name})}">
|
||||
<input type="submit" value="Push">
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="post" th:action="@{/repo/{name}/pull(name=${name})}">
|
||||
<input type="submit" value="Pull">
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<hr>
|
||||
|
||||
<h3>Danger Zone</h3>
|
||||
<form method="post" th:action="@{/repo/{name}/delete(name=${name})}">
|
||||
<input type="submit" value="Delete Repository">
|
||||
</form>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Clone Repository</title>
|
||||
</head>
|
||||
<body>
|
||||
<h2>Clone a Repository</h2>
|
||||
<form method="post" action="/clone" target="_top">
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>URL:</td>
|
||||
<td><input type="text" name="url" size="60"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Name:</td>
|
||||
<td><input type="text" name="name" size="30"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><input type="submit" value="Clone"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,14 @@
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title>WebGit</title>
|
||||
</head>
|
||||
<frameset cols="180,*">
|
||||
<frame th:src="${selectedRepo != null} ? '/nav?repo=' + ${selectedRepo} : '/nav'" name="nav">
|
||||
<frame th:src="${selectedRepo != null} ? '/repo/' + ${selectedRepo} + '/branches' : '/welcome'" name="content">
|
||||
<noframes>
|
||||
<body>
|
||||
<p>Your browser does not support frames. <a href="/repos">Click here</a> to continue.</p>
|
||||
</body>
|
||||
</noframes>
|
||||
</frameset>
|
||||
</html>
|
||||
@@ -1,43 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title>WebGit</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>WebGit</h1>
|
||||
|
||||
<h2>Repositories</h2>
|
||||
<table border="1" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
<tr th:each="repo : ${repositories}">
|
||||
<td th:text="${repo}"></td>
|
||||
<td><a th:href="@{/repo/{name}(name=${repo})}">Open</a></td>
|
||||
</tr>
|
||||
<tr th:if="${#lists.isEmpty(repositories)}">
|
||||
<td colspan="2"><i>No repositories cloned yet.</i></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<h2>Clone a Repository</h2>
|
||||
<form method="post" action="/clone">
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>URL:</td>
|
||||
<td><input type="text" name="url" size="60"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Name:</td>
|
||||
<td><input type="text" name="name" size="30"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><input type="submit" value="Clone"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,16 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title th:text="'Manage - ' + ${name}">Manage</title>
|
||||
</head>
|
||||
<body>
|
||||
<h2>Manage Repository</h2>
|
||||
|
||||
<h3>Danger Zone</h3>
|
||||
<p>This will permanently delete the repository and its working tree.</p>
|
||||
<form method="post" th:action="@{/repo/{name}/delete(name=${name})}" target="_top">
|
||||
<input type="submit" value="Delete Repository">
|
||||
</form>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,33 @@
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title>Navigation</title>
|
||||
</head>
|
||||
<body>
|
||||
<b>WebGit</b>
|
||||
<hr>
|
||||
|
||||
<form method="get" action="/" target="_top">
|
||||
<select name="repo">
|
||||
<option value="">-- Select repo --</option>
|
||||
<option th:each="r : ${repositories}" th:value="${r}" th:text="${r}" th:selected="${r == selectedRepo}"></option>
|
||||
</select>
|
||||
<br>
|
||||
<input type="submit" value="Go">
|
||||
</form>
|
||||
|
||||
<hr>
|
||||
|
||||
<a href="/repos" target="content">Repositories</a><br>
|
||||
<a href="/clone-form" target="content">Clone New</a><br>
|
||||
|
||||
<th:block th:if="${selectedRepo != null}">
|
||||
<hr>
|
||||
<b th:text="${selectedRepo}"></b><br>
|
||||
<a th:href="@{/repo/{name}/branches(name=${selectedRepo})}" target="content">Branches</a><br>
|
||||
<a th:href="@{/repo/{name}/changes(name=${selectedRepo})}" target="content">Changes</a><br>
|
||||
<a th:href="@{/repo/{name}/remote(name=${selectedRepo})}" target="content">Remote</a><br>
|
||||
<a th:href="@{/repo/{name}/manage(name=${selectedRepo})}" target="content">Manage</a><br>
|
||||
</th:block>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title th:text="'Remote - ' + ${name}">Remote</title>
|
||||
</head>
|
||||
<body>
|
||||
<h2>Remote</h2>
|
||||
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td>
|
||||
<form method="post" th:action="@{/repo/{name}/push(name=${name})}">
|
||||
<input type="submit" value="Push">
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="post" th:action="@{/repo/{name}/pull(name=${name})}">
|
||||
<input type="submit" value="Pull">
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<title>Repositories</title>
|
||||
</head>
|
||||
<body>
|
||||
<h2>Repositories</h2>
|
||||
<table border="1" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
<tr th:each="repo : ${repositories}">
|
||||
<td th:text="${repo}"></td>
|
||||
<td><a th:href="@{/repo/{name}/branches(name=${repo})}">Open</a></td>
|
||||
</tr>
|
||||
<tr th:if="${#lists.isEmpty(repositories)}">
|
||||
<td colspan="2"><i>No repositories cloned yet.</i></td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,9 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>WebGit</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Welcome to WebGit</h1>
|
||||
<p>Select a repository from the menu on the left, or clone a new one.</p>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user