jquery.hdfstree.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. // Licensed to Cloudera, Inc. under one
  2. // or more contributor license agreements. See the NOTICE file
  3. // distributed with this work for additional information
  4. // regarding copyright ownership. Cloudera, Inc. licenses this file
  5. // to you under the Apache License, Version 2.0 (the
  6. // "License"); you may not use this file except in compliance
  7. // with the License. You may obtain a copy of the License at
  8. //
  9. // http://www.apache.org/licenses/LICENSE-2.0
  10. //
  11. // Unless required by applicable law or agreed to in writing, software
  12. // distributed under the License is distributed on an "AS IS" BASIS,
  13. // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14. // See the License for the specific language governing permissions and
  15. // limitations under the License.
  16. /*
  17. * jHue HDFS tree plugin
  18. * shows a tree HDFS picker, if home is set it pre-populates the path
  19. * use attached to an element, ie:
  20. * $("#el").jHueHdfsTree({
  21. * home: "/user",
  22. * onPathChange: function (path) {
  23. * console.log(path);
  24. * }
  25. * });
  26. */
  27. (function ($, window, document, undefined) {
  28. var pluginName = "jHueHdfsTree",
  29. defaults = {
  30. home: "/",
  31. onPathChange: function () {
  32. }
  33. };
  34. function Plugin(element, options) {
  35. this.element = element;
  36. this.options = $.extend({}, defaults, options);
  37. this._defaults = defaults;
  38. this._name = pluginName;
  39. this.init();
  40. }
  41. Plugin.prototype.init = function () {
  42. var _this = this;
  43. var _el = $(_this.element);
  44. _el.empty();
  45. _el.addClass("jHueHdfsTree");
  46. var _tree = $("<ul>").addClass("content unstyled").html('<li><a class="pointer"><i class="fa fa-folder-open-o"></i> /</a></li>');
  47. _tree.appendTo(_el);
  48. _tree.find("a").on("click", function () {
  49. _this.options.onPathChange("/");
  50. _tree.find("a").removeClass("selected");
  51. _tree.find("a:eq(0)").addClass("selected");
  52. });
  53. var _root = $("<ul>").addClass("content unstyled").attr("data-path", "").attr("data-loaded", "true");
  54. _root.appendTo(_tree.find("li"));
  55. var BASE_PATH = "/filebrowser/view";
  56. var _currentFiles = [];
  57. function showHdfsLeaf(options) {
  58. var autocompleteUrl = BASE_PATH;
  59. if (options.paths != null) {
  60. autocompleteUrl += options.paths.shift();
  61. }
  62. else {
  63. autocompleteUrl += (options.leaf != null ? options.leaf : "");
  64. }
  65. $.getJSON(autocompleteUrl + "?pagesize=1000&format=json", function (data) {
  66. _currentFiles = [];
  67. if (data.error == null) {
  68. if (options.leaf != null) {
  69. _el.find("[data-path='" + options.leaf + "']").attr("data-loaded", true);
  70. }
  71. $(data.files).each(function (cnt, item) {
  72. if (item.name != "." && item.name != ".." && item.type == "dir") {
  73. var _path = item.path;
  74. var _li = $("<li>").html('<a class="pointer"><i class="fa fa-folder-o"></i> ' + item.name + '</a><ul class="content unstyled" data-path="' + _path + '" data-loaded="false"></ul>');
  75. var _destination = _path.substr(0, _path.lastIndexOf("/"));
  76. _li.appendTo(_el.find("[data-path='" + _destination + "']"));
  77. _li.find("a").on("click", function () {
  78. _this.options.onPathChange(_path);
  79. _tree.find("a").removeClass("selected");
  80. _li.find("a:eq(0)").addClass("selected");
  81. if (_li.find(".content").attr("data-loaded") == "false") {
  82. _li.find(".fa-folder-o").removeClass("fa-folder-o").addClass("fa-folder-open-o");
  83. showHdfsLeaf({
  84. leaf: _path
  85. });
  86. }
  87. else {
  88. if (_li.find(".content").is(":visible")) {
  89. _li.find(".content").hide();
  90. }
  91. else {
  92. _li.find(".content").show();
  93. }
  94. }
  95. });
  96. }
  97. });
  98. if (options.paths.length > 0) {
  99. showHdfsLeaf({
  100. paths: options.paths
  101. });
  102. }
  103. }
  104. });
  105. }
  106. var _paths = [];
  107. if (_this.options.home != "/") {
  108. var _re = /\//g;
  109. while ((match = _re.exec(_this.options.home)) != null) {
  110. _paths.push(_this.options.home.substr(0, match.index));
  111. }
  112. _paths.push(_this.options.home);
  113. console.log(_paths)
  114. }
  115. showHdfsLeaf({
  116. paths: _paths
  117. });
  118. };
  119. Plugin.prototype.setOptions = function (options) {
  120. this.options = $.extend({}, defaults, options);
  121. };
  122. $.fn[pluginName] = function (options) {
  123. return this.each(function () {
  124. if (!$.data(this, 'plugin_' + pluginName)) {
  125. $.data(this, 'plugin_' + pluginName, new Plugin(this, options));
  126. }
  127. });
  128. }
  129. $[pluginName] = function (options) {
  130. if (typeof console != "undefined") {
  131. console.warn("$(elem).jHueHdfsTree() is a preferred call method.");
  132. }
  133. $(options.element).jHueHdfsTree(options);
  134. };
  135. })(jQuery, window, document);