three first tutorial lessons translated into english

doc/en/development_tutorial-01.md

+## Introduction
+
+This article is an introductory tutorial to the source code of the Cesium software. 
+
+This will allow you, through a succession of steps, to access the mastery of the tools and methods used daily by the developers of Cesium to create and modify the software.
+
+At the end of this tutorial, you will be *able to modify the software*. And if you feel like it, you can even make a change and share it with the main code repository, so that it is officially integrated and available to users!
+
+To your keyboards!
+
+## Level I: Retrieve the source code
+
+This first level consists of creating *your own version* of the software sources and retrieving this copy on your computer. You will produce:
+
+* your own account on the [GitLab de Duniter](https://git.duniter.org)
+* your own version of the software, your *fork*
+* a local copy of the source code files from your *fork*
+
+### Create a GitLab Duniter account
+
+> If you already have a GitLab account, you can skip this step.
+
+Go to [https://git.duniter.org](https://git.duniter.org/users/sign_in?redirect_to_referer=yes) (site in english).
+
+In 'Register' Fill in the 3 proposed fields:
+
+* Full name 
+* Username 
+* E-mail 
+* Password
+
+You will probably receive a confirmation email that you will need to validate. Once this step is over, you should have an account on the GitLab Duniter.
+
+### Fork the main repo
+
+Go to https://git.duniter.org/clients/cesium-grp/cesium.
+
+Click the "Fork" button at the top of the page (below the logo).
+
+### Install Git
+
+Installing Git depends on your operating system. Simply follow the instructions on : https://git-scm.com/
+
+### Clone your fork
+
+At this point, you are able to retrieve your version of the source code (your *fork*), so that you can work on it.
+
+#### Open Git from the command line
+
+To retrieve the source code, launch Git in console mode.
+
+* On Linux and MacOS, simply open Terminal
+* On Windows launch the *Git Bash* program :
+
+<img src="../fr/img/6fc638dc0a22d88da7e84dbf0371e69747767f78.png" width="432" height="80">
+
+#### Clone your fork from the command line
+
+Go back to the GitHub webpage and find the "Clone or download" button: Click on it, you can then copy the clone URL by clicking on the suitcase icon.
+
+All you have to do is go back to your Git console and enter: 
+
+    git clone <paste the copied URL>
+
+which gives **in my case**:
+
+```
+git clone git@git.duniter.org:blavenie/cesium.git
+Cloning into 'cesium'...
+ (...)
+Checking connectivity... done.
+```
+
+If you have come to a similar behavior, **great**, you now have the Cesium source code!
+ 
+## Level II: Compiling and Launching in a Browser
+
+This second level aims to obtain the basic tools to execute the source code, and verify its proper functioning. You will realize:
+
+* installation of the JavaScript runtime *Node.js*
+* the verification of the proper functioning of the source code *via* the launch of the application, in web mode.
+
+If the application launches, you will already have a fully **functional** environment!
+
+### Install Node.js
+
+#### Under Linux / MacOS
+
+Installing Node.js has become extremely simple for these OS: a tool allows you to install the version of Node.js you want, change it whenever you want and without conflict with a previous version: it is [nvm](https://github.com/creationix/nvm).
+
+You can install nvm with the following command:
+
+```bash
+curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.6/install.sh | bash
+```
+
+Close and reopen your terminal, as shown. Then, install Node.js (choose version 12):
+
+```bash
+nvm install 12
+```
+
+You will then have the latest version of node's 5.x branch.js ready to use.
+
+##### Compilation tools
+
+Install the necessary tools for compilation.
+```bash
+sudo apt-get install build-essential
+```
+
+(mac users https://appuals.com/how-to-fix-sudo-apt-get-command-not-found-on-macos/)
+
+#### On Windows
+
+For Windows, download version 6 available from the official website of Node.js: https://nodejs.org
+
+Then launch the installer thus downloaded.
+
+### Install Cesium Node.js modules
+
+Cesium relies on third-party libraries to run called *dependencies*, such as compilation libraries (gulp, ionic, angularJS).
+
+The fact that you cloned the sources is actually not enough to launch the application. We need to get the code of the dependencies to get all the executable code of the program. To do this, go back to the Git console and move to the cloned directory:
+
+```bash
+cd cesium
+```
+
+Then, start downloading and installing the Cesium modules using the command:
+
+```bash
+npm install -g yarn gulp cordova@10.0.0 @ionic/cli web-ext
+```
+
+Then for non-global dependencies:
+
+```bash
+yarn
+```
+
+> The installation process may take several minutes. Indeed, it is necessary to download all the dependencies of Cesium and even compile some of them.
+
+If everything went well, you should get an end tree in the console, and the command prompt should have returned your hand:
+
+```bash
+yarn install v1.15.2
+[1/4] Resolving packages...
+  (...)
+$ node -e "try { require('fs').symlinkSync(require('path').resolve('node_modules/@bower_components'), 'www/lib', 'junction') } catch (e) { }"
+Done in 0.82s.
+```
+
+> You may get `npm WARN messages [...] `. Nothing serious: as the name of the message suggests, it is simply a non-blocking warning for the rest of the events.
+
+Then install the remaining dependencies (via bower):
+
+```bash
+npm run postinstall
+```
+
+### Install an IDE
+
+To develop in NodeJS, you can use the IDE of your choice:
+
+ * For example Sublime Text (not free) : https://www.sublimetext.com/
+ * Other possibilities : 
+    * VS Code (free).
+    * WebStorm (not free but very advanced operation).
+
+### Install Chrome and/or Firefox
+
+To debug Cesium javascript more easily, it is easier to use the Chrome browser
+
+## Level III: Mastering the usual commands
+
+This third level allows you to discover the few (five) commands that you will use all the time if you develop Cesium. You will learn:
+
+* configure Cesium, including the Duniter node it will use (default);
+* to launch Cesium in your browser;
+
+### Configure Cesium
+
+The default configuration of our environment is visible in the file 'app/config.json'. Several profiles are present: '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": "g1.duniter.org",
+         "port": "443"
+       },
+       "plugins":{
+         "es": {
+           "enable": true,
+           "askEnable": false,
+           "host": "g1.data.duniter.fr",
+           "port": "443"
+         }
+       }
+     },
+     
+     (...)
+     "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
+           }
+         }
+       },
+}
+```
+
+We will use the "dev" configuration, you  may use your Duniter node.
+
+Change the 'host' and 'port' values of the 'dev' configuration profile to match your Duniter node:
+
+```json
+  "dev: {
+  ...
+         "node": {
+           "host": "localhost",
+           "port": "9600"
+         },
+  ...
+```
+
+Disable the plugin "es" (used for Cesium+) :
+
+```json
+  "dev: {
+  ...
+         "plugins":{
+           "es": {
+             "enable": false
+           }
+         }
+  ...
+```
+
+To enable this configuration, now run the command:
+
+```bash
+ gulp config --env dev
+```
+
+```bash
+[17:32:34] Using gulpfile (...)/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
+```
+
+> This command will be restarted at the time of your changes to the `app/config` file.
+
+Cesium is now configured to use your local Duniter node.
+
+### Launch Cesium (web mode)
+
+All you have to do is launch the application (in web mode) to find out if everything went well and that you are ready for the future.
+
+Run the following command :
+
+```bash
+npm start
+```
+
+ > Alternative : `ionic serve`
+
+When complete, the command displays :
+
+```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 $ 
+```
+
+You can open a web browser at http://localhost:8100
+You should see the Cesium homepage there.
+ 
+Congratulations, you have an operational Cesium installation!
+
+### Documentation
+
+Cesium uses the Ionic framework, which has good documentation : http://ionicframework.com.
+
+Visit this site to learn more.
+
+## Level IV: Finding your way around the code
+
+### Locate software layers
+
+Open your IDE, and open the Cesium project.
+
+Search and locate in the code:
+
+* HTML templates that carry HMIs: www/templates 
+* controllers (JS): www/js/controllers 
+* services (JS): www/js/services
+
+<img src="../fr/img/a5078db3abdf71c87f245e948ce94a181b0e0f37.png" width="690" height="369">
+
+
+### Go further in the code
+
+Cesium relies on AngularJS. Excellent documentation is available on the web.
+
+__Note :__ The version of AngularJS used is a 1.x. The 2.x and above change completely and impose a complete redesign... This redesign is planned by 2019, in a version 2 of Cesium.
+
+## Level V: Debugging
+
+### On Chrome
+
+#### Open The Source Explorer
+
+Open the app in Chrome at http://localhost:8100
+
+Open the developer tools: 
+* Menu `Option > More Tools > Developer Tools` 
+* or by the keyboard shortcuts: `Ctrl + Shift + i`
+
+#### Debug a user's certification
+
+Open the source explorer, and then locate the file `dist/dist_js/app/controllers/wot-controllers.js`.
+
+Find the method `$scope.certify()`, and place a breakpoint there.
+
+Navigate the Cesium app as follows:
+
+ * Click in the menu (on the left) `Annuaire`;
+ * Searches for a user and then visualizes their identity;
+ * In `Certification received`, click on the `Certify` button;
+ * Verify that the console stops at the breakpoint.
+
+<img src="../fr/img/eca671a6d24b8e11566cfcca11b65e6c9c9c370c.png" width="690" height="223">
+
+Discover the code by scrolling down the step-by-step action.
+
+> Use the keys from `F9` to `F11`, to enter a method (F11), advance step by step (F10) or to the next breakpoint (F9), etc.
+
+
+## See more ?!
+
+You can now continue with the following levels. We will see how to modify a Cesium screen.
+
+[See more here >>](./development_tutorial-02.md)

doc/en/development_tutorial-02.md

+## Presentation
+
+This article is the 2nd initiation tutorial to the Cesium software source code.
+
+You will be able to understand the role of the different software layers,
+by modifying them in order to improve a screen of Cesium.
+
+## Prerequisites
+
+Before doing this tutorial, you must:
+  
+ - Know the functionalities of Cesium. If not, refer to [la vidéo de présentation générale des fonctionnalités](https://www.youtube.com/watch?v=FQzGIzJf9Nw&list=PLr7acQJbh5rzgkXOrCws2bELR8TNRIuv0&index=6) (RML7) and the one detailing the new features (RML8 - link to come)
+ - Have followed the 1st tutorial for setting up the environment [jusqu'au niveau III](https://github.com/duniter/cesium/blob/master/doc/fr/development_tutorial.md)
+
+## Level VI: Display a missing currency parameter
+
+__Objective :__ In this level, the objective is to display in the [`Currency`](http://g1.duniter.fr/#/app/currency/view/lg/) page the monetary parameter `stepMax`.
+
+> As a reminder, `stepMax` is the maximum distance between a member and an applicant, so that the latter can enter the web of trust.
+
+### Modify the HTML template
+
+Open the template file `/www/templates/currency/items_parameters.html`.
+
+Add a new item in the list of parameters, i.e. a new `<ion-item>` tag, below the other tags of the same name:
+
+```html
+   (...)
+
+   <ion-item class="item-icon-left">
+     <i class="icon ion-steam"></i>
+     <span translate>CURRENCY.VIEW.STEP_MAX</span>
+     <span class="badge badge-stable">{{stepMax}}</span>
+   </ion-item>
+```
+
+If you refresh the `Currency` page of your browser, you should see the change:
+
+<img src="../fr/img/19a637b1fa847aa5bbb18565737e9e5e28729221.jpg" width="431" height="97">
+
+### Internationalizing a Label
+
+The `CURRENCY.VIEW.STEP_MAX` string actually represents an **internationalized message key**.
+We now need to add the translation of this key.
+
+> The icon is configured simply by the `ion-stream` CSS class. To find out which icons are available, see
+[ionicons.com](http://ionicons.com/)
+
+Open the file `www/i18n/locale-fr-FR.json` and identify the element `CURRENCY` then `VIEW`.
+Add the translation for our new key:
+
+```json
+  "CURRENCY": {
+   (...)
+
+  "VIEW": {
+    "TITLE": "Monnaie",
+    (...)
+    "SIG_WINDOW": "Maximum delay a certification can wait<br/>before being expired for non-writing.",
+    "STEP_MAX": "Distance maximale dans la toile de confiance<br/>entre chaque membre et un nouvel entrant"
+  }
+}
+```
+
+Don't forget **to add a comma** on the preceding line...
+
+> Note: Cesium internationalization uses the AngularJS plugin [angular-translate](https://github.com/angular-translate/angular-translate).
+> Depending on the case, it is possible to use HTML tags, like here the tag `<br/>`
+
+Refresh your browser page: the key has been translated! 
+
+<img src="../fr/img/6bd04622dd2eb59f6d716ae9e2f114276e4ca35a.jpg" width="690" height="116">
+
+Repeat the operation in the **other translation files** present in `www/i18n`:
+
+```
+    (...)
+    "STEP_MAX": "Maximum distance between<br/>each WoT member and a newcomer"
+   }  
+
+```
+
+### Add a dynamic variable
+
+All that remains is to dynamically display the value of our `stepMax` parameter. We will use the `data-binding` functions that AngularJS allows.
+
+> In AngularJS, it is a controller that manages the filling of values, typically from data obtained on the network.
+
+Open the `CurrencyViewController` controller present in the file `www/js/controllers/currency-controllers.js`
+This controller already makes a call to the Duniter API [`/blockchain/parameters`](http://cgeek.fr:9330/blockchain/parameters).
+
+Identify the `load()` function.
+Modify the return code of the `/blockchain/parameters` call, to store the `stepMax` value in the `$scope`:
+
+```
+function CurrencyViewController($scope, $q, $translate, $timeout, BMA, UIUtils, csSettings, csCurrency, csNetwork) {
+  // Ajout d'une propriété qui stockera la valeur de stepMax
+  // (On met ici la valeur par défaut)
+  $scope.stepMax = 0;
+  (...)
+
+  $scope.load = function() {
+    (...)
+    
+    return $q.all([
+
+      // Get the currency parameters
+      BMA.node.blockchain.parameters() 
+       .then(function(json){
+          $scope.currency = json.currency;
+          (...)
+          // Mise à jour de la valeur, à partir du résultat que renvoi le noeud Duniter
+          $scope.stepMax = json.stepMax;
+        }),
+      (...)
+```
+
+> The '$scope' object is used to manipulate values shared between the controller and the template.
+> The value we put in `$scope.stepMax` is displayed thanks to the `{{stepMax}}` instruction that you put in the HTML template.
+
+Your browser should now display:
+
+<img src="../fr/img/3df8cbd2133ea9e9a28855f4b50413846fdf292c.jpg" width="519" height="85">
+
+Congratulations, you now know how to display new values in Cesium screens!
+
+## Level VII: Publish your changes
+
+__Objective :__  Become an official contributor, by publishing your code!
+
+### Make a `pull request`
+
+If you have never used git on your current machine, you will first need to define
+
+1. your email address: `git config --global user.email "your@email.xyz"`
+2. your first and last name: `git config --global user.name "First name NAME"`
+
+The change you just made actually corresponds to [ticket #209](https://git.duniter.org/clients/cesium-grp/cesium/issues/209).
+To add your modification to it, and thus **become an official contributor** of Cesium:
+
+ * Type the command `git add` followed by the names of the files you modified or, more simply, `git add *` to add all modified files to the commit.
+ * Then do a `git commit` to commit your code;
+ * Finally, do a `git push` to push to your GitHub repo.
+ * In GitLab, log in to your account;
+ * Open your `Cesium` repository via the "Projects" > "Your projects" menu that you will find at the top left, in the navigation bar.
+ * In the left menu, go to "Merge requests", and click on the "New merge request" button
+ * Most of the fields are already pre-populated, so all you have to do is select the source branch (if you haven't changed your branch via the git command line, it's "master")
+ * Click on `Compare branches and continue`
+ * In the title the reference to the ticket: `#209`
+
+Your contribution is now visible to Cesium developers, who will be able to integrate your code more easily.
+
+> _Note :_ Since RML7, this ticket has been closed. You can therefore continue this level, by adding other missing variables (see next paragraph), then 
+> publish your changes: the `pull request` process remains the same.
+
+## Niveau VIII : Free modification
+
+__Objective :__  Now it's up to you to add the missing information that seems interesting.
+
+### Add new variables
+
+To get your hands on the changes in Cesium, you can add other missing currency settings.
+For example, among those concerning the _BlockChain_: `xpercent`, `percentRot`, `blocksRot`...
+
+You can find their definition in the [Duniter protocol documentation](https://github.com/duniter/duniter/blob/master/doc/Protocol.md#protocol-parameters).
+
+> _Tip:_ to separate the different parts of the screen, add a separator, i.e. a `<div>` tag with the CSS class `item item-divider`:
+
+```html
+  <div class="item item-divider">
+      <span translate>CURRENCY.VIEW.BLOCKCHAIN_DIVIDER</span>
+  </div>
+  <!-- paramètres relatifs à la blockchain -->
+```
+
+## See more ?!
+
+You can now continue with the following levels. We will see how to compile and deploy Cesium on Android, then how to add a plugin, and even add a dynamic graph!
+
+[See more here >>](./development_tutorial-03-android.md)
\ No newline at end of file

doc/en/development_tutorial-03-android.md

+## Introduction
+
+This article is a tutorial to develop on Cesium, to compile and test the application on Android.
+
+## Prerequisites
+
+Before doing this tutorial, you must: 
+
+ - Have followed the tutorials on Cesium [up to level VIII] (./development_tutorial-02.md)
+
+## Level IX
+
+### Objective
+
+The objective here is to install the basic tools to compile and verify its proper functioning under Android. You will achieve: </p>
+
+- installation of `JDK`
+- installation of `Android Studio` software
+- installation of  `KVM` emulator
+- installation of `NDK Android` (optional - will be needed later)
+
+### Installing software
+
+#### Installing JDK
+
+The JDK or _Java Development Kit_
+
+You can download it from [Oracle](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html).
+
+<img src="../fr/img/fef4f4dfe7c2168cb27c9e7f5e399fd547ce774a.png" width="400">
+
+Depending on your operating system, download corresponding.
+
+Then install the file as normal, following the guided steps.
+
+#### Install Android Studio
+
+You can find all files at [AndroidStudio-Downloads](https://developer.android.com/studio/index.html#downloads)
+
+For Windows download file without Android SDK:
+
+<img src="../fr/img/3b8fa2f5c0465b13ae5ce74d49702e0c9f027866.png" width="690" height="237">
+
+##### For Linux
+
+All you need to do is unzip the ZIP file, open a terminal in that folder, and type the command:
+```bash
+./bin/studio.sh
+```
+
+##### For Windows and Mac OS
+
+Install the executable you downloaded earlier.
+
+##### All machines combined
+
+At the end of the installation or at the first launch, Android Studio will tell you that you do not have an SDK and will offer to install it:
+
+- If you have already installed it, you can indicate where it is.
+- Otherwise install the version it offers.
+
+
+#### Install NDK (optional)
+
+> The NDK is used for executing code under C++, in particular the NaCL cryptography library.
+> This step is currently optional (for experts only).
+
+You can download it at: [this site](https://developer.android.com/ndk/downloads/index.html)
+
+Warning: do not install version 12 of the NDK. It's not stable yet.
+
+Once again downloaded the correct version, unzip the file next to your SDK.
+
+Under Android Studio go to the menu `File > Project Structure...`
+
+<img src="../fr/img/04e64b769cbd45b9d275cd5f81002a399a1a7684.png" width="300">
+
+A window like this should open:
+
+<img src="../fr/img/ceb75301172038e75f5c43b328dd7febd7bedc7e.png" width="450">
+
+Enter the NDK installation path.
+
+#### Install KVM emulator (optional)
+
+For Linux / Debian only:
+
+```bash
+sudo apt-get install kvm qemu-kvm libvirt-bin bridge-utils virt-manager
+sudo groupadd libvirtd
+sudo adduser `id -un` libvirtd
+```
+
+##### In case of problem...
+
+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
+```
+
+Install two additional compatibility libraries (solution from [this 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
+```
+
+
+## Level X: Launching the application in Android Studio
+
+### Project Setup
+
+Go to the folder in which you installed cesium using the `cd` command followed by the path to the appropriate directory.
+
+Check that you are using the version of NodeJs that Cesium needs using the command
+
+```
+node --version
+```
+
+If you are not on a v6, use the command
+
+```
+nvm use 12
+```
+
+You can now launch the installation of the Cesium project for Android:
+
+
+```
+ionic cordova prepare
+```
+
+Normally, this command should initialize (among other things) a `platforms/android` directory.
+
+> This command may take a moment to complete.
+
+Now run the build for Android:
+
+```
+ionic build android
+```
+
+Now launch Android Studio. You should arrive at this window:
+
+
+<img src="../fr/img/33266d44fdbfd6c8b44e46a3664edafacaf0a316.png" width="500">
+
+Select "Open an existing Android Studio project" and point the folder to `cesium/platforms/android`.
+
+### Launch the application
+
+To be able to launch an emulator, we will have to create one.
+
+To do this, go to `Tools` > `AVD Manager`, or click on the following icon:
+
+<img src="../fr/img/46e959d1e616e34972a41f4d120a1d4f5beb0955.png" width="690" height="42">
+
+A window will open and offer you to create a "Virtual Device" follow the software.
+
+If you have an Android phone you can put it in developer mode and plug it in if you want to see the app on your phone.
+
+Then, once the emulator is created, you can click the "Play" button (<img src="../fr/img/70b2ce88a5e7aa5754f6a771cf5efed3c639a27b.png" width="46" height="44">) to launch the application.
+You can also use the icon (<img src="../fr/img/b7c419b33a43f6a43c5b756074ee0c199072f7d1.png" width="40" height="44">) to launch the application in debug mode.
+
+Android Studio will ask you which device you want to launch the app on, select emulator or phone and leave it alone.
+
+
+## Level XI: Application launched by `ionic`
+
+You can now use the `ionic` tool directly:
+
+ - Either to launch your application on a connected phone:
+  ```bash
+  ionic run android
+  ```
+
+ - Either to launch it on an emulator:
+  ```bash
+  ionic emulate android
+  ```
+
+## The following ?!
+
+You can now continue with the following levels. We will see there how to add a plugin to Cesium.
+
+[See more here >>](../fr/development_tutorial-04-add_plugin.md)
\ No newline at end of file