Merge branch 'ffi' into 'master'

branch ffi to master See merge request !1

Merge branch 'ffi' into 'master'
branch ffi to master See merge request !1
27951fe8 · Ali El Amrani · 348b0164 · a4fb9389 · 27951fe8 · 27951fe8
Commit 27951fe8 authored Sep 30, 2021 by Ali El Amrani
47 changed files
--- a/static/knowledge-phylomemy.json
+++ b/static/knowledge-phylomemy.json
--- a/dist/index.36efa996.js
+++ b/dist/index.36efa996.js
--- a/dist/index.36efa996.js.map
+++ b/dist/index.36efa996.js.map
--- a/dist/index.de4e3291.css
+++ b/dist/index.de4e3291.css
+@charset "UTF-8";
+/* color:#ffff00 */
+/* variable pile */
+.mèmiscape {
+  display: grid;
+  grid-template-columns: repeat(15, 1fr);
+  grid-template-rows: 2% 7% 7% auto 1%;
+  grid-gap: 10px;
+  height: calc(100vh - 20px);
+  background-color: #f800ec;
+  color: #000000;
+}
+
+.phyloCorpus {
+  grid-row: 1;
+  grid-column: 1/2;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: right;
+  background-color: #14e601;
+}
+
+.phyloInfos {
+  grid-row: 1;
+  grid-column: 3/4;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: right;
+  background-color: #db7602;
+}
+
+.phyloCorpus-info {
+  grid-row: 2;
+  grid-column: 2/4;
+  font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  background-color: #00fae5;
+}
+
+.phyloInfos-info {
+  grid-row: 2;
+  grid-column: 2/4;
+  font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  background-color: #14e601;
+}
+
+.phyloIsoline {
+  grid-row: 2/4;
+  grid-column: 1/15;
+  background-color: #fdf90b;
+  color: #000000;
+}
+
+.phyloGraph {
+  grid-row: 4;
+  grid-column: 1/15;
+  background-color: #14e601;
+}
+
+.phyloTimeline {
+  grid-row: 4;
+  grid-column: 1/2;
+  background-color: #e60101;
+}
+
+.phyloWordcloud {
+  grid-row: 4;
+  grid-column: 15/16;
+  background-color: #db7602;
+}
+
+
+/*# sourceMappingURL=index.de4e3291.css.map */
--- a/dist/index.de4e3291.css.map
+++ b/dist/index.de4e3291.css.map
+{"mappings":";AAAA;AAGA;AAWA;EACE;EACA;EACA;EACA;EACA;EACA,kBAfW;EAgBX,OAVM;;;AAYR;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAvBW;;;AAyBb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBA9BW;;;AAgCb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAxCW;;;AA0Cb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAlDW;;;AAoDb;EACE;EACA;EACA,kBAxDW;EAyDX,OApDM;;;AAsDR;EACE;EACA;EACA,kBA7DW;;;AA+Db;EACE;EACA;EACA,kBA/DW;;;AAiEb;EACE;EACA;EACA,kBArEW","sources":["src/sass/_phylo.sass"],"sourcesContent":[null],"names":[],"version":3,"file":"index.de4e3291.css.map","sourceRoot":"/__parcel_source_root/"}
\ No newline at end of file
--- a/dist/index.html
+++ b/dist/index.html
@@ -4,11 +4,11 @@
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link href="styles/sass.css" rel="stylesheet" type=text/css"/>
    <title>Mémiscape Purescript</title>
+    <link href="/index.de4e3291.css" rel="stylesheet" type="text/css">
 </head>
 <body>
    <div id="app"></div>
-    <script src="index.js"></script>
+    <script src="/index.36efa996.js" defer=""></script>
 </body>
-</html>
\ No newline at end of file
+</html>
--- a/dist/phylo-test.e31bb0bc.js
+++ b/dist/phylo-test.e31bb0bc.js
--- a/dist/phylo-test.e31bb0bc.js.map
+++ b/dist/phylo-test.e31bb0bc.js.map
--- a/dist/sass.e61a04af.css
+++ b/dist/sass.e61a04af.css
+@charset "UTF-8";
+/* color:#ffff00 */
+/* variable pile */
+.mèmiscape {
+  display: grid;
+  grid-template-columns: repeat(15, 1fr);
+  grid-template-rows: 2% 7% 7% auto 1%;
+  grid-gap: 10px;
+  height: calc(100vh - 20px);
+  background-color: #f800ec;
+  color: #000000;
+}
+
+.phyloCorpus {
+  grid-row: 1;
+  grid-column: 1/2;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: right;
+  background-color: #14e601;
+}
+
+.phyloInfos {
+  grid-row: 1;
+  grid-column: 3/4;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: right;
+  background-color: #db7602;
+}
+
+.phyloCorpus-info {
+  grid-row: 2;
+  grid-column: 2/4;
+  font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  background-color: #00fae5;
+}
+
+.phyloInfos-info {
+  grid-row: 2;
+  grid-column: 2/4;
+  font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  background-color: #14e601;
+}
+
+.phyloIsoline {
+  grid-row: 2/4;
+  grid-column: 1/15;
+  background-color: #fdf90b;
+  color: #000000;
+}
+
+.phyloGraph {
+  grid-row: 4;
+  grid-column: 1/15;
+  background-color: #14e601;
+}
+
+.phyloTimeline {
+  grid-row: 4;
+  grid-column: 1/2;
+  background-color: #e60101;
+}
+
+.phyloWordcloud {
+  grid-row: 4;
+  grid-column: 15/16;
+  background-color: #db7602;
+}
+
+
+
+
+/*# sourceMappingURL=/sass.e61a04af.css.map */
\ No newline at end of file
--- a/dist/sass.e61a04af.css.map
+++ b/dist/sass.e61a04af.css.map
+{"version":3,"sources":["src/sass/_phylo.sass"],"names":[],"mappings":";AAAA;AAGA;AAWA;EACE;EACA;EACA;EACA;EACA;EACA,kBAfW;EAgBX,OAVM;;;AAYR;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAvBW;;;AAyBb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBA9BW;;;AAgCb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAxCW;;;AA0Cb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAlDW;;;AAoDb;EACE;EACA;EACA,kBAxDW;EAyDX,OApDM;;;AAsDR;EACE;EACA;EACA,kBA7DW;;;AA+Db;EACE;EACA;EACA,kBA/DW;;;AAiEb;EACE;EACA;EACA,kBArEW","file":"sass.e61a04af.css","sourceRoot":"..","sourcesContent":["/* color:#ffff00\n\n\n/* variable pile\n\n$testcolor1: #f800ec\n$testcolor2: #fdf90b \n$testcolor3: #14e601\n$testcolor4: #00fae5 \n$testcolor5: #db7602\n$testcolor6: #e60101 \n$black: #000000\n$white: #ffffff \n\n.mèmiscape\n  display: grid\n  grid-template-columns: repeat(15, 1fr)\n  grid-template-rows: 2% 7% 7% auto 1%\n  grid-gap: 10px\n  height: calc(100vh - 20px)\n  background-color: $testcolor1\n  color: $black\n\n.phyloCorpus\n  grid-row: 1\n  grid-column: 1 / 2\n  font-size: 14px\n  display: flex\n  align-items: center\n  justify-content: right\n  background-color: $testcolor3\n\n.phyloInfos\n  grid-row: 1\n  grid-column: 3 / 4\n  font-size: 14px\n  display: flex\n  align-items: center\n  justify-content: right\n  background-color: $testcolor5\n\n.phyloCorpus-info\n  grid-row: 2\n  grid-column: 2 / 4\n  font-size: 14px\n  display: flex\n  flex-direction: column\n  justify-content: center\n  background-color: $testcolor4\n\n.phyloInfos-info\n  grid-row: 2\n  grid-column: 2 / 4\n  font-size: 14px\n  display: flex\n  flex-direction: column\n  justify-content: center\n  background-color: $testcolor3 \n\n.phyloIsoline\n  grid-row: 2 / 4\n  grid-column: 1 / 15\n  background-color: $testcolor2\n  color: $black\n\n.phyloGraph\n  grid-row: 4\n  grid-column: 1 / 15\n  background-color: $testcolor3  \n\n.phyloTimeline\n  grid-row: 4\n  grid-column: 1 / 2\n  background-color: $testcolor6\n\n.phyloWordcloud\n  grid-row: 4\n  grid-column: 15 / 16 \n  background-color: $testcolor5"]}
\ No newline at end of file
--- a/dist/sass.e61a04af.js
+++ b/dist/sass.e61a04af.js
--- a/dist/sass.e61a04af.js.map
+++ b/dist/sass.e61a04af.js.map
--- a/dist/styles/sass.css
+++ b/dist/styles/sass.css
-@font-face {
-  font-family: "Inter-Regular";
-  font-style: normal;
-  font-weight: 400;
-  src: url("./fonts/Inter-Regular.woff2") format("woff2"), url("./fonts/Inter-Regular.woff") format("woff");
-}
-@font-face {
-  font-family: "Inter-Bold";
-  font-style: normal;
-  font-weight: 700;
-  src: url("./fonts/Inter-Bold.woff2") format("woff2"), url("./fonts/Inter-Bold.woff") format("woff");
-}
-/* grid */
-body {
-  font-family: "Inter-Regular";
-  font-size: 16px;
+@charset "UTF-8";
+/* color:#ffff00 */
+/* variable pile */
+.mèmiscape {
  display: grid;
  grid-template-columns: repeat(15, 1fr);
  grid-template-rows: 2% 7% 7% auto 1%;
  grid-gap: 10px;
  height: calc(100vh - 20px);
-  color: #0d1824;
+  background-color: #f800ec;
+  color: #000000;
 }

-/* ---- row 1 ---- */
-.phylo-title {
+.phyloCorpus {
  grid-row: 1;
  grid-column: 1/2;
-  align-items: center;
-  text-align: right;
-  margin-top: 0.5px;
-}
-
-.phylo-folder {
-  grid-row: 1;
-  grid-column: 2/16;
-  align-items: center;
-}
-
-/* -------------------- */
-.phylo-corpus {
-  grid-row: 2/3;
-  grid-column: 1/2;
-  /*background : #3E75B3; */
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: right;
+  background-color: #14e601;
 }

-.phylo-phylo {
-  grid-row: 3/4;
-  grid-column: 1/2;
+.phyloInfos {
+  grid-row: 1;
+  grid-column: 3/4;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: right;
+  background-color: #db7602;
 }

-.phylo-corpus-info {
-  grid-row: 2/3;
+.phyloCorpus-info {
+  grid-row: 2;
  grid-column: 2/4;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
+  background-color: #00fae5;
 }

-.phylo-phylo-info {
-  grid-row: 3/4;
+.phyloInfos-info {
+  grid-row: 2;
  grid-column: 2/4;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
+  background-color: #14e601;
 }

-.phylo-how {
-  grid-row: 2/4;
-  grid-column: 1/2;
-  z-index: 2;
-  display: flex;
-  align-items: center;
-  justify-content: right;
-}
-
-.phylo-isoline {
-  grid-row: 2/4;
-  grid-column: 3/15;
-  /*background: rgba(223,216,200,0.25); */
-}
-
-.phylo-isoline-info {
+.phyloIsoline {
  grid-row: 2/4;
-  grid-column: 15/16;
-  padding-top: 20%;
-  padding-bottom: 20%;
-  padding-left: 15px;
+  grid-column: 1/15;
+  background-color: #fdf90b;
+  color: #000000;
 }

-/* -------------------- */
-.phylo-scape {
+.phyloGraph {
  grid-row: 4;
  grid-column: 1/15;
-  /*background: #FFCC73; */
+  background-color: #14e601;
 }

-.phylo-timeline {
+.phyloTimeline {
  grid-row: 4;
  grid-column: 1/2;
+  background-color: #e60101;
 }

-.phylo-graph {
+.phyloWordcloud {
  grid-row: 4;
  grid-column: 15/16;
-  /*background: #FFCC73; */
-}
-
-/* -------------------- */
-.phylo-footer {
-  grid-row: 5;
-  grid-column: 2/16;
-}
-
-/* classes */
-/* ---------- icons ---------- */
-a {
-  color: inherit;
-  cursor: pointer;
-}
-
-.how {
-  cursor: pointer;
-  position: relative;
-}
-
-.tooltip {
-  font-family: "Inter-Regular";
-  font-size: 14px;
-  font-style: normal;
-  font-weight: 400;
-}
-
-i.how span {
-  position: absolute;
-  width: 300px;
-  color: #FFFFFF;
-  background: #0d1824;
-  height: 30px;
-  line-height: 30px;
-  text-align: center;
-  visibility: hidden;
-  border-radius: 6px;
-}
-i.how span:after {
-  content: "";
-  position: absolute;
-  top: 50%;
-  right: 100%;
-  margin-top: -8px;
-  width: 0;
-  height: 0;
-  border-right: 8px solid #0d1824;
-  border-top: 8px solid transparent;
-  border-bottom: 8px solid transparent;
-}
-i.how:hover span {
-  visibility: visible;
-  left: 100%;
-  top: 50%;
-  margin-top: -15px;
-  margin-left: 15px;
-  z-index: 999;
-}
-
-.switch > .far + .fa {
-  display: none;
-}
-.switch:hover > .far {
-  display: none;
-}
-.switch:hover > .far + .fa {
-  display: inherit;
-  color: #0d1824;
-}
-
-/* ---------- fonts ---------- */
-.font-bold {
-  font-family: "Inter-Bold";
-  text-transform: uppercase;
-}
-
-.font-small {
-  color: #0d1824;
-  font-size: 12px;
-}
-
-.header {
-  /*font-weight: bold; */
-  /*text-transform: uppercase; */
-  font-weight: 500;
-  cursor: pointer;
-}
-.header:hover {
-  font-weight: bold;
-}
-
-/* ---------- input ---------- */
-.button {
-  background-color: white;
-  border: 1.5px solid #0d1824;
-  cursor: pointer;
-}
-.button:hover {
-  background-color: #0d1824;
-  color: white;
-}
-
-.btn-group button {
-  margin-top: 1px;
-  margin-bottom: 1px;
-  display: block;
-  width: 40px;
-}
-
-.draw {
-  display: none;
-}
-
-.phylo-focus {
-  fill: #f8381f;
-  color: #f8381f;
-}
-
-.reset, .label, .heading, .export {
-  visibility: hidden;
-}
-
-.headed, .labeled {
-  background-color: #0d1824;
-  color: white;
-}
-
-.input-file {
-  display: inline-block;
-  cursor: pointer;
-}
-.input-file:hover {
-  border-bottom: 1.5px solid #0d1824;
-}
-
-.input-name {
-  font-style: italic;
-  opacity: 0.7;
-  font-size: 14px;
-  padding-left: 6px;
-  padding-right: 6px;
-}
-
-/* ---------- axis ---------- */
-.x-axis path, .y-axis path {
-  stroke: #EBE4DD;
-  stroke-width: 1.5px;
-}
-
-.y-highlight {
-  stroke: #f3be54;
-  stroke-width: 1.5px;
-}
-
-.x-mark {
-  fill: #4A5C70;
-  stroke-width: 1px;
-  stroke: #fff;
-}
-
-.x-mark-over {
-  fill: #f3be54;
-}
-
-.x-mark-focus {
-  fill: #f8381f;
-}
-
-.tick text {
-  font-family: "Inter-Regular";
-}
-.tick text:hover {
-  cursor: pointer;
-}
-
-.y-label {
-  font-size: 10px;
-  font-family: "Inter-Regular";
-  font-weight: normal;
-}
-
-.y-label-bold {
-  font-size: 12px;
-  font-family: "Inter-Bold";
-  font-weight: bold;
-}
-
-.y-mark-year-inner {
-  fill: #4A5C70;
-}
-
-.y-mark-year-inner-highlight {
-  fill: #f3be54;
-}
-
-.y-mark-year-outer {
-  fill: #fff;
-  stroke: #4A5C70;
-  stroke-width: 1px;
-}
-
-.y-mark-year-outer-highlight {
-  fill: #fff;
-  stroke: #f3be54;
-  stroke-width: 3px;
-}
-
-.y-mark-month {
-  fill: #4A5C70;
-}
-
-/* ---------- group ---------- */
-.group-outer {
-  stroke-width: 0.8px;
-  stroke: #fff;
-  fill: #fff;
-}
-
-.group-inner {
-  stroke-width: 0.8px;
-  stroke: #0d1824;
-  fill: #0d1824;
-  /*cursor: pointer; */
-  z-index: 10;
-}
-
-.group-heading {
-  fill: #fff;
-  stroke: #B5B5B5;
-}
-
-.group-focus {
-  stroke: #f8381f;
-}
-
-.source-focus {
-  stroke: #67a9cf;
-}
-
-.group-unfocus {
-  stroke: #A9A9A9;
-}
-
-.group-path {
-  cursor: pointer;
-}
-
-/* ---------- labels ---------- */
-.ngrams {
-  visibility: hidden;
-}
-
-.term {
-  cursor: pointer;
-}
-.term:hover {
-  font-weight: bold;
-  fill: #f8381f;
-}
-
-.term-unfocus {
-  /*fill: #A9A9A9; */
-}
-
-.term-focus {
-  /*fill: black; */
-}
-
-.term-path {
-  fill: none;
-  stroke: #F0684D;
-  stroke-width: 1.5px;
-}
-
-.emerging {
-  /*text-decoration: underline #F0684D; */
-  /*fill:#5AA350; */
-  /*fill: #5AA350; */
-  fill: #F8381F;
-}
-
-.decreasing {
-  /*text-decoration: underline #74B5FF; */
-  fill: #11638F;
-}
-
-.path-focus {
-  fill: none;
-  stroke: #F0684D;
-  stroke-width: 1.5px;
-}
-
-.path-unfocus {
-  stroke: #A9A9A9;
-}
-
-.path-heading {
-  stroke: #B5B5B5;
-}
-
-/* ---------- phylo ---------- */
-.branch-hover {
-  fill: #f3be54;
-  opacity: 0.5;
-}
-
-/* elements */
-#file-path {
-  display: none;
-}
-
-/* axis */
-.axisRight {
-  font-family: "Inter-Regular";
-  font-size: 10px;
-}
-
-/* isoline */
-.peak {
-  stroke: white;
-  stroke-width: 1px;
-  font-family: "Inter-Regular";
-  font-size: 14px;
-  text-anchor: middle;
-  visibility: visible;
-}
-
-.peak-over {
-  font-size: 18px;
-  stroke-width: 2px;
-  cursor: pointer;
-  stroke: #f3be54;
-  z-index: 100;
-}
-
-.peak-focus {
-  font-size: 18px;
-  stroke-width: 2px;
-  stroke: #F0684D;
-}
-
-.peak-focus-source {
-  font-size: 18px;
-  stroke-width: 2px;
-  stroke: #67a9cf;
-}
-
-.peak-label {
-  text-align: center;
-  font-family: "Inter-Regular";
-  font-size: 14px;
-  font-style: normal;
-  font-weight: 400;
-  color: #FFFFFF;
-  border-radius: 3px;
-  border-style: solid;
-  border-width: 2px;
-  border-color: white;
-  background: #0d1824;
-  padding: 5px;
-  z-index: 10;
-  position: absolute;
-  visibility: hidden;
-}
-
-.word-cloud {
-  font-family: "Inter-Regular";
-  font-size: 12px;
-}
-
-.search {
-  margin-left: 10px;
-  visibility: hidden;
-  position: absolute;
-  z-index: 7;
-  font-size: 14px;
-  background-color: transparent;
-  outline: 0;
-  border-width: 0 0 2px;
-  border-color: #0d1824;
-}
-
-.search-label {
-  visibility: hidden;
-  margin-left: 5px;
-}
-
-.search:focus {
-  border-color: #F0684D;
-}
-
-.autocomplete {
-  margin-left: 10px;
-  visibility: hidden;
-  position: absolute;
-  z-index: 7;
-  font-size: 14px;
-  background-color: transparent;
-  color: silver;
-  z-index: 1;
-  border: none;
-}
-
-.loading {
-  visibility: hidden;
-}
-
-.phylo-name {
-  visibility: hidden;
-  text-transform: capitalize;
-  font-weight: bold;
-}
-
-.select-source {
-  margin-left: 10px;
-  display: none;
-  border: 1.5px solid #0d1824;
-  cursor: pointer;
-  outline: 0;
-  background: transparent;
-  border-image: none;
-  outline-offset: -2px;
-  outline-color: transparent;
-  box-shadow: none;
-  -webkit-appearance: none;
-}
-
-option {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 150px;
+  background-color: #db7602;
 }

 /*# sourceMappingURL=sass.css.map */
--- a/dist/styles/sass.css.map
+++ b/dist/styles/sass.css.map
-{"version":3,"sourceRoot":"","sources":["../../src/sass/sass.sass"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;AAEA;EACE;EACA;AAEA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;AAEA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;AAEA;EACE;EACA;AAEA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;AAEA;;;AAEF;AAEA;EACE;EACA;;;AAEF;AAEA;AAEA;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;AAEF;EACE;;AAEA;EACE;EACA;;;AAEN;AAEA;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;AACE;AACA;EACA;EACA;;AAEA;EACE;;;AAEJ;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;AAEA;EACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;;;AAEF;AAEA;EACE;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;AAEA;EACE;;;AAEJ;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;AAEA;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;AAEA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAEA;EACE;;;AAEF;EACE;;AAEA;EACE;EACA;;;AAEJ;AACE;;;AAEF;AACE;;;AAEF;EACE;EACA;EACA;;;AAEF;AACE;AACA;AACA;EACA;;;AAEF;AACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAEA;EACE;EACA;;;AAEF;AAEA;EACE;;;AAEF;AAEA;EACE;EACA;;;AAEF;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA","file":"sass.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../../src/sass/_phylo.sass"],"names":[],"mappings":";AAAA;AAGA;AAWA;EACE;EACA;EACA;EACA;EACA;EACA,kBAfW;EAgBX,OAVM;;;AAYR;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAvBW;;;AAyBb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBA9BW;;;AAgCb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAxCW;;;AA0Cb;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBAlDW;;;AAoDb;EACE;EACA;EACA,kBAxDW;EAyDX,OApDM;;;AAsDR;EACE;EACA;EACA,kBA7DW;;;AA+Db;EACE;EACA;EACA,kBA/DW;;;AAiEb;EACE;EACA;EACA,kBArEW","file":"sass.css"}
\ No newline at end of file
--- a/exos/MainTry.purs
+++ b/exos/MainTry.purs
+module MainExercices where
+
+import Prelude
+
+import DOM.Simple (Element, boundingRect)
+import DOM.Simple as DOM
+import DOM.Simple.Console (log)
+import DOM.Simple.Document (document)
+import DOM.Simple.Element (boundingRect)
+import DOM.Simple.Types (DOMRect)
+import Data.Maybe (Maybe(..))
+import Data.Nullable (toMaybe, null)
+import Effect (Effect)
+import Effect.Class (liftEffect)
+import FFI.Simple ((...), delay, args2)
+import Phylo.Ressources as PR
+import Phylo.Types as PT
+import Phylo.TypesExample as PTE
+import Reactix as R
+import Reactix.DOM.HTML as H
+
+main :: Effect Unit
+main = paint $ toMaybe (document ... "getElementById" $ [ "app" ])
+
+render :: R.Element -> DOM.Element -> Effect Unit
+render e d = delay unit $ \_ -> pure $ R.reactDOM ... "render" $ args2 e d
+
+paint :: Maybe Element -> Effect Unit
+paint Nothing = log "[main] container not found"
+paint (Just c) = render (app {} []) c
+
+app :: {} -> Array R.Element -> R.Element
+app = R.createElement appCpt
+
+appCpt :: R.Component()
+appCpt = R.hooksComponentWithModule "Phylo.Ressources" "app" cpt where
+  cpt {} _ = do
+    R.useEffect' $ do
+      PTE.logPhyloJSON
+      delay unit $ \_ -> do
+        -- PR.drawIsoline
+        pure unit
+    pure $ H.div {className:"Mèmiscape"}[
+      H.div{className:"PhyloCorpus"}[H.text "Corpus",
+        H.div{className:"PhyloCorpusInfo"}[H.span{id:"docs"}[H.text "docs"] -- Insert value JSON
+                                          ,H.span{id:"foundations"}[H.text "foundations"]
+                                          ,H.span{id:"periods"}[H.text "periods"]] 
+      ],
+      H.div{className:"PhyloInfo"}[H.text "Phylomemy",
+        H.div{className:"PhyloInfoCount"}[H.span{id:"phyloTerms"}[H.text ("terms")]
+                                        ,H.span{id:"phyloGroups"}[]
+                                        ,H.span{id:"phyloBranches"}[H.text ("branches")]]
+      ],
+      H.div{id:"Isoline"}[H.text "Here is Isoline"]
+    ]
+
+      
+      
\ No newline at end of file
--- a/exos/TypesExercises.purs
+++ b/exos/TypesExercises.purs
+module Phylo.TypesExercises where
+
+import Prelude
+
+import Affjax as AX
+import Affjax.ResponseFormat as ResponseFormat
+import DOM.Simple.Console (log, log2)
+import Data.Generic.Rep (class Generic)
+import Data.Either (Either(..))
+import Data.HTTP.Method (Method(..))
+import Data.Maybe (Maybe(..))
+import Effect (Effect)
+import Effect.Aff (Aff, launchAff_)
+import Effect.Class (liftEffect)
+import Simple.JSON as JSON
+
+type PhyloJSON = 
+  { name              :: String
+  , phyloDocs         :: String
+  , phyloFoundations  :: String
+  , phyloPeriods      :: String
+  , phyloTerms        :: String
+  , phyloGroups       :: String
+  , phyloBranches     :: String
+  , objects           :: Array PhyloObjects
+  , edges             :: Array PhyloEdges
+  }
+
+type PhyloObjects =
+  { _gvid    :: Int
+  , shape    :: Maybe String
+  , nodeType :: Maybe String
+  }
+
+type PhyloEdges =
+  { _gvid    :: Int
+  , color    :: Maybe String
+  , edgeType :: Maybe String
+  }
+
+-- data NodeType = NodeBranch | NodeGroup | NodePeriod
+-- derive instance Eq NodeType
+-- instance Show NodeType where
+--   show NodeBranch = "branch"
+--   show NodeGroup  = "group"
+--   show NodePeriod = "period"
+-- 
+-- data PhyloObject = Branch  
+--                 { _gvid :: Int
+--                 , bId :: String
+--                 , nodeType :: NodeType
+--                 }| Group   
+--                 { _gvid :: Int
+--                 , bId :: String
+--                 , nodeType :: NodeType
+--                 }| Period  
+--                 { _gvid :: Int
+--                 , nodeType :: NodeType
+--                 }| Default 
+--                 {
+--                   _gvid :: Int
+--                 }
+
+-- instance JSON.ReadForeign PhyloObject where
+--   readImpl f = do
+--     s <- JSON.readImpl f
+--     case s.nodeType of
+--       "branch" -> pure Branch
+--       "group" -> pure Group 
+--       "period" -> pure Period 
+--       x -> pure Default
+
+-- data EdgeType  = LinkType | BranchLinkType | AncestorLinkType
+-- derive instance Eq EdgeType
+-- instance Show EdgeType where
+--   show LinkType = "link"
+--   show BranchLinkType  = "ancestorLink"
+--   show AncestorLinkType = "branchLink"
+-- 
+-- data PhyloEdge = Link  
+--                 { _gvid :: Int
+--                 , bId :: String
+--                 , edgeType :: EdgeType
+--                 }| AncestorLink   
+--                 { _gvid :: Int
+--                 , bId :: String
+--                 , edgeType :: EdgeType
+--                 }| BranchLink  
+--                 { _gvid :: Int
+--                 , bId :: String
+--                 , edgeType :: EdgeType
+--                 }| DefaultLink
+--                 {
+--                   _gvid :: Int
+--                 }
+
+
+
+-- data PhyloObjects = Branch 
+--                 { _gvid :: Int
+--                 ,  name :: String
+--                 , nodeType :: Maybe String
+--                 } | Group
+--                 { _gvid :: Int
+--                 ,  name :: String
+--                 , nodeType :: Maybe String
+--                 } | Period
+--                 { _gvid :: Int
+--                 ,  name :: String
+--                 , nodeType :: Maybe String
+--                 }
+-- 
+-- data PhyloEdges = Link
+--                 { _gvid    :: Int
+--                 ,  head    :: Int
+--                 , edgeType :: Maybe String
+--                 } | BranchLink
+--                 { _gvid    :: Int
+--                 ,  head    :: Int
+--                 , edgeType :: Maybe String
+--                 } | AncestorLink
+--                 { _gvid    :: Int
+--                 ,  head    :: Int
+--                 , edgeType :: Maybe String
+--                 }
+-- 
+-- instance JSON.ReadForeign PhyloEdges where
+--   readImpl f = do
+--     inst <- JSON.readImpl f
+--     pure $ PhyloEdges 
+
+-- fetchPhyloJSON :: Aff (Maybe PhyloJSON)
+-- fetchPhyloJSON = do
+--   result <- AX.request (AX.defaultRequest { url = "http://-- localhost:5501/data/knowledge-phylomemy.json", method = -- Left GET, responseFormat = ResponseFormat.string })
+--   case result of
+--     Left err -> do
+--       liftEffect $ log $ "Phylo failed to load error : " <> -- AX.printError err
+--       pure Nothing
+--     Right response -> liftEffect $ do
+--       case JSON.readJSON response.body of
+--         Left err -> do
+--           log $ "Fail with error: " <> show err
+--           pure Nothing
+--         Right (r :: PhyloJSON) -> do
+--           log $ "name of phylo is : " <> show r.name
+--           pure $ Just r
+
+
+
+-- logPhyloJSON = do
+--   launchAff_ $ do
+--     mr <- fetchPhyloJSON
+--     liftEffect $ do
+--       case mr of
+--         Nothing -> log "Nothing"
+--         pure $ Just mr
+
+-- getParams mPhy param = 
+--   case mPhy of
+--     Left err -> do
+--       log $ "There's no phylo here" <> show err
+--     Right (r :: PhyloJSON) -> do
+--       pure $ Just r.name
+
+
+
+  
+
+    
+
+-- getName :: PhyloJSON -> String
+-- getName phylo = phylo.name
+
+-- getObjects :: PhyloJSON -> Array PhyloObjects
+-- getObjects 
+-- 
\ No newline at end of file
--- a/index.html
+++ b/index.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Mémiscape Purescript</title>
+    <link href="dist/styles/sass.css" rel="stylesheet" type="text/css" />
+</head>
+<body>
+    <div id="app"></div>
+    <script type="module" src="index.js"></script>
+</body>
+</html>
--- a/index.js
+++ b/index.js
--- a/nix/default.nix
+++ b/nix/default.nix
+with (import <nixpkgs> {});
+let
+  nodejs-with-packages = with nodePackages; [
+    bower
+    yarn
+  ]; in
+stdenv.mkDerivation rec {
+  name = "env";
+  env = buildEnv {
+    name = name;
+    paths = buildInputs;
+  };
+  buildInputs = [
+    nodejs-with-packages
+    yarn
+    yarn2nix
+  ];
+  builder = builtins.toFile "builder.sh" ''
+    source $stdenv/setup
+    touch $out
+  '';
+}
--- a/nix/easy-ps.nix
+++ b/nix/easy-ps.nix
+{ pkgs ? import ./pinned.nix { } }:
+
+import
+  (
+    pkgs.fetchFromGitHub {
+      owner = "justinwoo";
+      repo = "easy-purescript-nix";
+      rev = "bbef4245cd6810ea84e97a47c801947bfec9fadc";
+      sha256 = "00764zbwhbn61jwb5px2syzi2f9djyl8fmbd2p8wma985af54iwx";
+    }
+  ) {
+  inherit pkgs;
+}
--- a/nix/generate-packages-json.bash
+++ b/nix/generate-packages-json.bash
+#!/usr/bin/env bash
+set -e
+
+## You should use the `shell.nix` file in our project, or install dhall-to-json yourself: https://github.com/dhall-lang/dhall-haskell/releases
+dhall-to-json --file packages.dhall --output ./.psc-package/local/.set/packages.json
+echo "generated packages.json"
--- a/nix/generate-purs-packages.nix
+++ b/nix/generate-purs-packages.nix
+#!/usr/bin/env nix-shell
+#!nix-shell ./generate-purs-packages.nix --run 'exit'
+{ pkgs ? import ./pinned.nix { } }:
+let
+  psc-package-nix = import ./psc-package-nix.nix { inherit pkgs; };
+  purs-project = import ./purs-project.nix { inherit pkgs; };
+  generatePursPackages = import "${psc-package-nix}/nix/generate-purs-packages.nix" {
+    inherit pkgs;
+    inherit (purs-project) packagesJson inputNames;
+  };
+in
+pkgs.mkShell {
+  buildInputs = [ generatePursPackages ];
+
+  shellHook = ''
+    generate-purs-packages > ./nix/purs-packages.nix
+    echo "generated purs-packages.nix"
+  '';
+}
--- a/nix/pinned.nix
+++ b/nix/pinned.nix
+import (
+  builtins.fetchTarball {
+    url = "https://github.com/NixOS/nixpkgs/archive/21.05.tar.gz";
+    sha256 = "1ckzhh24mgz6jd1xhfgx0i9mijk6xjqxwsshnvq789xsavrmsc36";
+  }
+)
--- a/nix/psc-package-nix.nix
+++ b/nix/psc-package-nix.nix
+{ pkgs ? import ./pinned.nix { } }:
+
+pkgs.fetchFromGitHub {
+  owner = "justinwoo";
+  repo = "psc-package-nix";
+  rev = "0f1f001e2ea17ad461871a1873050f6aef5f1284";
+  sha256 = "0gbwcvw8rvxhlg9p6avd0812y263jzim1sra5frbdi0s6q0ngsgi";
+}
--- a/nix/purs-packages.nix
+++ b/nix/purs-packages.nix
--- a/nix/purs-project.nix
+++ b/nix/purs-project.nix
+#!/usr/bin/env nix-shell
+{ pkgs ? import ./pinned.nix { } }:
+let
+  packagesJson = ../.psc-package/local/.set/packages.json;
+  inputNames = (pkgs.lib.importJSON ../psc-package.json).depends;
+  pursPackages = import ./purs-packages.nix { inherit pkgs; };
+  getUnquotedSourceGlob = x: ''${x.src}/src/**/*.purs'';
+  unquotedSourceGlobs = map getUnquotedSourceGlob (builtins.attrValues pursPackages);
+  quote = x: ''"${x}"'';
+  sourceGlobs = map quote unquotedSourceGlobs;
+in
+{
+  inherit packagesJson inputNames sourceGlobs unquotedSourceGlobs;
+}
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
  "description": "Memiscape purescript version",
  "license": "MIT",
  "scripts": {
-    "build-purs": "spago bundle-app --to dist/index.js",
+    "build-purs": "spago bundle-app",
    "build-css": "sass src/sass/sass.sass:dist/styles/sass.css"
  },
  "dependencies": {
@@ -14,7 +14,7 @@
  },
  "devDependencies": {
    "parcel": "^2.0.0-rc.0",
-    "purescript": "^0.14.3",
+    "purescript": "0.14.4",
    "sass": "^1.37.5",
    "spago": "^0.20.3"
  }

--- a/shell.nix
+++ b/shell.nix
+{ pkgs ? import ./nix/pinned.nix {} }:
+let
+  easy-ps = import ./nix/easy-ps.nix { inherit pkgs; };
+
+  purs-packages = import ./purs-packages.nix { inherit pkgs; };
+
+  purs-project = import ./nix/purs-project.nix { inherit pkgs; };
+
+  build-purs = pkgs.writeShellScriptBin "build-purs" ''
+    #!/usr/bin/env bash
+    purs compile ${toString purs-project.sourceGlobs} "src/**/*.purs" "test/**/*.purs"
+  '';
+
+  build = pkgs.writeShellScriptBin "build" ''
+    #!/usr/bin/env bash
+    set -e
+
+    echo "Compiling"
+    #build-purs
+    echo "Bundling"
+    #yarn pulp browserify --skip-compile -t dist/bundle.js --src-path output
+    yarn spago build
+    browserify
+  '';
+
+  build-watch = pkgs.writeShellScriptBin "build-watch" ''
+    #!/usr/bin/env bash
+    set -e
+
+    echo "Build watch"
+    yarn spago build -w --then browserify
+  '';
+
+  browserify = pkgs.writeShellScriptBin "browserify" ''
+    #!/usr/bin/env bash
+    set -e
+
+    yarn pulp browserify --skip-compile -t dist/bundle.js --src-path output
+  '';
+
+  repl = pkgs.writeShellScriptBin "repl" ''
+    #!/usr/bin/env bash
+
+    yarn pulp repl
+  '';
+
+  test-ps = pkgs.writeShellScriptBin "test-ps" ''
+    #!/usr/bin/env bash
+    set -e
+
+    echo "Compiling"
+    build-purs
+    echo "Testing"
+    # yarn pulp browserify --skip-compile -t dist/bundle.js --src-path output
+    # yarn pulp test --src-path output --test-path output
+    NODE_PATH=output node -e "require('Test.Main').main();"
+  '';
+in
+pkgs.mkShell {
+  buildInputs = [
+    easy-ps.purs-0_14_3
+    easy-ps.psc-package
+    easy-ps.dhall-json-simple
+    browserify
+    build-purs
+    build-watch
+    build
+    repl
+    pkgs.spago
+    pkgs.yarn
+    test-ps
+  ];
+
+  shellHook = ''
+    export PURS_IDE_SOURCES='${toString purs-project.unquotedSourceGlobs}'
+  '';
+}
+
+## how to build the project with nix dependencies:
+#
+# 1. start a nix shell (e.g. `nix-shell -j 20`, this uses 20 jobs to fetch deps)
+# 2. run `yarn` to install npm deps
+# 3a. run `build-purs` to build using nix store dependencies, and make sure to update your purescript ide tooling as necesssary
+# 3b. or simply use `psc-package` as you might want to anyway
+#
+# note that the purescript compiler uses filepaths and timestamps, so using the above two commands
+# interchangeably will lead to constant rebuilding of the entire project.
+#
+## how to update purs-packages.nix
+#
+# 1. run `nix/generate-packages-json.nix` to generate packages.json
+# 2. run `nix/generate-purs-packages.nix` to generate purs-packages.nix
--- a/spago.dhall
+++ b/spago.dhall
@@ -22,6 +22,7 @@ to generate this file without the comments in this block.
  , "console"
  , "control"
  , "d3"
+  , "datetime"
  , "dom-simple"
  , "effect"
  , "either"

--- a/src/App.purs
+++ b/src/App.purs
+module App where
+
+import Prelude
+
+import DOM.Simple (Element)
+import DOM.Simple as DOM
+import DOM.Simple.Console (log)
+import DOM.Simple.Document (document)
+import Data.Maybe (Maybe(..))
+import Data.Nullable (toMaybe)
+import Effect (Effect)
+import FFI.Simple ((...), delay, args2)
+import Phylo.Graph (phyloR, timelineR, wordcloudR)
+import Phylo.Infos (infoCorpusR,infoPhyloR)
+import Phylo.Isoline (isolineR)
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Toestand as T
+
+app :: {} -> Array R.Element -> R.Element
+app = R.createElement appCpt 
+
+appCpt :: R.Component()
+appCpt = R.hooksComponent "app" cpt where
+  cpt _ _ = do
+    pure $ H.div {className:"mèmiscape"} [infoCorpusR,infoPhyloR, timelineR,isolineR, wordcloudR, phyloR]
+
--- a/src/Main.purs
+++ b/src/Main.purs
+module Main where
+
+import Prelude
+
+import App (app)
+import DOM.Simple (Element, boundingRect)
+import DOM.Simple as DOM
+import DOM.Simple.Console (log, log2)
+import DOM.Simple.Document (document)
+import DOM.Simple.Element (boundingRect)
+import DOM.Simple.Types (DOMRect)
+import Data.Maybe (Maybe(..))
+import Data.Nullable (toMaybe, null)
+import Data.Tuple (Tuple)
+import Data.Tuple.Nested ((/\))
+import Effect (Effect)
+import Effect.Class (liftEffect)
+import FFI.Simple ((...), delay, args2)
+import Graphics.D3.Base 
+import Phylo.Ressources as PR
+import Phylo.Types as PT
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Toestand as T
+
+main :: Effect Unit
+main = paint $ toMaybe (document ... "getElementById" $ [ "app" ])
+
+render :: R.Element -> DOM.Element -> Effect Unit
+render e d = delay unit $ \_ -> pure $ R.reactDOM ... "render" $ args2 e d
+
+paint :: Maybe Element -> Effect Unit
+paint Nothing = log "[main] container not found"
+paint (Just c) = render (app {} []) c
+
+d3charge :: D3
+d3charge = d3
+
+
+
+    
+
+      
+      
\ No newline at end of file
--- a/src/Phylo/Components/Counter.purs
+++ b/src/Phylo/Components/Counter.purs
+module Phylo.Counter where
+
+import Prelude
+
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Toestand as T
+import Data.Tuple.Nested ((/\))
+
+counterR :: R.Element
+counterR = counter {initialCount : 0}
+
+type Counter = ( initialCount :: Int )
+
+counter :: Record Counter -> R.Element
+counter props = R.createElement counterCpt props []
+
+counterCpt :: R.Component Counter
+counterCpt = R.hooksComponent "counter" cpt where
+  cpt { initialCount } _children = do
+    (count /\ setCount ) <- R.useState' initialCount
+    pure $ H.div {}
+      [ H.button { on: {click: \_event -> setCount (_ + 1) } }
+        [H.text "Click here"]
+        ,H.text ("You clicked " <> show count <> " times :)")]
\ No newline at end of file
--- a/src/Phylo/Components/Infos.purs
+++ b/src/Phylo/Components/Infos.purs
+module Phylo.Infos where
+
+import Prelude
+
+import DOM.Simple.Console (log, log2)
+import Data.Array (length)
+import Data.Int (toNumber, round)
+import Data.Maybe (Maybe(..), isJust, maybe)
+import Data.Nullable (null, toMaybe)
+import Effect (Effect)
+import Effect.Aff (Aff, killFiber, launchAff, launchAff_)
+import Effect.Class (liftEffect)
+import Effect.Exception (error)
+import FFI.Simple (delay)
+import Graphics.D3.Base (D3Eff)
+import Graphics.D3.Contour as Contour
+import Graphics.D3.Selection as Selection
+import Phylo.TypesExample as PTE
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Toestand as T
+
+type Props = ()
+
+infoCorpusR :: R.Element
+infoCorpusR = infoCorpus {}
+
+infoPhyloR :: R.Element
+infoPhyloR = infoPhylo {}
+
+--infoPhyloCpt :: R.Component Props
+--infoPhyloCpt = R.hooksComponent "infoPhylo" cpt where
+--  cpt {  } _children = do
+--    pure $ H.div {className:"phyloInfos"} [H.text "Here lies Phylo-info",
+--    H.div {className:"phyloInfos-info"}[H.text "0"]]
+
+infoPhyloCpt :: R.Component Props
+infoPhyloCpt = R.hooksComponent "infoCorpus" cpt where
+  cpt {  } _children = do
+    fetched <- T.useBox Nothing
+
+    R.useEffect' $ do
+      launchAff_ $ do        
+        mr <- PTE.fetchPhyloJSON
+        liftEffect $ do
+          case mr of
+            Nothing -> log "Nothing"
+            Just r -> T.write_ (Just r) fetched
+    pure $ infoPhyloLoaded { fetched } []
+
+--infoCorpusCpt :: R.Component InfoCorpus
+--infoCorpusCpt = R.hooksComponent "infoCorpus" cpt where
+--  cpt {  } _children = do
+--    pure $ H.div {className:"phyloCorpus"} [H.text "Here lies Corpus-info",
+--    H.div {className:"phyloCorpus-info"}[H.text $ "Corpus Info here"]
+
+infoCorpus :: Record Props -> R.Element 
+infoCorpus props = R.createElement infoCorpusCpt props []
+
+infoPhylo :: Record Props -> R.Element
+infoPhylo props = R.createElement infoPhyloCpt props []
+
+type InfoCorpusLoaded =
+  ( fetched :: T.Box (Maybe PTE.PhyloJSON) )
+
+infoCorpusCpt :: R.Component Props
+infoCorpusCpt = R.hooksComponent "infoCorpus" cpt where
+  cpt {  } _children = do
+    fetched <- T.useBox Nothing
+
+    R.useEffect' $ do
+      launchAff_ $ do        
+        mr <- PTE.fetchPhyloJSON
+        liftEffect $ do
+          case mr of
+            Nothing -> log "Nothing"
+            Just r -> T.write_ (Just r) fetched
+    pure $ infoCorpusLoaded { fetched } []
+
+infoCorpusLoaded :: Record InfoCorpusLoaded -> Array R.Element -> R.Element
+infoCorpusLoaded = R.createElement infoCorpusLoadedCpt
+
+infoPhyloLoaded :: Record InfoCorpusLoaded -> Array R.Element -> R.Element
+infoPhyloLoaded = R.createElement infoPhyloLoadedCpt
+
+infoCorpusLoadedCpt :: R.Component InfoCorpusLoaded
+infoCorpusLoadedCpt = R.hooksComponent "infoCorpusLoaded" cpt where
+  cpt { fetched } _ = do
+    fetched' <- T.useLive T.unequal fetched
+
+    case fetched' of
+      Nothing -> pure $ H.div {}[]
+      Just mr -> pure $ H.div {className:"phyloCorpus"} 
+        [H.text "Corpus",
+         H.div {className:"phyloInfos-info"}[H.span {}[H.text $ mr.phyloDocs <> " docs"],
+                                              H.span {}[H.text $ mr.phyloFoundations <> " foundations"],
+                                              H.span {}[H.text $ mr.phyloPeriods <> " periods"]]]
+
+infoPhyloLoadedCpt :: R.Component InfoCorpusLoaded
+infoPhyloLoadedCpt = R.hooksComponent "infoCorpusLoaded" cpt where
+  cpt { fetched } _ = do
+    fetched' <- T.useLive T.unequal fetched
+
+    case fetched' of
+      Nothing -> pure $ H.div {}[]
+      Just mr -> pure $ H.div {className:"phyloInfos"} 
+        [H.text "Phylo",
+         H.div {className:"phyloCorpus-info"}[H.span {}[H.text $ mr.phyloTerms <> " Termes"],
+                                              H.span {}[H.text $ mr.phyloBranches <> " Branches"],
+                                              H.span {}[H.text $ mr.phyloGroups <> " Groupes"]]]
+--getPhyloName = 
+--  launchAff_ $ do
+--    mr <- PTE.fetchPhyloJSON
+--    liftEffect $ do
+--      case mr of
+--        Nothing -> log "Nothing"
+--        Just r  -> log2 "r" r.name
+--      pure $ maybe mr.name
\ No newline at end of file
--- a/src/Phylo/Components/Isoline.js
+++ b/src/Phylo/Components/Isoline.js
--- a/src/Phylo/Components/Isoline.purs
+++ b/src/Phylo/Components/Isoline.purs
+module Phylo.Isoline where
+
+import Graphics.D3.Base
+import Prelude
+
+import DOM.Simple.Console (log, log2)
+import DOM.Simple.Element as DSE
+import Data.Array (length)
+import Data.Int (toNumber, round)
+import Data.Maybe (Maybe(..), fromMaybe, maybe)
+import Data.Nullable (null, toMaybe)
+import Effect (Effect)
+import Effect.Aff (Aff, launchAff_)
+import Effect.Class (liftEffect)
+import FFI.Simple (delay)
+import Graphics.D3.Base (D3Eff)
+import Graphics.D3.Contour as Contour
+import Graphics.D3.Selection as Selection
+import Phylo.TypesExample as PTE
+import Reactix as R
+import Reactix.DOM.HTML as H
+import Toestand as T
+
+foreign import drawIsoline :: Array PTE.PhyloObject -> String -> Effect Unit
+
+type Props = ()
+
+isolineR :: R.Element
+isolineR = isoline {}
+
+isoline :: Record Props -> R.Element
+isoline props = R.createElement isolineCpt props []
+
+isolineCpt :: R.Component Props
+isolineCpt = R.hooksComponent "isoline" cpt where
+  cpt {  } _children = do
+    fetched <- T.useBox Nothing
+
+    R.useEffect' $ do
+      launchAff_ $ do        
+        mr <- PTE.fetchPhyloJSON
+        liftEffect $ do
+          case mr of
+            Nothing -> log "Nothing"
+            Just r -> T.write_ (Just r) fetched
+    pure $ isolineLoaded { fetched } []
+
+type IsolineLoaded =
+  ( fetched :: T.Box (Maybe PTE.PhyloJSON))
+
+isolineLoaded :: Record IsolineLoaded -> Array R.Element -> R.Element
+isolineLoaded = R.createElement isolineLoadedCpt
+
+isolineLoadedCpt :: R.Component IsolineLoaded
+isolineLoadedCpt = R.hooksComponent "isolineLoaded" cpt where
+  cpt { fetched } _ = do
+    fetched' <- T.useLive T.unequal fetched
+    containerRef <- R.useRef null
+    case fetched' of
+      Nothing -> pure $ H.div{}[]
+      Just mr -> do
+--        R.useEffectOnce' $ do
+--          delay unit $ \_ -> do
+--            let mContainer = toMaybe $ R.readRef containerRef
+--            case mContainer of
+--              Nothing -> pure unit
+--              Just cr -> do
+--                drawIsoline (PTE.getBranches mr.objects) "phyloIsoline"
+        pure $ H.div {id:"phyloIsoline", ref: containerRef}[H.text "Isoline"]
+--      pure $ H.div {className:"phyloIsoline"}[H.text "Here lies the isoline"]
\ No newline at end of file
--- a/src/Phylo/Components/PhyloGraph.js
+++ b/src/Phylo/Components/PhyloGraph.js
--- a/src/Phylo/Components/PhyloGraph.purs
+++ b/src/Phylo/Components/PhyloGraph.purs
--- a/src/Phylo/Data.purs
+++ b/src/Phylo/Data.purs
--- a/src/Phylo/Ressources.purs
+++ b/src/Phylo/Ressources.purs
--- a/src/Phylo/Types.purs
+++ b/src/Phylo/Types.purs
--- a/src/Phylo/TypesExamples.purs
+++ b/src/Phylo/TypesExamples.purs
--- a/src/Phylo/Utils.purs
+++ b/src/Phylo/Utils.purs
--- a/src/Phylo/test.purs
+++ b/src/Phylo/test.purs
--- a/src/sass/_phylo.sass
+++ b/src/sass/_phylo.sass
--- a/src/sass/quentin.sass
+++ b/src/sass/quentin.sass
--- a/src/sass/sass.sass
+++ b/src/sass/sass.sass
--- a/yarn.lock
+++ b/yarn.lock