notification fronend refactor

2016-02-01 17:09:45 +02:00
parent 4f4069c3d7
commit ed7d24bc8f
29 changed files with 249 additions and 44 deletions
@@ -44,10 +44,12 @@ class Notification extends \Espo\Core\Controllers\Base

        $offset = intval($request->get('offset'));
        $maxSize = intval($request->get('maxSize'));
+        $after = $request->get('after');

        $params = array(
            'offset' => $offset,
            'maxSize' => $maxSize,
+            'after' => $after
        );

        $result = $this->getService('Notification')->getList($userId, $params);
@@ -217,7 +217,9 @@
        "writeYourCommentHere": "Write your comment here",
        "writeMessageToUser": "Write a message to {user}",
        "writeMessageToSelf": "Write a message to self",
-        "typeAndPressEnter": "Type & press enter"
+        "typeAndPressEnter": "Type & press enter",
+        "checkForNewNotifications": "Check for new notifications",
+        "checkForNewNotes": "Check for new Stream entries"
    },
    "boolFilters": {
        "onlyMy": "Only My",
@@ -1,5 +1,7 @@
 {
-  "itemViews": {
-    "System": "Notifications.Items.System"
-  }
+    "controller": "controllers/notification",
+    "collection": "collections/note",
+    "itemViews": {
+        "System": "views/notification/items/system"
+    }
 }
@@ -152,9 +152,16 @@ class Notification extends \Espo\Core\Services\Base
    public function getList($userId, array $params = array())
    {
        $searchParams = array();
-        $searchParams['whereClause'] = array(
+
+        $whereClause = array(
            'userId' => $userId
        );
+        if (!empty($params['after'])) {
+            $whereClause['createdAt>'] = $params['after'];
+        }
+
+        $searchParams['whereClause'] = $whereClause;
+
        if (array_key_exists('offset', $params)) {
            $searchParams['offset'] = $params['offset'];
        }
@@ -0,0 +1,19 @@
+<div class="page-header">
+    <div class="row">
+        <div class="col-sm-7">
+            <h3>{{translate 'Notifications'}}</h3>
+        </div>
+        <div class="col-sm-5">
+            <div class="pull-right btn-group">
+                <button class="btn btn-default" data-action="markAllNotificationsRead" title="{{translate 'Mark all read'}}">{{translate 'Mark all read'}}</button>
+                <button class="btn btn-default" data-action="refresh" title="{{translate 'checkForNewNotifications' category='messages'}}">&nbsp;&nbsp;<span class="glyphicon glyphicon-refresh"></span>&nbsp;&nbsp;</button>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="row">
+    <div class="col-md-8">
+        <div class="list-container">{{{list}}}</div>
+    </div>
+</div>
@@ -10,7 +10,7 @@
                {{#each filterList}}
                <button class="btn btn-default{{#ifEqual this ../filter}} active{{/ifEqual}}" data-action="selectFilter" data-name="{{./this}}">{{translate this scope='Note' category='filters'}}</button>
                {{/each}}
-                <button class="btn btn-default" data-action="refresh" title="{{translate 'Refresh'}}">&nbsp;&nbsp;<span class="glyphicon glyphicon-refresh"></span>&nbsp;&nbsp;</button>
+                <button class="btn btn-default" data-action="refresh" title="{{translate 'checkForNewNotes' category='messages'}}">&nbsp;&nbsp;<span class="glyphicon glyphicon-refresh"></span>&nbsp;&nbsp;</button>
            </div>
        </div>
    </div>
@@ -25,11 +25,19 @@
 * In accordance with Section 7(b) of the GNU General Public License version 3,
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/
-
-Espo.define('views/notifications/list', 'views/record/list-expanded', function (Dep) {
+Espo.define('controllers/notification', 'controller', function (Dep) {

    return Dep.extend({

+        defaultAction: 'index',
+
+        index: function () {
+            this.main('views/notification/list', {
+            }, function (view) {
+                view.render();
+            });
+        }
+
    });

 });
@@ -26,11 +26,11 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/badge', 'view', function (Dep) {
+Espo.define('views/notification/badge', 'view', function (Dep) {

    return Dep.extend({

-        template: 'notifications/badge',
+        template: 'notification/badge',

        notificationsCheckInterval: 10,

@@ -237,7 +237,7 @@ Espo.define('views/notifications/badge', 'view', function (Dep) {

            $container.appendTo(this.$el.find('.notifications-panel-container'));

-            this.createView('panel', 'Notifications.Panel', {
+            this.createView('panel', 'views/notification/panel', {
                el: '#notifications-panel',
            }, function (view) {
                view.render();
@@ -26,15 +26,15 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/field', 'views/fields/base', function (Dep) {
+Espo.define('views/notification/fields/container', 'views/fields/base', function (Dep) {

    return Dep.extend({

        type: 'notification',

-        listTemplate: 'notifications/field',
+        listTemplate: 'notification/fields/container',

-        detailTemplate: 'notifications/field',
+        detailTemplate: 'notification/fields/container',

        setup: function () {
            switch (this.model.get('type')) {
@@ -54,7 +54,7 @@ Espo.define('views/notifications/field', 'views/fields/base', function (Dep) {
            if (!type) return;
            type = type.replace(/ /g, '');

-            var viewName = this.getMetadata().get('clientDefs.Notification.itemViews.' + type) || 'views/notifications/items/' + Espo.Utils.camelCaseToHyphen(type);
+            var viewName = this.getMetadata().get('clientDefs.Notification.itemViews.' + type) || 'views/notification/items/' + Espo.Utils.camelCaseToHyphen(type);
            this.createView('notification', viewName, {
                model: this.model,
                el: this.params.containerEl + ' li[data-id="' + this.model.id + '"]',
@@ -81,7 +81,7 @@ Espo.define('views/notifications/field', 'views/fields/base', function (Dep) {
            this.wait(true);
            this.getModelFactory().create('Note', function (model) {
                model.set(data);
-                var viewName = 'Stream.Notes.MentionInPost';
+                var viewName = 'views/stream/notes/mention-in-post';
                this.createView('notification', viewName, {
                    model: model,
                    userId: this.model.get('userId'),
@@ -24,24 +24,24 @@
 *
 * In accordance with Section 7(b) of the GNU General Public License version 3,
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
- ************************************************************************/ 
+ ************************************************************************/

-Espo.define('Views.Notifications.Read', 'Views.Fields.Base', function (Dep) {
+Espo.define('views/notification/fields/read', 'views/fields/base', function (Dep) {

    return Dep.extend({

-        type: 'read',            
-        
-        listTemplate: 'notifications.read',
-        
-        detailTemplate: 'notifications.read',
-        
+        type: 'read',
+
+        listTemplate: 'notification/fields/read',
+
+        detailTemplate: 'notification/fields/read',
+
        data: function () {
            return {
                isRead: this.model.get('read')
            };
-        },        
-        
+        },
+
    });
 });

@@ -26,13 +26,13 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/items/assign', 'views/notifications/notification', function (Dep) {
+Espo.define('views/notification/items/assign', 'views/notification/items/base', function (Dep) {

    return Dep.extend({

        messageName: 'assign',

-        template: 'notifications/items/assign',
+        template: 'notification/items/assign',

        setup: function () {
            var data = this.model.get('data') || {};
@@ -26,7 +26,7 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/notification', 'view', function (Dep) {
+Espo.define('views/notification/items/base', 'view', function (Dep) {

    return Dep.extend({

@@ -26,13 +26,13 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/items/email-received', 'views/notifications/notification', function (Dep) {
+Espo.define('views/notification/items/email-received', 'views/notification/items/base', function (Dep) {

    return Dep.extend({

        messageName: 'emailReceived',

-        template: 'notifications/items/email-received',
+        template: 'notification/items/email-received',

        data: function () {
            return _.extend({
@@ -26,13 +26,13 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/items/entity-removed', 'views/notifications/notification', function (Dep) {
+Espo.define('views/notification/items/entity-removed', 'views/notification/items/base', function (Dep) {

    return Dep.extend({

        messageName: 'entityRemoved',

-        template: 'notifications/items/entity-removed',
+        template: 'notification/items/entity-removed',

        setup: function () {
            var data = this.model.get('data') || {};
@@ -26,11 +26,11 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/items/message', 'views/notifications/notification', function (Dep) {
+Espo.define('views/notification/items/message', 'views/notification/items/base', function (Dep) {

    return Dep.extend({

-        template: 'notifications/items/message',
+        template: 'notification/items/message',

        data: function () {
            return _.extend({
@@ -26,11 +26,11 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('views/notifications/items/system', 'views/notifications/notification', function (Dep) {
+Espo.define('views/notification/items/system', 'views/notification/items/base', function (Dep) {

    return Dep.extend({

-        template: 'notifications/items/system',
+        template: 'notification/items/system',

        data: function () {
            var data = Dep.prototype.data.call(this);
@@ -0,0 +1,92 @@
+/************************************************************************
+ * This file is part of EspoCRM.
+ *
+ * EspoCRM - Open Source CRM application.
+ * Copyright (C) 2014-2015 Yuri Kuznetsov, Taras Machyshyn, Oleksiy Avramenko
+ * Website: http://www.espocrm.com
+ *
+ * EspoCRM is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * EspoCRM is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with EspoCRM. If not, see http://www.gnu.org/licenses/.
+ *
+ * The interactive user interfaces in modified source and object code versions
+ * of this program must display Appropriate Legal Notices, as required under
+ * Section 5 of the GNU General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
+ ************************************************************************/
+
+Espo.define('views/notification/list', 'view', function (Dep) {
+
+    return Dep.extend({
+
+        template: 'notification/list',
+
+        events: {
+            'click [data-action="markAllNotificationsRead"]': function () {
+                $.ajax({
+                    url: 'Notification/action/markAllRead',
+                    type: 'POST'
+                }).done(function (count) {
+                    this.trigger('all-read');
+                }.bind(this));
+            },
+            'click [data-action="refresh"]': function () {
+                this.getView('list').showNewRecords();
+            },
+        },
+
+        setup: function () {
+            this.wait(true);
+            this.getCollectionFactory().create('Notification', function (collection) {
+                this.collection = collection;
+                collection.maxSize = this.getConfig().get('recordsPerPage') || 20;
+                this.wait(false);
+            }, this);
+        },
+
+        afterRender: function () {
+            this.listenToOnce(this.collection, 'sync', function () {
+                var viewName = this.getMetadata().get(['clientDefs', 'Notification', 'recordViews', 'list']) || 'views/notification/record/list';
+                this.createView('list', viewName, {
+                    el: this.options.el + ' .list-container',
+                    collection: this.collection,
+                    showCount: false,
+                    listLayout: {
+                        rows: [
+                            [
+                                {
+                                    name: 'data',
+                                    view: 'views/notification/fields/container',
+                                    params: {
+                                        containerEl: this.options.el
+                                    },
+                                }
+                            ]
+                        ],
+                        right: {
+                            name: 'read',
+                            view: 'views/notification/fields/read',
+                            width: '10px'
+                        }
+                    }
+                }, function (view) {
+                    view.render();
+                });
+            }, this);
+            this.collection.fetch();
+        }
+
+    });
+
+});
@@ -26,11 +26,11 @@
 * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
 ************************************************************************/

-Espo.define('Views.Notifications.Panel', 'View', function (Dep) {
+Espo.define('views/notification/panel', 'view', function (Dep) {

    return Dep.extend({

-        template: 'notifications.panel',
+        template: 'notification/panel',

        events: {
            'click [data-action="markAllNotificationsRead"]': function () {
@@ -54,7 +54,8 @@ Espo.define('Views.Notifications.Panel', 'View', function (Dep) {

        afterRender: function () {
            this.listenToOnce(this.collection, 'sync', function () {
-                this.createView('list', 'Notifications.List', {
+                var viewName = this.getMetadata().get(['clientDefs', 'Notification', 'recordViews', 'list']) || 'views/notification/record/list';
+                this.createView('list', viewName, {
                    el: this.options.el + ' .list-container',
                    collection: this.collection,
                    showCount: false,
@@ -63,7 +64,7 @@ Espo.define('Views.Notifications.Panel', 'View', function (Dep) {
                            [
                                {
                                    name: 'data',
-                                    view: 'Notifications.Field',
+                                    view: 'views/notification/fields/container',
                                    params: {
                                        containerEl: this.options.el
                                    },
@@ -72,14 +73,14 @@ Espo.define('Views.Notifications.Panel', 'View', function (Dep) {
                        ],
                        right: {
                            name: 'read',
-                            view: 'Notifications.Read',
+                            view: 'views/notification/fields/read',
                            width: '10px'
                        }
                    }
                }, function (view) {
                    view.render();
                });
-            }.bind(this));
+            }, this);
            this.collection.fetch();
        }

@@ -0,0 +1,72 @@
+/************************************************************************
+ * This file is part of EspoCRM.
+ *
+ * EspoCRM - Open Source CRM application.
+ * Copyright (C) 2014-2015 Yuri Kuznetsov, Taras Machyshyn, Oleksiy Avramenko
+ * Website: http://www.espocrm.com
+ *
+ * EspoCRM is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * EspoCRM is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with EspoCRM. If not, see http://www.gnu.org/licenses/.
+ *
+ * The interactive user interfaces in modified source and object code versions
+ * of this program must display Appropriate Legal Notices, as required under
+ * Section 5 of the GNU General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
+ ************************************************************************/
+
+Espo.define('views/notification/record/list', 'views/record/list-expanded', function (Dep) {
+
+    return Dep.extend({
+
+        showNewRecords: function () {
+            var collection = this.collection;
+            var initialCount = collection.length;
+
+            var $list = this.$el.find(this.listContainerEl);
+
+            var success = function () {
+                if (initialCount === 0) {
+                    this.reRender();
+                    return;
+                }
+                var rowCount = collection.length - initialCount;
+                var rowsReady = 0;
+                for (var i = rowCount - 1; i >= 0; i--) {
+                    var model = collection.at(i);
+
+                    this.buildRow(i, model, function (view) {
+                        view.getHtml(function (html) {
+                            var $row = $(this.getRowContainerHtml(model.id));
+                            $row.append(html);
+                            $list.prepend($row);
+                            rowsReady++;
+                            view._afterRender();
+                            if (view.options.el) {
+                                view.setElement(view.options.el);
+                            }
+                        }.bind(this));
+                    });
+                }
+                this.noRebuild = true;
+            }.bind(this);
+
+            collection.fetchNew({
+                success: success,
+            });
+        }
+
+    });
+
+});
@@ -124,7 +124,7 @@ Espo.define('views/site/navbar', 'view', function (Dep) {
                return true;
            }, this);

-            this.createView('notificationsBadge', 'views/notifications/badge', {
+            this.createView('notificationsBadge', 'views/notification/badge', {
                el: this.options.el + ' .notifications-badge-container'
            });