CSS + Début organisation index.html

javascript/components/school.js

@@ -1,12 +0,0 @@
-var school = {
-  css: null,
-  exports: {
-    onMounted() {
-      console.log("Test!");
-    }
-  },
-  template: (template, expressionTypes, bindingTypes, getComponent) => template('<main class="container"><div class="block control has-icons-left is-inline-block is-pulled-right"><input class="input" type="search" placeholder="Établissement"/><span class="icon is-small is-left"><i class="fas fa-search"></i></span></div><table class="table is-fullwidth is-hoverable"><thead><tr><th><abbr title="name">Nom</abbr></th><th><abbr title="city">Ville</abbr></th><th><abbr title="dept">Dpt</abbr></th><th><abbr title="moyenne">Moyenne</abbr></th><th><abbr title="selectivite">Sélectivité</abbr></th></tr></thead></table></main>', []),
-  name: 'school'
-};
-
-export { school as default };

javascript/line-graph.js

@@ -38,19 +38,19 @@ var lineGraph = {
       this.colors = ["#003F5C", "#2F4B7C", "#665191", "#A05195", "#D45087"];
       this.state.data = [{
         name: "P",
-        value: 100
+        value: 52
       }, {
         name: "AB",
-        value: 200
+        value: 43
       }, {
         name: "B",
-        value: 150
+        value: 2
       }, {
         name: "TB",
-        value: 50
+        value: 1
       }, {
         name: "TBF",
-        value: 50
+        value: 0
       }];
       let canvas = this.$("canvas");
       canvas.width = canvas.clientWidth;
@@ -58,7 +58,7 @@ var lineGraph = {
       this.updateCanvas();
     }
   },
-  template: (template, expressionTypes, bindingTypes, getComponent) => template('<div style="height: inherit;"><canvas style="height: 100%; width: 100%;"></canvas></div>', []),
+  template: (template, expressionTypes, bindingTypes, getComponent) => template('<div style="height: inherit; width: inherit; padding: inherit; margin: inherit;"><canvas style="height: 100%; width: 100%;"></canvas></div>', []),
   name: 'line-graph'
 };
 

javascript/school-info.js

@@ -2,10 +2,37 @@ var schoolInfo = {
   css: null,
   exports: {
     onMounted() {
-      console.log("Test!");
+      this.state.enabled = true;
+      this.update();
+    },
+    closeWindow() {
+      this.state.enabled = false;
+      this.update();
     }
   },
-  template: (template, expressionTypes, bindingTypes, getComponent) => template('<div><div></div></div>', []),
+  template: (template, expressionTypes, bindingTypes, getComponent) => template('<div expr33="expr33" style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: #000000DD;"></div>', [{
+    type: bindingTypes.IF,
+    evaluate: _scope => _scope.state.enabled,
+    redundantAttribute: 'expr33',
+    selector: '[expr33]',
+    template: template('<div style="position: absolute; top: 10%; left: 10%; width: 80%; height: 80%; background: #FFFFFF"><button expr34="expr34">X</button><p><h2></h2></p><line-graph expr35="expr35" style="height: 90px; margin: 10px;"></line-graph></div>', [{
+      redundantAttribute: 'expr34',
+      selector: '[expr34]',
+      expressions: [{
+        type: expressionTypes.EVENT,
+        name: 'onclick',
+        evaluate: _scope => _scope.closeWindow
+      }]
+    }, {
+      type: bindingTypes.TAG,
+      getComponent: getComponent,
+      evaluate: _scope => 'line-graph',
+      slots: [],
+      attributes: [],
+      redundantAttribute: 'expr35',
+      selector: '[expr35]'
+    }])
+  }]),
   name: 'school-info'
 };
 

javascript/search.js

@@ -114,9 +114,9 @@ var search = {
       }
     };
   },
-  template: (template, expressionTypes, bindingTypes, getComponent) => template('<label><input expr0="expr0" type="input"/><button expr1="expr1"><</button><div id="list-formations"><ul><li expr2="expr2"></li></ul></div></label>', [{
-    redundantAttribute: 'expr0',
-    selector: '[expr0]',
+  template: (template, expressionTypes, bindingTypes, getComponent) => template('<div class="box p-1 m-2"><div class="columns m-1"><input expr674="expr674" class="input" type="input"/><button expr675="expr675" class="button ml-1">&lt;</button></div><div id="list-formations"><ul><li expr676="expr676" class="m-1"></li></ul></div></div>', [{
+    redundantAttribute: 'expr674',
+    selector: '[expr674]',
     expressions: [{
       type: expressionTypes.EVENT,
       name: 'onkeydown',
@@ -127,8 +127,8 @@ var search = {
       evaluate: _scope => _scope.state.placeholder
     }]
   }, {
-    redundantAttribute: 'expr1',
-    selector: '[expr1]',
+    redundantAttribute: 'expr675',
+    selector: '[expr675]',
     expressions: [{
       type: expressionTypes.EVENT,
       name: 'onclick',
@@ -138,29 +138,33 @@ var search = {
     type: bindingTypes.EACH,
     getKey: null,
     condition: null,
-    template: template('<span expr3="expr3"> </span><span expr4="expr4"> </span>', [{
-      redundantAttribute: 'expr3',
-      selector: '[expr3]',
+    template: template('<button expr677="expr677" class="button is-fullwidth"><span><strong expr678="expr678"> </strong></span><div style="margin-left: auto;"></div><span expr679="expr679" class="tag is-primary"> </span></button>', [{
+      redundantAttribute: 'expr677',
+      selector: '[expr677]',
       expressions: [{
-        type: expressionTypes.TEXT,
-        childNodeIndex: 0,
-        evaluate: _scope => _scope.item.name
-      }, {
         type: expressionTypes.EVENT,
         name: 'onclick',
         evaluate: _scope => () => _scope.filter(_scope.item.name)
       }]
     }, {
-      redundantAttribute: 'expr4',
-      selector: '[expr4]',
+      redundantAttribute: 'expr678',
+      selector: '[expr678]',
+      expressions: [{
+        type: expressionTypes.TEXT,
+        childNodeIndex: 0,
+        evaluate: _scope => _scope.item.name
+      }]
+    }, {
+      redundantAttribute: 'expr679',
+      selector: '[expr679]',
       expressions: [{
         type: expressionTypes.TEXT,
         childNodeIndex: 0,
         evaluate: _scope => _scope.item.count
       }]
     }]),
-    redundantAttribute: 'expr2',
-    selector: '[expr2]',
+    redundantAttribute: 'expr676',
+    selector: '[expr676]',
     itemName: 'item',
     indexName: null,
     evaluate: _scope => _scope.state.items