diff --git a/media/css/seahub.css b/media/css/seahub.css
index deacbb44ae..1a2f862ce8 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -1644,9 +1644,6 @@ button.sf-dropdown-toggle:focus {
     margin-bottom:.5em;
     border-radius:2px;
 }
-#dir-view .repo-op {
-    position: relative; /* for '#upload-menu' */
-}
 #right-panel .hd,
 .tabnav,
 .wiki-top {
@@ -2121,6 +2118,11 @@ button.sf-dropdown-toggle:focus {
 #dir-view .repo-op .op-btn {
     padding:5px 14px;
 }
+#new-file-menu {
+    margin-top:4px;
+    border-top:1px solid #ddd;
+    padding-top:4px;
+}
 .repo-file-list {
     margin:0;
 }
diff --git a/seahub/templates/js/lib-op-popups.html b/seahub/templates/js/lib-op-popups.html
index c769d8208b..af22ce8ce7 100644
--- a/seahub/templates/js/lib-op-popups.html
+++ b/seahub/templates/js/lib-op-popups.html
@@ -13,18 +13,9 @@
 
     <script type="text/template" id="add-new-file-form-template">
     <form id="add-new-file-form" action="" method="post" class="hide">{% csrf_token %}
-        <h3 id="dialogTitle">{% trans "New File" %}</h3>
-        <div id="featured-filetype">
-            <label>{% trans "Featured File Type" %}</label><br />
-            <button type="button" class="set-file-type" data-filetype="md" title="{% trans "Click to choose" %}">markdown</button> <span>{% trans "simple markup format." %}</span>
-            {% if LANGUAGE_CODE == 'zh-cn' %}
-            <a href="http://www.seafile.com/help/markdown/" target="_blank">{% trans 'Details' %}</a>
-            {% else %}
-            <a href="http://www.seafile.com/en/help/markdown/" target="_blank">{% trans 'Details' %}</a>
-            {% endif %}
-        </div>
-        <label for="file-name">{% trans "File Name" %}</label><br/>
-        <input type="text" name="name" value="" class="input" maxlength="{{max_file_name}}" id="file-name" /><br />
+        <h3 id="dialogTitle"><%= title %></h3>
+        <label for="file-name">{% trans "Name" %}</label><br/>
+        <input type="text" name="name" value="<%= initial_file_name %>" class="input" maxlength="{{max_file_name}}" id="file-name" /><br />
         <p class="error hide"></p>
         <button type="submit" class="submit">{% trans "Submit" %}</button>
         <button class="simplemodal-close">{% trans "Cancel" %}</button>
diff --git a/seahub/templates/js/templates.html b/seahub/templates/js/templates.html
index e22cc97cd4..0936f0247b 100644
--- a/seahub/templates/js/templates.html
+++ b/seahub/templates/js/templates.html
@@ -144,8 +144,21 @@
     <% } else { %>
     <button class="op-btn btn-disabled" disabled="disabled" title="{% trans "Out of quota" %}">{% trans "Upload" %}</button>
     <% } %>
-    <button id="add-new-dir" class="op-btn">{% trans "New Folder" %}</button>
-    <button id="add-new-file" class="op-btn">{% trans "New File" %}</button>
+    <div id="add-new" class="sf-dropdown sf-dropdown-inline">
+        <button class="sf-dropdown-toggle op-btn">{% trans "New" %}</button>
+        <div class="sf-dropdown-menu hide">
+            <ul>
+                <li><a id="add-new-dir" class="op" href="#">{% trans "New Folder" %}</a></li>
+                <li><a id="add-new-file" class="op" href="#">{% trans "New File" %}</a></li>
+            </ul>
+            <ul id="new-file-menu">
+                <li><a id="add-new-md-file" class="op" href="#">{% trans "New Markdown File" %}</a></li>
+                <li><a id="add-new-excel-file" class="op" href="#">{% trans "New Excel File" %}</a></li>
+                <li><a id="add-new-ppt-file" class="op" href="#">{% trans "New PowerPoint File" %}</a></li>
+                <li><a id="add-new-word-file" class="op" href="#">{% trans "New Word File" %}</a></li>
+            </ul>
+        </div>
+    </div>
     <% } %>
 
     <% if (!encrypted && (can_generate_share_link || can_generate_upload_link || is_repo_owner)) { %>
diff --git a/static/scripts/app/views/dir.js b/static/scripts/app/views/dir.js
index f4fd1f1aec..62c53849c3 100644
--- a/static/scripts/app/views/dir.js
+++ b/static/scripts/app/views/dir.js
@@ -440,6 +440,13 @@ define([
                     can_generate_upload_link: app.pageOptions.can_generate_upload_link,
                     enable_upload_folder: app.pageOptions.enable_upload_folder
                 })));
+
+                if (dir.user_perm == 'rw') {
+                    // add new folder/file
+                    this.new_dropdown = new DropdownView({
+                        el: this.$("#add-new")
+                    });
+                }
             },
 
             renderDirentsHd: function() {
@@ -460,7 +467,11 @@ define([
             // Directory Operations
             events: {
                 'click #add-new-dir': 'newDir',
-                'click #add-new-file': 'newFile',
+                'click #add-new-file': 'newCommonFile',
+                'click #add-new-md-file': 'newMdFile',
+                'click #add-new-excel-file': 'newExcelFile',
+                'click #add-new-ppt-file': 'newPPTFile',
+                'click #add-new-word-file': 'newWordFile',
                 'click #share-cur-dir': 'share',
                 'click #js-switch-grid-view': 'switchToGridView',
                 'click #js-switch-list-view': 'switchToListView',
@@ -534,31 +545,29 @@ define([
 
                     return false;
                 });
+
+                return false;
             },
 
-            newFile: function() {
-                var form = $(this.newFileTemplate()),
-                    form_id = form.attr('id'),
-                    file_name = form.find('input[name="name"]'),
+            newFile: function(options) {
+                var $form = $(this.newFileTemplate(options)),
+                    form_id = $form.attr('id'),
+                    $input = $('input[name="name"]', $form),
                     dir = this.dir,
                     dirView = this;
 
-                form.modal({
+                $form.modal({
                     appendTo: '#main',
                     focus: false,
                     containerCss: {'padding':'20px 25px'}
                 });
-                file_name.focus();
                 $('#simplemodal-container').css({'height':'auto'});
 
-                $('.set-file-type', form).click(function() {
-                    file_name.val('.' + $(this).data('filetype'));
-                    Common.setCaretPos(file_name[0], 0);
-                    file_name.focus();
-                });
+                Common.setCaretPos($input[0], 0);
+                $input.focus();
 
-                form.submit(function() {
-                    var dirent_name = $.trim(file_name.val());
+                $form.submit(function() {
+                    var dirent_name = $.trim($input.val());
 
                     if (!dirent_name) {
                       Common.showFormError(form_id, gettext("It is required."));
@@ -578,10 +587,10 @@ define([
                         $.modal.close();
                         var new_dirent = dir.add({
                             'is_file': true,
-                            'is_img': Common.imageCheck(data['obj_name']),
-                            'obj_name': data['obj_name'],
-                            'file_size': Common.fileSizeFormat(0),
-                            'obj_id': '0000000000000000000000000000000000000000',
+                            'is_img': Common.imageCheck(data.obj_name),
+                            'obj_name': data.obj_name,
+                            'file_size': Common.fileSizeFormat(data.size),
+                            'obj_id': data.obj_id,
                             'file_icon': 'file.png',
                             'starred': false,
                             'perm': 'rw',
@@ -592,7 +601,7 @@ define([
                     };
 
                     Common.ajaxPost({
-                        'form': form,
+                        'form': $form,
                         'post_url': post_url,
                         'post_data': post_data,
                         'after_op_success': after_op_success,
@@ -603,6 +612,46 @@ define([
                 });
             },
 
+            newCommonFile: function() {
+                this.newFile({
+                    title: gettext('New File'),
+                    initial_file_name: ''
+                });
+                return false;
+            },
+
+            newMdFile: function() {
+                this.newFile({
+                    title: gettext('New Markdown File'),
+                    initial_file_name: '.md'
+                });
+                return false;
+            },
+
+            newExcelFile: function() {
+                this.newFile({
+                    title: gettext('New Excel File'),
+                    initial_file_name: '.xlsx'
+                });
+                return false;
+            },
+
+            newPPTFile: function() {
+                this.newFile({
+                    title: gettext('New PowerPoint File'),
+                    initial_file_name: '.pptx'
+                });
+                return false;
+            },
+
+            newWordFile: function() {
+                this.newFile({
+                    title: gettext('New Word File'),
+                    initial_file_name: '.docx'
+                });
+                return false;
+            },
+
             addNewFile: function(new_dirent) {
                 var dirView = this,
                     dir = this.dir;