fuelux.tree-sampledata.js 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. var DataSourceTree = function(options) {
  2. this._data = options.data;
  3. this._delay = options.delay;
  4. }
  5. DataSourceTree.prototype.data = function(options, callback) {
  6. var self = this;
  7. var $data = null;
  8. if(!("name" in options) && !("type" in options)){
  9. $data = this._data;//the root tree
  10. callback({ data: $data });
  11. return;
  12. }
  13. else if("type" in options && options.type == "folder") {
  14. if("additionalParameters" in options && "children" in options.additionalParameters)
  15. $data = options.additionalParameters.children;
  16. else $data = {}//no data
  17. }
  18. if($data != null)//this setTimeout is only for mimicking some random delay
  19. setTimeout(function(){callback({ data: $data });} , parseInt(Math.random() * 500) + 200);
  20. //we have used static data here
  21. //but you can retrieve your data dynamically from a server using ajax call
  22. //checkout examples/treeview.html and examples/treeview.js for more info
  23. };
  24. var tree_data = {
  25. 'for-sale' : {name: 'For Sale', type: 'folder'} ,
  26. 'vehicles' : {name: 'Vehicles', type: 'folder'} ,
  27. 'rentals' : {name: 'Rentals', type: 'folder'} ,
  28. 'real-estate' : {name: 'Real Estate', type: 'folder'} ,
  29. 'pets' : {name: 'Pets', type: 'folder'} ,
  30. 'tickets' : {name: 'Tickets', type: 'item'} ,
  31. 'services' : {name: 'Services', type: 'item'} ,
  32. 'personals' : {name: 'Personals', type: 'item'}
  33. }
  34. tree_data['for-sale']['additionalParameters'] = {
  35. 'children' : {
  36. 'appliances' : {name: 'Appliances', type: 'item'},
  37. 'arts-crafts' : {name: 'Arts & Crafts', type: 'item'},
  38. 'clothing' : {name: 'Clothing', type: 'item'},
  39. 'computers' : {name: 'Computers', type: 'item'},
  40. 'jewelry' : {name: 'Jewelry', type: 'item'},
  41. 'office-business' : {name: 'Office & Business', type: 'item'},
  42. 'sports-fitness' : {name: 'Sports & Fitness', type: 'item'}
  43. }
  44. }
  45. tree_data['vehicles']['additionalParameters'] = {
  46. 'children' : {
  47. 'cars' : {name: 'Cars', type: 'folder'},
  48. 'motorcycles' : {name: 'Motorcycles', type: 'item'},
  49. 'boats' : {name: 'Boats', type: 'item'}
  50. }
  51. }
  52. tree_data['vehicles']['additionalParameters']['children']['cars']['additionalParameters'] = {
  53. 'children' : {
  54. 'classics' : {name: 'Classics', type: 'item'},
  55. 'convertibles' : {name: 'Convertibles', type: 'item'},
  56. 'coupes' : {name: 'Coupes', type: 'item'},
  57. 'hatchbacks' : {name: 'Hatchbacks', type: 'item'},
  58. 'hybrids' : {name: 'Hybrids', type: 'item'},
  59. 'suvs' : {name: 'SUVs', type: 'item'},
  60. 'sedans' : {name: 'Sedans', type: 'item'},
  61. 'trucks' : {name: 'Trucks', type: 'item'}
  62. }
  63. }
  64. tree_data['rentals']['additionalParameters'] = {
  65. 'children' : {
  66. 'apartments-rentals' : {name: 'Apartments', type: 'item'},
  67. 'office-space-rentals' : {name: 'Office Space', type: 'item'},
  68. 'vacation-rentals' : {name: 'Vacation Rentals', type: 'item'}
  69. }
  70. }
  71. tree_data['real-estate']['additionalParameters'] = {
  72. 'children' : {
  73. 'apartments' : {name: 'Apartments', type: 'item'},
  74. 'villas' : {name: 'Villas', type: 'item'},
  75. 'plots' : {name: 'Plots', type: 'item'}
  76. }
  77. }
  78. tree_data['pets']['additionalParameters'] = {
  79. 'children' : {
  80. 'cats' : {name: 'Cats', type: 'item'},
  81. 'dogs' : {name: 'Dogs', type: 'item'},
  82. 'horses' : {name: 'Horses', type: 'item'},
  83. 'reptiles' : {name: 'Reptiles', type: 'item'}
  84. }
  85. }
  86. var treeDataSource = new DataSourceTree({data: tree_data});
  87. var tree_data_2 = {
  88. '1' : {name: '水果蔬菜', type: 'folder', 'icon-class':'orange'} ,
  89. '2' : {name: '大家电', type: 'folder', 'icon-class':'orange'} ,
  90. '3' : {name: '小电器', type: 'folder', 'icon-class':'orange'} ,
  91. '4' : {name: '手机数码', type: 'folder', 'icon-class':'orange'} ,
  92. '5' : {name: '服装鞋帽', type: 'folder', 'icon-class':'orange'} ,
  93. '6' : {name: '粮油副食', type: 'folder', 'icon-class':'orange'} ,
  94. '7' : {name: '零食', type: 'folder', 'icon-class':'orange'} ,
  95. '8' : {name: '卫浴', type: 'folder', 'icon-class':'orange'} ,
  96. '9' : {name: '厨房用具', type: 'orange'} ,
  97. }
  98. tree_data_2['1']['additionalParameters'] = {
  99. 'children' : [
  100. {name: '<a href=""><i class="icon-file-text blue"></i>苹果</a>', type: 'item'},
  101. {name: '<i class="icon-file-text blue"></i> song2.ogg', type: 'item'},
  102. {name: '<i class="icon-file-text blue"></i> song3.ogg', type: 'item'},
  103. {name: '<i class="icon-file-text blue"></i> song4.ogg', type: 'item'},
  104. {name: '<i class="icon-file-text blue"></i> song5.ogg', type: 'item'}
  105. ]
  106. }
  107. tree_data_2['2']['additionalParameters'] = {
  108. 'children' : [
  109. {name: '<i class="icon-file-text blue"></i> movie1.avi', type: 'item'},
  110. {name: '<i class="icon-file-text blue"></i> movie2.avi', type: 'item'},
  111. {name: '<i class="icon-file-text blue"></i> movie3.avi', type: 'item'},
  112. {name: '<i class="icon-file-text blue"></i> movie4.avi', type: 'item'},
  113. {name: '<i class="icon-file-text blue"></i> movie5.avi', type: 'item'}
  114. ]
  115. }
  116. tree_data_2['3']['additionalParameters'] = {
  117. 'children' : {
  118. 'wallpapers' : {name: 'Wallpapers', type: 'folder', 'icon-class':'pink'},
  119. 'camera' : {name: 'Camera', type: 'folder', 'icon-class':'pink'}
  120. }
  121. }
  122. tree_data_2['3']['additionalParameters']['children']['wallpapers']['additionalParameters'] = {
  123. 'children' : [
  124. {name: '<i class="icon-file-text green"></i> wallpaper1.jpg', type: 'item'},
  125. {name: '<i class="icon-file-text green"></i> wallpaper2.jpg', type: 'item'},
  126. {name: '<i class="icon-file-text green"></i> wallpaper3.jpg', type: 'item'},
  127. {name: '<i class="icon-file-text green"></i> wallpaper4.jpg', type: 'item'}
  128. ]
  129. }
  130. tree_data_2['3']['additionalParameters']['children']['camera']['additionalParameters'] = {
  131. 'children' : [
  132. {name: '<i class="icon-file-text green"></i> photo1.jpg', type: 'item'},
  133. {name: '<i class="icon-file-text green"></i> photo2.jpg', type: 'item'},
  134. {name: '<i class="icon-file-text green"></i> photo3.jpg', type: 'item'},
  135. {name: '<i class="icon-file-text green"></i> photo4.jpg', type: 'item'},
  136. {name: '<i class="icon-file-text green"></i> photo5.jpg', type: 'item'},
  137. {name: '<i class="icon-file-text green"></i> photo6.jpg', type: 'item'}
  138. ]
  139. }
  140. tree_data_2['4']['additionalParameters'] = {
  141. 'children' : [
  142. {name: '<i class="icon-file-text red"></i> document1.pdf', type: 'item'},
  143. {name: '<i class="icon-file-text grey"></i> document2.doc', type: 'item'},
  144. {name: '<i class="icon-file-text grey"></i> document3.doc', type: 'item'},
  145. {name: '<i class="icon-file-text red"></i> document4.pdf', type: 'item'},
  146. {name: '<i class="icon-file-text grey"></i> document5.doc', type: 'item'}
  147. ]
  148. }
  149. tree_data_2['5']['additionalParameters'] = {
  150. 'children' : [
  151. {name: '<i class="icon-file-text brown"></i> backup1.zip', type: 'item'},
  152. {name: '<i class="icon-file-text brown"></i> backup2.zip', type: 'item'},
  153. {name: '<i class="icon-file-text brown"></i> backup3.zip', type: 'item'},
  154. {name: '<i class="icon-file-text brown"></i> backup4.zip', type: 'item'}
  155. ]
  156. }
  157. var treeDataSource2 = new DataSourceTree({data: tree_data_2});