appstore: initialize i18n stuff

This commit is contained in:
Alexandre Aubin
2023-09-05 20:24:38 +02:00
parent fdad58a45d
commit 55e0a098ef
13 changed files with 473 additions and 99 deletions

View File

@ -1,4 +1,3 @@
{% set locale = 'en' %}
{% extends "base.html" %}
{% block main %}
<div class="max-w-screen-md mx-auto pt-5">
@ -15,7 +14,7 @@
<h2 class="pl-2 pt-3 text-3xl font-bold text-gray-900">{{ infos["manifest"]["name"] }}</h2>
{% if infos['category'] %}
<span class="ml-2 mb-1 rounded-full px-2.5 py-0.5 text-[10px] border text-{{ catalog['categories'][infos['category']]['color'] }}-500 border-{{ catalog['categories'][infos['category']]['color'] }}-400 ">
{{ catalog['categories'][infos['category']]['title'][locale].lower() }}
{{ catalog['categories'][infos['category']]['title']|localize|lower }}
</span>
{% endif %}
<div class="grow"></div>
@ -65,7 +64,7 @@
href="{{ infos["manifest"]["upstream"]["demo"] }}"
>
<i class="fa fa-external-link fa-fw" aria-hidden="true"></i>
Try the demo
{{ _("Try the demo") }}
</a>
{% endif %}
</div>
@ -77,9 +76,9 @@
</span>
<p class="text-sm text-slate-500">Current version: {{ infos["manifest"]["version"] }}</p>
<p class="text-sm text-slate-500">{{ _("Current version: %(version)s", version=infos["manifest"]["version"]) }}</p>
{% if infos["potential_alternative_to"] %}
<p class="text-sm text-slate-500">Potential alternative to: {{ infos["potential_alternative_to"]|join(', ') }}</p>
<p class="text-sm text-slate-500">{{ _("Potential alternative to: %(alternatives)s", alternatives=infos["potential_alternative_to"]|join(', ')) }}</p>
{% endif %}
<div class="from-markdown">{{ infos["full_description_html"]|safe }}</div>
@ -90,44 +89,45 @@
{% if infos["manifest"]["integration"]["architectures"] != "all" %}
<div class="my-3 rounded-md bg-orange-200 text-orange-800 px-5 py-2">
<i class="fa fa-exclamation-triangle fa-fw"></i> This app is only compatible with these specific architectures : {{ infos["manifest"]["integration"]["architectures"]|join(', ') }}
<i class="fa fa-exclamation-triangle fa-fw"></i> {{ _("This app is only compatible with these specific architectures: %(archs)s", archs=infos["manifest"]["integration"]["architectures"]|join(', ')) }}
</div>
{% endif %}
{% if infos["manifest"]["integration"]["ram"]["build_binary"] >= 500 * 1024 * 1024 %}
<div class="my-3 rounded-md bg-orange-200 text-orange-800 px-5 py-2">
<i class="fa fa-exclamation-triangle fa-fw"></i> This app requires an unusual amount of RAM to build : {{ infos["manifest"]["integration"]["ram"]["build"] }}
<i class="fa fa-exclamation-triangle fa-fw"></i> {{ _("This app requires an unusual amount of RAM to install: %(ram)s", ram=infos["manifest"]["integration"]["ram"]["build"]) }}
</div>
{% endif %}
{% if infos["pre_install_html"] %}
<div class="my-3 rounded-md bg-blue-200 text-blue-800 px-5 py-2">
<h3 class="inline-block text-xl mb-2 font-semibold">Important infos before installing</h3>
<h3 class="inline-block text-xl mb-2 font-semibold">{{ _("Important infos before installing") }}</h3>
<div class="from-markdown">{{ infos["pre_install_html"] | safe }}</div>
</div>
{% endif %}
{% if infos["antifeatures"] %}
<h3 class="inline-block text-xl mb-2 font-semibold">Anti-features</h3> <p class="inline-block text-sm">(This app has features you may not like)</p>
<h3 class="inline-block text-xl mb-2 font-semibold">{{ _("Anti-features") }}</h3>
<p class="inline-block text-sm">{{ _("(This app has features you may not like)") }}</p>
<div class="my-3 rounded-md bg-red-200 text-red-800 px-5 py-2">
<ul>
{% for antifeature in infos["antifeatures"] %}
<li class="mb-1"><i class="fa fa-{{ catalog['antifeatures'][antifeature]['icon'] }} fa-fw" aria-hidden="true"></i> {{ catalog['antifeatures'][antifeature]['description'][locale] }}</li>
<li class="mb-1"><i class="fa fa-{{ catalog['antifeatures'][antifeature]['icon'] }} fa-fw" aria-hidden="true"></i> {{ catalog['antifeatures'][antifeature]['description']|localize }}</li>
{% endfor %}
</ul>
</div>
{% endif %}
<h3 class="text-xl mb-2 font-semibold">Useful links</h3>
<h3 class="text-xl mb-2 font-semibold">{{ _("Useful links") }}</h3>
<div>
{% set upstream = infos["manifest"]["upstream"] %}
<a class="block btn btn-link my-1" href="https://spdx.org/licenses/{{upstream.license}}"><i class="fa fa-institution fa-fw" aria-hidden="true"></i> License : {{ upstream.license }}</a>
{% if upstream.website %}<a class="block btn btn-link my-1" href="{{ upstream.website }}"><i class="fa fa-globe fa-fw" aria-hidden="true"></i> Official website</a>{% endif %}
{% if upstream.admindoc %}<a class="block btn btn-link my-1" href="{{ upstream.admindoc }}"><i class="fa fa-book fa-fw" aria-hidden="true"></i> Official admin documentation</a>{% endif %}
{% if upstream.userdoc %}<a class="block btn btn-link my-1" href="{{ upstream.userdoc }}"><i class="fa fa-book fa-fw" aria-hidden="true"></i> Official user documentation</a>{% endif %}
{% if upstream.code %}<a class="block btn btn-link my-1" href="{{ upstream.code }}"><i class="fa fa-code fa-fw" aria-hidden="true"></i> Official code repository</a>{% endif %}
<a class="block btn btn-link my-1" href="{{ infos["git"]["url"] }}"><i class="fa fa-code fa-fw" aria-hidden="true"></i> YunoHost package repository</a>
<a class="block btn btn-link my-1" href="https://spdx.org/licenses/{{upstream.license}}"><i class="fa fa-institution fa-fw" aria-hidden="true"></i> {{ _("License: %(license)s", license=upstream.license) }}</a>
{% if upstream.website %}<a class="block btn btn-link my-1" href="{{ upstream.website }}"><i class="fa fa-globe fa-fw" aria-hidden="true"></i> {{ _(" Official website") }}</a>{% endif %}
{% if upstream.admindoc %}<a class="block btn btn-link my-1" href="{{ upstream.admindoc }}"><i class="fa fa-book fa-fw" aria-hidden="true"></i> {{ _("Official admin documentation") }}</a>{% endif %}
{% if upstream.userdoc %}<a class="block btn btn-link my-1" href="{{ upstream.userdoc }}"><i class="fa fa-book fa-fw" aria-hidden="true"></i> {{ _("Official user documentation") }}</a>{% endif %}
{% if upstream.code %}<a class="block btn btn-link my-1" href="{{ upstream.code }}"><i class="fa fa-code fa-fw" aria-hidden="true"></i> {{ _("Official code repository") }}</a>{% endif %}
<a class="block btn btn-link my-1" href="{{ infos["git"]["url"] }}"><i class="fa fa-code fa-fw" aria-hidden="true"></i> {{ _("YunoHost package repository") }}</a>
</div>
</div>
{% endblock %}

View File

@ -1,8 +1,8 @@
<!DOCTYPE html>
<html lang="en">
<html lang="{{ locale }}">
<head>
<title>YunoHost app store</title>
<title>{{ _("YunoHost app store") }}</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="{{ url_for('static', filename='tailwindcss.js') }}"></script>
@ -53,7 +53,7 @@
class="flex h-16 items-center gap-8 px-4 sm:px-6 lg:px-8"
>
<a class="block text-teal-600" href="/">
<span class="sr-only">Home</span>
<span class="sr-only">{{ _("Home") }}</span>
<img src="{{ url_for('static', filename='ynh_logo_roundcorner.png') }}" style="height: 3em;" />
</a>
@ -62,13 +62,13 @@
<ul class="flex items-center gap-6 text-sm">
<li>
<a class="text-gray-800 font-bold transition hover:text-gray-500/75" href="{{ url_for('browse_catalog') }}">
Catalog
{{ _("Catalog") }}
</a>
</li>
<li>
<a class="text-gray-800 font-bold transition hover:text-gray-500/75" href="{{ url_for('browse_wishlist') }}">
Wishlist
{{ _("Wishlist") }}
</a>
</li>
</ul>
@ -81,21 +81,21 @@
href="https://yunohost.org/docs/"
>
<i class="fa fa-external-link fa-fw" aria-hidden="true"></i>
YunoHost documentation
{{ _("YunoHost documentation") }}
</a>
{% if not user %}
<a
class="btn btn-primary hidden md:inline-block"
href="{{ url_for('login_using_discourse') }}"
>
Login using YunoHost's forum
{{ _("Login using YunoHost's forum") }}
</a>
{% else %}
<button
type="button"
class="group flex shrink-0 items-center rounded-lg transition"
>
<span class="sr-only">Menu</span>
<span class="sr-only">{{ _("Menu") }}</span>
<img
alt="Man"
src="{{ user['avatar_url'] }}"
@ -120,7 +120,7 @@
<button
class="block rounded bg-gray-100 p-2.5 text-gray-600 transition hover:text-gray-600/75 md:hidden"
>
<span class="sr-only">Toggle menu</span>
<span class="sr-only">{{ _("Toggle menu") }}</span>
<i class="fa fa-bars h-5 w-5" aria-hidden="true"></i>
</button>
</div>

View File

@ -1,5 +1,3 @@
{% set locale = 'en' %}
{% macro appCard(app, infos, timestamp_now, catalog) -%}
{% set this_app_stars = stars.get(app, {})|length %}
@ -53,14 +51,14 @@
</span>
</span>
<p class="max-w-[40ch] text-xs text-gray-500">
{{ infos['manifest']['description']['en'] }}
{{ infos['manifest']['description']|localize }}
</p>
<div class="hidden">
{{ infos["potential_alternative_to"]|join(', ') }}
</div>
{% if infos['category'] %}
<span class="rounded-full px-2.5 py-0.5 text-[10px] border text-{{ catalog['categories'][infos['category']]['color'] }}-500 border-{{ catalog['categories'][infos['category']]['color'] }}-400 ">
{{ catalog['categories'][infos['category']]['title'][locale].lower() }}
{{ catalog['categories'][infos['category']]['title']|localize|lower }}
</span>
{% endif %}
</div>
@ -73,18 +71,18 @@
{% block main %}
<div class="mt-5 text-center">
<h2 class="text-2xl font-bold text-gray-900">
Application Catalog
{{ _("Application Catalog") }}
</h2>
</div>
<div class="max-w-screen-md mx-auto mt-3 mb-3">
<div class="flex flex-row">
<div class="px-2 inline-block relative basis-2/3 text-gray-700">
<label for="search" class="sr-only"> Search </label>
<label for="search" class="sr-only"> {{ _("Search") }} </label>
<input
type="text"
id="search"
placeholder="Search for..."
placeholder="{{ _('Search for...') }}"
{% if init_search %}value="{{ init_search }}"{% endif %}
class="w-full rounded-md border-gray-200 shadow-sm sm:text-sm py-2 pe-10"
/>
@ -100,10 +98,10 @@
id="selectcategory"
class="w-full rounded-md border-gray-200 shadow-sm sm:test-sm px-2 py-1.5"
>
<option value="">All apps</option>
<option value="">{{ _("All apps") }}</option>
{% for id, category in catalog['categories'].items() %}
{{ category['title'][locale] }}
<option {% if id == init_category %}selected{% endif %} value="{{ id }}" {{ id == init_category }} >{{ category['title'][locale] }}</option>
{{ category['title']|localize }}
<option {% if id == init_category %}selected{% endif %} value="{{ id }}" {{ id == init_category }} >{{ category['title']|localize }}</option>
{% endfor %}
</select>
</div>
@ -111,15 +109,15 @@
<div class="flex flex-row justify-center items-center pt-2 text-center text-sm">
<div class="inline-block px-2">
Sort by
{{ _("Sort by") }}
<select
name="selectsort"
id="selectsort"
class="inline-block rounded-md border-gray-200 text-sm ml-1 pl-1 pr-7 h-8 py-0"
>
<option {% if not init_sort %}selected{% endif %} value="">Alphabetical</option>
<option {% if init_sort == "newest" %}selected{% endif %} value="newest">Newest</option>
<option {% if init_sort == "popularity" %}selected{% endif %} value="popularity">Popularity</option>
<option {% if not init_sort %}selected{% endif %} value="">{{ _("Alphabetical") }}</option>
<option {% if init_sort == "newest" %}selected{% endif %} value="newest">{{ _("Newest") }}</option>
<option {% if init_sort == "popularity" %}selected{% endif %} value="popularity">{{ _("Popularity") }}</option>
</select>
</div>
<div class="inline-block flex items-center px-2">
@ -132,7 +130,7 @@
<span class="absolute inset-y-0 start-0 m-1 h-2 w-2 rounded-full bg-white transition-all peer-checked:start-3">
</span>
</label>
Show only apps you starred
{{ _("Show only apps you starred") }}
</div>
</div>
</div>
@ -148,21 +146,21 @@
<div id="noResultFound" class="text-center pt-5 hidden">
<p class="text-lg font-bold text-gray-900 mb-5">
No results found
{{ _("No results found.") }}
</p>
<p class="text-md text-gray-900">
Not finding what you are looking for ?<br/>
Checkout the wishlist !
{{ _("Not finding what you are looking for?") }}<br/>
{{ _("Checkout the wishlist!") }}
</p>
</div>
<div id="lowQualityAppTitle" class="text-center pt-10">
<h2 class="text-lg font-bold text-gray-900">
Applications currently broken or low-quality
{{ _("Applications currently flagged as broken or low-quality") }}
</h2>
<p class="text-sm">
These are apps which failed our automatic tests.<br/>
This is usually a temporary situation which requires packagers to fix something in the app.
{{ _("These are apps which failed our automatic tests.") }}<br/>
{{ _("This is usually a temporary situation which requires packagers to fix something in the app.") }}
</p>
</div>

View File

@ -1,11 +1,10 @@
{% extends "base.html" %}
{% block main %}
{% set locale = 'en' %}
<div class="mx-auto w-full text-center p-8">
<img src="{{ url_for('static', filename='ynh_logo_black.svg') }}" class="w-32 mx-auto" />
<h2 class="text-2xl font-bold text-gray-900">
Application Store
{{ _("Application Store") }}
</h2>
</div>
@ -16,7 +15,7 @@
class="h-full relative block overflow-hidden hover:bg-gray-200 pt-12"
>
<h3 class="text-md font-bold text-gray-900">
Browse all applications
{{ _("Browse all applications") }}
</h3>
</a>
</div>
@ -28,10 +27,10 @@
>
<h3 class="text-md font-bold text-gray-900">
<i class="fa fa-{{ category['icon'] }}" aria-hidden="true"></i>
{{ category['title'][locale] }}
{{ category['title']|localize }}
</h3>
<p class="mx-auto max-w-[40ch] text-xs text-gray-500">
{{ category['description'][locale] }}
{{ category['description']|localize }}
</p>
</a>
</div>

View File

@ -2,19 +2,19 @@
{% block main %}
<div class="mt-5 text-center">
<h2 class="text-2xl font-bold text-gray-900">
Application Wishlist
{{ _("Application Wishlist") }}
</h2>
</div>
<div class="max-w-screen-md mx-auto mt-3 mb-3">
<div class="flex flex-row">
<div class="px-2 inline-block relative basis-2/3 text-gray-700">
<label for="search" class="sr-only"> Search </label>
<label for="search" class="sr-only"> {{ _("Search") }} </label>
<input
type="text"
id="search"
placeholder="Search for..."
placeholder="{{ _('Search for...') }}"
class="w-full rounded-md border-gray-200 shadow-sm sm:text-sm py-2 pe-10"
/>
@ -23,33 +23,28 @@
</span>
</div>
<a
class="btn btn-primary-outline"
href="{{ url_for('add_to_wishlist') }}"
>
<a class="btn btn-primary-outline" href="{{ url_for('add_to_wishlist') }}">
<i class="fa fa-plus fa-fw" aria-hidden="true"></i>
Add an app to the wishlist
{{ _("Suggest an app") }}
</a>
</div>
</div>
</div>
<div class="overflow-x-auto max-w-screen-lg mx-auto pt-5">
<table class="min-w-full divide-y-2 divide-gray-200 bg-white text-sm">
<thead>
<tr>
<th class="whitespace-nowrap px-4 py-2 font-medium text-gray-900">
Name
{{ _("Name") }}
</th>
<th class="whitespace-nowrap px-4 py-2 font-medium text-gray-900">
Description
{{ _("Description") }}
</th>
<th class="py-2"></th>
<th class="py-2"></th>
<th class="whitespace-nowrap px-4 py-2 font-medium text-gray-900 max-w-[5em]">Popularity</th>
<th class="whitespace-nowrap px-4 py-2 font-medium text-gray-900 max-w-[5em]">{{ _("Popularity") }}</th>
</tr>
</thead>

View File

@ -2,7 +2,7 @@
{% block main %}
<div class="mt-5 text-center">
<h2 class="text-2xl font-bold text-gray-900">
Add an application to the wishlist
{{ _("Suggest an application to be added to YunoHost's catalog") }}
</h2>
</div>
@ -23,7 +23,7 @@
<div role="alert" class="rounded-md border-s-4 border-orange-500 bg-orange-50 p-4 mb-5">
<p class="mt-2 text-sm text-orange-700 font-bold">
<i class="fa fa-exclamation-triangle fa-fw" aria-hidden="true"></i>
You must first login to be allowed to submit an app to the wishlist
{{ _("You must first login to be allowed to submit an app to the wishlist") }}
</p>
</div>
{% endif %}
@ -31,10 +31,10 @@
<div role="alert" class="rounded-md border-s-4 border-sky-500 bg-sky-50 p-4">
<p class="mt-2 text-sm text-sky-700 font-bold">
<i class="fa fa-info-circle fa-fw" aria-hidden="true"></i>
Please check the license of the app your are proposing
{{ _("Please check the license of the app your are proposing") }}
</p>
<p class="mt-2 text-sm text-sky-700">
The YunoHost project will only package free/open-source software (with possible case-by-case exceptions for apps which are not-totally-free)
{{ _("The YunoHost project will only package free/open-source software (with possible case-by-case exceptions for apps which are not-totally-free)") }}
</p>
</div>
@ -50,26 +50,26 @@
<form method="POST" action="{{ url_for('add_to_wishlist') }}" class="mt-8 mb-8" >
<label for="name" class="mt-5 block font-bold text-gray-700">Name</label>
<label for="name" class="mt-5 block font-bold text-gray-700">{{ _("Name") }}</label>
<input name="name" type="text" class="w-full mt-1 rounded-md border-gray-200 text-gray-700 shadow-sm" maxlength="30" required onkeyup="this.value = this.value.replace(/[^a-zA-Z0-9.-\\(\\)\\ ]/, '')" />
<label for="description" class="mt-5 block font-bold text-gray-700">Description</label>
<label for="description" class="mt-5 block font-bold text-gray-700">{{ _("Description") }}</label>
<textarea name="description" type="text" class="w-full mt-1 rounded-md border-gray-200 text-gray-700 shadow-sm" required rows='3' maxlength='100'></textarea>
<span class="text-xs text-gray-600"><span class="font-bold">Please be concise and focus on what the app does.</span> No need to repeat "[App] is ...". No need to state that it is free/open-source or self-hosted (otherwise it wouldn't be packaged for YunoHost). Avoid marketing stuff like 'the most', or vague properties like 'easy', 'simple', 'lightweight'.</span>
<span class="text-xs text-gray-600"><span class="font-bold">{{ _("Please be concise and focus on what the app does.") }}</span> {{ _("No need to repeat '[App] is ...'. No need to state that it is free/open-source or self-hosted (otherwise it wouldn't be packaged for YunoHost). Avoid marketing stuff like 'the most', or vague properties like 'easy', 'simple', 'lightweight'.") }}</span>
<label for="upstream" class="mt-5 block font-bold text-gray-700">Project code repository</label>
<label for="upstream" class="mt-5 block font-bold text-gray-700">{{ _("Project code repository") }}</label>
<input name="upstream" type="url" class="w-full mt-1 rounded-md border-gray-200 text-gray-700 shadow-sm" maxlength="150" required />
<label for="website" class="mt-5 block font-bold text-gray-700">Project website</label>
<label for="website" class="mt-5 block font-bold text-gray-700">{{ _("Project website") }}</label>
<input name="website" type="url" class="w-full mt-1 rounded-md border-gray-200 text-gray-700 shadow-sm" maxlength="150" />
<span class="text-xs text-gray-600">Please <emph>do not</emph> just copy-paste the code repository URL. If the project has no proper website, then leave the field empty.</span>
<span class="text-xs text-gray-600">{{ _("Please *do not* just copy-paste the code repository URL. If the project has no proper website, then leave the field empty.") }}</span>
<button
type="submit"
class="block mx-auto btn btn-primary mt-5 {% if user %}hover:bg-blue-700{% endif %}"
{% if not user %}disabled{% endif %}
>
Submit
{{ _("Submit") }}
</button>
</form>