monConnecteur.litFichierComm('../WebTest/web_tres_simple_avec_2Fact.comm')
myTreeDico=monConnecteur.getDicoObjetsCompletsPourTree(monConnecteur.monEditeur.tree.racine)
+ myFancyTreeDico=monConnecteur.getDicoForFancy(monConnecteur.monEditeur.tree.racine)
myTreeJS=json.dumps([myTreeDico])
+ myFancyTreeJS=json.dumps([myFancyTreeDico])
+
# myNewTreeDico=OrderedDict([('text', 'MonProc2'), ('nodes', OrderedDict([('text', 'MonProc22'), ('nodes', [{'text': 'param1 1.0'}, [OrderedDict([('text', 'Fact1'), ('nodes', [{'text': 'param3 43.0'}])]), OrderedDict([('text', 'Fact1'), ('nodes', [{'text': 'param3 44.0'}])])]])]))])
# myNewTreeJS=json.dumps([myNewTreeDico])
print("---- myTreeDico : ")
print("---- tree4Fancy : ", tree4Fancy)
# print("---- myNewTreeDico : ", myNewTreeDico)
# print("---- myNewTreeJS : ", myNewTreeJS)
+ print("---- myFancyTreeDico : ", myFancyTreeDico)
+ print("---- myFancyTreeJS : ", myFancyTreeJS)
return render_template('commandes_2.html',
titre=code,
profondeur=4,
mcTraite={'MonProc2': {'s1': ('I', 2), 'F2': {'s2': ('I', 3), 'F3': {'s3': ('I', 4)}}}},
mcTraiteJson=json.dumps(mcTraite),
- tree=tree4Fancy,
+ tree=myFancyTreeJS,
+ # tree=tree4Fancy,
# tree=myTreeJS
# tree='['+myTreeJS+']'
)
</div>
- <script>
+ <!-- <style type="text/css"> -->
+ <!-- #treetable { -->
+ <!-- table-layout: fixed; -->
+ <!-- } -->
+ <!-- #treetable tr td:nth-of-type(1) { -->
+ <!-- text-align: right; -->
+ <!-- } -->
+ <!-- #treetable tr td:nth-of-type(2) { -->
+ <!-- text-align: center; -->
+ <!-- } -->
+ <!-- #treetable tr td:nth-of-type(3) { -->
+ <!-- min-width: 100px; -->
+ <!-- white-space: nowrap; -->
+ <!-- overflow: hidden; -->
+ <!-- text-overflow: ellipsis; -->
+ <!-- } -->
+ <!-- </style> -->
+ <script>
function getTree1() {
// Some logic to retrieve, or generate tree structure
return {{ mcTraiteJson|tojson }};
}
-<!-- $("#tree1").fancytree({ source: [ {title: "Node 1", key: "1"},{title: "Folder 2", key: "2", folder: true, children: [ {title: "Node 2.1", key: "3"},{title: "Node 2.2", key: "4"} ]} ], }) -->
+<!-- $('#tree1').treeview({ data: getTree1() }) -->
+
+<!-- $("#tree1").fancytree({ source: [ {title: "Node 1", key: "1000"},{title: "Folder 2", key: "2", folder: true, children: [ {title: "Node 2.1", key: "3000"},{title: "Node 2.2", key: "44"} ]} ], }) -->
+
+<!-- $("#tree1").fancytree({ source: JSON.parse(getTree1()), }) -->
-$("#tree10").fancytree({ source: JSON.parse(getTree1()), })
+
+ var glyph_opts = {
+ preset: "bootstrap3",
+ map: {
+ }
+ };
+
+ $(function(){
+ $("#tree1").fancytree({
+ extensions: ["dnd5", "edit", "glyph", "wide"],
+ checkbox: true,
+ selectMode: 3,
+ dnd5: {
+ dragStart: function(node, data) { return true; },
+ dragEnter: function(node, data) { return true; },
+ dragDrop: function(node, data) { data.otherNode.copyTo(node, data.hitMode); }
+ },
+ glyph: glyph_opts,
+ source: JSON.parse(getTree1()),
+ //wide: {
+ // iconWidth: "1em", // Adjust this if @fancy-icon-width != "16px"
+ // iconSpacing: "0.5em", // Adjust this if @fancy-icon-spacing != "3px"
+ // labelSpacing: "0.1em", // Adjust this if padding between icon and label != "3px"
+ // levelOfs: "1.5em" // Adjust this if ul padding != "16px"
+ //},
+ icon: function(event, data){
+ if( data.node.isFolder() ) {
+ return "glyphicon glyphicon-book";
+ }
+ },
+ //lazyLoad: function(event, data) {
+ // data.result = {url: "ajax-sub2.json", debugDelay: 1000};
+ //}
+ });
+ });
<!-- var $searchableTree = $('#tree1').treeview({ -->
<!-- data: getTree1() -->