====== Khaganat web ======

Khaganat web est une application web développée en Python/Django ayant pour vocation de devenir le prochain site vitrine du projet.


===== Tests et mise en production =====

La version disponible sur [[https://cipra.khaganat.net/|Cipra]] est un environnement servant à préparer la future mise en production du site. Vous êtes invités à vous y inscrire et à tester les différents éléments. Cependant, certains éléments actuellement sur Cipra seront sauvegardés et directement transférés en production, il convient donc de ne pas y toucher afin de ne pas perturber les opérations.

<WRAP center round important>Une adresse email valide est nécessaire pour s'inscrire car il y sera envoyé un lien d'activation du compte.</WRAP>

==== Éléments allant en production à ne pas toucher ====

La liste est exhaustive.

  * pages statiques
  * barre de navigation


==== Éléments de test pouvant être modifiés à loisir ====

La liste **n'est pas** exhaustive.

  * utilisateurs
  * droits d'accès
  * pastebin
  * journaux de conversation
  * mots de passe partagés
  * etc


===== Fonctionnalités =====

<task>
TITLE: Pages statiques
PRIORITY: 1
PROGRESS: 100%
DESCRIPTION: Permet la réalisation de pages statiques depuis l'interface d'administration.
</task>

<task>
TITLE: Gestion des utilisateurs
PRIORITY: 1
PROGRESS: 100%
DESCRIPTION: Inscription, connexion, déconnexion, suppression, réinitialisation du mot de passe, gestion du profil.
</task>

<task>
TITLE: Barre de navigation
PRIORITY: 1
PROGRESS: 70%
DESCRIPTION: Barre de navigation éditable depuis l'interface d'administration.
</task>

<task>
TITLE: Journaux de conversation
PRIORITY: 2
PROGRESS: 50%
DESCRIPTION: Affichage des journaux de conversation du projet.
</task>

<task>
TITLE: Gestion du contenu sensible
PRIORITY: 2
PROGRESS: 100%
DESCRIPTION: Possibilité d'indiquer du contenu comme sensible afin d'obtenir l'accord explicite des utilisateurs avant affichage.
</task>


<task>
TITLE: Pastebin
PRIORITY: 3
PROGRESS: 100%
DESCRIPTION: Intégration d'un outil permettant de poster des extraits de code source.
</task>


<task>
TITLE: Partage de mots de passe
PRIORITY: 3
PROGRESS: 100%
DESCRIPTION: Intégration d'un outil de partage de mots de passe.
</task>


<task>
TITLE: Webchat
PRIORITY: 3
PROGRESS: 90%
DESCRIPTION: Intégration d'un webchat XMPP.
</task>

<task>
TITLE: Générateur de noms
PRIORITY: 3
PROGRESS: 0%
DESCRIPTION: Intégration d'un générateur de noms.
</task>


<task>
TITLE: Intégration de dokuwiki
PRIORITY: 4
PROGRESS: 0%
DESCRIPTION: Lier le docuwiki existant au site web.
</task>


<task>
TITLE: Intégration de NextCloud
PRIORITY: 4
PROGRESS: 0%
DESCRIPTION: Lier le NextCloud existant au site web.
</task>


<task>
TITLE: Forum
PRIORITY: 5
PROGRESS: 0%
DESCRIPTION: Intégration d'un moteur de forum.
</task>


===== Administrer =====


==== Les paramètres globaux ====

Il est possible de définir de nombreux paramètres globaux à l'aide de variables d'environnement. Le plus simple pour définir des variables d'environnement est de les définir dans le fichier ''.env'', elles seront automatiquement chargées par pipenv. La liste des variables pouvant ainsi influer sur le déploiement se trouve dans le README.


==== Pastebin ====

Afin de supprimer les pastes périmés, il est important de lancer régulièrement la commande suivante :

<code>pipenv run ./manage.py npb_purge_pastes</code>

Par défaut, les pastes périmés ne sont pas affichés, il n'y a donc pas un besoin absolu de faire cette purge en permanence. En fonction de la charge, la lancer chaque semaine ou chaque mois peut être suffisant. Il est bien entendu recommandé d'automatiser cette tâche.


==== Changement de clé secrète ====

Si l'on pense que la clé secrète a pu être compromise, il faut immédiatement en changer. Tout ce qui repose sur cette clé (sessions utilisateurs, mots de passes partagés, etc) ne sera donc plus valide. Si pour les sessions utilisateur il suffit que ces derniers se reconnectent, pour les mots de passe partagés c'est plus compliqué car il faut tous les déchiffrer avec l'ancienne clé puis les chiffrer à nouveau avec la nouvelle. Afin de faire ceci simplement, la procédure de changement de clé secrète est la suivante :

  - Lire l'ensemble de la procédure et s'assurer que l'on a compris à quoi sert chaque étape.
  - Sauvegarder l'ancienne clé (il y en aura besoin dans la suite de la procédure).
  - Générer une nouvelle clé à l'aide de la commande ''<nowiki>pipenv run python -c 'from django.core.management.utils import get_random_secret_key; print(get_random_secret_key())'</nowiki>'' (en une seule ligne).
  - Dans l'environnement de production, remplacer l'ancienne clé par la nouvelle.
  - Dans l'environnement de production, lancer la commande ''pipenv run ./manage.py pwdb_rotate_secret_key <ancienne_clé>''.
  - Redémarrer le service WSGI.


===== Contribuer =====


==== Rapports de bug ====

Le premier moyen de contribution possible est d'utiliser la [[https://cipra.khaganat.net/|version de test]] et de [[https://git.khaganat.net/Tycho/khaganat-web/issues|signaler les bugs]].

==== Éditer le code ====

Comme pour tout projet, vous pouvez directement contribuer au code source en soumettant des pull request sur le [[gitlab>Tycho/khaganat-web|dépôt GitLab]].

Il vous faudra probablement installer le site en version locale (sur votre propre serveur, sur une VM) afin de tester vos modifications. Pour cela, la page [[fr:install_khaganat_web|Installer Django et le site web Khaganat]] vous sera probablement utile.

==== Pour les traducteurs ====

Afin d'améliorer les traduction, vous pouvez éditer les fichiers ''.po'' situés dans les répertoires ''<nowiki><module>/locale/<langue>/LC_MESSAGES/</nowiki>''.
Toutes les informations sur le fonctionnement des traductions est disponible dans [[https://docs.djangoproject.com/fr/2.0/topics/i18n/translation/|la documentation de Django]].

==== Pour les graphistes ====

Avant toute chose, vous devriez consulter la page [[taf>fr:taf:web:ergonomie:cipra|CSS de Django (Cipra)]].

=== Django ===

Django divise le site web final en différents modules initialement autonomes. Bien que cette autonomie est bien souvent remise en question par la nécessité de faire dépendre certains modules d'autres modules, il faut garder à l'esprit que cet état d'esprit. À ce titre, chaque module comporte un sous-dossier ''static'' contenant tous les fichiers devant être accessible (images, css, javascript, etc). Ceci impose certains comportements :

  - bien étudier la portée du fichier que l'on utilise (est-il propre à un module ou non ?) ;
  - faire attention à ne pas créer de doublons entre deux modules (utilisation de sous-dossiers portant le nom du module afin de créer des espaces de noms).

<WRAP center round important>Les fichiers ''module1/static/toto.jpg'' et ''module2/static/toto.jpg'' entreront en conflit. Afin d'éviter que l'un ne soit perdu, il faut les déplacer en tant que ''module1/static/module1/toto.jpg'' et ''module2/static/module2/toto.jpg''.</WRAP>

Afin de générer les pages HTML, Django utilise des gabarits. Tout comme les fichiers statiques, les gabarits sont répartis dans les différents modules en fonction de leur rôle, dans un sous-dossier nommé ''templates''. Il convient de prendre le mêmes précautions qu'avec les fichiers statiques.

<WRAP center round info>Le module ''khaganat'' est utilisé pour les fichiers statiques et gabarits globaux.</WRAP>

<WRAP center round tip>Le chemin vers les fichiers statiques est susceptible de changer en fonction de la configuration. Vous ne devez donc surtout pas mettre le chemin « en dur » mais, à la place, utiliser la balise [[https://docs.djangoproject.com/fr/2.0/ref/templates/builtins/#static|static]]. Il en va de même pour les liens internes au site pour lesquels il faut utiliser la balise [[https://docs.djangoproject.com/fr/2.0/ref/templates/builtins/#url|url]].</WRAP>

Afin d'éditer les gabarits de Django, vous aurez besoin de la documentation sur [[https://docs.djangoproject.com/fr/2.0/ref/templates/language/|le langage de gabarit]] ainsi que de la [[https://docs.djangoproject.com/fr/2.0/ref/templates/builtins/|liste des balises et filtres de gabarit intégrés]].

<WRAP center round info>Les développeurs Python peuvent ajouter de nouvelles balises et filtres. Par exemple, c'est ainsi que la barre de navigation est ajoutée dans le gabarit global.</WRAP>


=== Bulma ===

Le projet utilise un framework CSS : [[https://bulma.io/|Bulma]]. N'hésitez pas à consulter sa [[https://bulma.io/documentation/|documentation]].

Afin de personaliser Bulma, il est possible de définir des [[https://bulma.io/documentation/overview/variables/|variables Sass]]. Afin de mettre en place un environnement de développement sass, nous allons tout d'abord installer les outils de compilation sass (nécessite npm) : pour lancer un processus qui compilera les fichiers sass à chaque modification.

<code>
git clone https://git.khaganat.net/khaganat/web/khaganat_web_css.git
cd khaganat_web_css
npm install bulma
npm install node-sass
cp bulma.sass node_modules/bulma/bulma.sass
cd node_modules/bulma/
npm run build-sass
cp css/bulma.css khaganat-web/khaganat/static/khaganat/css/style.css
</code>

Le fichier css est à copier dans ''khaganat-web/khaganat/static/khaganat/css/style.css''.



{{tag>Serveur Web}}