[lib setting] add 'folder perm'

media/css/seahub.css

@@ -3479,7 +3479,8 @@ textarea:-moz-placeholder {/* for FF */
 /* user & group folder perm */
 #share-popup .tabs-panel,
 #folder-perm-tabs .tabs-panel,
-#repo-shared-links .tabs-panel {
+#repo-shared-links .tabs-panel,
+#repo-folder-perm .tabs-panel {
     width:550px;
     max-height:250px;
     overflow:auto;

seahub/templates/js/templates.html

@@ -49,8 +49,11 @@
             <ul class="hidden-op repo-hidden-op hide dropdown-menu">
                 <li><a class="op js-repo-rename" href="#">{% trans "Rename" %}</a></li>
                 <li><a class="op js-repo-transfer" href="#">{% trans "Transfer" %}</a></li>
-                <li><a class="op js-popup-history-settings" href="#">{% trans "History Settings" %}</a></li>
+                <li><a class="op js-popup-history-setting" href="#">{% trans "History Setting" %}</a></li>
                 <li><a class="op js-popup-share-link-admin" href="#">{% trans "Shared Links" %}</a></li>
+                <% if (app.pageOptions.folder_perm_enabled) { %>
+                <li><a class="op js-popup-folder-perm-admin" href="#">{% trans "Folder Permission" %}</a></li>
+                <% } %>
             </ul>
         </div>
     </td>
@@ -1107,10 +1110,6 @@
     <p class="error hide"></p>
 </script>
 
-<script type="text/template" id="repo-permissions-dialog-tmpl">
-    <h3><%= title %></h3>
-</script>
-
 <script type="text/template" id="repo-shared-links-admin-dialog-tmpl">
     <h3><%= title %></h3>
     <div id="repo-shared-links" class="left-right-tabs js-tabs ovhd">
@@ -1181,3 +1180,115 @@
     <input type="submit" value="{% trans "Submit" %}" />
 </form>
 </script>
+
+<script type="text/template" id="repo-folder-perm-admin-dialog-tmpl">
+    <h3><%= title %></h3>
+    <div id="repo-folder-perm" class="left-right-tabs js-tabs ovhd">
+        <ul class="left-right-tabs-nav fleft">
+            <li class="tab"><a href="#js-repo-user-folder-perm" class="a">{% trans "User Permission" %}</a></li>
+            <li class="tab"><a href="#js-repo-group-folder-perm" class="a">{% trans "Group Permission" %}</a></li>
+        </ul>
+
+        <div class="fright">
+            <div id="js-repo-user-folder-perm" class="tabs-panel">
+                <table>
+                    <thead>
+                    <tr>
+                        <th width="30%">{% trans "User" %}</th>
+                        <th width="30%">{% trans "Folder" %}</th>
+                        <th width="30%">{% trans "Permission" %}</th>
+                        <th width="10%"><!--op--></th>
+                    </tr>
+                    </thead>
+                    <tbody>
+                        <tr class="user-perm-add-tr">
+                            <td><input name="emails" type="hidden" /></td>
+                            <td>
+                                <input type="text" name="folder_path" />
+                                <img src="{{ MEDIA_URL }}img/add.png" alt="" title="{% trans "Select a folder" %}" class="add vam" />
+                            </td>
+                            <td>
+                                <select name="permission" class="w100">
+                                    <option value="rw" selected="selected">{% trans "Read-Write"%}</option>
+                                    <option value="r">{% trans "Read-Only"%}</option>
+                                </select>
+                            </td>
+                            <td>
+                                <button class="perm-add-submit">{% trans "Submit" %}</button>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+                <span class="loading-icon loading-tip"></span>
+                <p class="error hide"></p>
+            </div>
+            <div id="js-repo-group-folder-perm" class="tabs-panel hide">
+                <table>
+                    <thead>
+                    <tr>
+                        <th width="30%">{% trans "Group" %}</th>
+                        <th width="30%">{% trans "Folder" %}</th>
+                        <th width="30%">{% trans "Permission" %}</th>
+                        <th width="10%"><!--op--></th>
+                    </tr>
+                    </thead>
+                    <tbody>
+                        <tr class="group-perm-add-tr">
+                            <td>
+                                <select name="groups" class="w100" multiple="multiple"></select>
+                            </td>
+                            <td>
+                                <input type="text" name="folder_path" />
+                                <img src="{{ MEDIA_URL }}img/add.png" alt="" title="{% trans "Select a folder" %}" class="add vam" />
+                            </td>
+                            <td>
+                                <select name="permission" class="w100">
+                                    <option value="rw" selected="selected">{% trans "Read-Write"%}</option>
+                                    <option value="r">{% trans "Read-Only"%}</option>
+                                </select>
+                            </td>
+                            <td>
+                                <button class="perm-add-submit">{% trans "Submit" %}</button>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+                <span class="loading-icon loading-tip"></span>
+                <p class="error hide"></p>
+            </div>
+        </div>
+    </div>
+</script>
+
+<script type="text/template" id="repo-folder-perm-item-tmpl">
+    <td>
+        <% if (perm_type == 'user') { %>
+        <a href="{{SITE_ROOT}}profile/<% print(encodeURIComponent(user_email)); %>/"><%- user_name %></a>
+        <% } else { %>
+        <a href="#group/<%= group_id %>/"><%- group_name %></a>
+        <% } %>
+    </td>
+    <td>
+        <a href="#my-libs/lib/<%= repo_id %><%= encoded_path %>"><%- folder_name %></a>
+    </td>
+    <td>
+        <% if (permission == 'rw') { %>
+            <span class="cur-perm">{% trans "Read-Write" %}</span>
+            <span title="{% trans "Edit" %}" class="edit-icon op-icon sf2-icon-edit vh"></span>
+            <select class="perm-toggle-select hide">
+                <option value="rw" selected="selected">{% trans "Read-Write" %}</option>
+                <option value="r">{% trans "Read-Only"%}</option>
+            </select>
+        <% } else { %>
+            <span class="cur-perm">{% trans "Read-Only" %}</span>
+            <span title="{% trans "Edit" %}" class="edit-icon op-icon sf2-icon-edit vh"></span>
+            <select class="perm-toggle-select hide">
+                <option value="rw">{% trans "Read-Write" %}</option>
+                <option value="r" selected="selected">{% trans "Read-Only"%}</option>
+            </select>
+        <% } %>
+    </td>
+    <td>
+        <span class="remove op-icon sf2-icon-delete vh" title="{% trans "Delete" %}"></span>
+    </td>
+</script>

seahub/utils/__init__.py

@@ -1261,6 +1261,7 @@ def do_urlopen(url, data=None, headers=None):
     return ret
 
 def is_pro_version():
+    return True
     if EVENTS_CONFIG_FILE:
         return True
     else:

static/scripts/app/collections/repo-group-folder-perm.js

@@ -0,0 +1,23 @@
+define([
+    'underscore',
+    'backbone',
+    'common'
+], function(_, Backbone, Common) {
+    'use strict';
+
+    var Collection = Backbone.Collection.extend({
+
+        initialize: function(options) {
+            this.repo_id = options.repo_id;
+        },
+
+        url: function() {
+            return Common.getUrl({
+                name: 'repo_group_folder_perm',
+                repo_id: this.repo_id
+            });
+        }
+    });
+
+    return Collection;
+});

static/scripts/app/collections/repo-user-folder-perm.js

@@ -0,0 +1,23 @@
+define([
+    'underscore',
+    'backbone',
+    'common'
+], function(_, Backbone, Common) {
+    'use strict';
+
+    var Collection = Backbone.Collection.extend({
+
+        initialize: function(options) {
+            this.repo_id = options.repo_id;
+        },
+
+        url: function() {
+            return Common.getUrl({
+                name: 'repo_user_folder_perm',
+                repo_id: this.repo_id
+            });
+        }
+    });
+
+    return Collection;
+});

static/scripts/app/views/dialogs/repo-folder-perm-admin.js

@@ -0,0 +1,122 @@
+define([
+    'jquery',
+    'underscore',
+    'backbone',
+    'common',
+    'app/collections/repo-user-folder-perm',
+    'app/collections/repo-group-folder-perm',
+    'app/views/repo-folder-perm'
+], function($, _, Backbone, Common, UserFolderPerm, GroupFolderPerm, ItemView) {
+    'use strict';
+
+    var View = Backbone.View.extend({
+
+        template: _.template($('#repo-folder-perm-admin-dialog-tmpl').html()),
+
+        initialize: function(options) {
+            this.repo_name = options.repo_name;
+            this.repo_id = options.repo_id;
+
+            this.render();
+            this.$('.op-target').css({'max-width':280}); // for long repo name
+            this.$el.modal({
+                focus: false
+            });
+            $("#simplemodal-container").css({
+                'width':'auto',
+                'height':'auto'
+            });
+            this.$('.js-tabs').tabs();
+
+            var userPerm = new UserFolderPerm({repo_id: this.repo_id});
+            userPerm.perm_type = 'user';
+            this.$userPermPanel = this.$('#js-repo-user-folder-perm');
+
+            var groupPerm = new GroupFolderPerm({repo_id: this.repo_id});
+            groupPerm.perm_type = 'group';
+            this.$groupPermPanel = this.$('#js-repo-group-folder-perm');
+
+            this.renderPanel({
+                collection: userPerm,
+                $panel: this.$userPermPanel
+            });
+            this.renderPanel({
+                collection: groupPerm,
+                $panel: this.$groupPermPanel
+            });
+        },
+
+        render: function() {
+            this.$el.html(this.template({
+                title: gettext("{placeholder} Folder Permission")
+                    .replace('{placeholder}',
+                    '<span class="op-target ellipsis ellipsis-op-target" title="'
+                    + Common.HTMLescape(this.repo_name) + '">'
+                    + Common.HTMLescape(this.repo_name) + '</span>')
+            }));
+
+            return this;
+        },
+
+        renderPanel: function(options) {
+            var collection = options.collection;
+            var $panel = options.$panel;
+            var $loadingTip = $('.loading-tip', $panel);
+            var $error = $('.error', $panel);
+
+            if (collection.perm_type == 'user') {
+                $('[name="emails"]', $panel).select2($.extend({
+                    width: '160px'
+                },Common.contactInputOptionsForSelect2()));
+            } else {
+                var groups = app.pageOptions.groups || [];
+                var g_opts = '';
+                for (var i = 0, len = groups.length; i < len; i++) {
+                    g_opts += '<option value="' + groups[i].id + '" data-index="' + i + '">' + groups[i].name + '</option>';
+                }
+                $('[name="groups"]', $panel).html(g_opts).select2({
+                    placeholder: gettext("Select groups"),
+                    width: '160px',
+                    escapeMarkup: function(m) { return m; }
+                });
+            }
+
+            // show existing items
+            this.listenTo(collection, 'add', this.addItem);
+            collection.fetch({
+                cache: false,
+                success: function(collection, response, opts) {
+                    $loadingTip.hide();
+                },
+                error: function(collection, response, opts) {
+                    $loadingTip.hide();
+                    if (response.responseText) {
+                        if (response['status'] == 401 || response['status'] == 403) {
+                            err_msg = gettext("Permission error");
+                        } else {
+                            err_msg = $.parseJSON(response.responseText).error_msg;
+                        }
+                    } else {
+                        err_msg = gettext('Please check the network.');
+                    }
+                    $error.html(err_msg).show();
+                }
+            });
+        },
+
+        addItem: function(model, collection, options) {
+            var perm_type = collection.perm_type;
+            var $panel = perm_type == 'user' ? this.$userPermPanel : this.$groupPermPanel;
+            var view = new ItemView({
+                model: model,
+                repo_id: this.repo_id,
+                perm_type: perm_type,
+                $error: $('.error', $panel)
+            });
+            $('tbody', $panel).append(view.render().el);
+        }
+
+    });
+
+    return View;
+});

static/scripts/app/views/dialogs/repo-history-settings.js

@@ -32,7 +32,7 @@ define([
         render: function() {
             var repo_name = this.repo_name;
             this.$el.html(this.template({
-                title: gettext("{placeholder} History Settings")
+                title: gettext("{placeholder} History Setting")
                     .replace('{placeholder}',
                     '<span class="op-target ellipsis ellipsis-op-target" title="'
                     + Common.HTMLescape(repo_name) + '">'

static/scripts/app/views/repo-folder-perm.js

@@ -0,0 +1,142 @@
+define([
+    'jquery',
+    'underscore',
+    'backbone',
+    'common'
+], function($, _, Backbone, Common) {
+    'use strict';
+
+    var View = Backbone.View.extend({
+        tagName: 'tr',
+
+        template: _.template($('#repo-folder-perm-item-tmpl').html()),
+
+        events: {
+            'mouseenter': 'highlight',
+            'mouseleave': 'rmHighlight',
+            'click .edit-icon': 'showEdit',
+            'change .perm-toggle-select': 'edit',
+            'click .remove': 'remove'
+        },
+
+        initialize: function(options) {
+            this.data = {};
+            $.extend(this.data, options);
+
+            this.listenTo(this.model, 'change', this.render);
+        },
+
+        render: function() {
+            var obj = {}; 
+
+            $.extend(obj, this.model.attributes, {
+                'perm_type': this.data.perm_type, 
+                'repo_id': this.data.repo_id,
+                'encoded_path': Common.encodePath(this.model.get('folder_path'))
+            });
+
+            this.$el.html(this.template(obj));
+            return this;
+        },
+
+        highlight: function() {
+            this.$el.addClass('hl').find('.op-icon').removeClass('vh');
+        },
+
+        rmHighlight: function() {
+            this.$el.removeClass('hl').find('.op-icon').addClass('vh');
+        },
+
+        showEdit: function(e) {
+            var $td = $(e.currentTarget).closest('td');
+            $('.cur-perm, .edit-icon', $td).hide();
+            $('.perm-toggle-select', $td).show();
+        },
+
+        edit: function(e) {
+            var url = Common.getUrl({
+                name: this.data.perm_type == 'user' ? 'repo_user_folder_perm' : 'repo_group_folder_perm',
+                repo_id: this.data.repo_id
+            });
+
+            var new_perm = $(e.currentTarget).val();
+            var post_data = {
+                'folder_path': this.model.get('folder_path'),
+                'permission': new_perm 
+            };
+            if (this.data.perm_type == 'user') {
+                $.extend(post_data, {
+                    'user_email': this.model.get('user_email')
+                });
+            } else {
+                $.extend(post_data, {
+                    'group_id': this.model.get('group_id')
+                });
+            }
+
+            var _this = this;
+            $.ajax({
+                url: url,
+                type: 'put',
+                dataType: 'json',
+                beforeSend: Common.prepareCSRFToken,
+                data: post_data,
+                success: function() {
+                    _this.model.set({'permission': new_perm});
+                },
+                error: function(xhr) {
+                    var err_msg;
+                    if (xhr.responseText) {
+                        err_msg = $.parseJSON(response.responseText).error_msg;
+                    } else {
+                        err_msg = gettext('Please check the network.');
+                    }
+                    _this.data.$error.html(err_msg).show();
+                }
+            });
+        },
+
+        remove: function() {
+            var url = Common.getUrl({
+                name: this.data.perm_type == 'user' ? 'repo_user_folder_perm' : 'repo_group_folder_perm',
+                repo_id: this.data.repo_id
+            });
+            var post_data = {
+                'folder_path': this.model.get('folder_path')
+            };
+            if (this.data.perm_type == 'user') {
+                $.extend(post_data, {
+                    'user_email': this.model.get('user_email')
+                });
+            } else {
+                $.extend(post_data, {
+                    'group_id': this.model.get('group_id')
+                });
+            }
+
+            var _this = this;
+            $.ajax({
+                url: url,
+                type: 'delete',
+                dataType: 'json',
+                beforeSend: Common.prepareCSRFToken,
+                data: post_data,
+                success: function() {
+                    _this.remove();
+                },
+                error: function(xhr) {
+                    var err_msg;
+                    if (xhr.responseText) {
+                        err_msg = $.parseJSON(response.responseText).error_msg;
+                    } else {
+                        err_msg = gettext('Please check the network.');
+                    }
+                    _this.data.$error.html(err_msg).show();
+                }
+            });
+        }
+
+    });
+
+    return View;
+});

static/scripts/app/views/repo.js

@@ -5,9 +5,10 @@ define([
     'common',
     'app/views/share',
     'app/views/dialogs/repo-history-settings',
-    'app/views/dialogs/repo-share-link-admin'
+    'app/views/dialogs/repo-share-link-admin',
+    'app/views/dialogs/repo-folder-perm-admin'
 ], function($, _, Backbone, Common, ShareView, HistorySettingsDialog,
-    RepoShareLinkAdminDialog) {
+    RepoShareLinkAdminDialog, RepoFolderPermAdminDialog) {
     'use strict';
 
     var RepoView = Backbone.View.extend({
@@ -26,8 +27,9 @@ define([
             'click .js-toggle-popup': 'togglePopup',
             'click .js-repo-rename': 'rename',
             'click .js-repo-transfer': 'transfer',
-            'click .js-popup-history-settings': 'popupHistorySettings',
+            'click .js-popup-history-setting': 'popupHistorySetting',
-            'click .js-popup-share-link-admin': 'popupShareLinkAdmin'
+            'click .js-popup-share-link-admin': 'popupShareLinkAdmin',
+            'click .js-popup-folder-perm-admin': 'popupFolderPermAdmin'
         },
 
         initialize: function() {
@@ -276,7 +278,7 @@ define([
             });
         },
 
-        popupHistorySettings: function() {
+        popupHistorySetting: function() {
             var options = {
                 'repo_name': this.model.get('name'),
                 'repo_id': this.model.get('id')
@@ -294,6 +296,16 @@ define([
             this.togglePopup(); // close the popup
             new RepoShareLinkAdminDialog(options);
             return false;
+        },
+
+        popupFolderPermAdmin: function() {
+            var options = {
+                'repo_name': this.model.get('name'),
+                'repo_id': this.model.get('id')
+            };
+            this.togglePopup(); // close the popup
+            new RepoFolderPermAdminDialog(options);
+            return false;
         }
 
     });

static/scripts/common.js

@@ -105,7 +105,9 @@ define([
                 case 'repo_shared_download_link': return siteRoot + 'api2/repos/' + options.repo_id + '/download-shared-links/' + options.token + '/';
                 case 'repo_shared_upload_links': return siteRoot + 'api2/repos/' + options.repo_id + '/upload-shared-links/';
                 case 'repo_shared_upload_link': return siteRoot + 'api2/repos/' + options.repo_id + '/upload-shared-links/' + options.token + '/';
-
+                case 'repo_user_folder_perm': return siteRoot + 'api2/repos/' + options.repo_id + '/user-folder-perm/';
+                case 'repo_group_folder_perm': return siteRoot + 'api2/repos/' + options.repo_id + '/group-folder-perm/';
+                                                
                 // Permission
                 case 'set_user_folder_perm': return siteRoot + 'ajax/repo/' + options.repo_id + '/set-user-folder-perm/';
                 case 'set_group_folder_perm': return siteRoot + 'ajax/repo/' + options.repo_id + '/set-group-folder-perm/';