Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 1 | espaco | 1 | var UITree = function () { |
| 2 | |||
| 3 | var handleSample1 = function () { |
||
| 4 | |||
| 5 | $('#tree_1').jstree({ |
||
| 6 | "core" : { |
||
| 7 | "themes" : { |
||
| 8 | "responsive": false |
||
| 9 | } |
||
| 10 | }, |
||
| 11 | "types" : { |
||
| 12 | "default" : { |
||
| 13 | "icon" : "fa fa-folder icon-state-warning icon-lg" |
||
| 14 | }, |
||
| 15 | "file" : { |
||
| 16 | "icon" : "fa fa-file icon-state-warning icon-lg" |
||
| 17 | } |
||
| 18 | }, |
||
| 19 | "plugins": ["types"] |
||
| 20 | }); |
||
| 21 | |||
| 22 | // handle link clicks in tree nodes(support target="_blank" as well) |
||
| 23 | $('#tree_1').on('select_node.jstree', function(e,data) { |
||
| 24 | var link = $('#' + data.selected).find('a'); |
||
| 25 | if (link.attr("href") != "#" && link.attr("href") != "javascript:;" && link.attr("href") != "") { |
||
| 26 | if (link.attr("target") == "_blank") { |
||
| 27 | link.attr("href").target = "_blank"; |
||
| 28 | } |
||
| 29 | document.location.href = link.attr("href"); |
||
| 30 | return false; |
||
| 31 | } |
||
| 32 | }); |
||
| 33 | } |
||
| 34 | |||
| 35 | var handleSample2 = function () { |
||
| 36 | $('#tree_2').jstree({ |
||
| 37 | 'plugins': ["wholerow", "checkbox", "types"], |
||
| 38 | 'core': { |
||
| 39 | "themes" : { |
||
| 40 | "responsive": false |
||
| 41 | }, |
||
| 42 | 'data': [{ |
||
| 43 | "text": "Same but with checkboxes", |
||
| 44 | "children": [{ |
||
| 45 | "text": "initially selected", |
||
| 46 | "state": { |
||
| 47 | "selected": true |
||
| 48 | } |
||
| 49 | }, { |
||
| 50 | "text": "custom icon", |
||
| 51 | "icon": "fa fa-warning icon-state-danger" |
||
| 52 | }, { |
||
| 53 | "text": "initially open", |
||
| 54 | "icon" : "fa fa-folder icon-state-default", |
||
| 55 | "state": { |
||
| 56 | "opened": true |
||
| 57 | }, |
||
| 58 | "children": ["Another node"] |
||
| 59 | }, { |
||
| 60 | "text": "custom icon", |
||
| 61 | "icon": "fa fa-warning icon-state-warning" |
||
| 62 | }, { |
||
| 63 | "text": "disabled node", |
||
| 64 | "icon": "fa fa-check icon-state-success", |
||
| 65 | "state": { |
||
| 66 | "disabled": true |
||
| 67 | } |
||
| 68 | }] |
||
| 69 | }, |
||
| 70 | "And wholerow selection" |
||
| 71 | ] |
||
| 72 | }, |
||
| 73 | "types" : { |
||
| 74 | "default" : { |
||
| 75 | "icon" : "fa fa-folder icon-state-warning icon-lg" |
||
| 76 | }, |
||
| 77 | "file" : { |
||
| 78 | "icon" : "fa fa-file icon-state-warning icon-lg" |
||
| 79 | } |
||
| 80 | } |
||
| 81 | }); |
||
| 82 | } |
||
| 83 | |||
| 84 | var contextualMenuSample = function() { |
||
| 85 | |||
| 86 | $("#tree_3").jstree({ |
||
| 87 | "core" : { |
||
| 88 | "themes" : { |
||
| 89 | "responsive": false |
||
| 90 | }, |
||
| 91 | // so that create works |
||
| 92 | "check_callback" : true, |
||
| 93 | 'data': [{ |
||
| 94 | "text": "Parent Node", |
||
| 95 | "children": [{ |
||
| 96 | "text": "Initially selected", |
||
| 97 | "state": { |
||
| 98 | "selected": true |
||
| 99 | } |
||
| 100 | }, { |
||
| 101 | "text": "Custom Icon", |
||
| 102 | "icon": "fa fa-warning icon-state-danger" |
||
| 103 | }, { |
||
| 104 | "text": "Initially open", |
||
| 105 | "icon" : "fa fa-folder icon-state-success", |
||
| 106 | "state": { |
||
| 107 | "opened": true |
||
| 108 | }, |
||
| 109 | "children": [ |
||
| 110 | {"text": "Another node", "icon" : "fa fa-file icon-state-warning"} |
||
| 111 | ] |
||
| 112 | }, { |
||
| 113 | "text": "Another Custom Icon", |
||
| 114 | "icon": "fa fa-warning icon-state-warning" |
||
| 115 | }, { |
||
| 116 | "text": "Disabled Node", |
||
| 117 | "icon": "fa fa-check icon-state-success", |
||
| 118 | "state": { |
||
| 119 | "disabled": true |
||
| 120 | } |
||
| 121 | }, { |
||
| 122 | "text": "Sub Nodes", |
||
| 123 | "icon": "fa fa-folder icon-state-danger", |
||
| 124 | "children": [ |
||
| 125 | {"text": "Item 1", "icon" : "fa fa-file icon-state-warning"}, |
||
| 126 | {"text": "Item 2", "icon" : "fa fa-file icon-state-success"}, |
||
| 127 | {"text": "Item 3", "icon" : "fa fa-file icon-state-default"}, |
||
| 128 | {"text": "Item 4", "icon" : "fa fa-file icon-state-danger"}, |
||
| 129 | {"text": "Item 5", "icon" : "fa fa-file icon-state-info"} |
||
| 130 | ] |
||
| 131 | }] |
||
| 132 | }, |
||
| 133 | "Another Node" |
||
| 134 | ] |
||
| 135 | }, |
||
| 136 | "types" : { |
||
| 137 | "default" : { |
||
| 138 | "icon" : "fa fa-folder icon-state-warning icon-lg" |
||
| 139 | }, |
||
| 140 | "file" : { |
||
| 141 | "icon" : "fa fa-file icon-state-warning icon-lg" |
||
| 142 | } |
||
| 143 | }, |
||
| 144 | "state" : { "key" : "demo2" }, |
||
| 145 | "plugins" : [ "contextmenu", "dnd", "state", "types" ] |
||
| 146 | }); |
||
| 147 | |||
| 148 | } |
||
| 149 | |||
| 150 | var ajaxTreeSample = function() { |
||
| 151 | |||
| 152 | $("#tree_4").jstree({ |
||
| 153 | "core" : { |
||
| 154 | "themes" : { |
||
| 155 | "responsive": false |
||
| 156 | }, |
||
| 157 | // so that create works |
||
| 158 | "check_callback" : true, |
||
| 159 | 'data' : { |
||
| 160 | 'url' : function (node) { |
||
| 161 | return 'demo/jstree_ajax_data.php'; |
||
| 162 | }, |
||
| 163 | 'data' : function (node) { |
||
| 164 | return { 'parent' : node.id }; |
||
| 165 | } |
||
| 166 | } |
||
| 167 | }, |
||
| 168 | "types" : { |
||
| 169 | "default" : { |
||
| 170 | "icon" : "fa fa-folder icon-state-warning icon-lg" |
||
| 171 | }, |
||
| 172 | "file" : { |
||
| 173 | "icon" : "fa fa-file icon-state-warning icon-lg" |
||
| 174 | } |
||
| 175 | }, |
||
| 176 | "state" : { "key" : "demo3" }, |
||
| 177 | "plugins" : [ "dnd", "state", "types" ] |
||
| 178 | }); |
||
| 179 | |||
| 180 | } |
||
| 181 | |||
| 182 | |||
| 183 | return { |
||
| 184 | //main function to initiate the module |
||
| 185 | init: function () { |
||
| 186 | |||
| 187 | handleSample1(); |
||
| 188 | handleSample2(); |
||
| 189 | contextualMenuSample(); |
||
| 190 | ajaxTreeSample(); |
||
| 191 | |||
| 192 | } |
||
| 193 | |||
| 194 | }; |
||
| 195 | |||
| 196 | }(); |