[jira] [Commented] (HDFS-7713) Improve the HDFS Web UI browser to allow creating dirs

[Haohui Mai (JIRA)]

    [ 
https://issues.apache.org/jira/browse/HDFS-7713?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=14345830#comment-14345830
 ] 

Haohui Mai commented on HDFS-7713:
----------------------------------

{code}
+            <button type="button" class="close"
+              data-dismiss="modal" aria-hidden="true">&times;</button>
+            <h4 class="modal-title" id="dir-create-title">Create Directory</h4>
+          </div>
{code}

The id {{dir-create-title}} are unnecessary, so as things like 
{{dir-create-body}}. Only elements that are accessed by JavaScript need IDs.

{code}
+              <div class="col-sm-10">
{code}

It is unnecessary.

{code}
+                  <input type="text" class="form-control" id="new_directory"
+                    placeholder="New Directory Name">
{code}

It has to be a closed tag to meet the XHTML standard.

{code}
+        <div>&nbsp;</div>
+        <div>
+          <button type="button" class="btn btn-default" data-toggle="modal"
+            data-target="#create-directory">Create Directory
+          </button>
+        </div>
{code}

It breaks the row layout in bootstrap. You can put the button on the same row 
using:

{code}
    <div class="row">
      <div class="col-xs-11">
        <form onsubmit="return false;">
          <div class="input-group">
            <input type="text" class="form-control" id="directory"/>
            <span class="input-group-btn">
              <button class="btn btn-default" type="button" 
id="btn-nav-directory">Go!</button>
            </span>
          </div>
        </form>
      </div>
      <div class="col-xs-1">
        <button type="button" class="btn btn-default" data-toggle="modal" 
aria-label="New Directory"
                data-target="#create-directory"> <span class="glyphicon 
glyphicon-folder-open"></span>
        </button>
      </div>
    </div>
{code}

{code}
+  $('#create-directory').on('show.bs.modal', function(event) {
+    var modal = $(this)
+    $('#new_directory_pwd').html(current_directory);
+    $('#create-directory-button').on('click', function () {
{code}

The click handler should be registered outside and should use the {{click()}} 
method directly, otherwise you'll end up with registering multiple click 
handlers and issue multiple webhdfs request. 

It also makes sense to ID the button with consistent naming style, e.g. 
{{btn-create-directory}}

{code}
+      $.ajax(url,
+        { type: 'PUT'
+        }
{code}

It might make sense to put it in one line.


> Improve the HDFS Web UI browser to allow creating dirs
> ------------------------------------------------------
>
>                 Key: HDFS-7713
>                 URL: https://issues.apache.org/jira/browse/HDFS-7713
>             Project: Hadoop HDFS
>          Issue Type: Sub-task
>            Reporter: Ravi Prakash
>            Assignee: Ravi Prakash
>         Attachments: HDFS-7713.01.patch, HDFS-7713.02.patch, 
> HDFS-7713.03.patch, HDFS-7713.04.patch, HDFS-7713.05.patch
>
>
> This sub-task JIRA is for improving the NN HTML5 UI to allow the user to 
> create directories. It uses WebHDFS and adds to the great work done in 
> HDFS-6252



--
This message was sent by Atlassian JIRA
(v6.3.4#6332)