diff --git a/media/css/seahub.css b/media/css/seahub.css
index 9f4c0ff2d3..44dbc8c6a4 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -3494,9 +3494,26 @@ textarea:-moz-placeholder {/* for FF */
     width:630px;
     padding-right:0;
 }
+#repo-folder-perm .jstree {
+    margin:10px 0 4px;
+}
 .repo-folder-perm-folder-path {
-    padding:3px 5px;
-    width:155px;
+    width:150px;
+    padding:3px 33px 3px 5px;
+}
+.repo-folder-perm-add-folder {
+    position:absolute;
+    right:0;
+    top:4px;
+    width:29px;
+    height:28px;
+    line-height:28px;
+    text-align:center;
+    font-size:14px;
+    color:#666;
+    cursor:pointer;
+    border-left: 1px solid #ddd;
+    margin:0;
 }
 .repo-folder-perm-content {
     width:610px; /* for the table in it. */
@@ -3512,6 +3529,7 @@ textarea:-moz-placeholder {/* for FF */
     height:30px;
 }
 #share-popup table,
+#repo-folder-perm table,
 #folder-perm-tabs table {
     margin:0;
 }
@@ -3819,19 +3837,20 @@ img.thumbnail {
 /* grid view */
 .grid-item {
     display:inline-block;
-    width:100px;
-    padding:10px 24px;
+    width:140px;
+    padding:10px 4px;
     position:relative;
 }
 .grid-item .img-link {
     position:relative; /* for locked icon */
     display:block;
     text-align:center;
+    width:100px;
     height:100px;
     font-size:0;
     line-height:0;
     border-radius:3px;
-    margin-bottom:6px;
+    margin:0 auto 6px;
 }
 .grid-item .img-link:before {
     content:' ';
@@ -3855,8 +3874,6 @@ img.thumbnail {
     color:#333;
     font-size:14px;
     line-height:17px;
-    height:34px;
-    white-space:normal;
 }
 .grid-item .text-link.hl {
     color:#f93;
@@ -3881,5 +3898,5 @@ img.thumbnail {
     box-shadow: 0 2px 2px #aaa;
 }
 #dir-view .grid-item {
-    padding:10px 20px; /* use less padding */
+    width:134px;
 }
diff --git a/seahub/templates/js/templates.html b/seahub/templates/js/templates.html
index fd1b7fef2f..8ed036ab98 100644
--- a/seahub/templates/js/templates.html
+++ b/seahub/templates/js/templates.html
@@ -1287,10 +1287,12 @@
                     </thead>
                     <tbody>
                         <tr>
-                            <td><input name="emails" type="hidden" /></td>
+                            <td><input name="emails" type="hidden" class="w100" /></td>
                             <td>
-                                <input type="text" name="folder_path" class="repo-folder-perm-folder-path" />
-                                <img src="{{ MEDIA_URL }}img/add.png" alt="" title="{% trans "Select a folder" %}" class="add vam add-folder" />
+                                <div class="pos-rel">
+                                    <input type="text" name="folder_path" class="repo-folder-perm-folder-path" />
+                                    <span title="{% trans "Select a folder" %}" class="js-add-folder repo-folder-perm-add-folder icon-plus"></span>
+                                </div>
                             </td>
                             <td>
                                 <select name="permission" class="w100">
@@ -1333,8 +1335,10 @@
                                 <select name="groups" class="w100" multiple="multiple"></select>
                             </td>
                             <td>
-                                <input type="text" name="folder_path" class="repo-folder-perm-folder-path" />
-                                <img src="{{ MEDIA_URL }}img/add.png" alt="" title="{% trans "Select a folder" %}" class="add vam add-folder" />
+                                <div class="pos-rel">
+                                    <input type="text" name="folder_path" class="repo-folder-perm-folder-path" />
+                                    <span title="{% trans "Select a folder" %}" class="js-add-folder repo-folder-perm-add-folder icon-plus"></span>
+                                </div>
                             </td>
                             <td>
                                 <select name="permission" class="w100">
diff --git a/seahub/templates/sysadmin/repoadmin_js.html b/seahub/templates/sysadmin/repoadmin_js.html
index 4bdd24ba80..b0b1e692b1 100644
--- a/seahub/templates/sysadmin/repoadmin_js.html
+++ b/seahub/templates/sysadmin/repoadmin_js.html
@@ -15,7 +15,7 @@ $('.repo-transfer-btn').click(function(){
     $('[name="email"]', form).select2($.extend({
         width: '268px',
         maximumSelectionSize: 1,
-        placeholder: "{% trans "Search user or enter email" %}",
+        placeholder: "{% trans "Search user or enter email and press Enter" %}",
         formatInputTooShort: "{% trans "Please enter 1 or more character" %}",
         formatNoMatches: "{% trans "No matches" %}",
         formatSearching: "{% trans "Searching..." %}",
diff --git a/static/css/backbone.css b/static/css/backbone.css
index 9596a718f0..653d5c641b 100644
--- a/static/css/backbone.css
+++ b/static/css/backbone.css
@@ -35,8 +35,13 @@
     border-radius: 2px;
     background-image: none; /* rm the shadow */
 }
+.select2-container-multi .select2-choices .select2-search-field {
+    float:none;
+}
 .select2-container-multi .select2-choices .select2-search-field input {
     padding:2px 2px 2px 5px;
+    font-family:inherit; 
+    font-size:13px;
 }
 .select2-container-multi .select2-choices .select2-search-choice {
     border:none;
diff --git a/static/scripts/app/views/dialogs/repo-folder-perm-admin.js b/static/scripts/app/views/dialogs/repo-folder-perm-admin.js
index 003a6bea9b..f126508c6c 100644
--- a/static/scripts/app/views/dialogs/repo-folder-perm-admin.js
+++ b/static/scripts/app/views/dialogs/repo-folder-perm-admin.js
@@ -88,8 +88,7 @@ define([
             if (collection.perm_type == 'user') {
                 $('[name="emails"]', $panel).select2($.extend(
                     Common.contactInputOptionsForSelect2(), {
-                        width: '190px',
-                        placeholder: gettext("Search user or enter email"), // to override 'placeholder' returned by `Common.conta...`
+                        placeholder: gettext("Search user or enter email and press Enter"), // to override 'placeholder' returned by `Common.conta...`
                         maximumSelectionSize: 1,
                         formatSelectionTooBig: gettext("You can only select 1 item")
                     }));
@@ -101,7 +100,6 @@ define([
                 }
                 $('[name="groups"]', $panel).html(g_opts).select2({
                     placeholder: gettext("Select a group"),
-                    width: '190px',
                     maximumSelectionSize: 1,
                     formatSelectionTooBig: gettext("You can only select 1 item"),
                     escapeMarkup: function(m) { return m; }
@@ -148,7 +146,7 @@ define([
         },
 
         events: {
-            'click .add-folder': 'showFolderSelectForm',
+            'click .js-add-folder': 'showFolderSelectForm',
             'click .js-folder-select-submit': 'addFolder',
             'click .js-folder-select-cancel': 'cancelFolderSelect',
 
diff --git a/static/scripts/app/views/dirent.js b/static/scripts/app/views/dirent.js
index fecf79f608..13211b7cec 100644
--- a/static/scripts/app/views/dirent.js
+++ b/static/scripts/app/views/dirent.js
@@ -19,8 +19,6 @@ define([
 
         template: _.template($('#dirent-tmpl').html()),
         renameTemplate: _.template($("#rename-form-template").html()),
-        mvcpTemplate: _.template($("#mvcp-form-template").html()),
-        mvProgressTemplate: _.template($("#mv-progress-popup-template").html()),
 
         initialize: function(options) {
             this.dirView = options.dirView;
diff --git a/static/scripts/app/views/group-manage-members.js b/static/scripts/app/views/group-manage-members.js
index 4c0e0892d9..5f037cc42b 100644
--- a/static/scripts/app/views/group-manage-members.js
+++ b/static/scripts/app/views/group-manage-members.js
@@ -35,7 +35,7 @@ define([
             this.$modalContainer = $('#simplemodal-container').css({'height':'auto'});
 
             this.$('[name="user_name"]').select2($.extend({
-                width: '268px',
+                width: '320px',
             }, Common.contactInputOptionsForSelect2()));
 
             this.collection = new GroupMembers();
diff --git a/static/scripts/app/views/group-settings.js b/static/scripts/app/views/group-settings.js
index b7632c23ff..35fe88b92a 100644
--- a/static/scripts/app/views/group-settings.js
+++ b/static/scripts/app/views/group-settings.js
@@ -176,7 +176,7 @@ define([
                 Common.contactInputOptionsForSelect2(), {
                 width: '268px',
                 maximumSelectionSize: 1,
-                placeholder: gettext("Search user or enter email"), // to override 'placeholder' returned by `Common.conta...`
+                placeholder: gettext("Search user or enter email and press Enter"), // to override 'placeholder' returned by `Common.conta...`
                 formatSelectionTooBig: gettext("You cannot select any more choices")
             }));
 
diff --git a/static/scripts/app/views/share.js b/static/scripts/app/views/share.js
index ba8798e888..45399b8543 100644
--- a/static/scripts/app/views/share.js
+++ b/static/scripts/app/views/share.js
@@ -474,7 +474,7 @@ define([
             var form = this.$('#dir-user-share');
 
             $('[name="emails"]', form).select2($.extend({
-                width: '297px'
+                //width: '292px' // the container will copy class 'w100' from the original element to get width
             },Common.contactInputOptionsForSelect2()));
 
             // show existing items
@@ -521,7 +521,6 @@ define([
             }
             $('[name="groups"]', form).html(g_opts).select2({
                 placeholder: gettext("Select groups"),
-                width: '297px',
                 escapeMarkup: function(m) { return m; }
             });
 
@@ -560,10 +559,10 @@ define([
         },
 
         dirUserShare: function () {
-            var panel = $('#dir-user-share');
-            var form = this.$('#add-dir-user-share-item');
+            var $panel = $('#dir-user-share');
+            var $form = this.$('#add-dir-user-share-item'); // pseudo form
 
-            var emails_input = $('[name="emails"]', form),
+            var emails_input = $('[name="emails"]', $form),
                 emails = emails_input.val(); // string
             if (!emails) {
                 return false;
@@ -572,8 +571,12 @@ define([
             var $add_item = $('#add-dir-user-share-item');
             var repo_id = this.repo_id, 
                 path = this.dirent_path;
-            var perm = $('[name="permission"]', form).val();
+            var $perm = $('[name="permission"]', $form);
+            var perm = $perm.val();
+            var $error = $('.error', $panel); 
+            var $submitBtn = $('[type="submit"]', $form); 
 
+            Common.disableButton($submitBtn);
             $.ajax({
                 url: Common.getUrl({
                     name: 'dir_shared_items',
@@ -589,26 +592,31 @@ define([
                     'permission': perm
                 },
                 success: function(data) {
-                    $(data.success).each(function(index, item) {
-                        var new_item = new FolderShareItemView({
-                            'repo_id': repo_id,
-                            'path': path,
-                            'item_data': {
-                                "user": item.user_info.name,
-                                "user_name": item.user_info.nickname,
-                                "perm": item.permission,
-                                'for_user': true
-                            }
+                    if (data.success.length > 0) {
+                        $(data.success).each(function(index, item) {
+                            var new_item = new FolderShareItemView({
+                                'repo_id': repo_id,
+                                'path': path,
+                                'item_data': {
+                                    "user": item.user_info.name,
+                                    "user_name": item.user_info.nickname,
+                                    "perm": item.permission,
+                                    'for_user': true
+                                }
+                            });
+                            $add_item.after(new_item.el);
                         });
-                        $add_item.after(new_item.el);
-                    });
-                    emails_input.select2("val", "");
+                        emails_input.select2("val", "");
+                        $('[value="rw"]', $perm).attr('selected', 'selected');
+                        $('[value="r"]', $perm).removeAttr('selected');
+                        $error.addClass('hide');
+                    }
                     if (data.failed.length > 0) {
                         var err_msg = '';
                         $(data.failed).each(function(index, item) {
                             err_msg += Common.HTMLescape(item.email) + ': ' + item.error_msg + '<br />';
                         });
-                        $('.error', panel).html(err_msg).removeClass('hide');
+                        $error.html(err_msg).removeClass('hide');
                     }
                 },
                 error: function(xhr) {
@@ -619,17 +627,20 @@ define([
                     } else {
                         err_msg = gettext("Failed. Please check the network.")
                     }
-                    $('.error', panel).html(err_msg).removeClass('hide');
+                    $error.html(err_msg).removeClass('hide');
+                },
+                complete: function() {
+                    Common.enableButton($submitBtn);
                 }
             });
         },
 
         dirGroupShare: function () {
-            var panel = $('#dir-group-share');
-            var form = this.$('#add-dir-group-share-item');
+            var $panel = $('#dir-group-share');
+            var $form = this.$('#add-dir-group-share-item'); // pseudo form
 
-            var groups_input = $('[name="groups"]', form),
-                groups = groups_input.val(); // null or [group.id]
+            var $groups_input = $('[name="groups"]', $form),
+                groups = $groups_input.val(); // null or [group.id]
 
             if (!groups) {
                 return false;
@@ -638,8 +649,12 @@ define([
             var $add_item = $('#add-dir-group-share-item');
             var repo_id = this.repo_id, 
                 path = this.dirent_path;
-            var perm = $('[name="permission"]', form).val();
+            var $perm = $('[name="permission"]', $form),
+                perm = $perm.val();
+            var $error = $('.error', $panel); 
+            var $submitBtn = $('[type="submit"]', $form); 
 
+            Common.disableButton($submitBtn);
             $.ajax({
                 url: Common.getUrl({
                     name: 'dir_shared_items',
@@ -655,26 +670,31 @@ define([
                     'permission': perm
                 },
                 success: function(data) {
-                    $(data.success).each(function(index, item) {
-                        var new_item = new FolderShareItemView({
-                            'repo_id': repo_id,
-                            'path': path,
-                            'item_data': {
-                                "group_id": item.group_info.id,
-                                "group_name": item.group_info.name,
-                                "perm": item.permission,
-                                'for_user': false
-                            }
+                    if (data.success.length > 0) {
+                        $(data.success).each(function(index, item) {
+                            var new_item = new FolderShareItemView({
+                                'repo_id': repo_id,
+                                'path': path,
+                                'item_data': {
+                                    "group_id": item.group_info.id,
+                                    "group_name": item.group_info.name,
+                                    "perm": item.permission,
+                                    'for_user': false
+                                }
+                            });
+                            $add_item.after(new_item.el);
                         });
-                        $add_item.after(new_item.el);
-                    });
-                    groups_input.select2("val", "");
+                        $groups_input.select2("val", "");
+                        $('[value="rw"]', $perm).attr('selected', 'selected');
+                        $('[value="r"]', $perm).removeAttr('selected');
+                        $error.addClass('hide');
+                    }
                     if (data.failed.length > 0) {
                         var err_msg = '';
                         $(data.failed).each(function(index, item) {
                             err_msg += Common.HTMLescape(item.group_name) + ': ' + item.error_msg + '<br />';
                         });
-                        $('.error', panel).html(err_msg).removeClass('hide');
+                        $error.html(err_msg).removeClass('hide');
                     }
                 },
                 error: function(xhr) {
@@ -685,7 +705,10 @@ define([
                     } else {
                         err_msg = gettext("Failed. Please check the network.")
                     }
-                    $('.error', panel).html(err_msg).removeClass('hide');
+                    $error.html(err_msg).removeClass('hide');
+                },
+                complete: function() {
+                    Common.enableButton($submitBtn);
                 }
             });
         }
diff --git a/static/scripts/common.js b/static/scripts/common.js
index a72960e4f3..a5d82b31bc 100644
--- a/static/scripts/common.js
+++ b/static/scripts/common.js
@@ -631,7 +631,7 @@ define([
         contactInputOptionsForSelect2: function() {
             var _this = this;
             return {
-                placeholder: gettext("Search users or enter emails"),
+                placeholder: gettext("Search users or enter emails and press Enter"),
 
                 // with 'tags', the user can directly enter, not just select
                 // tags need `<input type="hidden" />`, not `<select>`
diff --git a/static/scripts/file-tree.js b/static/scripts/file-tree.js
index a13c69fd69..81f7c29570 100644
--- a/static/scripts/file-tree.js
+++ b/static/scripts/file-tree.js
@@ -202,7 +202,6 @@ define([
                 cur_path += '/';
             }
             var _this = this;
-            // container.data('site_root', '{{SITE_ROOT}}');
             $.ajax({
                 url: Common.getUrl({name: 'get_dirents', repo_id: options.repo_id})
                 + '?path=' + encodeURIComponent(cur_path) + '&dir_only=true&all_dir=true',