display available shares list to tab

1 files changed, 168 insertions, 7 deletions

diff --git a/js/share.js b/js/share.js
index 704dc76..1fec188 100644
--- a/js/share.js
+++ b/js/share.js
@@ -22,11 +22,25 @@
         AppName: "onlyoffice",
     }, OCA.Onlyoffice);
 
+    OCA.Onlyoffice.Permissions = {
+        Review: 1,
+        Comment: 2,
+        FillForms: 4,
+        ModifyFilter: 8
+    };
+
     OCA.Onlyoffice.SharingTabView = OCA.Files.DetailTabView.extend({
         id: "onlyofficeSharingTabView",
         className: "tab onlyofficeSharingTabView",
 
-        template: null,
+        templateItem: null,
+        permissionsMenu: null,
+        collection: null,
+        format: null,
+
+        events: {
+            'click #onlyoffice-share-action': '_onClickPermissionMenu',
+        },
 
         initialize() {
             OCA.Files.DetailTabView.prototype.initialize.apply(this, arguments);
@@ -43,18 +57,34 @@
         render() {
             var that = this;
 
-            $("<div>").html(t(OCA.Onlyoffice.AppName, "Share files with ONLYOFFICE")).prependTo(that.$el);
-            $.get(OC.filePath(OCA.Onlyoffice.AppName, "templates", "share.html"), 
-                function (tmpl) {
-                    that.template = $(tmpl);
+            this._getTemplate(() => {
+                var container = this.$el.find(".onlyoffice-share-container");
 
-                    that.$el.append(that.template);
+                container.children().remove();
+                this.collection.forEach(extra => {
+                    var itemNode = that.templateItem.clone();
+                    var descNode = itemNode.find("span");
+                    var avatar = itemNode.find("img");
+
+                    avatar[0].src = "/index.php/avatar/" + extra["shareWith"] + "/32?v=0";
+                    itemNode[0].id = extra.share_id;
+                    descNode[0].innerText = extra.shareWithName;
+                    
+                    container.append(itemNode);
                 });
+            });
         },
 
         setFileInfo(fileInfo) {
             if(fileInfo) {
-                this.render();
+                OCA.Onlyoffice.GetShares(fileInfo.id, (shares) => {
+                    this.collection = shares;
+
+                    var ext = fileInfo.attributes.name.split(".").pop();
+                    this.format = OCA.Onlyoffice.setting.formats[ext];
+
+                    this.render();
+                });
             }
         },
 
@@ -65,6 +95,137 @@
 
             return true;
         },
+
+        _getTemplate: function(callback) {
+            if (this.templateItem) {
+                callback();
+                return;
+            }
+
+            var that = this;
+            $.get(OC.filePath(OCA.Onlyoffice.AppName, "templates", "share.html"), 
+                function (tmpl) {
+                    that.templateItem = $(tmpl);
+
+                    $("<ul>", {class: "onlyoffice-share-container"}).appendTo(that.$el)
+                    $("<div>").html(t(OCA.Onlyoffice.AppName, "Share files with ONLYOFFICE")).prependTo(that.$el);
+
+                    that.$el.append(that.template);
+
+                    callback();
+                });
+        },
+
+        _onClickPermissionMenu: function(e) {
+            if (!this.permissionsMenu) {
+                this.permissionsMenu = this._permissionMenu();
+            }
+
+            var shareNode = $(e.target).closest(".onlyoffice-share-item")[0];
+            var shareId = shareNode.id;
+
+            
+            if (this.permissionsMenu.isOpen()) {
+                var previousId = this.permissionsMenu.getTargetId();
+                this.permissionsMenu.close();
+
+                if (previousId == shareId) return;
+            }
+
+            var extra = this.collection.find(item => item.share_id == shareId);
+
+            var review = false;
+            var comment = false;
+            var fillForms = false;
+            var modifyFilter = false;
+            if ("review" in this.format) {
+                review = (OCA.Onlyoffice.Permissions.Review & extra["permissions"]) === OCA.Onlyoffice.Permissions.Review;
+                this.permissionsMenu.appendItem(review, OCA.Onlyoffice.Permissions.Review, t(OCA.Onlyoffice.AppName, "Review"));
+            }
+            if ("comment" in this.format && !review) {
+                comment = (OCA.Onlyoffice.Permissions.Comment & extra["permissions"]) === OCA.Onlyoffice.Permissions.Comment;
+                this.permissionsMenu.appendItem(comment, OCA.Onlyoffice.Permissions.Comment, t(OCA.Onlyoffice.AppName, "Comment"));
+            }
+            if ("fillForms" in this.format && !review) {
+                fillForms = (OCA.Onlyoffice.Permissions.FillForms & extra["permissions"]) === OCA.Onlyoffice.Permissions.FillForms;
+                this.permissionsMenu.appendItem(fillForms, OCA.Onlyoffice.Permissions.FillForms, t(OCA.Onlyoffice.AppName, "FillForms"));
+            }
+            if ("modifyFilter" in this.format) {
+                modifyFilter = (OCA.Onlyoffice.Permissions.ModifyFilter & extra["permissions"]) === OCA.Onlyoffice.Permissions.ModifyFilter;
+                this.permissionsMenu.appendItem(modifyFilter, OCA.Onlyoffice.Permissions.ModifyFilter, t(OCA.Onlyoffice.AppName, "ModifyFilter"));
+            }
+
+            this.permissionsMenu.open(extra.share_id, $(e.target).position());
+        },
+
+        _permissionMenu: function() {
+            var popup = $("<div>", {
+                class: "popovermenu onlyoffice-share-popup"
+            }).append($("<ul>"), {
+                id: -1
+            });
+
+            this.$el.append(popup);
+
+            return {
+                isOpen: function() {
+                    return popup.is(":visible");
+                },
+
+                open: function(id, position) {
+                    if (position) {
+                        popup.css({top: position.top});
+                    }
+
+                    this.setTargetId(id);
+                    popup.show();
+                },
+
+                close: function() {
+                    var items = popup.find("li");
+                    if (items) {
+                        items.remove();
+                    }
+
+                    this.setTargetId(-1);
+                    popup.hide();
+                },
+
+                appendItem: function(checked, checkboxId, name) {
+                    var item = $("<li>").append($("<span>", {
+                        class: "onlyoffice-share-action"
+                    }).append($("<input>", {
+                        id: checkboxId,
+                        type: "checkbox",
+                        class: "checkbox action-checkbox__checkbox focusable",
+                        checked: checked
+                    })).append($("<label>", {
+                        for: checkboxId,
+                        text: name,
+                        class: "onlyoffice-share-label"
+                    })));
+
+                    popup.find("ul").append(item);
+                },
+
+                setTargetId: function(id) {
+                    popup.find("ul").attr("id", id);
+                },
+
+                getTargetId: function() {
+                    return Number(popup.find("ul").attr("id"));
+                },
+            }
+        }
     });
 
+    OCA.Onlyoffice.GetShares = function(fileId, callback) {
+        $.ajax({
+            url: OC.linkToOCS("apps/" + OCA.Onlyoffice.AppName + "/api/v1/shares", 2) + fileId + "?format=json",
+            success: function onSuccess(response) {
+                callback(response.ocs.data);
+            }
+        })
+    }
+
 })(jQuery, OC);
\ No newline at end of file