tibo
5 years ago
1 changed files with 136 additions and 0 deletions
Unified View
Diff Options
-
+136 -0index.html
+ 136
- 0
index.html
View File
| @ -0,0 +1,136 @@ | |||||
| <!DOCTYPE html> | |||||
| <html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr"> | |||||
| <head> | |||||
| <meta charset="utf-8" /> | |||||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||||
| <title>SMETI store ITEMS</title> | |||||
| <link rel="stylesheet" href="css/carets.css"> | |||||
| <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> | |||||
| </head> | |||||
| <body> | |||||
| <h2>SMETI store ITEMS</h2> | |||||
| <ul class="ul_no_list" id="smeti_list"></ul> | |||||
| <script> | |||||
| /* | |||||
| * A récuperer en JSON | |||||
| */ | |||||
| var liste_instructions = null; | |||||
| /* | |||||
| * Créer la hierarchie | |||||
| */ | |||||
| function setHierarchy() { | |||||
| liste_instructions.forEach(function(element1){ | |||||
| liste_instructions.forEach(function(element2){ | |||||
| if (element1.parent == element2.id) | |||||
| { | |||||
| element1.parent_code = element2.code; | |||||
| return false; | |||||
| } | |||||
| }); | |||||
| }); | |||||
| } | |||||
| function afficherArbre() | |||||
| { | |||||
| var heritage = [ 'XXX' ]; | |||||
| var m14_ul = [ document.getElementById('smeti_list') ]; | |||||
| var m14_span = [ null ]; | |||||
| while(m14_ul[0].firstChild) m14_ul[0].removeChild(m14_ul[0].firstChild); | |||||
| liste_instructions.forEach(function(element){ | |||||
| // if (element.instruction != 'M14') return true; | |||||
| // if (element.type != courant) return true; | |||||
| var letexte = ''; | |||||
| var li = document.createElement('li'); | |||||
| var span = document.createElement('span'); | |||||
| var ul = document.createElement('ul'); | |||||
| var len = heritage.length; | |||||
| while(len-- > 1) { | |||||
| if (element.parent_code == heritage[len]) | |||||
| break; | |||||
| heritage.pop(); | |||||
| m14_ul.pop(); | |||||
| m14_span.pop(); | |||||
| } | |||||
| span.setAttribute('class','caret_gris'); | |||||
| letexte += ' { '+element.id + ' } '; | |||||
| letexte += '[ '+element.code + ' ]' | |||||
| letexte += ' - '; | |||||
| letexte += element.libelle | |||||
| span.appendChild(document.createTextNode(letexte)); | |||||
| if (element.link == 1) span.setAttribute('style','color:grey'); | |||||
| li.appendChild(span); | |||||
| ul.setAttribute('class','nested ul_no_list'); | |||||
| li.appendChild(ul); | |||||
| m14_ul[m14_ul.length-1].appendChild(li); | |||||
| if (m14_span.length > 1) | |||||
| m14_span[m14_span.length-1].setAttribute('class','caret'); | |||||
| m14_ul.push(ul); | |||||
| m14_span.push(span); | |||||
| heritage.push(element.code); | |||||
| }); | |||||
| var toggler = document.getElementsByClassName("caret"); | |||||
| for (var i = 0; i < toggler.length; i++) { | |||||
| toggler[i].addEventListener("click", function() { | |||||
| this.parentElement.querySelector(".nested").classList.toggle("active"); | |||||
| this.classList.toggle("caret-down"); | |||||
| }); | |||||
| } | |||||
| } | |||||
| $( document ).ready(function() { | |||||
| $.getJSON( "api/get.php", function( data ) { | |||||
| liste_instructions = data; | |||||
| liste_instructions.forEach(function(element){ | |||||
| element.instruction = 'M14'; | |||||
| element.type = 'Chapitre'; | |||||
| element.exercice = 2019; | |||||
| element.libelle = element.name; | |||||
| }); | |||||
| liste_instructions.sort(function(a, b) { | |||||
| if (a.path < b.path) return -1; | |||||
| if (a.path > b.path) return 1; | |||||
| if (a.instruction < b.instruction) return -1; | |||||
| if (a.instruction > b.instruction) return 1; | |||||
| if (a.exercice < b.exercice) return -1; | |||||
| if (a.exercice > b.exercice) return 1; | |||||
| if (a.type < b.type) return -1; | |||||
| if (a.type > b.type) return 1; | |||||
| if (a.parent < b.parent) return -1; | |||||
| if (a.parent > b.parent) return 1; | |||||
| if (a.code < b.code) return -1; | |||||
| if (a.code > b.code) return 1; | |||||
| return 0; | |||||
| }); | |||||
| setHierarchy(); | |||||
| afficherArbre(); | |||||
| }); | |||||
| }); | |||||
| </script> | |||||
| </body> | |||||
| </html> | |||||