fuelux.tree-sampledata.js 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  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. 'pictures' : {name: 'Pictures', type: 'folder', 'icon-class':'red'} ,
  89. 'music' : {name: 'Music', type: 'folder', 'icon-class':'orange'} ,
  90. 'video' : {name: 'Video', type: 'folder', 'icon-class':'blue'} ,
  91. 'documents' : {name: 'Documents', type: 'folder', 'icon-class':'green'} ,
  92. 'backup' : {name: 'Backup', type: 'folder'} ,
  93. 'readme' : {name: '<i class="icon-file-text grey"></i> ReadMe.txt', type: 'item'},
  94. 'manual' : {name: '<i class="icon-book blue"></i> Manual.html', type: 'item'}
  95. }
  96. tree_data_2['music']['additionalParameters'] = {
  97. 'children' : [
  98. {name: '<i class="icon-music blue"></i> song1.ogg', type: 'item'},
  99. {name: '<i class="icon-music blue"></i> song2.ogg', type: 'item'},
  100. {name: '<i class="icon-music blue"></i> song3.ogg', type: 'item'},
  101. {name: '<i class="icon-music blue"></i> song4.ogg', type: 'item'},
  102. {name: '<i class="icon-music blue"></i> song5.ogg', type: 'item'}
  103. ]
  104. }
  105. tree_data_2['video']['additionalParameters'] = {
  106. 'children' : [
  107. {name: '<i class="icon-film blue"></i> movie1.avi', type: 'item'},
  108. {name: '<i class="icon-film blue"></i> movie2.avi', type: 'item'},
  109. {name: '<i class="icon-film blue"></i> movie3.avi', type: 'item'},
  110. {name: '<i class="icon-film blue"></i> movie4.avi', type: 'item'},
  111. {name: '<i class="icon-film blue"></i> movie5.avi', type: 'item'}
  112. ]
  113. }
  114. tree_data_2['pictures']['additionalParameters'] = {
  115. 'children' : {
  116. 'wallpapers' : {name: 'Wallpapers', type: 'folder', 'icon-class':'pink'},
  117. 'camera' : {name: 'Camera', type: 'folder', 'icon-class':'pink'}
  118. }
  119. }
  120. tree_data_2['pictures']['additionalParameters']['children']['wallpapers']['additionalParameters'] = {
  121. 'children' : [
  122. {name: '<i class="icon-picture green"></i> wallpaper1.jpg', type: 'item'},
  123. {name: '<i class="icon-picture green"></i> wallpaper2.jpg', type: 'item'},
  124. {name: '<i class="icon-picture green"></i> wallpaper3.jpg', type: 'item'},
  125. {name: '<i class="icon-picture green"></i> wallpaper4.jpg', type: 'item'}
  126. ]
  127. }
  128. tree_data_2['pictures']['additionalParameters']['children']['camera']['additionalParameters'] = {
  129. 'children' : [
  130. {name: '<i class="icon-picture green"></i> photo1.jpg', type: 'item'},
  131. {name: '<i class="icon-picture green"></i> photo2.jpg', type: 'item'},
  132. {name: '<i class="icon-picture green"></i> photo3.jpg', type: 'item'},
  133. {name: '<i class="icon-picture green"></i> photo4.jpg', type: 'item'},
  134. {name: '<i class="icon-picture green"></i> photo5.jpg', type: 'item'},
  135. {name: '<i class="icon-picture green"></i> photo6.jpg', type: 'item'}
  136. ]
  137. }
  138. tree_data_2['documents']['additionalParameters'] = {
  139. 'children' : [
  140. {name: '<i class="icon-file-text red"></i> document1.pdf', type: 'item'},
  141. {name: '<i class="icon-file-text grey"></i> document2.doc', type: 'item'},
  142. {name: '<i class="icon-file-text grey"></i> document3.doc', type: 'item'},
  143. {name: '<i class="icon-file-text red"></i> document4.pdf', type: 'item'},
  144. {name: '<i class="icon-file-text grey"></i> document5.doc', type: 'item'}
  145. ]
  146. }
  147. tree_data_2['backup']['additionalParameters'] = {
  148. 'children' : [
  149. {name: '<i class="icon-archive brown"></i> backup1.zip', type: 'item'},
  150. {name: '<i class="icon-archive brown"></i> backup2.zip', type: 'item'},
  151. {name: '<i class="icon-archive brown"></i> backup3.zip', type: 'item'},
  152. {name: '<i class="icon-archive brown"></i> backup4.zip', type: 'item'}
  153. ]
  154. }
  155. var treeDataSource2 = new DataSourceTree({data: tree_data_2});