Longue vie aux objets propose des solutions pour promouvoir les gestes de consommation responsable:
- Mise à disposition d'une cartographie d'Acteurs du ré-emploi et de la réparation en France (disponible aussi via une iframe)
- Promotion des gestes de consommation responsable tels que le don, le partage local et la réparation
Le site "Longue vie aux objets" est disponible à l'URL : https://longuevieauxobjets.ademe.fr/
il suffit d'ajouter le script js suivant:
<script src="https://lvao.ademe.fr/static/iframe.js"
data-max_width="800"
data-direction="jai"
data-first_dir="jai"
data-action_list="preter|donner|reparer|echanger|mettreenlocation|revendre"
></script>
les paramètres de l'iframe sont passés dans le dataset : en tant qu'attribut préfixé par data-
Les paramètres disponibles pour customiser l'affichage de l'iframe sont:
data-direction
, optionjai
oujecherche
, par défaut l'option de direction « Je cherche » est activedata-first_dir
, optionjai
oujecherche
, par défaut l'option de direction « Je cherche » est affiché en premier dans la liste des options de directiondata-action_list
, liste des actions cochées selon la direction séparées par le caractère|
:- pour la direction
jecherche
les actions possibles sont :emprunter
,echanger
,louer
,acheter
- pour la direction
jai
les actions possibles sont :reparer
,preter
,donner
,echanger
,mettreenlocation
,revendre
- si le paramètre
action_list
n'est pas renseigné ou est vide, toutes les actions éligibles à la direction sont cochées
- pour la direction
data-max_width
, largeur maximum de l'iframe, la valeur par défaut est 800pxdata-height
, hauteur allouée à l'iframe cette hauteur doit être de 700px minimum, la valeur par défaut est 100vhdata-iframe_attributes
, liste d'attributs au format JSON à ajouter à l'iframe
La hauteur et la largeur de l'iframe peuvent être exprimées dans toutes les unités interprétées par les navigateurs ex: px, %, vh, rem…
Voir l'exemple d'integration de l'iframe « Longue vie aux objets » dans une page html : iframe.html
Il est aussi possible d'intégrer directement l'iframe à votre site sans l'appel au script iframe.js
. Dans ce cas, vous devrez passer les paramètres de l'iframe dans l'url (sans le préfix data-
), configurer les appels à la librairie iframe-resizer
et passer les bons attributs à l'iframe.
Vous trouverez un exemple d'intégration ici : iframe_without_js.html
Chaque acteur du ré-emploi et recyclage expose des propositions de service associées à un geste et une liste de catégories d'objet.
Certains objets de la base de données sont des objets d'administration qui n'ont pas vocation aest mis à jour régulièrement. Ci-dessous les populations de ces objets en date du 18 septembre 2023.
Direction de l'action (qfdmo_actiondirection):
Détenir ou chercher un objet
Action (qfdmo_action):
Quelle action souhaitez vous faire, Exemple : réparer un objet, acheter de seconde main…
Catégorie / Sous-catégorie / Objet (qfdmo_categorieobjet, qfdmo_souscategorieobjet)
Classification des objets
Type de service (qfdmo_acteurservice)
Type des services rendu par l'acteur, Exemple : Achat/revente entre particuliers, Location par un professionnel, Pièces détachées…
Type d'acteur (qfdmo_acteurtype)
Exemple : commerce, association, acteur digital…
- docker-compose
- python 3.11
- node 18.17
- gdal (librairie nécessaire à l'utilisation de GeoDjango)
Conseil: utiliser asdf
pour la gestion des environnement virtuel node
et python
https://gist.github.com/codingjoe/a31405952ec936beba99b059e665491e
- Python
- Django
- github
- Licence MIT
- Node
- Parcel
- DSFR
- honcho
- Scalingo
- Sentry
- Pytest
- Whitnoise
- Tailwind
- Dependabot
- Django-debug-toolbar
Les bases de données source MySQL
et cible Postgres + Postgis
sont executées et mises à disposition par le gestionnaire de conteneur Docker
docker compose up
Création de l'environnement virtuel de votre choix (préférence pour asdf)
python -m venv .venv --prompt $(basename $(pwd))
source .venv/bin/activate
Installation
pip install -r requirements.txt -r dev-requirements.txt
npm install
Configuration des variables d'environnement
cp .env.template .env
// Modifier les variables dans le fichier .env si nécessaire
Migration
python manage.py migrate
Population de la base (optionel, si la base de données de production est chargée sur l'environnement de développement)
python manage.py loaddata categories actions acteur_services acteur_types
python manage.py createsuperuser
honcho start -f Procfile.dev
Honcho démarrera les containers Docker s'ils ne sont pas déjà démarrés. Une fois les processus démarrés, le serveur web sera accessible à l'adresse https://localhost:8000, écoutant sur le port 8000.
python avec pytest
pytest
Test Js unitaire
npm run test
End to end avec Playwright
npx playwright install --with-deps
npx playwright test
Ajouter les dépendances aux fichiers requirements.in
et dev-requirements.in
Compiler les dépendances:
pip-compile dev-requirements.in --generate-hashes
pip-compile requirements.in --generate-hashes
Pour installer les git hook de pre-commit, installer le package precommit et installer les hooks en executant pre-commit
pre-commit install
Create a one-off contanier and download LVAO base file from your local using --file option.
scalingo --region osc-fr1 --app quefairedemesobjets run --file backup_db.bak/Base_20221218_Depart.csv bash
following message should be display in prompt:
-----> Starting container one-off-1576 Done in 0.224 seconds
Upload /Users/nicolasoudard/workspace/beta.gouv.fr/quefairedemesobjets/backup_db.bak/Base_20221218_Depart.csv to container.
…
uploaded file is stored in /tmp/uploads
folder
Launch import :
python manage.py populate_lvao_base /tmp/uploads/Base_20221218_Depart.csv
DUMP_FILE=</path/to/dump/file.pgsql>
DATABASE_URL=postgres:https://qfdmo:qfdmo@localhost:6543/qfdmo
for table in $(psql "${DATABASE_URL}" -t -c "SELECT \"tablename\" FROM pg_tables WHERE schemaname='public'"); do
psql "${DATABASE_URL}" -c "DROP TABLE IF EXISTS \"${table}\" CASCADE;"
done
pg_restore -d "${DATABASE_URL}" --clean --no-acl --no-owner --no-privileges "${DUMP_FILE}"
Nous avons besoin d'installer GDAL comme c'est expliqué dans la doc suivante : https://techilearned.com/configure-geodjango-in-scalingo/ cf. https://doc.scalingo.com/platform/app/app-with-gdal
le code est déployé en preprod lors de la mise à jour de la branche main
et en production quand il est tagué avec en respectant le format de version semantique vX.Y.Z
le code de l'interface est déployé sur le repo git de scalingo à conditions que les tests soit passés avec succès via Github
le code des dags Airflow est déployé sur le repo s3 de clevercloud à conditions que les tests soit passés avec succès via Github
---
title: Schéma simplifié les acteurs
---
classDiagram
class ActeurService {
- id: int
- code: str
- libelle: str
- actions: List[Action]
}
class ActeurType {
- id: int
- code: str
- libelle: str
}
class Source {
- id: int
- code: str
- libelle: str
- afficher: bool
- url: str
- logo_file: str
}
class LabelQualite {
- id: int
- code: str
- libelle: str
- afficher: bool
- bonus: bool
- type_enseigne: bool
- url: str
- logo_file: str
}
class DisplayedActeur {
- nom: str
- description: str
- identifiant_unique: str
- acteur_type: ActeurType
- adresse: str
- adresse_complement: str
- code_postal: str
- ville: str
- url: str
- email: str
- location: Point
- telephone: str
- nom_commercial: str
- nom_officiel: str
- labels: List[LabelQualite]
- acteur_services: List[ActeurService]
- siret: str
- source: Source
- identifiant_externe: str
- statut: ActeurStatus
- naf_principal: str
- commentaires: str
- cree_le: datetime
- modifie_le: datetime
- horaires_osm: str
- horaires_description: str
- public_accueilli: str
- reprise: str
- exclusivite_de_reprisereparation: bool
- uniquement_sur_rdv: bool
}
class DisplayedPropositionService {
- action: Action
- sous_categories: List[SousCategorieObjet]
- acteur: Acteur
}
class Action {
- id: int
- code: str
- afficher: bool
- description: str
- directions: List[Direction]
- order: int
- couleur: str
- icon: str
- groupe_action: GroupeAction
}
class Direction {
- id: int
- code: str
- libelle: str
- order: int
}
class GroupeAction {
- id: int
- code: str
- afficher: bool
- description: str
- order: int
- couleur: str
- icon: str
}
class CategorieObjet {
- id: int
- code: str
- libelle: str
}
class SousCategorieObjet {
- id: int
- code: str
- libelle: str
- afficher: bool
- categorie: CategorieObjet
}
class Objet {
- id: int
- code: str
- libelle: str
- sous_categorie: SousCategorieObjet
}
Direction --> Action
DisplayedActeur --> DisplayedPropositionService
DisplayedActeur <--> ActeurService
ActeurType --> DisplayedActeur
Source --> DisplayedActeur
LabelQualite <--> DisplayedActeur
DisplayedPropositionService <-- Action
DisplayedPropositionService <--> SousCategorieObjet
CategorieObjet --> SousCategorieObjet
SousCategorieObjet --> Objet
GroupeAction --> Action
---
title: Schéma simplifié des relations autour des acteurs
---
erDiagram
Direction }|--|{ Action : n-m
DisplayedActeur ||--|{ DisplayedPropositionService : un-n
ActeurType ||--|{ DisplayedActeur : un-n
Source ||--|{ DisplayedActeur : un-n
Action ||--|{ DisplayedPropositionService : un-n
ActeurService }|--|{ DisplayedActeur : un-n
DisplayedPropositionService }|--|{ SousCategorieObjet : n-m
---
title: Schéma de l'application des corrections des acteurs
---
flowchart TB
subgraph Acteur importé
direction LR
Acteur --> PropositionService
end
subgraph Acteur Corrigé
direction LR
CorrectionEquipeActeur --> CorrectionEquipePropositionService
end
subgraph Acteur Affiché
direction LR
DisplayedActeur --> DisplayedPropositionService
end
Acteur --> CorrectionEquipeActeur --> DisplayedActeur
Acteur --> DisplayedActeur
PropositionService --> CorrectionEquipePropositionService --> DisplayedPropositionService
PropositionService --> DisplayedPropositionService
Nous suivons les règles et standards de l'industrie que nous contrôlons à chaque commit et Pull Request grâce à des outils tel que ruff
ou eslint
.
Cependant, ce projet est développé et propulsé par l'État français et doit être utilisable et administrable simplement par le plus grand nombre. Nous appliquons donc une règle spécifique quant à l'utilisation de la langue française versus la langue anglaise, nous avons donc défini les cas d'utilisation de ces 2 langues.
A l'attention des administrés, administrations, administrateurs, et l'équipe Longue vie aux objets
- Git/Github Les commits, les Pull Request
- La documentation dans les markdowns
- Les noms et les champs des tables en base de données
Dans le code, à l'attention des équipes techniques
- les fonctions
- les noms de variables
- les commentaires dans le code
Certaines variables combinant un nom d'objet et un suffixe ou préfixe peuvent être en franglais
Ex : acteur_by_id