explorer.js 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. /**
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing, software
  13. * distributed under the License is distributed on an "AS IS" BASIS,
  14. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15. * See the License for the specific language governing permissions and
  16. * limitations under the License.
  17. */
  18. (function() {
  19. "use strict";
  20. // The chunk size of tailing the files, i.e., how many bytes will be shown
  21. // in the preview.
  22. var TAIL_CHUNK_SIZE = 32768;
  23. var helpers = {
  24. 'helper_to_permission': function(chunk, ctx, bodies, params) {
  25. var p = ctx.current().permission;
  26. var dir = ctx.current().type == 'DIRECTORY' ? 'd' : '-';
  27. var symbols = [ '---', '--x', '-w-', '-wx', 'r--', 'r-x', 'rw-', 'rwx' ];
  28. var sticky = p > 1000;
  29. var res = "";
  30. for (var i = 0; i < 3; ++i) {
  31. res = symbols[(p % 10)] + res;
  32. p = Math.floor(p / 10);
  33. }
  34. if (sticky) {
  35. var otherExec = ((ctx.current().permission % 10) & 1) == 1;
  36. res = res.substr(0, res.length - 1) + (otherExec ? 't' : 'T');
  37. }
  38. chunk.write(dir + res);
  39. return chunk;
  40. }
  41. };
  42. var base = dust.makeBase(helpers);
  43. var current_directory = "";
  44. function show_err_msg(msg) {
  45. $('#alert-panel-body').html(msg);
  46. $('#alert-panel').show();
  47. }
  48. $(window).bind('hashchange', function () {
  49. $('#alert-panel').hide();
  50. var dir = window.location.hash.slice(1);
  51. if(dir == "") {
  52. dir = "/";
  53. }
  54. if(current_directory != dir) {
  55. browse_directory(dir);
  56. }
  57. });
  58. function network_error_handler(url) {
  59. return function (jqxhr, text, err) {
  60. var msg = '<p>Failed to retreive data from ' + url + ', cause: ' + err + '</p>';
  61. if (url.indexOf('/webhdfs/v1') === 0) {
  62. msg += '<p>WebHDFS might be disabled. WebHDFS is required to browse the filesystem.</p>';
  63. }
  64. show_err_msg(msg);
  65. };
  66. }
  67. function append_path(prefix, s) {
  68. var l = prefix.length;
  69. var p = l > 0 && prefix[l - 1] == '/' ? prefix.substring(0, l - 1) : prefix;
  70. return p + '/' + s;
  71. }
  72. function get_response(data, type) {
  73. return data[type] !== undefined ? data[type] : null;
  74. }
  75. function get_response_err_msg(data) {
  76. var msg = data.RemoteException !== undefined ? data.RemoteException.message : "";
  77. return msg;
  78. }
  79. function view_file_details(path, abs_path) {
  80. function show_block_info(blocks) {
  81. var menus = $('#file-info-blockinfo-list');
  82. menus.empty();
  83. menus.data("blocks", blocks);
  84. menus.change(function() {
  85. var d = $(this).data('blocks')[$(this).val()];
  86. if (d === undefined) {
  87. return;
  88. }
  89. dust.render('block-info', d, function(err, out) {
  90. $('#file-info-blockinfo-body').html(out);
  91. });
  92. });
  93. for (var i = 0; i < blocks.length; ++i) {
  94. var item = $('<option value="' + i + '">Block ' + i + '</option>');
  95. menus.append(item);
  96. }
  97. menus.change();
  98. }
  99. var url = '/webhdfs/v1' + abs_path + '?op=GET_BLOCK_LOCATIONS';
  100. $.ajax({"url": url, "crossDomain": true}).done(function(data) {
  101. var d = get_response(data, "LocatedBlocks");
  102. if (d === null) {
  103. show_err_msg(get_response_err_msg(data));
  104. return;
  105. }
  106. $('#file-info-tail').hide();
  107. $('#file-info-title').text("File information - " + path);
  108. var download_url = '/webhdfs/v1' + abs_path + '/?op=OPEN';
  109. $('#file-info-download').attr('href', download_url);
  110. $('#file-info-preview').click(function() {
  111. var offset = d.fileLength - TAIL_CHUNK_SIZE;
  112. var url = offset > 0 ? download_url + '&offset=' + offset : download_url;
  113. $.get(url, function(t) {
  114. $('#file-info-preview-body').val(t);
  115. $('#file-info-tail').show();
  116. }, "text").error(network_error_handler(url));
  117. });
  118. if (d.fileLength > 0) {
  119. show_block_info(d.locatedBlocks);
  120. $('#file-info-blockinfo-panel').show();
  121. } else {
  122. $('#file-info-blockinfo-panel').hide();
  123. }
  124. $('#file-info').modal();
  125. }).error(network_error_handler(url));
  126. }
  127. function browse_directory(dir) {
  128. var url = '/webhdfs/v1' + dir + '?op=LISTSTATUS';
  129. $.get(url, function(data) {
  130. var d = get_response(data, "FileStatuses");
  131. if (d === null) {
  132. show_err_msg(get_response_err_msg(data));
  133. return;
  134. }
  135. current_directory = dir;
  136. $('#directory').val(dir);
  137. window.location.hash = dir;
  138. dust.render('explorer', base.push(d), function(err, out) {
  139. $('#panel').html(out);
  140. $('.explorer-browse-links').click(function() {
  141. var type = $(this).attr('inode-type');
  142. var path = $(this).attr('inode-path');
  143. var abs_path = append_path(current_directory, path);
  144. if (type == 'DIRECTORY') {
  145. browse_directory(abs_path);
  146. } else {
  147. view_file_details(path, abs_path);
  148. }
  149. });
  150. });
  151. }).error(network_error_handler(url));
  152. }
  153. function init() {
  154. dust.loadSource(dust.compile($('#tmpl-explorer').html(), 'explorer'));
  155. dust.loadSource(dust.compile($('#tmpl-block-info').html(), 'block-info'));
  156. var b = function() { browse_directory($('#directory').val()); };
  157. $('#btn-nav-directory').click(b);
  158. var dir = window.location.hash.slice(1);
  159. if(dir == "") {
  160. window.location.hash = "/";
  161. } else {
  162. browse_directory(dir);
  163. }
  164. }
  165. init();
  166. })();