external/aurweb
0
0
Fork 0
mirror of https://gitlab.archlinux.org/archlinux/aurweb.git synced 2025-02-03 10:43:03 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

port over base HTML layout from PHP to FastAPI+Jinja2

Browse source 
+ Mounted static files (at web/html) to /static.
+ Added AURWEB_VERSION to aurweb.config (this is used around HTML
  to refer back to aurweb's release on git.archlinux.org), so we
  need it easily accessible in the Python codebase.
+ Implemented basic Jinja2 partials to put together whole aurweb
  pages. This may be missing some things currently and is a WIP
  until this set is ready to be merged.
+ Added config [options] aurwebdir = YOUR_AUR_ROOT; this configuration
  option should specify the root directory of the aurweb project.
  It is used by various parts of the FastAPI codebase to target
  project directories.

Added routes via aurweb.routers.html:
    * POST /language: Set your session language.
    * GET /favicon.ico: Redirect to /static/images/favicon.ico.
        * Some browsers always look for $ROOT/favicon.ico to get an icon
          for the page being loaded, regardless of a specified "shortcut
          icon" given in a <link> directive.
    * GET /: Home page; WIP.

* Updated aurweb.routers.html.language passes query parameters to
  its next redirection.

When calling aurweb.templates.render_template, the context passed should
be formed via the aurweb.templates.make_context. See
aurweb.routers.html.index for an example of this.

Signed-off-by: Kevin Morris <kevr@0cost.org>
This commit is contained in:
Kevin Morris 2021-03-29 15:20:04 -07:00
parent 1ff822bb14
commit 2df90ce280
18 changed files with 339 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

4
templates/index.html Normal file
View file

@ -0,0 +1,4 @@
{% extends 'partials/layout.html' %}
{% block pageContent %}
{% endblock %}

8
templates/partials/archdev-navbar.html Normal file
View file

@ -0,0 +1,8 @@
<div id="archdev-navbar">
<ul>
<li><a href="/">AUR {% trans %}Home{% endtrans %}</a></li>
<li><a href="/packages/">{% trans %}Packages{% endtrans %}</a></li>
<li><a href="/register/">{% trans %}Register{% endtrans %}</a></li>
<li><a href="/login/">{% trans %}Login{% endtrans %}</a></li>
</ul>
</div>

10
templates/partials/body.html Normal file
View file

@ -0,0 +1,10 @@
<div id="content">
{% include 'partials/set_lang.html' %}
{% include 'partials/archdev-navbar.html' %}
{% block pageContent %}
<!-- Content block to be defined by extender. -->
{% endblock %}
{% include 'partials/footer.html' %}
</div>

5
templates/partials/footer.html Normal file
View file

@ -0,0 +1,5 @@
<div id="footer">
<p>aurweb <a href="https://git.archlinux.org/aurweb.git/log/?h={{ config.AURWEB_VERSION }}">{{ config.AURWEB_VERSION }}</a></p>
<p>Copyright &copy; 2004-{{ now.strftime("%Y") }} aurweb Development Team.</p>
<p>{% trans %}AUR packages are user produced content. Any use of the provided files is at your own risk.{% endtrans %}</p>
</div>

16
templates/partials/head.html Normal file
View file

@ -0,0 +1,16 @@
<head>
{% include 'partials/meta.html' %}
<!-- CSS -->
<link rel="stylesheet" href="/static/css/archweb.css">
<link rel="stylesheet" href="/static/css/aurweb.css">
<!-- Resources -->
<link rel="shortcut icon" href="/static/images/favicon.ico">
<!-- Alternate resources -->
<link rel="alternate" type="application/rss+xml"
title="Newest Packages RSS" href="/rss/">
<title>AUR ({{ language }}) - {{ title | tr }}</title>
</head>

10
templates/partials/layout.html Normal file
View file

@ -0,0 +1,10 @@
<!DOCTYPE html>
<html lang="{{ language }}">
{% include 'partials/head.html' %}
<body>
{% include 'partials/navbar.html' %}
{% extends 'partials/body.html' %}
{% include 'partials/typeahead.html' %}
</body>
</html>

1
templates/partials/meta.html Normal file
View file

@ -0,0 +1 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

19
templates/partials/navbar.html Normal file
View file

@ -0,0 +1,19 @@
<div id="archnavbar" class="anb-aur">
<div id="archnavbarlogo">
<h1>
<a href="/" title="Return to the main page">{% trans %}Arch Linux User Repository{% endtrans %}</a>
</h1>
</div>
<div id="archnavbarmenu">
<ul id="archnavbarlist">
<li id="anb-home"><a href="https://www.archlinux.org/" title="Arch news, packages, projects and more">{% trans %}Home{% endtrans %}</a></li>
<li id="anb-packages"><a href="https://www.archlinux.org/packages/" title="Arch Package Database">{% trans %}Packages{% endtrans %}</a></li>
<li id="anb-forums"><a href="https://bbs.archlinux.org/" title="Community forums">{% trans %}Forums{% endtrans %}</a></li>
<li id="anb-wiki"><a href="https://wiki.archlinux.org/" title="Community documentation">{% trans %}Wiki{% endtrans %}</a></li>
<li id="anb-bugs"><a href="https://bugs.archlinux.org/" title="Report and track bugs">{% trans %}Bugs{% endtrans %}</a></li>
<li id="anb-security"><a href="https://security.archlinux.org/" title="Arch Linux Security Tracker">{% trans %}Security{% endtrans %}</a></li>
<li id="anb-aur"><a href="/" title="Arch Linux User Repository">AUR</a></li>
<li id="anb-download"><a href="https://www.archlinux.org/download/" title="Get Arch Linux">{% trans %}Download{% endtrans %}</a></li>
</ul>
</div>
</div>

28
templates/partials/set_lang.html Normal file
View file

@ -0,0 +1,28 @@
<div id="lang_sub">
<form method="post" action="/language">
<fieldset>
<div>
<select id="id_setlang" name="set_lang">
{% for domain, display in languages.items() %}
<option
value="{{ domain }}"
{% if language == domain %}
selected="selected"
{% endif %}
>
{{ display }}
</option>
{% endfor %}
</select>
<!-- Pass our current url path as next. -->
<input type="hidden" name="next" value="{{ request.url.path }}">
<!-- Pass query_params over to /language via POST. -->
<input type="hidden" name="q" value="{{ request.query_params }}">
<input type="submit" value="Go">
</div>
</fieldset>
</form>
</div>

30
templates/partials/typeahead.html Normal file
View file

@ -0,0 +1,30 @@
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="/static/js/bootstrap-typeahead.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#pkgsearch-field').typeahead({
source: function(query, callback) {
$.getJSON('/rpc', {type: "suggest", arg: query}, function(data) {
callback(data);
});
},
matcher: function(item) { return true; },
sorter: function(items) { return items; },
menu: '<ul class="pkgsearch-typeahead"></ul>',
items: 20,
updater: function(item) {
document.location = '/packages/' + item;
return item;
}
}).attr('autocomplete', 'off');
$('#pkgsearch-field').keydown(function(e) {
if (e.keyCode == 13) {
var selectedItem = $('ul.pkgsearch-typeahead li.active');
if (selectedItem.length == 0) {
$('#pkgsearch-form').submit();
}
}
});
});
</script>