From 8bb1437e240ce47e04f7bcb7dc3a56ef6b5d892b Mon Sep 17 00:00:00 2001 From: Vincent Petry Date: Wed, 3 Feb 2016 13:00:55 +0100 Subject: [PATCH] Add file row indicator for unread comments --- apps/comments/css/comments.css | 4 + apps/comments/js/filesplugin.js | 84 ++++++++++++++++++ apps/comments/tests/js/filespluginSpec.js | 102 ++++++++++++++++++++++ core/img/actions/comment.png | Bin 0 -> 169 bytes core/img/actions/comment.svg | 4 + tests/karma.config.js | 2 +- 6 files changed, 195 insertions(+), 1 deletion(-) create mode 100644 apps/comments/tests/js/filespluginSpec.js create mode 100644 core/img/actions/comment.png create mode 100644 core/img/actions/comment.svg diff --git a/apps/comments/css/comments.css b/apps/comments/css/comments.css index c1624dcc57..5e247aaeb7 100644 --- a/apps/comments/css/comments.css +++ b/apps/comments/css/comments.css @@ -49,3 +49,7 @@ position: absolute; right: 0; } + +.app-files .action-comment>img { + margin-right: 5px; +} diff --git a/apps/comments/js/filesplugin.js b/apps/comments/js/filesplugin.js index c8d91e0ede..bf6bb05146 100644 --- a/apps/comments/js/filesplugin.js +++ b/apps/comments/js/filesplugin.js @@ -8,7 +8,15 @@ * */ +/* global Handlebars */ + (function() { + var TEMPLATE_COMMENTS_UNREAD = + '' + + '' + + '{{count}}' + + ''; + OCA.Comments = _.extend({}, OCA.Comments); if (!OCA.Comments) { /** @@ -26,12 +34,88 @@ 'favorites' ], + _formatCommentCount: function(count) { + if (!this._commentsUnreadTemplate) { + this._commentsUnreadTemplate = Handlebars.compile(TEMPLATE_COMMENTS_UNREAD); + } + return this._commentsUnreadTemplate({ + count: count, + countMessage: t('comments', '{count} unread comments', {count: count}), + iconUrl: OC.imagePath('core', 'actions/comment') + }); + }, + attach: function(fileList) { + var self = this; if (this.allowedLists.indexOf(fileList.id) < 0) { return; } fileList.registerTabView(new OCA.Comments.CommentsTabView('commentsTabView')); + + var NS_OC = 'http://owncloud.org/ns'; + + var oldGetWebdavProperties = fileList._getWebdavProperties; + fileList._getWebdavProperties = function() { + var props = oldGetWebdavProperties.apply(this, arguments); + props.push('{' + NS_OC + '}comments-unread'); + return props; + }; + + fileList.filesClient.addFileInfoParser(function(response) { + var data = {}; + var props = response.propStat[0].properties; + var commentsUnread = props['{' + NS_OC + '}comments-unread']; + if (!_.isUndefined(commentsUnread) && commentsUnread !== '') { + data.commentsUnread = parseInt(commentsUnread, 10); + } + return data; + }); + + fileList.$el.addClass('has-comments'); + var oldCreateRow = fileList._createRow; + fileList._createRow = function(fileData) { + var $tr = oldCreateRow.apply(this, arguments); + if (fileData.commentsUnread) { + $tr.attr('data-comments-unread', fileData.commentsUnread); + } + return $tr; + }; + + // register "comment" action for reading comments + fileList.fileActions.registerAction({ + name: 'Comment', + displayName: t('comments', 'Comment'), + mime: 'all', + permissions: OC.PERMISSION_READ, + type: OCA.Files.FileActions.TYPE_INLINE, + render: function(actionSpec, isDefault, context) { + var $file = context.$file; + var unreadComments = $file.data('comments-unread'); + if (unreadComments) { + var $actionLink = $(self._formatCommentCount(unreadComments)); + context.$file.find('a.name>span.fileactions').append($actionLink); + return $actionLink; + } + return ''; + }, + actionHandler: function(fileName, context) { + context.$file.find('.action-comment').tooltip('hide'); + // open sidebar in comments section + context.fileList.showDetailsView(fileName, 'commentsTabView'); + } + }); + + // add attribute to "elementToFile" + var oldElementToFile = fileList.elementToFile; + fileList.elementToFile = function($el) { + var fileInfo = oldElementToFile.apply(this, arguments); + var commentsUnread = $el.data('comments-unread'); + if (commentsUnread) { + fileInfo.commentsUnread = commentsUnread; + } + return fileInfo; + }; } }; diff --git a/apps/comments/tests/js/filespluginSpec.js b/apps/comments/tests/js/filespluginSpec.js new file mode 100644 index 0000000000..78becc5af0 --- /dev/null +++ b/apps/comments/tests/js/filespluginSpec.js @@ -0,0 +1,102 @@ +/* + * Copyright (c) 2016 Vincent Petry + * + * This file is licensed under the Affero General Public License version 3 + * or later. + * + * See the COPYING-README file. + * + */ + +describe('OCA.Comments.FilesPlugin tests', function() { + var fileList; + var testFiles; + + beforeEach(function() { + var $content = $('
'); + $('#testArea').append($content); + // dummy file list + var $div = $( + '
' + + '' + + '' + + '' + + '
' + + '
'); + $('#content').append($div); + + fileList = new OCA.Files.FileList($div); + OCA.Comments.FilesPlugin.attach(fileList); + + testFiles = [{ + id: 1, + type: 'file', + name: 'One.txt', + path: '/subdir', + mimetype: 'text/plain', + size: 12, + permissions: OC.PERMISSION_ALL, + etag: 'abc', + shareOwner: 'User One', + isShareMountPoint: false, + commentsUnread: 3 + }]; + }); + afterEach(function() { + fileList.destroy(); + fileList = null; + }); + + describe('Comment icon', function() { + it('does not render icon when no unread comments available', function() { + testFiles[0].commentsUnread = 0; + fileList.setFiles(testFiles); + var $tr = fileList.findFileEl('One.txt'); + expect($tr.find('.action-comment').length).toEqual(0); + }); + it('renders comment icon and extra data', function() { + var $action, $tr; + fileList.setFiles(testFiles); + $tr = fileList.findFileEl('One.txt'); + $action = $tr.find('.action-comment'); + expect($action.length).toEqual(1); + expect($action.hasClass('permanent')).toEqual(true); + + expect($tr.attr('data-comments-unread')).toEqual('3'); + }); + it('clicking icon opens sidebar', function() { + var sidebarStub = sinon.stub(fileList, 'showDetailsView'); + var $action, $tr; + fileList.setFiles(testFiles); + $tr = fileList.findFileEl('One.txt'); + $action = $tr.find('.action-comment'); + $action.click(); + + expect(sidebarStub.calledOnce).toEqual(true); + expect(sidebarStub.lastCall.args[0]).toEqual('One.txt'); + expect(sidebarStub.lastCall.args[1]).toEqual('commentsTabView'); + }); + }); + describe('elementToFile', function() { + it('returns comment count', function() { + fileList.setFiles(testFiles); + var $tr = fileList.findFileEl('One.txt'); + var data = fileList.elementToFile($tr); + expect(data.commentsUnread).toEqual(3); + }); + it('does not set comment count when not set', function() { + delete testFiles[0].commentsUnread; + fileList.setFiles(testFiles); + var $tr = fileList.findFileEl('One.txt'); + var data = fileList.elementToFile($tr); + expect(data.commentsUnread).not.toBeDefined(); + }); + it('does not set comment count when zero', function() { + testFiles[0].commentsUnread = 0; + fileList.setFiles(testFiles); + var $tr = fileList.findFileEl('One.txt'); + var data = fileList.elementToFile($tr); + expect(data.commentsUnread).not.toBeDefined(); + }); + }); +}); diff --git a/core/img/actions/comment.png b/core/img/actions/comment.png new file mode 100644 index 0000000000000000000000000000000000000000..7ca20eba363b77d280b976c690ce778e9c4d2fbe GIT binary patch literal 169 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!73?$#)eFPGa4)6(a1=6^{l)y&{Ksk<*AirP+ zBTJ_@A3lFkE!?yhC}!&E;uyjaot)6n+|$>`=PtnPQNBg1K|&#hNAzVzyP=grkc + + + diff --git a/tests/karma.config.js b/tests/karma.config.js index 4a7a9ad236..fddcfb319e 100644 --- a/tests/karma.config.js +++ b/tests/karma.config.js @@ -90,7 +90,7 @@ module.exports = function(config) { 'apps/comments/js/commentmodel.js', 'apps/comments/js/commentcollection.js', 'apps/comments/js/commentstabview.js', - 'apps/comments/js/filesplugin' + 'apps/comments/js/filesplugin.js' ], testFiles: ['apps/comments/tests/js/**/*.js'] },