Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision
  • chrome-manifest-v3
  • develop
  • feat/force-migration-check
  • feat/improve-network-scan
  • feature/android_api_19
  • feature/encrypted_comment
  • feature/migrate-cordova-13
  • gitlab_migration_1
  • master
  • rml8
  • 0.0.1.ES.alpha1
  • 0.0.2
  • 0.1.13
  • 0.1.14
  • 0.1.15
  • 0.1.16
  • 0.1.17
  • 0.1.18
  • 0.1.19
  • 0.1.20
  • 0.1.21
  • 0.1.22
  • 0.1.23
  • 0.1.24
  • 0.1.25
  • 0.1.26
  • 0.1.27
  • 0.1.28
  • 0.1.4
  • 0.1.7
  • 0.1.8
  • 0.2.0
  • 0.2.1
  • v0.10.0
  • v0.10.1
  • v0.10.2
  • v0.11.0
  • v0.11.1
  • v0.11.2
  • v0.11.3
  • v0.11.4
  • v0.11.5
  • v0.11.6
  • v0.11.7
  • v0.11.8
  • v0.12.0
  • v0.12.1
  • v0.12.2
  • v0.12.3
  • v0.12.4
  • v0.12.5
  • v0.12.6
  • v0.12.7
  • v0.12.8
  • v0.12.9
  • v0.13.0
  • v0.14.0
  • v0.14.1
  • v0.15.0
  • v0.15.1
  • v0.15.2
  • v0.15.3
  • v0.15.4
  • v0.15.5
  • v0.15.6
  • v0.15.7
  • v0.16.0
  • v0.16.1
  • v0.17.0
  • v0.17.1
  • v0.17.2
  • v0.17.3
  • v0.17.4
  • v0.17.5
  • v0.17.6
  • v0.18.0
  • v0.18.1
  • v0.18.2
  • v0.18.3
  • v0.19.0
  • v0.19.1
  • v0.19.2
  • v0.19.3
  • v0.19.4
  • v0.19.5
  • v0.19.6
  • v0.2.10
  • v0.2.12
  • v0.2.13
  • v0.2.14
  • v0.2.3
  • v0.2.4
  • v0.2.5
  • v0.2.6
  • v0.2.7
  • v0.2.8
  • v0.2.9
  • v0.3.0
  • v0.3.1
  • v0.3.10
  • v0.3.11
  • v0.3.12
  • v0.3.13
  • v0.3.14
  • v0.3.15
  • v0.3.16
  • v0.3.17
  • v0.3.2
  • v0.3.3
  • v0.3.4
110 results

Target

Select target project
  • cordeliaze/cesium
  • pfouque06/cesium
  • wellno1/cesium
  • 1000i100/cesium
  • vincentux/cesium
  • calbasi/cesium
  • thomasbromehead/cesium
  • matograine/cesium
  • clients/cesium-grp/cesium
  • cedricmenec/cesium
  • Pamplemousse/cesium
  • etienneleba/cesium
  • tnntwister/cesium
  • scanlegentil/cesium
  • morvanc/cesium
  • yyy/cesium
  • Axce/cesium
  • Bertrandbenj/cesium
  • Lupus/cesium
  • elmau/cesium
  • MartinDelille/cesium
  • tykayn/cesium
  • numeropi/cesium
  • Vivakvo/cesium
  • pokapow/cesium
  • pini-gh/cesium
  • anam/cesium
  • RavanH/cesium
  • bpresles/cesium
  • am97/cesium
  • tuxmain/cesium
  • jytou/cesium
  • oliviermaurice/cesium
  • 666titi999/cesium
  • Yvv/cesium
35 results
Select Git revision
  • dev
  • gitlab_migration_1
  • issue_4
  • issue_780
  • master
  • patch-1
  • rml8
  • 0.0.1.ES.alpha1
  • 0.0.2
  • 0.1.13
  • 0.1.14
  • 0.1.15
  • 0.1.16
  • 0.1.17
  • 0.1.18
  • 0.1.19
  • 0.1.20
  • 0.1.21
  • 0.1.22
  • 0.1.23
  • 0.1.24
  • 0.1.25
  • 0.1.26
  • 0.1.27
  • 0.1.28
  • 0.1.4
  • 0.1.7
  • 0.1.8
  • 0.2.0
  • 0.2.1
  • v0.10.0
  • v0.10.1
  • v0.10.2
  • v0.11.0
  • v0.11.1
  • v0.11.2
  • v0.11.3
  • v0.11.4
  • v0.11.5
  • v0.11.6
  • v0.11.7
  • v0.11.8
  • v0.12.0
  • v0.12.1
  • v0.12.2
  • v0.12.3
  • v0.12.4
  • v0.12.5
  • v0.12.6
  • v0.12.7
  • v0.12.8
  • v0.12.9
  • v0.13.0
  • v0.14.0
  • v0.14.1
  • v0.15.0
  • v0.15.1
  • v0.15.2
  • v0.15.3
  • v0.15.4
  • v0.15.5
  • v0.15.6
  • v0.15.7
  • v0.16.0
  • v0.16.1
  • v0.17.0
  • v0.17.1
  • v0.17.2
  • v0.17.3
  • v0.17.4
  • v0.17.5
  • v0.17.6
  • v0.18.0
  • v0.18.1
  • v0.18.2
  • v0.18.3
  • v0.19.0
  • v0.19.1
  • v0.19.2
  • v0.19.3
  • v0.19.4
  • v0.19.5
  • v0.19.6
  • v0.2.10
  • v0.2.12
  • v0.2.13
  • v0.2.14
  • v0.2.3
  • v0.2.4
  • v0.2.5
  • v0.2.6
  • v0.2.7
  • v0.2.8
  • v0.2.9
  • v0.3.0
  • v0.3.1
  • v0.3.10
  • v0.3.11
  • v0.3.12
  • v0.3.13
  • v0.3.14
  • v0.3.15
  • v0.3.16
  • v0.3.17
  • v0.3.2
  • v0.3.3
  • v0.3.4
107 results
Show changes
Showing
with 1117 additions and 608 deletions
{
"version": "https://jsonfeed.org/version/1",
"title": "News",
"user_comment": "Ce fichier est nécessaire pour les versions avant la 1.7.7",
"feed_url": "https://raw.githubusercontent.com/duniter/cesium/master/doc/feed/feed-es.json",
"home_page_url": "https://forum.duniter.org/t/nueva-version-de-cesium-es/11459/3",
"author": {
"name": "Benoit Lavenier",
"url": "@BenoitLavenier",
"avatar": "https://forum.duniter.org//user_avatar/forum.duniter.org/kimamila/48/185_2.png"
},
"items": [
{
"title": "Nueva versión de Cesium",
"author": {
"name": "Benoit Lavenier",
"url": "@BenoitLavenier",
"avatar": "https://forum.duniter.org//user_avatar/forum.duniter.org/kimamila/48/185_2.png"
},
"date_published": "2023-08-14T19:30:00+02:00",
"id": "https://forum.duniter.org/t/nueva-version-de-cesium-es/11459",
"url": "https://forum.duniter.org/t/nueva-version-de-cesium-es/11459",
"content_html": "<p>¡Una nueva versión de Cesium <a href=\"https://cesium.app\">está disponible</a>!</p><blockquote><p>El sitio cesium.app está siendo actualizado... Lo mismo para Play Store, App Store, etc.\n¡Tengan paciencia!</p></blockquote><p>En los últimos meses, muchos de ustedes han encontrado múltiples dificultades: transacciones que desaparecen o se pierden completamente, error de “tiempo de espera excedido”, nodo desincronizado, etc.</p><p>Somos muy conscientes de estos problemas. Están relacionados con varios factores:</p><ul><li>por un lado, a la nueva versión 1.7 de Cesium, que introduce la selección automática del nodo Duniter, mediante sorteo entre los nodos sincronizados;</li><li>por otro lado, al estado de la red de nodos Duniter, algunos de los cuales se han revelado mal configurados para funcionar con Cesium, o utilizando versiones inestables de Duniter.</li></ul><h2><a name=\"novedades-1\" class=\"anchor\" href=\"#novedades-1\"></a>Novedades</h2><h3><a name=\"al-inicio-2\" class=\"anchor\" href=\"#al-inicio-2\"></a>Al inicio</h3><p>La selección de nodos al inicio ha sido revisada, para seleccionar solo aquellos compatibles con las funcionalidades de Cesium. Esto debería corregir los problemas explicados anteriormente.</p><h3><a name=\"mis-operaciones-3\" class=\"anchor\" href=\"#mis-operaciones-3\"></a>Mis operaciones</h3><p>En “Mis operaciones”, los comentarios largos son ahora más visibles, ya sea en un teléfono:<br><img src=\"https://forum.duniter.org/uploads/default/original/2X/4/4fa5d83286441e6689d93b6d636a46771fcb543d.png\" alt=\"image\" data-base62-sha1=\"bmB2vlwdnBe1zK86r7RGiQpJesl\" width=\"594\" height=\"357\"></p><p>…o en un navegador web:</p><p><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e.png\" data-download-href=\"https://forum.duniter.org/uploads/default/7d081473f9398e237425c96c8b9d55ef81e5662e\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e_2_690x192.png\" alt=\"image\" data-base62-sha1=\"hQ4ZGoEbNyaKoAMxEGc1d0Ksby6\" width=\"690\" height=\"192\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e_2_690x192.png, https://forum.duniter.org/uploads/default/original/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e.png 2x\" data-dominant-color=\"F2F6F8\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">819×229 36.5 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></p><p>Otras pequeñas mejoras en esta página:</p><ul><li>El hecho de refrescar la lista ya no provoca el parpadeo de las operaciones existentes. Solo las nuevas operaciones están animadas;</li><li>la carga de las operaciones más antiguas (en la parte inferior de la página) se hace directamente desplazándose hacia abajo. ¡No es necesario hacer clic en “Mostrar más” o “Mostrar todo”! Más allá de 6 meses de historial, estos botones aparecen para limitar el número de solicitudes a la red.<br><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699.png\" data-download-href=\"https://forum.duniter.org/uploads/default/8617ad8aa899debbc16bd92f38f1eefe68ed4699\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699_2_690x211.png\" alt=\"image\" data-base62-sha1=\"j8eI3VQg2QseXemuowxFVl8qFlf\" width=\"690\" height=\"211\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699_2_690x211.png, https://forum.duniter.org/uploads/default/optimized/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699_2_1035x316.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699.png 2x\" data-dominant-color=\"F7F9FA\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">1094×335 36.1 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></li></ul><h3><a name=\"redes-en-modo-experto-4\" class=\"anchor\" href=\"#redes-en-modo-experto-4\"></a>Redes (en modo experto)</h3><p>La vista de red permite ahora ver el estado de las colas de espera (o piscinas) que contienen los documentos pendientes (transacciones y solicitudes de membresía).</p><blockquote><p>Solo si ha activado el “modo experto” en la configuración,<br>y para los nodos que han activado la API BMA</p></blockquote><p><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5.png\" data-download-href=\"https://forum.duniter.org/uploads/default/f475de5c8c5f2e8efa21e33a387c3262a33eded5\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5_2_690x258.png\" alt=\"image\" data-base62-sha1=\"ySB2aVf3V1kcQ5aWwasCVNCX9kN\" width=\"690\" height=\"258\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5_2_690x258.png, https://forum.duniter.org/uploads/default/original/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5.png 2x\" data-dominant-color=\"F3F7F4\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">781×293 36.4 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></p><p>Otra pequeña novedad: ahora puede ver si un nodo (BMA) archiva correctamente el historial de transacciones. El símbolo <strong><img src=\"https://forum.duniter.org/images/emoji/twitter/credit_card.png?v=12\" title=\":credit_card:\" class=\"emoji\" alt=\":credit_card:\" loading=\"lazy\" width=\"20\" height=\"20\"> <code>TX</code></strong> aparece ahora en la columna <code>API</code>.</p><blockquote><p>Solo visible en modo experto, al <strong>expandir la visualización</strong> de las filas</p></blockquote><p><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c.png\" data-download-href=\"https://forum.duniter.org/uploads/default/f6c5abe0063f927df3b6a1814f3265d611c4ac4c\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c_2_690x40.png\" alt=\"image\" data-base62-sha1=\"zd2XW5qedxuZ7gjgSiRiYV6K2D2\" width=\"690\" height=\"40\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c_2_690x40.png, https://forum.duniter.org/uploads/default/original/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c.png 2x\" data-dominant-color=\"EFF3F1\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">787×46 8.14 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></p><h3><a name=\"otras-correcciones-5\" class=\"anchor\" href=\"#otras-correcciones-5\"></a>Otras correcciones</h3><ul><li>Android / iOS: ¡la descarga de archivos funciona! Para el archivo de revocación en particular, pero también para la lista de operaciones, la salvaguardia de identificadores, etc.<blockquote><p>Encontrarás el archivo descargado en el directorio “Descargas” (en Android) o “Documentos” (en iOS);</p></blockquote></li><li>Mis operaciones: la lista de UDs se muestra ahora correctamente (sin pasar por los nodos Duniter para eludir una limitación, pero a través del pod Cesium+ si está activado);</li><li>Notificaciones: el número de mensajes o notificaciones es ahora correcto cuando inicia sesión por primera vez en una cuenta.</li></ul><br/><br/>(...)"
}
]
}
{
"version": "https://jsonfeed.org/version/1",
"title": "Actualités",
"user_comment": "Ce fichier est nécessaire pour les versions avant la 1.7.7",
"feed_url": "https://raw.githubusercontent.com/duniter/cesium/master/doc/feed/feed-ff.json",
"home_page_url": "https://forum.duniter.org/t/nouvelle-version-de-cesium-fr/11458/2",
"author": {
"name": "Benoit Lavenier",
"url": "@BenoitLavenier",
"avatar": "https://forum.duniter.org//user_avatar/forum.duniter.org/kimamila/48/185_2.png"
},
"items": [
{
"title": "Nouvelle version de Cesium",
"author": {
"name": "Benoit Lavenier",
"url": "@BenoitLavenier",
"avatar": "https://forum.duniter.org//user_avatar/forum.duniter.org/kimamila/48/185_2.png"
},
"date_published": "2023-08-14T19:30:00+02:00",
"id": "https://forum.duniter.org/t/nouvelle-version-de-cesium/11458",
"url": "https://forum.duniter.org/t/nouvelle-version-de-cesium/11458",
"content_html": "<p>Une nouvelle version de Cesium <a href=\"https://cesium.app\">est disponible</a> !</p><blockquote><p>La mise jour du site et des Play Store est en cours.\nSoyez patient !</p></blockquote><p>Ces derniers mois, beaucoup d’entre vous ont rencontré des difficultés multiples : transactions qui disparaissent ou sont carrément perdues, erreur “délai d’attente dépassé”, nœud désynchronisé, etc.</p><p>Nous sommes bien conscients de ces problèmes. Ils sont liés à plusieurs facteurs :</p><ul><li>d’une part, à la nouvelle version 1.7 de Cesium, qui introduit la sélection automatique du nœud Duniter, par tirage au sort parmi les nœuds synchronisés ;</li><li>d’autre part, à l’état du réseau des nœuds Duniter, dont certains nœuds se sont révélés mal configurés pour fonctionner avec Cesium, ou utilisant des versions de Duniter non stables.</li></ul><h2><a name=\"nouveauts-1\" class=\"anchor\" href=\"#nouveauts-1\"></a>Nouveautés</h2><h3><a name=\"au-dmarrage-2\" class=\"anchor\" href=\"#au-dmarrage-2\"></a>Au démarrage</h3><p>La sélection des nœuds au démarrage a été revue, pour ne sélectionner que ceux compatibles avec les fonctionnalités de Cesium. Ceci devrait corriger les problèmes précédemment expliqués.</p><h3><a name=\"mes-oprations-3\" class=\"anchor\" href=\"#mes-oprations-3\"></a>Mes opérations</h3><p>Dans “Mes opérations”, les longs commentaires sont mieux visibles, que ce soit sur téléphone :<br><img src=\"https://forum.duniter.org/uploads/default/original/2X/4/4fa5d83286441e6689d93b6d636a46771fcb543d.png\" alt=\"image\" data-base62-sha1=\"bmB2vlwdnBe1zK86r7RGiQpJesl\" width=\"594\" height=\"357\"></p><p>…ou dans un navigateur web :</p><p><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e.png\" data-download-href=\"https://forum.duniter.org/uploads/default/7d081473f9398e237425c96c8b9d55ef81e5662e\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e_2_690x192.png\" alt=\"image\" data-base62-sha1=\"hQ4ZGoEbNyaKoAMxEGc1d0Ksby6\" width=\"690\" height=\"192\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e_2_690x192.png, https://forum.duniter.org/uploads/default/original/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/7/7d081473f9398e237425c96c8b9d55ef81e5662e.png 2x\" data-dominant-color=\"F2F6F8\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">819×229 36.5 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></p><p>Autres petites améliorations sur cette page :</p><ul><li>Le fait de rafraîchir la liste ne provoque plus de clignotement des opérations déjà existantes. Seules les nouvelles opérations sont animées ;</li><li>le chargement des opérations plus anciennes (en bas de page) se fait directement par défilement vers le bas. Plus besoin de cliquer sur “Afficher plus” ou “Afficher tout” ! Au-delà de 6 mois d’historique, ces boutons apparaissent, pour limiter le nombre de requêtes au réseau.<br><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699.png\" data-download-href=\"https://forum.duniter.org/uploads/default/8617ad8aa899debbc16bd92f38f1eefe68ed4699\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699_2_690x211.png\" alt=\"image\" data-base62-sha1=\"j8eI3VQg2QseXemuowxFVl8qFlf\" width=\"690\" height=\"211\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699_2_690x211.png, https://forum.duniter.org/uploads/default/optimized/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699_2_1035x316.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/8/8617ad8aa899debbc16bd92f38f1eefe68ed4699.png 2x\" data-dominant-color=\"F7F9FA\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">1094×335 36.1 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></li></ul><h3><a name=\"rseaux-en-mode-expert-4\" class=\"anchor\" href=\"#rseaux-en-mode-expert-4\"></a>Réseaux (en mode expert)</h3><p>La vue réseau permet maintenant de voir l’état des files d’attente (ou piscines) contenant les documents en attente (transactions et demandes d’adhésion).</p><blockquote><p>Uniquement si vous avez activé le “mode expert” dans les paramètres,<br>et pour les nœuds ayant activé l’API BMA</p></blockquote><p><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5.png\" data-download-href=\"https://forum.duniter.org/uploads/default/f475de5c8c5f2e8efa21e33a387c3262a33eded5\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5_2_690x258.png\" alt=\"image\" data-base62-sha1=\"ySB2aVf3V1kcQ5aWwasCVNCX9kN\" width=\"690\" height=\"258\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5_2_690x258.png, https://forum.duniter.org/uploads/default/original/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/f/f475de5c8c5f2e8efa21e33a387c3262a33eded5.png 2x\" data-dominant-color=\"F3F7F4\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">781×293 36.4 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></p><p>Autre petite nouveauté : vous pouvez voir si un nœud (BMA) archive bien l’historique des transactions. Le symbole <strong><img src=\"https://forum.duniter.org/images/emoji/twitter/credit_card.png?v=12\" title=\":credit_card:\" class=\"emoji\" alt=\":credit_card:\" loading=\"lazy\" width=\"20\" height=\"20\"> <code>TX</code></strong> s’affiche maintenant, dans la colonne <code>API</code>.</p><blockquote><p>Visible uniquement en mode expert, en <strong>décompactant l’affichage</strong> des lignes</p></blockquote><p><div class=\"lightbox-wrapper\"><a class=\"lightbox\" href=\"https://forum.duniter.org/uploads/default/original/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c.png\" data-download-href=\"https://forum.duniter.org/uploads/default/f6c5abe0063f927df3b6a1814f3265d611c4ac4c\" title=\"image\"><img src=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c_2_690x40.png\" alt=\"image\" data-base62-sha1=\"zd2XW5qedxuZ7gjgSiRiYV6K2D2\" width=\"690\" height=\"40\" srcset=\"https://forum.duniter.org/uploads/default/optimized/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c_2_690x40.png, https://forum.duniter.org/uploads/default/original/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c.png 1.5x, https://forum.duniter.org/uploads/default/original/2X/f/f6c5abe0063f927df3b6a1814f3265d611c4ac4c.png 2x\" data-dominant-color=\"EFF3F1\"><div class=\"meta\"><svg class=\"fa d-icon d-icon-far-image svg-icon\" aria-hidden=\"true\"><use href=\"#far-image\"></use></svg><span class=\"filename\">image</span><span class=\"informations\">787×46 8.14 KB</span><svg class=\"fa d-icon d-icon-discourse-expand svg-icon\" aria-hidden=\"true\"><use href=\"#discourse-expand\"></use></svg></div></a></div></p><h3><a name=\"autres-correctifs-5\" class=\"anchor\" href=\"#autres-correctifs-5\"></a>Autres correctifs</h3><ul><li>Android / iOS : le téléchargement de fichier fonctionne ! Pour le fichier de révocation notamment, mais aussi pour la liste des opérations, la sauvegarde des identifiants, etc.<blockquote><p>Vous trouverez le fichier téléchargé dans le répertoire “Téléchargements” (sous Android) ou “Documents” (sous iOS) ;</p></blockquote></li><li>Mes opérations : la liste des DU s’affiche maintenant correctement (sans passer par les nœuds Duniter pour contourner une limitation, mais par le pod Cesium+ s’il est activé) ;</li><li>Notifications : le nombre de messages ou de notifications est maintenant correct lorsque vous vous connectez pour la première fois sur un compte.</li></ul><br/> (...)"
},
{
"title": "Actu générale : La Ǧ1 bouge !",
"author": {
"name": "Collectif MaJ V2",
"url": "@LeForum",
"avatar": "https://forum.monnaie-libre.fr/user_avatar/forum.monnaie-libre.fr/leforum/48/8260_2.png"
},
"date_published": "2025-02-25T12:09:00+02:00",
"id": "https://forum.monnaie-libre.fr/t/actu-generale-la-1-bouge/31318",
"url": "https://forum.monnaie-libre.fr/t/actu-generale-la-1-bouge/31318",
"content_html": "<p>La Ǧ1 bouge, plusieurs chantiers importants sont en cours :</p>\n<ul>\n<li>Son écosystème technique qui approche de sa <a href=\"https://monnaie-libre.fr/maj-v2/\">mise à jour (V2) </a> sur laquelle nous travaillons depuis plusieurs années.</li>\n<li>Organisation et prises des décisions (gouvernance) dont un <a href=\"https://forum.monnaie-libre.fr/t/proposition-licence-g1-v0-3-0/31234\">vote pour faire évoluer la licence Ǧ1</a> auquel vous pouvez prendre part avant le 13 mars.</li>\n</ul>\n<p><strong>Pour la dernière ligne droite, la Ǧ1 a besoin de vous :</strong></p>\n<ul>\n<li>Pour accélérer les développements restants par un <a href=\"https://www.helloasso.com/associations/axiom-team/collectes/finalisation-de-cesium-v2-et-duniter-v2\">financement participatif</a> pour rémunérer quelques mois un développeur afin de finaliser Cesium².</li>\n<li>Pour tester les logiciels et nous dire ce qui ne marche pas sur votre appareil (ordi, tablette ou smartphone).</li>\n</ul>\n<p>Pour être tenu au courant d’un ou plusieurs des sujets évoqués, <a href=\"https://s.42l.fr/form-g1v2\">laissez-nous votre email</a>.</p>"
}
]
}
File added
# Connexion automatique, par fichier de trousseau
> Possible uniquement sur la version de bureau (desktop) de Cesium
Pour se connecter dès la lancement, à partir d'une fichier de trousseau (ou fichier de clefs), suivez les étapes suivantes :
1. Générer un fichier de trousseau :
* Allez dans "Mon compte > Options > Compte et sécurité";
* Choisissez "Générer mon fichier de trousseau";
* Puis "format "PubSec".
2. Placer le fichier à l'emplacement suivant `<home>/.config/cesium/keyring.yml`
3. Lancer Cesium : vous devriez être directement connecté sur ce compte.
...@@ -10,29 +10,30 @@ A vos claviers ! ...@@ -10,29 +10,30 @@ A vos claviers !
Ce premier niveau consiste à créer *votre propre version* des sources du logiciel et de récupérer cette copie sur votre ordinateur. Vous y produirez : Ce premier niveau consiste à créer *votre propre version* des sources du logiciel et de récupérer cette copie sur votre ordinateur. Vous y produirez :
* votre propre compte *GitHub* * votre propre compte sur le [GitLab de Duniter](https://git.duniter.org)
* votre propre version du logiciel, votre *fork* * votre propre version du logiciel, votre *fork*
* une copie locale des fichiers de code source provenant de votre *fork* * une copie locale des fichiers de code source provenant de votre *fork*
### Créez un compte GitHub ### Créez un compte GitLab Duniter
> Si vous disposez déjà d'un compte GitHub, vous pouvez passer cette étape. > Si vous disposez déjà d'un compte GitLab, vous pouvez passer cette étape.
Rendez-vous sur https://github.com (site en anglais). Renseigner les 3 champs proposés : Rendez-vous sur [https://git.duniter.org](https://git.duniter.org/users/sign_in?redirect_to_referer=yes) (site en anglais).
Dans `Register` Renseigner les 3 champs proposés :
* Nom complet
* Nom d'utilisateur * Nom d'utilisateur
* E-mail * E-mail
* Mot de passe * Mot de passe
<img src="https://forum.duniter.org/uploads/default/original/1X/13ade346327b73bbf1acc97027af147eeb4e9089.png" width="346" height="325"> Vous recevrez probablement un e-mail de confirmation qu'il vous faudra valider. Une fois cette étape passée, vous devriez disposer d'un compte sur le GitLab Duniter.
Vous recevrez probablement un e-mail de confirmation qu'il vous faudra valider. Une fois cette étape passée, vous devriez disposer d'un compte GitHub .
### Forkez le dépôt principal ### Forkez le dépôt principal
Rendez-vous à l'adresse https://github.com/duniter/cesium. Cliquez sur le bouton « Fork » en dans le coin supérieur droit de la page : Rendez-vous à l'adresse https://git.duniter.org/clients/cesium-grp/cesium.
<img src="https://forum.duniter.org/uploads/default/original/1X/3b9228c664520496d6a7e86e3f9c4c438f111914.png" width="388" height="98"> Cliquez sur le bouton « Fourcher » (ou « Fork ») en haut de la page (sous le logo).
### Installer Git ### Installer Git
...@@ -49,7 +50,7 @@ Pour récupérer le code source, lancez Git en mode console. ...@@ -49,7 +50,7 @@ Pour récupérer le code source, lancez Git en mode console.
* Sous Linux et MacOS, ouvrez tout simplement le Terminal * Sous Linux et MacOS, ouvrez tout simplement le Terminal
* Sous Windows lancez le programme *Git Bash* : * Sous Windows lancez le programme *Git Bash* :
<img src="https://forum.duniter.org/uploads/default/original/1X/6fc638dc0a22d88da7e84dbf0371e69747767f78.png" width="432" height="80"> <img src="./img/6fc638dc0a22d88da7e84dbf0371e69747767f78.png" width="432" height="80">
#### Clonez votre fork, en ligne de commande #### Clonez votre fork, en ligne de commande
...@@ -60,10 +61,10 @@ Vous n'avez plus qu'à retourner dans votre console Git et saisir : ...@@ -60,10 +61,10 @@ Vous n'avez plus qu'à retourner dans votre console Git et saisir :
git clone <coller l'URL copiée> git clone <coller l'URL copiée>
ce qui donne dans mon cas : ce qui donne **dans mon cas** :
``` ```
git clone https://github.com/blavenie/cesium.git git clone git@git.duniter.org:blavenie/cesium.git
Cloning into 'cesium'... Cloning into 'cesium'...
(...) (...)
Checking connectivity... done. Checking connectivity... done.
...@@ -89,16 +90,16 @@ Installer Node.js est devenu extrêmement simple pour ces OS : un outil vous per ...@@ -89,16 +90,16 @@ Installer Node.js est devenu extrêmement simple pour ces OS : un outil vous per
Vous pouvez installer nvm avec la commande suivante : Vous pouvez installer nvm avec la commande suivante :
```bash ```bash
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.1/install.sh | bash curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.39.3/install.sh | bash
``` ```
Fermez puis rouvrez votre terminal, comme indiqué. Puis, installez Node.js (choisissez la version 5) : Fermez puis rouvrez votre terminal, comme indiqué. Puis, installez Node.js (choisissez la version 12) :
```bash ```bash
nvm install 5 nvm install 12
``` ```
Vous aurez alors la dernière version de la branche 5.x de Node.js prête à l'emploi. Vous aurez alors la dernière version de la branche 12.x de Node.js prête à l'emploi.
##### Outils de compilation ##### Outils de compilation
...@@ -109,13 +110,13 @@ sudo apt-get install build-essential ...@@ -109,13 +110,13 @@ sudo apt-get install build-essential
#### Sous Windows #### Sous Windows
Pour Windows, téléchargez la version 5 disponible sur le site officiel de Node.js : https://nodejs.org Pour Windows, téléchargez la version 12 disponible sur le site officiel de Node.js : https://nodejs.org
Puis lancez l'installeur ainsi téléchargé. Puis lancez l'installeur ainsi téléchargé.
### Installer les modules Node.js de Cesium ### Installer les modules Node.js de Cesium
Cesium repose sur des librairies tierce pour fonctionner appelées *dépendances*, comme par exemple des librairies de compilation (gulp, bower, ionic). Cesium repose sur des librairies tierce pour fonctionner appelées *dépendances*, comme par exemple des librairies de compilation (gulp, ionic, angularJS).
Le fait d'avoir cloné les sources n'est en réalité pas suffisant pour lancer l'application. Nous devons obtenir le code des dépendances pour obtenir ainsi l'ensemble du code exécutable du programme. Pour ce faire, retournez dans la console Git et déplacez-vous dans le répertoire cloné : Le fait d'avoir cloné les sources n'est en réalité pas suffisant pour lancer l'application. Nous devons obtenir le code des dépendances pour obtenir ainsi l'ensemble du code exécutable du programme. Pour ce faire, retournez dans la console Git et déplacez-vous dans le répertoire cloné :
...@@ -126,11 +127,13 @@ cd cesium ...@@ -126,11 +127,13 @@ cd cesium
Puis, lancez le téléchargement et l'installation des modules Cesium à l'aide de la commande : Puis, lancez le téléchargement et l'installation des modules Cesium à l'aide de la commande :
```bash ```bash
npm install -g bower gulp ionic cordova npm install -g yarn gulp cordova@10.0.0 @ionic/cli web-ext
``` ```
Puis pour les dépendances non globales : Puis pour les dépendances non globales :
```bash ```bash
npm install yarn
``` ```
> Le processus d'installation peut prendre plusieurs minutes. En effet, il faut télécharger toutes les dépendances de Cesium et même en compiler certaines. > Le processus d'installation peut prendre plusieurs minutes. En effet, il faut télécharger toutes les dépendances de Cesium et même en compiler certaines.
...@@ -138,30 +141,19 @@ npm install ...@@ -138,30 +141,19 @@ npm install
Si tout s'est bien passé, vous devriez obtenir une fin d'arborescence dans la console, et l'invité de commande devrait vous avoir rendu la main : Si tout s'est bien passé, vous devriez obtenir une fin d'arborescence dans la console, et l'invité de commande devrait vous avoir rendu la main :
```bash ```bash
├── bower@1.7.9 yarn install v1.15.2
├─┬ gulp@3.9.1 [1/4] Resolving packages...
│ ├── archy@1.0.0
│ ├─┬ chalk@1.1.3
(...) (...)
│ ├─┬ through2@0.5.1 $ node -e "try { require('fs').symlinkSync(require('path').resolve('node_modules/@bower_components'), 'www/lib', 'junction') } catch (e) { }"
│ │ ├── readable-stream@1.0.34 Done in 0.82s.
│ │ └── xtend@3.0.0
│ └─┬ vinyl@0.2.3
│ └── clone-stats@0.0.1
└── shelljs@0.3.0
npm WARN cesium@0.0.1 No repository field.
npm WARN cesium@0.0.1 No license field.
blavenie@~$
``` ```
> Il se peut que vous obteniez des messages `npm WARN [...]`. Rien de grave : comme le nom du message l'indique, il s'agit simplement d'un avertissement non bloquant pour la suite des événements. > Il se peut que vous obteniez des messages `npm WARN [...]`. Rien de grave : comme le nom du message l'indique, il s'agit simplement d'un avertissement non bloquant pour la suite des événements.
Puis installer les dépendences via bower : Puis installer les dépendences restantes (via bower) :
```bash ```bash
bower install npm run postintall
``` ```
### Installer un IDE ### Installer un IDE
...@@ -169,11 +161,13 @@ bower install ...@@ -169,11 +161,13 @@ bower install
Pour développer sous NodeJS, vous pouvez utiliser l'IDE de votre choix : Pour développer sous NodeJS, vous pouvez utiliser l'IDE de votre choix :
* Par exemple Sublime Text (non libre) : https://www.sublimetext.com/ * Par exemple Sublime Text (non libre) : https://www.sublimetext.com/
* Autre possibilité : WebStorm (non libre mais fonctionnement très avancé). cf Post de cgeek sur le développement de Duniter. * Autres possibilités :
* VS Code (libre).
* WebStorm (non libre mais fonctionnement très avancé).
### Installer Chrome et/ou Firefox ### Installer Chrome et/ou Firefox
Pour débugger plus facilement le javascript Cesium, il est plus facile Les navigateur Chrome Pour débugger plus facilement le javascript Cesium, il est plus facile d'utiliser le navigateur Chrome
## Niveau III : maîtriser les commandes usuelles ## Niveau III : maîtriser les commandes usuelles
...@@ -184,69 +178,128 @@ Ce troisième niveau permet de découvrir les quelques (cinq) commandes que vous ...@@ -184,69 +178,128 @@ Ce troisième niveau permet de découvrir les quelques (cinq) commandes que vous
### Configurer Cesium ### Configurer Cesium
La configuration par défaut de notre environnement est visible dans le fichier : app/config.json La configuration par défaut de notre environnement est visible dans le fichier `app/config.json`. Plusieurs profils y sont présents : `default`, `dev`, etc.
```bash ```json
{ {
"default": { "default": {
"APP_CONFIG": { "cacheTimeMs": 60000,
"DUNITER_NODE": "cgeek.fr:9330", "fallbackLanguage": "en",
"NEW_ISSUE_LINK": "https://github.com/duniter/cesium/issues/new?labels=bug", "rememberMe": false,
"TIMEOUT": 4000, "showUDHistory": false,
"DEBUG": false, "timeout": 10000,
"NATIVE_TRANSITION": false "timeWarningExpireMembership": 5184000,
} "timeWarningExpire": 7776000,
"useLocalStorage": true,
"useRelative": true,
"initPhase": false,
"expertMode": false,
"decimalCount": 4,
"helptip": {
"enable": true,
"installDocUrl": "https://github.com/duniter/duniter/blob/master/doc/install-a-node.md"
}, },
"duniter-fr": { "node": {
"APP_CONFIG": { "host": "g1.duniter.org",
"DUNITER_NODE": "cgeek.fr:9330", "port": "443"
"NEW_ISSUE_LINK": "https://github.com/duniter/cesium/issues/new?labels=bug", },
"TIMEOUT": 4000, "plugins":{
"DEBUG": false, "es": {
"NATIVE_TRANSITION": false "enable": true,
"askEnable": false,
"host": "g1.data.duniter.fr",
"port": "443"
}
} }
}, },
(...) (...)
"dev": { "dev": {
"APP_CONFIG": { "cacheTimeMs": 60000,
"DUNITER_NODE": "localhost:9201", "fallbackLanguage": "fr-FR",
"TIMEOUT": 4000, "defaultLanguage": "fr-FR",
"DEBUG": false, "rememberMe": true,
"NATIVE_TRANSITION": true "showUDHistory": false,
"timeout": 6000,
"timeWarningExpireMembership": 5184000,
"timeWarningExpire": 7776000,
"useLocalStorage": true,
"useRelative": true,
"initPhase": false,
"expertMode": false,
"decimalCount": 2,
"helptip": {
"enable": true,
},
"node": {
"host": "localhost",
"port": "9600"
},
"plugins":{
"es": {
"enable": false
} }
} }
},
} }
``` ```
Nous utiliserons la configuration "dev", pour utiliser votre noeud Duniter. Nous utiliserons la configuration "dev", pour utiliser votre noeud Duniter.
Pour activer cette configuration, lancez la commande :
Modifiez les valeurs `host` et `port` du profil de configuration `dev`, afin qu'elles correspondent à votre noeud Duniter :
```json
"dev: {
...
"node": {
"host": "localhost",
"port": "9600"
},
...
```
Désactivez le plugin "es" (utilisé pour Cesium+) :
```json
"dev: {
...
"plugins":{
"es": {
"enable": false
}
}
...
```
Pour activer cette configuration, lancez maintenant la commande :
```bash ```bash
gulp default --env dev gulp config --env dev
``` ```
```bash ```bash
[17:32:34] Using gulpfile ~/git/duniter/cesium/gulpfile.js [17:32:34] Using gulpfile (...)/cesium/gulpfile.js
[17:32:34] Starting 'sass'...
[17:32:34] Starting 'config'... [17:32:34] Starting 'config'...
[17:32:34] Building `www/js/config.js` for `dev` environment... [17:32:34] Building `www/js/config.js` for `dev` environment...
[17:32:34] Finished 'config' after 71 ms [17:32:36] Finished 'config' after 10 μs
[17:32:36] Finished 'sass' after 1.2 s
[17:32:36] Starting 'default'...
[17:32:36] Finished 'default' after 10 μs
``` ```
> Cette commande sera à relancer à cachune de vos modifications du fichier `app/config`.
Cesium est maintenant configuré pour utiliser votre noeud Duniter local. Cesium est maintenant configuré pour utiliser votre noeud Duniter local.
### Lancer Cesium (mode web) ### Lancer Cesium (mode web)
Moment fatidique ! Il ne vous reste plus qu'à lancer l'application (en mode web) pour savoir si tout s'est bien passé et que vous êtes prêts pour la suite. Il ne vous reste plus qu'à lancer l'application (en mode web) pour savoir si tout s'est bien passé et que vous êtes prêts pour la suite.
Lancez la commande suivante : Lancez la commande suivante :
```bash ```bash
ionic serve npm start
``` ```
> Alternative : `ionic serve`
Une fois terminée, la commande affiche : Une fois terminée, la commande affiche :
```bash ```bash
...@@ -262,8 +315,11 @@ Ionic server commands, enter: ...@@ -262,8 +315,11 @@ Ionic server commands, enter:
ionic $ ionic $
``` ```
Vous pouvez ouvrir un navigateur web à l'adresse suivante : http://localhost:8100 Vous pouvez ouvrir un navigateur web à l'adresse suivante : http://localhost:8100
Vous verrez la page d'accueil de Cesium. Vous devriez y voir la page d'accueil de Cesium.
Bravo, vous avez une installation de Cesium opérationnelle !
### Documentation ### Documentation
...@@ -283,39 +339,49 @@ Chercher et répérer dans le code : ...@@ -283,39 +339,49 @@ Chercher et répérer dans le code :
* les controllers (JS) : www/js/controllers * les controllers (JS) : www/js/controllers
* les services (JS) : www/js/services * les services (JS) : www/js/services
<img src="./img/a5078db3abdf71c87f245e948ce94a181b0e0f37.png" width="690" height="369">
### Aller plus loin dans le code ### Aller plus loin dans le code
Cesium s'appuie sur AngularJS. D'excellentes documentations sont présentes sur le web. Cesium s'appuie sur AngularJS. D'excellentes documentations sont présentes sur le web.
__Note :__ La version d'AngularJS utilisée est une 1.x : la 2.x change complètement l'approche du code... La suite nous dira si Cesium passera à la version 2. __Note :__ La version d'AngularJS utilisée est une 1.x. Les 2.x et supérieure changent complètement et impose une refonte complète... Cette refonte est prévue d'ici 2019, dans une version 2 de Cesium.
## Niveau V : Debuggage ## Niveau V : Debuggage
### Sous Chrome ### Sous Chrome
Ouvrir l'application dans Chrome à l'adresse http://localhost:8100 #### Ouvrir l'explorateur de sources
Ouvrez l'application dans Chrome à l'adresse http://localhost:8100
Ouvrir la console de développeur : "Option > Plus d'outils > Outils de développement" Ouvrez les outils de développement :
* Menu `Option > Plus d'outils > Outils de développement`
* ou par le raccourcis clavier : `Ctrl + Maj + i`
Dans l'explorateur de fichier javascript : #### Débugger la certification d'un utilisateur
* Chercher et visualisé le fichier "js/controllers/wot-controllers.js" Ouvrez l'explorateur de source, puis cherchez le fichier `dist/dist_js/app/controllers/wot-controllers.js`.
* Chercher la méthode "certifyIdentity()"
* Placer un point d'arrêt.
Dans l'application web : Recherchez la méthode `$scope.certify()`, et placez y un point d'arrêt.
* Dans le menu de gauche, cliquer sur "Annuaire"; Naviguez dans l'application Cesium de la manière suivante :
* Recherche un utilisateur;
* Cliquer sur l'utilisateur pour visualiser son identité * Cliquez dans le menu (à gauche) `Annuaire`;
* Cliquer sur le bouton "Certifier" * Recherche un utilisateur, puis visualiser son identité;
* Dans `Certification reçues`, cliquez sur le bouton `Certifier`;
* Vérifier que la console s'arrête sur le point d'arrêt. * Vérifier que la console s'arrête sur le point d'arrêt.
Pour découvrir le code, il est intéressant <img src="./img/eca671a6d24b8e11566cfcca11b65e6c9c9c370c.png" width="690" height="223">
Découvrez le code en déroulant l'action pas à pas.
> Utiliser les touches de `F9` à `F11`, pour rentrer dans une méthode (F11), avancer pas à pas (F10) ou jusqu'au prochain point d'arrêt (F9), etc.
## La Suite ?! ## La Suite ?!
Vous pouvez maintenant poursuivre avec les niveaux qui suivent. Vous pouvez maintenant poursuivre avec les niveaux qui suivent. Nous y verrons comment modifier un écran de Cesium.
Nous y verrons comment modifier un écran de Cesium.
[Voir la suite ici >>](./development_tutorial-02.md) [Voir la suite ici >>](./development_tutorial-02.md)
...@@ -7,30 +7,24 @@ en les modifiant afin d'améliorer un écran de Cesium. ...@@ -7,30 +7,24 @@ en les modifiant afin d'améliorer un écran de Cesium.
## Prérequis ## Prérequis
### Connaitre les fonctionnalités Avant de faire ce tutoriel, vous devez :
Il nécessite que vous connaissiez déjà l'outil Cesium. - Connaitre les fonctionnalités de Cesium. Si ce n'est pas le cas, reportez vous à [la vidéo de présentation générale des fonctionnalités](https://www.youtube.com/watch?v=FQzGIzJf9Nw&list=PLr7acQJbh5rzgkXOrCws2bELR8TNRIuv0&index=6) (RML7) et à celle détaillant les nouveautés (RML8 - lien à venir)
Si ce n'est pas le cas, reportez vous à [la vidéo de présentation générale des fonctionnalités](https://www.youtube.com/watch?v=FQzGIzJf9Nw&list=PLr7acQJbh5rzgkXOrCws2bELR8TNRIuv0&index=6) (RML7) et à celle détaillant les nouveautés (RML8 - lien à venir) - Avoir suivi le 1er tutoriel de mise en place de l'environnement [jusqu'au niveau III](https://github.com/duniter/cesium/blob/master/doc/fr/development_tutorial.md)
### Avoir atteint le niveau III : Mise en place de l'environnement
Pour mettre en place votre environnement de développement, suivez le [1er tutoriel de mise en place de l'environnement](https://github.com/duniter/cesium/blob/master/doc/fr/development_tutorial.md) (au moins jusqu'au niveau III)
## Niveau VI : Afficher un paramètre monétaire manquant ## Niveau VI : Afficher un paramètre monétaire manquant
__Objectif :__ Dans ce niveau, l'objectif est d'afficher dans la page [`Monnaie`](http://cesium.duniter.fr/#/app/currency/view/lg/) le paramètre monétaire `stepMax`. __Objectif :__ Dans ce niveau, l'objectif est d'afficher dans la page [`Monnaie`](http://g1.duniter.fr/#/app/currency/view/lg/) le paramètre monétaire `stepMax`.
> Pour rappel, `stepMax` est la distance maximale entre un membre et un postulant, pour que ce dernier puisse rentrer dans la toile de confiance. > Pour rappel, `stepMax` est la distance maximale entre un membre et un postulant, pour que ce dernier puisse rentrer dans la toile de confiance.
### Modifier le template HTML ### Modifier le template HTML
Ouvrez le fichier de template `/www/templates/currency/tabs/view_parameters.html`. Ouvrez le fichier de template `/www/templates/currency/items_parameters.html`.
Ajouter un nouvel élément dans la liste des paramètres, c'est à dire un nouveau tag `<ion-item>`, sous le tag `<ion-list>` : Ajouter un nouvel élément dans la liste des paramètres, c'est à dire un nouveau tag `<ion-item>`, en dessous les autres tag du même nom :
```html ```html
<ion-list>
(...) (...)
<ion-item class="item-icon-left"> <ion-item class="item-icon-left">
...@@ -38,13 +32,11 @@ Ajouter un nouvel élément dans la liste des paramètres, c'est à dire un nouv ...@@ -38,13 +32,11 @@ Ajouter un nouvel élément dans la liste des paramètres, c'est à dire un nouv
<span translate>CURRENCY.VIEW.STEP_MAX</span> <span translate>CURRENCY.VIEW.STEP_MAX</span>
<span class="badge badge-stable">{{stepMax}}</span> <span class="badge badge-stable">{{stepMax}}</span>
</ion-item> </ion-item>
</ion-list>
``` ```
Si vous rafraichissez la page `Monnaie` de votre navigateur, vous devriez observer la modification : Si vous rafraichissez la page `Monnaie` de votre navigateur, vous devriez observer la modification :
<img src="https://forum.duniter.org/uploads/default/original/2X/1/19a637b1fa847aa5bbb18565737e9e5e28729221.jpg" width="431" height="97"> <img src="./img/19a637b1fa847aa5bbb18565737e9e5e28729221.jpg" width="431" height="97">
### Internationliser un libellé ### Internationliser un libellé
...@@ -77,7 +69,7 @@ N'oubliez pas **d'ajouter une virgule** sur la ligne qui précéde... ...@@ -77,7 +69,7 @@ N'oubliez pas **d'ajouter une virgule** sur la ligne qui précéde...
Refarichissez la page de votre navigateur : la clef a bien été traduite ! Refarichissez la page de votre navigateur : la clef a bien été traduite !
<img src="https://forum.duniter.org/uploads/default/original/2X/6/6bd04622dd2eb59f6d716ae9e2f114276e4ca35a.jpg" width="690" height="116"> <img src="./img/6bd04622dd2eb59f6d716ae9e2f114276e4ca35a.jpg" width="690" height="116">
Recommencez l'opération dans les **autres fichiers de traduction** présents dans `www/i18n` : Recommencez l'opération dans les **autres fichiers de traduction** présents dans `www/i18n` :
...@@ -97,7 +89,7 @@ Il ne reste plus qu'à afficher dynamiquement la valeur de notre paramètre `ste ...@@ -97,7 +89,7 @@ Il ne reste plus qu'à afficher dynamiquement la valeur de notre paramètre `ste
Ouvrez le controlleur `CurrencyViewController` présent dans le fichier `www/js/controllers/currency-controllers.js` Ouvrez le controlleur `CurrencyViewController` présent dans le fichier `www/js/controllers/currency-controllers.js`
Ce controlleur fait déjà un appel à l'API Duniter [`/blockchain/parameters`](http://cgeek.fr:9330/blockchain/parameters). Ce controlleur fait déjà un appel à l'API Duniter [`/blockchain/parameters`](http://cgeek.fr:9330/blockchain/parameters).
Identifiez la fonction `loadParameters()`. Identifiez la fonction `load()`.
Modifiez le code de retour de l'appel `/blockchain/parameters`, pour stocker la valeur `stepMax` dans le `$scope` : Modifiez le code de retour de l'appel `/blockchain/parameters`, pour stocker la valeur `stepMax` dans le `$scope` :
``` ```
...@@ -107,15 +99,13 @@ function CurrencyViewController($scope, $q, $translate, $timeout, BMA, UIUtils, ...@@ -107,15 +99,13 @@ function CurrencyViewController($scope, $q, $translate, $timeout, BMA, UIUtils,
$scope.stepMax = 0; $scope.stepMax = 0;
(...) (...)
$scope.loadParameter = function() { $scope.load = function() {
if (!$scope.node) { (...)
return;
}
var M;
return $q.all([ return $q.all([
// Appel de /blockchain/parameters sur le noeud Duniter // Get the currency parameters
$scope.node.blockchain.parameters() BMA.node.blockchain.parameters()
.then(function(json){ .then(function(json){
$scope.currency = json.currency; $scope.currency = json.currency;
(...) (...)
...@@ -130,30 +120,51 @@ function CurrencyViewController($scope, $q, $translate, $timeout, BMA, UIUtils, ...@@ -130,30 +120,51 @@ function CurrencyViewController($scope, $q, $translate, $timeout, BMA, UIUtils,
Votre navigateur doit maintenant afficher : Votre navigateur doit maintenant afficher :
<img src="https://forum.duniter.org/uploads/default/original/2X/3/3df8cbd2133ea9e9a28855f4b50413846fdf292c.jpg" width="519" height="85"> <img src="./img/3df8cbd2133ea9e9a28855f4b50413846fdf292c.jpg" width="519" height="85">
Bravo, vous savez maintenant afficher de nouvelle valeurs dans les écrans de Cesium ! Bravo, vous savez maintenant afficher de nouvelle valeurs dans les écrans de Cesium !
### Devenir contributeur officiel > faire `pull request` ## Niveau VII : Publier vos modifications
__Objectif :__ Devenir contributeur officiel, en publiant votre code !
La modification que vous venez de faire correspond en réalité au [ticket gihub #209](https://github.com/duniter/cesium/issues/209). ### Faire un `pull request`
Si vous n'avez jamais utilisé git sur votre machine courante, il va d'abord falloir que vous définissiez
1. votre adresse e-mail : `git config --global user.email "votre@email.xyz"`
2. vos nom et prénom : `git config --global user.name "Prénom NOM"`
La modification que vous venez de faire correspond en réalité au [ticket #209](https://git.duniter.org/clients/cesium-grp/cesium/issues/209).
Pour lui adjoindre votre modification, et ainsi **devenir officiellement contributeur** de Cesium : Pour lui adjoindre votre modification, et ainsi **devenir officiellement contributeur** de Cesium :
* Faites un `git commit` pour valider votre code; * Tapez la commande `git add` suivie des noms des fichiers que vous avez modifiés ou, plus simplement `git add *` pour ajouter au commit tous les fichiers modifiés.
* Puis un `git push` pour envoyer sur votre repo GitHub. * Puis faites un `git commit` pour valider votre code;
* Dans github, connectez sur votre compte; * Enfin, faites un `git push` pour envoyer sur votre repo GitHub.
* Ouvrez votre dépot `Cesium` * Dans GitLab, connectez-vous sur votre compte;
* Cliquer sur `New pull request`, en indiquant dans le titre la référence au ticket : `#209` * Ouvrez votre dépot `Cesium` via le menu "Projets" > "Your projects" que vous trouverez tout en haut à gauche, dans la barre de navigation.
* Dans le menu de gauche, rendez-vous dans "Merge requests", et cliquez sur le bouton "New merge request"
* La plupart des champs étant déjà préremplis, il ne vous reste plus qu'à sélectionner la branche source (si vous n'avez pas changé de branche via la ligne de commande git, c'est "master")
* Cliquez sur `Compare branches and continue`
* Dans le titre la référence au ticket : `#209`
Votre contribution est maintenant visible par les développeurs de Cesium, qui pourront plus facilement intégrer votre code. Votre contribution est maintenant visible par les développeurs de Cesium, qui pourront plus facilement intégrer votre code.
### Pour aller plus loin : d'autres variables ? (optionnel) > _Note :_ Depuis les RML7, ce ticket a été fermé. Vous pouvez donc continuer ce niveau, en ajoutant d'autres variables manquantes (cf paragraphe suivant), puis
> publier vos modifications : la démarche du `pull request` reste la même.
## Niveau VIII : Modification libre
Pour vous faire la main sur les modifications dans Cesium, vous pouvez ajouter d'autres paramètres manquants de la monnaie, notamment ceux qui concernent la Blockchain : `xpercent`, `percentRot`, `blocksRot`... __Objectif :__ A vous maintenant d'ajouter les informations manquantes, et qui semblent intéressantes.
### Ajouter de nouvelles variables
Pour vous faire la main sur les modifications dans Cesium, vous pouvez ajouter d'autres paramètres manquants de la monnaie.
Par exemple, parmi ceux qui concernent la _BlockChain_ : `xpercent`, `percentRot`, `blocksRot`...
Vous trouverez leur définition dans la [documentation du protocole Duniter](https://github.com/duniter/duniter/blob/master/doc/Protocol.md#protocol-parameters). Vous trouverez leur définition dans la [documentation du protocole Duniter](https://github.com/duniter/duniter/blob/master/doc/Protocol.md#protocol-parameters).
Astuce : pour séparer les différentes partie de l'écran, ajoutez un séparateur, c'est à dire un tag `<div>` avec la classe CSS `item item-divider` : > _Astuce :_ pour séparer les différentes partie de l'écran, ajoutez un séparateur, c'est à dire un tag `<div>` avec la classe CSS `item item-divider` :
```html ```html
<div class="item item-divider"> <div class="item item-divider">
...@@ -162,10 +173,8 @@ Astuce : pour séparer les différentes partie de l'écran, ajoutez un séparate ...@@ -162,10 +173,8 @@ Astuce : pour séparer les différentes partie de l'écran, ajoutez un séparate
<!-- paramètres relatifs à la blockchain --> <!-- paramètres relatifs à la blockchain -->
``` ```
Autre modification que vous pouvez faire : la correction de la formule du DU (cf [ce ticket](https://github.com/duniter/cesium/issues/210)).
## La Suite ?! ## La Suite ?!
Vous pouvez maintenant poursuivre avec les niveaux qui suivent. Nous y verrons comment déployer et tester Cesium sur un téléphone Android. Vous pouvez maintenant poursuivre avec les niveaux qui suivent. Nous y verrons comment compiler et déployer Cesium sur Android, puis comment ajouter un plugin, et même ajouter un graphique dynamique !
[Voir la suite ici >>](./development_tutorial-03.md) [Voir la suite ici >>](./development_tutorial-03-android.md)
\ No newline at end of file \ No newline at end of file
## Introduction
Cet article est un tutoriel pour développer sur Cesium, pour compiler et tester l'application sous Android.
## Prérequis
Avant de faire ce tutoriel, vous devez :
- Avoir suivi les tutoriels sur Cesium [jusqu'au niveau VII](./development_tutorial-02.md)
## Niveau IX
### Objectif
L'objectif ici est d'installer les outils de base pour compiler et vérifier son bon fonctionnement sous Android. Vous y réaliserez : </p>
- l'installation du `JDK`
- l'installation du logiciel `Android Studio`
- l'installation de l'émulateur `KVM`
- l'installation du `NDK Android` (optionnel - sera nécessaire plus tard)
### Installation des logiciels
#### Installer JDK
Le JDK ou _Java Development Kit_
Vous pouvez la télécharger sur le site [d'Oracle](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html).
<img src="./img/fef4f4dfe7c2168cb27c9e7f5e399fd547ce774a.png" width="400">
En fonction de votre système d'exploitation, téléchargez correspondant.
Installez ensuite le fichier normalement, en suivant les étapes guidées.
#### Installer Android Studio
Vous trouverez tous les fichiers à l'adresse [AndroidStudio-Downloads](https://developer.android.com/studio/index.html#downloads)
Pour Windows télécharger le fichier sans SDK Android:
<img src="./img/3b8fa2f5c0465b13ae5ce74d49702e0c9f027866.png" width="690" height="237">
##### Sous Linux
Il vous suffit de décompresser le fichier ZIP, d'ouvrir un terminal dans ce dossier et de taper la commande:
```bash
./bin/studio.sh
```
##### Sous Windows et Mac OS
Installez l'exécutable que vous avez précédemment téléchargé.
##### Toutes machines confondues
A la fin de l'installation ou au premier lancement, Android Studio vous indiquera que vous ne possédez pas de SDK et vous proposera de l'installer :
- Si vous l'avez déjà installé vous pouvez indiqué où il se trouve.
- Sinon installez la version qu'il vous propose.
#### Installer NDK (optionnel)
> Le NDK est utilisé pour l'exécution de code sous C++, notamment la librairie de cryptographie NaCL.
> Cette étape est pour le moment optionnelle (pour les experts seulement).
Vous pouvez le télécharger à l'adresse : [ce site](https://developer.android.com/ndk/downloads/index.html)
Attention : n'installez pas la version 12 du NDK. Elle n'est pas encore stable.
Encore une fois téléchargé la bonne version, décompressez le fichier à coté de votre SDK.
Sous Android Studio allez dans le menu `File > Project Structure...`
<img src="./img/04e64b769cbd45b9d275cd5f81002a399a1a7684.png" width="300">
Une fenêtre comme celle-ci devrait s'ouvrir :
<img src="./img/ceb75301172038e75f5c43b328dd7febd7bedc7e.png" width="450">
Renseignez le chemin d'installation du NDK.
#### Installer l'émulateur KVM (optionnel)
Pour Linux / Debian uniquement :
```bash
sudo apt-get install kvm qemu-kvm libvirt-bin bridge-utils virt-manager
sudo groupadd libvirtd
sudo adduser `id -un` libvirtd
```
##### En cas de problème...
If you get this error :
```
Cannot run program "/home/eis/android-sdks/build-tools/21.1.2/aapt": error=2, Aucun fichier ou dossier de ce type
```
Installez deux librairies de compatibilité supplémentaires (solution provenant de [ce post](http://stackoverflow.com/questions/22701405/aapt-ioexception-error-2-no-such-file-or-directory-why-cant-i-build-my-grad)) :
```bash
sudo apt-get install lib32stdc++6 lib32z1
```
## Niveau X: Lancement de l'application sous Android Studio
### Configuration du projet
Placez-vous dans le dossier dans lequel vous avez installé cesium via la commande `cd` suivie du chemin vers le répertoire idoine.
Vérifiez que vous utilisez bien la version de NodeJs dont Cesium a besoin à l'aide de la commande
```
node --version
```
Si vous n'êtes pas sur une v6, utilisez la commande
```
nvm use 12
```
Vous pouvez maintenant lancer l'instalaltion du projet Cesium pour Android :
```
ionic cordova prepare
```
Normalement, cette commande devrait initialiser (entre autre) un répertoire `platforms/android`.
> Cette commande peut prendre un moment à se terminer.
Lancez maintenant la compilation pour Android :
```
ionic build android
```
Lancez maintenant Android Studio. Vous devriez arriver sur cette fenêtre:
<img src="./img/33266d44fdbfd6c8b44e46a3664edafacaf0a316.png" width="500">
Sélectionnez "Open an existing Android Studio project" et indiquez le dossier vers `cesium/platforms/android`.
### Lancer l'application
Pour pouvoir lancer un émulateur, on va devoir en créer un.
Pour cela, allez dans `Tools` > `AVD Manager`, ou cliquez sur l'icone suivante :
<img src="./img/46e959d1e616e34972a41f4d120a1d4f5beb0955.png" width="690" height="42">
Une fenêtre va s'ouvrir et vous proposer de créer un "Virtual Device" suivez le logiciel.
Si vous avez un téléphone Android vous pouvez le mettre en mode développeur et le brancher si vous souhaitez voir l'application sur votre téléphone.
Puis, une fois l'émulateur créé, vous pouvez cliquer le bouton "Play" (<img src="./img/70b2ce88a5e7aa5754f6a771cf5efed3c639a27b.png" width="46" height="44">) pour lancer l'application.
Vous pouvez aussi utiliser l'icone (<img src="./img/b7c419b33a43f6a43c5b756074ee0c199072f7d1.png" width="40" height="44">) pour lancer l'application en mode debug.
Android Studio vous demandera sur quel appareil vous souhaitez lancer l'application, sélectionner l'émulateur ou le téléphone et laissez faire.
## Niveau XI: Lancement de l'application par `ionic`
Vous pouvez maintenant utiliser directement l'outil `ionic` :
- Soit pour lancer votre application sur une téléphone connecté :
```bash
ionic run android
```
- Soit pour la lancer sur une émulateur :
```bash
ionic emulate android
```
## La Suite ?!
Vous pouvez maintenant poursuivre avec les niveaux qui suivent. Nous y verrons comment ajouter un plugin à Cesium.
[Voir la suite ici >>](./development_tutorial-04-add_plugin.md)
\ No newline at end of file
## Introduction
Cet article est un tutoriel pour développer sur Cesium+, en utilisant les capacités de l'ES API portée par Duniter4j.
## Prérequis
Avant de faire ce tutoriel, vous devez :
- Avoir suivi les tutoriels sur Cesium [jusqu'au niveau VII](./development_tutorial-02.md)
- Avoir suivi le tutoriel sur Duniter4j [jusqu'au niveau V](https://github.com/duniter/duniter4j/blob/master/doc/fr/development_tutorial.md).
## Niveau IX
### Objectif
L'objectif ici est de réaliser un graphique représentant l'évolution de montant du dividende universel.
Quand l'utilisateur cliquera sur le champ "dividende universel" de la page suivante : http://cesium.duniter.fr/#/app/currency/view/lg/
### Récupérer le code (tag rml8)
Passez sur la branche du code #rml8 : https://github.com/duniter/cesium/tree/rml8
### Démarrer Cesium
Lancer Cesium :
```bash
cd cesium
ionic serve
```
### Démarrer le noeud ElasticSearch
Démarrer votre noeud ES :
```bash
cd duniter4j
mvn install -DskipTests
mvn install -Prun -pl duniter4j-elasticsearch
```
### Ajout de la librairie D3.js
D3.js est une puissante librairie JS qui permet de faire de magnifiques graphiques.
Vous pouvez utiliser `bower` pour installer la dépendance.
Puis ajouter la librairie dans la page principale de l'application : `www/index.html`
### Gestion du controlleur
Editer le fichier `www/js/controllers.js`, et décommenter la ligne :
```json
(...)
'cesium.currency-charts.controllers',
(...)
```
Editez le fichier `www/js/controllers/currency-charts-controllers.js`.
A vous de jouer ! Il faut :
- Remplir la requete POST vers le noeud ES sur l'index `/test_net/block/_search`; cf méthode `$scope.loadUds()';
- Traiter le retour de la requête, pour la transformer dans le format attendu par D3.js.
### Template
Editez le template HTML, dans le fichier `www/templates/currency/charts/ud.html`
Regardez la documentation D3.js pour savoir comment faire la suite !
## La suite ?
Si vous avez réussi ce niveau, vous êtes vraiment un contributeur expert de Cesium !
Il ne vous reste qu'à publier le résultat ! ;)
- sur le forum duniter,
- ou mieux via un `pull request` sur github.
\ No newline at end of file
ATTENTION : ne pas lire AVANT les RML9 (en cours de rédaction !)
## Introduction
Cet article est un tutoriel pour développer un plugin Cesium.
## Prérequis
Avant de faire ce tutoriel, vous devez :
- Avoir suivi les deux premiers tutoriels sur Cesium :
* [Niveaux I à V](./development_tutorial-01.md) : mise en place de l'environnement, etc.
* [Niveaux VI à VII](./development_tutorial-02.md) : modifier un écran et publier vos modifications.
## Niveau XII
__Objectif :__ Ce niveau a pour objectif d'activer un nouveau plugin, minimaliste, nommé `rml9`.
### Récupérer le code (tag rml9)
Passez sur la branche du code #rml9 : https://github.com/duniter/cesium/tree/rml9
Une fois la branche récupérée, vous devriez voir les _nouveaux_ fichiers suivant :
```java
www
\-- plugins
|-- (...) // plugins existants
\-- rml9 // le nouveau plugin
|-- i18n // ici, les traductions
|-- templates // ici, les fichiers HTML content les interfaces graphiques
| |-- button.html
| \-- view.html
|-- plugin.js // Code final du plugin (à garder pour la fin !)
|-- plugin-01-add_button.js // 1ère étape du tuto
\-- plugin-02-(...).js // etc.
```
> Pour simplifier, nous avons regroupé tout le code dans un seul fichier `plugin.js`. Dans les autres plugins, généralement, on a préfèré déoupé le code en plusieurs fichiers (controllers, services, etc).
### Activation du plugin (en version `01`)
Nous allons activer une 1ère version du plugin.
Editer le fichier `www/index.html`, et ajouter la ligne suivante, vers la fin du fichier :
```html
<!--removeIf(no-plugin)-->
(...)
<!-- Ajout du fichier JS du plugin (à mettre vers le bas de la section <head>) -->
<script src="dist/dist_js/plugins/rml9/plugin-01-add_button.js"></script>
(...)
<!--endRemoveIf(no-plugin)-->
```
Editer le fichier `www/js/plugins.js`, et ajoutez une entrée dans la liste, comme indiqué ci-dessous :
```
(...)
// RML9 plugin:
'cesium.rml9.plugin', // <-- La nouvelle ligne
(...)
```
Editer le fichier `www/js/config.js`, et ajouter les lignes suivantes dans sous la balise `plugins` :
```js
// (...)
"plugins": {
// (...)
// Activation du plugin RML9
"rml9": {
"enable": true
}
},
```
### Vérification de l'activation du plugin
Le plugin `rml9` est maintenant activé. Il ne vous reste plus qu'à lancer Cesium pour vérifier !
```
> cd cesium
> ionic serve
```
- Ouvrez un navigateur à l'adresse [http://localhost:8100](http://localhost:8100)
- Dans le menu de gauche, cliquez sur `Annuaire`
- puis choisissez un compte au hasard.
- Vous devriez voir un nouveau bouton, de couleur verte :
<img src="https://forum.duniter.org/uploads/default/original/2X/4/4e28c8487f380ac6229a735e01ac206d13fd9a21.png" width="690" height="225">
- Ouvrez la console Javascript de votre navigateur;
- Si vous cliquez sur le bouton vert, vous devriez voir le log suivant dans la console :
<img src="https://forum.duniter.org/uploads/default/original/2X/d/db5575c48fe0cd136a8949e5336e26ced95e08ec.png" width="676" height="77">
Bravo ! Le nouveau plugin est opérationnel !
> Pour le moment, ce plugin ne fait rien d'utile, mais nous allons pouvoir l'enrichir tranquillement : patience ! ;)
## Niveau XIII : Etendre l'interface graphique
__Objectif :__ Grâce à ce niveau, vous allez savoir étendre un écran existant de Cesium.
### Se repérer dans le code
Ouvrez le fichier `www/plugins/rml9/plugin-01-add_button.js`, qui contient le code du plugin.
En haut du fichier, identifiez la partie qui définit le point d'insertion du plugin, dans l'écran :
```javascript
var enable = csConfig.plugins && csConfig.plugins.rml9;
if (enable) {
// Extension de la vue d'une identité: ajout d'un bouton
PluginServiceProvider
.extendState('app.wot_identity', {
points: {
'buttons': {
templateUrl: "plugins/rml9/templates/01-button.html",
controller: 'Rml9ButtonCtrl'
}
}
});
}
```
Vous y voyez qu'une page (ou `state` dans AngularJS) est étendue : celle d'une identité dont `state` vaut `app.wot_identity`
> L'identifant de cette page (son `state`) provient du code existant de Cesium, dans le fichier `www/js/controllers/wot-controllers.js` . Vous pouvez l'ouvrir pour mieux comprendre...
Dans le code de notre plugin, notons aussi qu'un point d'extension est nommé. Il s'agit de l'emplacement où notre code sera injecté dans Cesium. Ici, le point d'extension est nommé `buttons` :
```
points: {
'buttons': { // <- nom du point d'extension, où va s'insérer notre plugin
// ...
```
Ce point d'extension a été défini dans le template HTML de la page affichant une identité.
Ouvrez le fichier `www/templates/wot/view_identity.html` :
```html
<!-- Définition d'un point d'extension nommé "buttons", dans le template de la page à étendre -->
<cs-extension-point name="buttons"></cs-extension-point>
```
Vous voyez que le formalisme utilisé pour le définir l'emplacement d'un point d'extension est très simple.
Ouvrez maintenant le fichier `www/plugins/rml9/templates/01-button.html` :
```html
<!-- Button that call a function of the controller -->
<button class="button button-balanced button-small-padding icon ion-android-archive"
ng-click="onButtonClick()"
title="{{'RML9.BTN_OPEN' | translate}}">
</button>
```
Ce fichier contient le **contenu visuel de notre plugin**.
Ici, il s'agit simplement d'un bouton, avec l'appel d'une fonction JS à chaque clic.
Simple comme un `Hello world`, non ? ;)
### Ajouter du bouton dans une autre page
Vous allez maintenant pouvoir ajouter le bouton (le même, celui de notre plugin) dans une autre page : celle accessible par le memnu de gauche : `Mes opérations`.
Editer le fichier `www/plugins/rml9/plugin-01-add_button.js`. Puis, sous la première extension définie, ajouter les lignes suivantes :
```
// Extension de la page 'Mes opérations': insertion du même bouton
PluginServiceProvider
.extendState('app.view_wallet_tx', {
points: {
'buttons': {
templateUrl: "plugins/rml9/templates/01-button.html",
controller: 'Rml9ButtonCtrl'
}
}
});
// ...
}
```
> La page `Mes opérations` a été étendue à partir du nom de son état (`state`) `app.view_wallet_tx`.
> Cet état est visible en ouvrant le fichier `www/js/controllers/wallet-controllers.js` (dans la partie haute du fichier). Ouvrez le si besoin, pour mieux comprendre.
> __Attention :__ Bien que le nom du point d'extension soit encore nommé `buttons`, il s'agit _d'un autre point d'extension_, distinct du premier, et défini dans un autre template : le fichier `www/templates/wallet/view_wallet_tx.html`
Vérifier maintenant que le résultat est celui attendu :
- Ouvrez Cesium, puis connectez-vous (à n'importe quel compte)
- Dans la page `Mes opérations`; notre même bouton vert vient d'apparaitre :
<img src="https://forum.duniter.org/uploads/default/original/2X/e/e02307b86cf43dc7c6dcc4f8a77b797e50b45d82.png" width="518" height="196">
### Etendre, n'importe où ! Récapitulons...
Maintenant que vous comprenez comment étendre Cesium, vous comprenez aussi qu'on peut étendre n'importe quelle partie de l'interface de Cesium !
La méthologie est toujours la même :
- Chercher dans les `templates` HTML, la page (ou le composant) que vous voulez étendre;
- S'il n'y en a pas déjà, à l'emplacement qui vous inéteresse, ajouter dans ce template (à l'emplacement précis de votre choix) le nouveau point d'extension. Vous devrez lui choisir un nom, unique dans la page. Par exemple :
```html
<cs-extension-point name="this-is-a-good-extension-place"></cs-extension-point>
```
- Dans le code des controlleurs (fichiers du répertoire `www/js/controllers`) recherchez le nom de la page (state) concernée;
- Dans le code du plugin, étendre le point d'extension de la manière suivante :
```
PluginServiceProvider
.extendState('app.a_state_name', { // ici, le nom de la page (state), à identifier dans les controlleurs
points: {
'this-is-a-good-extension-place': { // ici, le nom du point d'extension concerné
templateUrl: "plugins/rml9/templates/template.html", // le template HTML
controller: 'MyCtrl' // Le controlleur associé au template
}
}
});
```
## Niveau XIV : Ajouter une page
__Objectif :__ L'objectif est d'apprendre à ajouter une nouvelle page (un nouvel écran) dans Cesium. Il s'agira également d'utiliser un service d'accès aux données.
### Activation du plugin (en version `02`)
Editez le fichier `www/index.html` pour activer cette fois le plugin en version `02` (remettre en commentaire la version précédente):
```html
<script src="dist/dist_js/plugins/rml9/plugin-02-add_view.js"></script>
```
Dans votre navigateur, vérifiez que le bouton est toujours présent (page d'une identité ou `Mes opérations`).
Cliquez sur notre bouton vert : une nouvelle page s'ouvre :
<img src="https://forum.duniter.org/uploads/default/original/2X/5/5a8b4eb0c09d8125b1d6f92551256377a700e128.png" width="690" height="299">
### Se repérer dans le code
Ouvrez le code du plugin (fichier `www/plugins/rml9/plugin-02-add_view.js`).
En haut du fichier, repérez le code suivant :
```js
// [NEW] Ajout d'une nouvelle page #/app/rml9
$stateProvider
.state('app.rml9', {
url: "/rml9/:pubkey",
views: {
'menuContent': {
templateUrl: "plugins/rml9/templates/02-view.html",
controller: 'Rml9ViewCtrl'
}
}
});
```
Cette déclaration ajoute une nouvelle page (state) `app.rml9`, utilisant le template HTML `02-view.html` et un nouveau controlleur associé.
Le code du controlleur de cette page est sité un peu plus bas :
```
// Manage events from the page #/app/rml9
.controller('Rml9ViewCtrl', function($scope) {
'ngInject';
// When opening the view
$scope.$on('$ionicView.enter', function(e, state) {
console.log("[RML9] Opening the view...");
// Get the pubkey (from URL params) and store it in the page context ($scope)
$scope.pubkey = (state && state.stateParams && state.stateParams.pubkey);
if (!$scope.pubkey) return;
// Create some data to display
$scope.items = [
{amount: 64, time: 1493391431, pubkey:'2RFPQGxYraKTFKKBXgp...'},
{amount: -500, time: 1493373164, pubkey:'2RFPQGxYraKTFKKBXgp...'},
{amount: 100, time: 1493363131, pubkey:'5U2xuAUEPFeUQ4zpns6...'}
];
});
});
```
> Le reste du code provient du plugin réalisé lors du niveau précédent.
> Le nouveau code est identifié par des commentaire précédé de la balise "`[NEW]`"
Ouvrez maintenant le fichier `www/plugins/rml9/templates/02-view.html` qui contient le template HTML.
Observez notamment l'affichage des données que nous avons stockées dans la variable `$scope.items` :
```html
<!-- Iterate on each TX -->
<div class="item" ng-repeat="item in items">
<h3>{{item.time|formatDate}}</h3>
<h4>{{item.pubkey|formatPubkey}}</h4>
<div class="badge">{{item.amount|formatAmount}}</div>
</div>
```
> L'attribut `ng-repeat` (directive native d'Angular JS) permet de boucler simplement sur chaque élément d'une collection.
### Utiliser un service d'accès aux données
Nous allons maintenant remplacer les données _en dur_ dans le code, par l'appel à un "service" existant de Cesium.
> Les "services" d'AngularJS sont des objets indépendants des composants graphiques, et donc réutiliables entre plusieurs écrans ou compasants graphiques. Typiquement, dans Cesium, ils executent les requêtes HTTP vers le noeud Duniter (le noeud configuré dans vos paramètres Cesium).
Dans le fichier `plugin-02-add_view.js`, remplacez l'initialisation du tableau `$scope.items` par un appel au service `csTx` :
```
// Load account TX data
csTx.load($scope.pubkey) // <- appel au service csTx
.then(function(result) {
console.log(result); // Allow to discover data structure
if (result && result.tx && result.tx.history) {
$scope.items = result.tx.history;
}
});
```
> Le `console.log()` est un moyen simple pour découvrir la structure des données renvoyées par le service.
> Un point d'arrêt dans la fonction aura le même effet.
Notez bien le formalisme de traitement du retour de la méthode, propre aux executions asynchrones :
```
monService.maMethode()
.then(function(result) {
// ici, traitement du résultat
});
```
> Pour ne pas pénaliser les performances de la navigation, les services utilisent le plus souvent un mode d'execution _asynchrone_. Il est donc indespensable de bien maitriser l'usage de telles méthodes.
#### Déclaration du service utilisé
A ce stade, si vous testez votre code.
Vous devriez avoir une erreur dans la console Javascript :
<img src="https://forum.duniter.org/uploads/default/original/2X/a/a0d809e20b59af5786ce486dbf8c4f2ad2a0c4c8.png" width="690" height="87">
pas de panique : ce type d'erreur est fréquent ! il indique simplement que le service utilisé, `csTx`, n'a pas été déclaré comme dépendence du controlleur de la page.
Pour corriger l'erreur, ajouté le simplement dans la fonction du controlleur :
```
.controller('Rml9ViewCtrl', function($scope, csTx /*ICI, ajouter la déclaration du service*/) {
'ngInject';
// ...
```
> C'est la chaine de caratère `ngInject` qui permet de gérer automatiquement l'ajout de dépendances dans AngularJS, par injection à partir du nom. Il est donc indispensable que les variables portent ici le même nom que les services définis.
Vous pouvez maintenant tester !
<img src="https://forum.duniter.org/uploads/default/original/2X/7/7c9416bf1ee97605d1859ef0b5cc9af075555e64.png" width="690" height="470">
#### Amélioration de la page
Cette nouvelle page est correspond vraiment à une demande : celle de Galuel de pouvoir consultr un compte sans se connecter.
A vous d'imaginer comme réaliser cette fonctionnalités!
Voici simplement quelques pistes d'améliorations :
- Calculer et afficher la balance du compte
- Ajouter le pseudo (UID) de l'utilisateur, acessible par `item.uid`
- Afficher son nom de profile et son avatar Cesium+ (`item.name` et `item.avatar`)
> Attention: dans cette dernière proposition, vous devrez penser que le plugin Cesium+ peut être désactiver, et prévoir un affichage correct (dégradé) le cas échéant ;)
#### Quels services utiliser ?
Lors du développement d'un plugin Cesium, vous devrez savoir quel service utiliser. Rassurez vous, ils sont tous regrouper dans le répertoire `www/js/services`.
Voici les plus importants :
```java
\-- www/js/services
|-- bma-services.js // accès complet à l'API BMA du noeud (résultats brutes)
|-- crypto-services.js // fonctions de crypotographie
|-- currency-services.js // nom et paramètres de la monnaie,
|-- device-services.js // accès au capteurs (appareil photo, etc) - pour les téléphones/tablettes
|-- modal-services.js // utilitaires pour gérer les fenêtres modales simplement
|-- network-services.js // accès aux peers - utilisé par la page Réseau
|-- settings-services.js // accès aux paramètres de l'utilisateur
|-- tx-services.js // accès à l'historique des transaction et aux sources d'un compte
|-- utils-services.js // fonctions utiliaraires, comme les popup d'erreur ou de confirmation
|-- wallet-services.js // Le portefeuille de l'utilisateur connecté (envoi de paiement, etc.)
\-- wot-services.js // accès aux données de la WoT - utilisé par la page 'Annuaire' et sous-pages
```
## Niveau XV : Développer un export fichier d'un compte
__Objectif :__ Ce niveau a pour objectif de développer un fonctionnalité d'export des transactions d'un comptes, dans un fichier.
La encore, il s'agit d'une demande réelle (cf ticket #[445](#https://github.com/duniter/cesium/issues/445)).
### Activation du plugin (en version `03`)
Editez le fichier `www/index.html` pour activer cette fois le plugin en version 3 :
```
<script src="dist/dist_js/plugins/rml9/plugin-03-file_export.js"></script>
```
Notre page RML9 a maintenant un bouton de téléchargement :
<img src="https://forum.duniter.org/uploads/default/original/2X/3/32f330d76431c16c56d865cb4629558c13c16410.png" width="690" height="384">
Si vous cliquez sur le bouton, un fichier (au contenu presque vide) est téléchargé.
### Utilisation d'un plugin AngularJS
Cette fois-ci, nous allons utiliser un plugin AngularJS.
La communauté AngularJS est très active : de nombreux plugins, de tous genres, sont disponibles !
Généralement, installer un nouveau plugin AngularJS est très simple. Il suffit d'executer la commande suivante pour que le téléchargement de la librairie soit fait :
```bash
> bower install ---save <nom_du_plugin_AngularJS>
```
Le chemin de la librairie installée doit ensuite être ajouté à la main, dans le fichier `www/index.html`. Par exemple: :
```html
<script src="lib/angular-file-saver/dist/dist/angular-file-saver.bundle.js"></script>
```
### 5 minutes de dev : Top chrono !
Editez maintenant le code du plugin (fichier `www/plugins/rml9/plugin-03-file_export.js`)*[]:
Modifier la méthode `onExportButtonClick()`, afin que le contenu du fichier soit correct :
```
// [NEW] Manage click on the export button
$scope.onExportButtonClick = function() {
console.debug("[RML9] call method onExportButtonClick() on pubkey: " + $scope.pubkey);
// [NEW] Load account TX data
var fromTime = -1; // all TX (full history)
csTx.load($scope.pubkey, fromTime)
.then(function(result) {
if (!result || !result.tx || !result.tx.history) return; // no TX: stop here
// TODO: replace this !
// You can choose any format (CSV, TXT, JSON, ...) and test it !
var content = [
"Hello Libre World !\n",
"Cesium rock's !\n"
];
var file = new Blob(content, {type: 'text/plain; charset=utf-8'});
var filename = $scope.pubkey+'-history.txt';
FileSaver.saveAs(file, filename);
});
};
```
Il suffit de remplir le tableau nommé `content`.
Allez hop: une petite fonction bien codée, ca vaut bien une pause, non ? ;)
## Niveau XVI : Ajouter un graphique ChartJS
__Objectif :__ Nous allons voir comment ajouter simplement un graphique, dans un écran.
### Activation du plugin (en version `04`)
Editez le fichier `www/index.html` pour activer cette fois le plugin en version `04` :
```
<script src="dist/dist_js/plugins/rml9/plugin-04-chart.js"></script>
```
En vous rendant dans la page `rml9`, vous devriez voir apparaitre deux graphiques :
<img src="/uploads/default/original/2X/5/503d5d31c7bc3987d74a5109a7f39c5cbef4876b.png" width="667" height="500">
On y voit deux graphiques, représentant respectovement :
- la somme des **montants entrants**, regroupé par émétteur ;
- la somme des **montants sortants**, regroupé par destinataire.
### Se repérer dans le code
Ouvrir le code du plugin (fichier `www/plugins/rml9/plugin-04-chart.js`), et répérer le code du controlleur qui pépare les données pour ces graphiques :
```
// [NEW] data for input chart
$scope.inputChart = {
data: [500, 100, 64],
labels: ['2RFPQGxYraKTFKKBXgpNn1QDEPdFM7rHNu7HdbmmF43v','5U2xuAUEPFeUQ4zpns6Zn33Q1ZWaHxEd3sPx689ZpaZV','2ny7YAdmzReQxAayyJZsyVYwYhVyax2thKcGknmQy5nQ']
};
// [NEW] data for output chart
$scope.outputChart = {
data: [650, 240, 154],
labels: ['2RFPQGxYraKTFKKBXgpNn1QDEPdFM7rHNu7HdbmmF43v','5U2xuAUEPFeUQ4zpns6Zn33Q1ZWaHxEd3sPx689ZpaZV','2ny7YAdmzReQxAayyJZsyVYwYhVyax2thKcGknmQy5nQ']
};
```
Cette fois encore, les données ont été fixées _en dur_, pour bien comprendre la structure des données attendues.
- La partie `data` est un simple tableau, possédant les valeurs numériques du graphique
- La partie `labels` contient les libellés associées aux valeurs. elles sont visibles quand on passe la sourie sur un élément du graphique.
Ouvrez maintenant le template HTML :
```html
<!-- [NEW] TX input chart -->
<p class="gray" translate>RML9.CHART.INPUT_CHART_TITLE</p>
<canvas id="chart-received-pie" class="chart-pie"
chart-data="inputChart.data"
chart-labels="inputChart.labels">
</canvas>
<!-- [NEW] TX output chart -->
<p class="gray" translate>RML9.CHART.OUTPUT_CHART_TITLE</p>
<canvas id="chart-sent-pie" class="chart-pie"
chart-data="outputChart.data"
chart-labels="outputChart.labels">
</canvas>
```
> Cesium n'utilise pas directement ChartJS, mais une adaptation pour angular JS, nommé `angular-chart`.
> Vous trouverez toute la documentation nécessaire sur le site http://jtblin.github.io/angular-chart.js/
### A vous de jouer !
A vous de jouer, afin de remplacer par du contenu dynamique !
> Une méthode qui pourrait vous faire gagner du temps à été placée dans le controlleur : `$scope.computeChartData()`.
> Elle prend en paramètres une liste de transaction, et renvoi les données telles que attendues par ChartJS.
> Reste à savoir quelle liste de transaction il faut lui envoyer, et comment la constituer ! ;)
## Niveau XVII : Etendre les services
__Objectif :__ Nous allons voir comment étendre le fonctionnement du code présent dans les services.
### Activation du plugin (en version `05`)
Editez le fichier `www/index.html` pour activer cette fois le plugin en version `05` :
```
<script src="dist/dist_js/plugins/rml9/plugin-05-service_api.js"></script>
```
### Se repérer dans le code
Dans le code du plugin, observez notamment les lignes suivantes :
```
// [NEW] Add a RML9 service, that listen some Cesium events
.factory('rml9Service', function($rootScope, csWallet, csWot) {
'ngInject';
var exports = {};
// [NEW] add listeners on Cesium services
csWallet.api.data.on.login($rootScope, function(walletData, deferred){
console.log('[RML9] Successfull login. Wallet data:', walletData);
// IMPORTANT: this is required, because of async call of extension
deferred.resolve();
}, this);
(...)
return exports;
});
```
## Niveau XVIII : Etendre les paramètres
__Objectif :__ Nous allons voir comment étendre les paramètres de Cesium, en y ajoutant une entrée.
### Activation du plugin (en version `06`)
Dans le code du plugin (fichier `www/plugins/rml9/plugin-06-settings`).
### Se repérer dans le code
Observez notamment cette partie du code du plugin :
```
.controller('Rml9ButtonCtrl', function($scope, UIUtils, csSettings) {
'ngInject';
// [NEW] Calcul l'état du plugin (actif ou non)
function isPluginEnable(settings) {
return settings.plugins && settings.plugins.rml9 && settings.plugins.rml9.enable;
}
// [NEW] Nouvelle variable stockée dans le contexte de la page
$scope.enable = isPluginEnable(csSettings.data);
// [NEW] Détection des changements dans les paramètres
csSettings.api.data.on.changed($scope, function(settings) {
console.debug("[RML9] Detect changes in settings!");
$scope.enable = isPluginEnable(settings);
console.debug("[RML9] RML9 plugin enable: " + $scope.enable);
});
// (...)
});
```
Nous voyons que l'état du plugin (actif ou non) est stocké dans la variable `$scope.enable` :
```
$scope.enable = isPluginEnable(csSettings.data);
```
Cette même variable est **maintenue à jour**, lors de changement survenu dans les paramètres :
```
csSettings.api.data.on.changed($scope, function(settings) {
// ...
$scope.enable = isPluginEnable(settings);
//...
});
```
> Au passage, notez l'usage d'une API de service comme vu plus haut : ici le service
`csSettings`.
## La suite ?
Vous pouvez maintenant poursuivre avec les niveaux qui suivent. Nous y verrons comment **ajouter un graphique**.
[Voir la suite ici >>](./development_tutorial-05-add_chart.md)
\ No newline at end of file
## Introduction
Cet article est un tutoriel d'initiation au code source du logiciel Cesium. Celui-ci vous permettra, à travers une succession d'étapes, d'accéder à la maîtrise des outils et méthodes utilisés quotidiennement par les développeurs de Cesium pour créer et modifier le logiciel.
A la fin de ce tutoriel, vous serez donc *capable de modifier le logiciel*.
## Niveau I : récupérer le code source
Ce premier niveau consiste à créer *votre propre version* des sources du logiciel et de récupérer cette copie sur votre ordinateur. Vous y produirez :
* votre propre compte *GitHub*
* votre propre version du logiciel, votre *fork*
* une copie locale des fichiers de code source provenant de votre *fork*
### Créez un compte GitHub
> Si vous disposez déjà d'un compte GitHub, vous pouvez passer cette étape.
Rendez-vous sur https://github.com (site en anglais). Renseigner les 3 champs proposés :
* Nom d'utilisateur
* E-mail
* Mot de passe
<img src="https://forum.duniter.org/uploads/default/original/1X/13ade346327b73bbf1acc97027af147eeb4e9089.png" width="346" height="325">
Vous recevrez probablement un e-mail de confirmation qu'il vous faudra valider. Une fois cette étape passée, vous devriez disposer d'un compte GitHub .
### Forkez le dépôt principal
Rendez-vous à l'adresse https://github.com/duniter/cesium. Cliquez sur le bouton « Fork » en dans le coin supérieur droit de la page :
<img src="https://forum.duniter.org/uploads/default/original/1X/3b9228c664520496d6a7e86e3f9c4c438f111914.png" width="388" height="98">
### Installer Git
L'installation de Git dépend de votre système d'exploitation. Suivez simplement les indications présentes sur : https://git-scm.com/
### Cloner votre fork
A ce stade, vous êtes en mesure de récupérer votre version du code source (votre *fork*), afin de pouvoir travailler dessus.
#### Ouvrez Git en ligne de commande
Pour récupérer le code source, lancez Git en mode console.
* Sous Linux et MacOS, ouvrez tout simplement le Terminal
* Sous Windows lancez le programme *Git Bash* :
<img src="https://forum.duniter.org/uploads/default/original/1X/6fc638dc0a22d88da7e84dbf0371e69747767f78.png" width="432" height="80">
#### Clonez votre fork, en ligne de commande
Retournez sur la page web GitHub, puis trouvez le bouton « Clone or download » :
Cliquez dessus, vous pourrez alors copier l'URL de clonage en cliquant sur l'icône de valise.
Vous n'avez plus qu'à retourner dans votre console Git et saisir :
git clone <coller l'URL copiée>
ce qui donne dans mon cas :
```
git clone https://github.com/blavenie/cesium.git
Cloning into 'cesium'...
(...)
Checking connectivity... done.
```
Si vous êtes arrivés à un comportement similaire, **bravo**, vous posséder désormais le code source Cesium !
## Niveau II : Compilation et lancement dans un navigateur
Ce second niveau vise à obtenir les outils de base pour exécuter le code source, et vérifier son bon fonctionnement. Vous y réaliserez :
* l'installation du moteur d'exécution JavaScript *Node.js*
* la vérification du bon fonctionnement du code source *via* le lancement de l'application, en mode web.
Si l'application se lance, vous aurez dores et déjà un environnement entièrement **fonctionnel** !
### Installer Node.js
#### Sous Linux / MacOS
Installer Node.js est devenu extrêmement simple pour ces OS : un outil vous permet d'installer la version de Node.js que vous souhaitez, en changer quand vous voulez et sans conflit avec une version précédente : il s'agit de [nvm](https://github.com/creationix/nvm).
Vous pouvez installer nvm avec la commande suivante :
```bash
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.1/install.sh | bash
```
Fermez puis rouvrez votre terminal, comme indiqué. Puis, installez Node.js (choisissez la version 5) :
```bash
nvm install 5
```
Vous aurez alors la dernière version de la branche 5.x de Node.js prête à l'emploi.
##### Outils de compilation
Installer les outils nécessaires pour la compilation.
```bash
sudo apt-get install build-essential
```
#### Sous Windows
Pour Windows, téléchargez la version 5 disponible sur le site officiel de Node.js : https://nodejs.org
Puis lancez l'installeur ainsi téléchargé.
### Installer les modules Node.js de Cesium
Cesium repose sur des librairies tierce pour fonctionner appelées *dépendances*, comme par exemple des librairies de compilation (gulp, bower, ionic).
Le fait d'avoir cloné les sources n'est en réalité pas suffisant pour lancer l'application. Nous devons obtenir le code des dépendances pour obtenir ainsi l'ensemble du code exécutable du programme. Pour ce faire, retournez dans la console Git et déplacez-vous dans le répertoire cloné :
```bash
cd cesium
```
Puis, lancez le téléchargement et l'installation des modules Cesium à l'aide de la commande :
```bash
npm install -g bower gulp ionic@1.7.16 cordova
```
Puis pour les dépendances non globales :
```bash
npm install
```
> Le processus d'installation peut prendre plusieurs minutes. En effet, il faut télécharger toutes les dépendances de Cesium.
Si tout s'est bien passé, vous devriez obtenir une fin d'arborescence dans la console, et l'invité de commande devrait vous avoir rendu la main :
```bash
├── bower@1.7.9
├─┬ gulp@3.9.1
│ ├── archy@1.0.0
│ ├─┬ chalk@1.1.3
(...)
│ ├─┬ through2@0.5.1
│ │ ├── readable-stream@1.0.34
│ │ └── xtend@3.0.0
│ └─┬ vinyl@0.2.3
│ └── clone-stats@0.0.1
└── shelljs@0.3.0
npm WARN cesium@0.0.1 No repository field.
npm WARN cesium@0.0.1 No license field.
user1@~$
```
> Il se peut que vous obteniez des messages `npm WARN [...]`. Rien de grave : comme le nom du message l'indique, il s'agit simplement d'un avertissement non bloquant pour la suite des événements.
Puis installer les dépendences via bower :
```bash
bower install
```
### Installer un IDE
Pour développer sous NodeJS, vous pouvez utiliser l'IDE de votre choix :
* Par exemple Sublime Text (non libre) : https://www.sublimetext.com/
* Autre possibilité : WebStorm (non libre mais fonctionnement très avancé).
### Installer Chrome et/ou Firefox
Pour débugger plus facilement le javascript Cesium, il est plus facile d'utiliser le navigateur Chrome
## Niveau III : maîtriser les commandes usuelles
Ce troisième niveau permet de découvrir les quelques (cinq) commandes que vous utiliserez tout le temps si vous développez Cesium. Vous y apprendrez :
* à configurer Cesium, notamment le noeud Duniter qu'il utilisera (par défaut);
* à le lancer Cesium dans votre navigateur;
### Configurer Cesium
La configuration par défaut de notre environnement est visible dans le fichier `app/config.json`. Plusieurs profils y sont présents : `default`, `dev`, etc.
```json
{
"default": {
"cacheTimeMs": 60000,
"fallbackLanguage": "en",
"rememberMe": false,
"showUDHistory": false,
"timeout": 10000,
"timeWarningExpireMembership": 5184000,
"timeWarningExpire": 7776000,
"useLocalStorage": true,
"useRelative": true,
"initPhase": false,
"expertMode": false,
"decimalCount": 4,
"helptip": {
"enable": true,
"installDocUrl": "https://github.com/duniter/duniter/blob/master/doc/install-a-node.md"
},
"node": {
"host": "cgeek.fr",
"port": "9330"
},
"plugins":{
"es": {
"enable": true,
"askEnable": false,
"host": "data.duniter.fr",
"port": "80"
}
}
},
(...)
"dev": {
"cacheTimeMs": 60000,
"fallbackLanguage": "fr-FR",
"defaultLanguage": "fr-FR",
"rememberMe": true,
"showUDHistory": false,
"timeout": 6000,
"timeWarningExpireMembership": 5184000,
"timeWarningExpire": 7776000,
"useLocalStorage": true,
"useRelative": true,
"initPhase": false,
"expertMode": false,
"decimalCount": 2,
"helptip": {
"enable": true,
},
"node": {
"host": "localhost",
"port": "9600"
},
"plugins":{
"es": {
"enable": false
}
}
},
}
```
Nous utiliserons la configuration "dev", pour utiliser votre noeud Duniter.
Modifiez les valeurs `host` et `port` du profil de configuration `dev`, afin qu'elles correspondent à votre noeud Duniter :
```json
"dev: {
...
"node": {
"host": "localhost",
"port": "9600"
},
...
```
Désactivez le plugin "es" (utilisé pour Cesium+) :
```json
"dev: {
...
"plugins":{
"es": {
"enable": false
}
}
...
```
Pour activer cette configuration, lancez maintenant la commande :
```bash
gulp config --env dev
```
```bash
[17:32:34] Using gulpfile ~/git/duniter/cesium/gulpfile.js
[17:32:34] Starting 'config'...
[17:32:34] Building `www/js/config.js` for `dev` environment...
[17:32:36] Finished 'config' after 10 μs
```
> Cette commande sera à relancer à cachune de vos modifications du fichier `app/config`.
Cesium est maintenant configuré pour utiliser votre noeud Duniter local.
### Lancer Cesium (mode web)
Il ne vous reste plus qu'à lancer l'application pour savoir si tout s'est bien passé et que vous êtes prêts pour la suite.
Lancez la commande suivante :
```bash
ionic serve
```
Une fois terminée, la commande affiche :
```bash
Running live reload server: http://localhost:35729
Watching: 0=www/**/*, 1=!www/lib/**/*
Running dev server: http://localhost:8100
Ionic server commands, enter:
restart or r to restart the client app from the root
goto or g and a url to have the app navigate to the given url
consolelogs or c to enable/disable console log output
serverlogs or s to enable/disable server log output
quit or q to shutdown the server and exit
ionic $
```
Vous pouvez ouvrir un navigateur web à l'adresse suivante : http://localhost:8100
Vous devriez y voir la page d'accueil de Cesium.
Bravo, vous avez une installation de Cesium opérationnelle !
### Documentation
Cesium utilise le framework Ionic, qui a une bonne documentation : http://ionicframework.com.
Consulter ce site pour en savoir plus.
## Niveau IV : Se repérer dans le code
### Répérer les couches logicielles
Ouvrir votre IDE, et ouvrir le projet Cesium.
Chercher et répérer dans le code :
* les templates HTML qui porte les IHM : www/templates
* les controllers (JS) : www/js/controllers
* les services (JS) : www/js/services
<img src="https://forum.duniter.org/uploads/default/original/2X/a/a5078db3abdf71c87f245e948ce94a181b0e0f37.png" width="690" height="369">
### Aller plus loin dans le code
Cesium s'appuie sur AngularJS. D'excellentes documentations sont présentes sur le web.
__Note :__ La version d'AngularJS utilisée est une 1.x : la 2.x change complètement l'approche du code... La suite nous dira si Cesium passera à la version 2.
## Niveau V : Debuggage
### Sous Chrome
#### Ouvrir l'explorateur de sources
Ouvrez l'application dans Chrome à l'adresse http://localhost:8100
Ouvrez les outils de développement :
* Menu `Option > Plus d'outils > Outils de développement`
* ou par le raccourcis clavier : `Ctrl + Maj + i`
#### Débugger la certification d'un utilisateur
Ouvrez l'explorateur de source, puis cherchez le fichier `dist/dist_js/app/controllers/wot-controllers.js`.
Recherchez la méthode `$scope.certify()`, et placez y un point d'arrêt.
Naviguez dans l'application Cesium de la manière suivante :
* Cliuquez dans le menu (à gauche) `Annuaire`;
* Recherche un utilisateur, puis visualiser son identité;
* Dans `Certification reçues`, cliquez sur le bouton `Certifier`;
* Vérifier que la console s'arrête sur le point d'arrêt.
<img src="https://forum.duniter.org/uploads/default/original/2X/e/eca671a6d24b8e11566cfcca11b65e6c9c9c370c.png" width="690" height="223">
Découvrez le code en déroulant l'action pas à pas.
> Utiliser les touches de `F9` à `F11`, pour rentrer dans une méthode (F11), avancer pas à pas (F10) ou jusqu'au prochain point d'arrêt (F9), etc.
doc/fr/img/04e64b769cbd45b9d275cd5f81002a399a1a7684.png

132 KiB

doc/fr/img/13ade346327b73bbf1acc97027af147eeb4e9089.png

28.6 KiB

doc/fr/img/19a637b1fa847aa5bbb18565737e9e5e28729221.jpg

5.43 KiB

doc/fr/img/33266d44fdbfd6c8b44e46a3664edafacaf0a316.png

93.6 KiB

doc/fr/img/3b8fa2f5c0465b13ae5ce74d49702e0c9f027866.png

135 KiB

doc/fr/img/3b9228c664520496d6a7e86e3f9c4c438f111914.png

4.44 KiB

doc/fr/img/3df8cbd2133ea9e9a28855f4b50413846fdf292c.jpg

7.68 KiB

doc/fr/img/46e959d1e616e34972a41f4d120a1d4f5beb0955.png

29.9 KiB

doc/fr/img/6bd04622dd2eb59f6d716ae9e2f114276e4ca35a.jpg

11.6 KiB

doc/fr/img/6fc638dc0a22d88da7e84dbf0371e69747767f78.png

2.76 KiB