Agenda list slide improvements

- project summary of selected item - show full tree OR main agenda items only - show done items grey (without icon)
2016-02-24 21:01:52 +01:00 · 2016-02-24 21:01:52 +01:00 · a6be43809f
commit a6be43809f
parent d3d73a019d
7 changed files with 111 additions and 32 deletions
--- a/openslides/agenda/static/js/agenda/base.js
+++ b/openslides/agenda/static/js/agenda/base.js
@ -80,7 +80,7 @@ angular.module('OpenSlidesApp.agenda', ['OpenSlidesApp.users'])
                    );
                },
                // override isProjected function of jsDataModel factory
-                isProjected: function () {
+                isProjected: function (list) {
                    // Returns true if there is a projector element with the same
                    // name and the same id.
                    var projector = Projector.get(1);
@ -88,9 +88,19 @@ angular.module('OpenSlidesApp.agenda', ['OpenSlidesApp.users'])
                    if (typeof projector !== 'undefined') {
                        var self = this;
                        var predicate = function (element) {
-                            return element.name == self.content_object.collection &&
+                            var value;
+                            if (typeof list === 'undefined') {
+                                // Releated item detail slide
+                                value = element.name == self.content_object.collection &&
                                    typeof element.id !== 'undefined' &&
                                    element.id == self.content_object.id;
+                            } else {
+                                // Item list slide for sub tree
+                                value = element.name == 'agenda/item-list' &&
+                                    typeof element.id !== 'undefined' &&
+                                    element.id == self.id;
+                            }
+                            return value;
                        };
                        isProjected = typeof _.findKey(projector.elements, predicate) === 'string';
                    } else {
@ -186,21 +196,21 @@ angular.module('OpenSlidesApp.agenda', ['OpenSlidesApp.users'])
                return getChildren(parentItems);
            },

-            // Returns a list of all items as a flat tree the attribute parentCount
+            // Returns a list of all items as a flat tree
            getFlatTree: function(items) {
                var tree = this.getTree(items);
                var flatItems = [];

-                function generateFatTree(tree, parentCount) {
+                function generateFlatTree(tree, parentCount) {
                    _.each(tree, function (item) {
                        item.item.parentCount = parentCount;
                        flatItems.push(item.item);
-                        generateFatTree(item.children, parentCount + 1);
+                        generateFlatTree(item.children, parentCount + 1);
                    });
                }
-                generateFatTree(tree, 0);
+                generateFlatTree(tree, 0);
                return flatItems;
-            },
+            }
        };
    }
 ])
--- a/openslides/agenda/static/js/agenda/projector.js
+++ b/openslides/agenda/static/js/agenda/projector.js
@ -34,9 +34,10 @@ angular.module('OpenSlidesApp.agenda.projector', ['OpenSlidesApp.agenda'])
 .controller('SlideItemListCtrl', [
    '$scope',
    '$http',
+    '$filter',
    'Agenda',
    'AgendaTree',
-    function($scope, $http, Agenda, AgendaTree) {
+    function($scope, $http, $filter, Agenda, AgendaTree) {
        // Attention! Each object that is used here has to be dealt on server side.
        // Add it to the coresponding get_requirements method of the ProjectorElement
        // class.
@ -45,7 +46,30 @@ angular.module('OpenSlidesApp.agenda.projector', ['OpenSlidesApp.agenda'])
        $scope.$watch(function () {
            return Agenda.lastModified();
        }, function () {
+            if ($scope.element.id) {
+                $scope.rootItem = Agenda.get($scope.element.id);
+                var tree = AgendaTree.getFlatTree(Agenda.getAll());
+                var startIndex = tree.indexOf($scope.rootItem);
+                tree = tree.slice(startIndex);
+                // define delta to move the whole subtree to level 0
+                if (tree[0]) {
+                    var parentCountDelta = tree[0].parentCount;
+                }
+                $scope.items = [];
+                for (var i = 1; i < tree.length; i++) {
+                    if (tree[i].parentCount - parentCountDelta <= 0) {
+                        break;
+                    }
+                    var item = tree[i];
+                    // move rootItem (and all childs) to level 0
+                    item.parentCount = item.parentCount - parentCountDelta;
+                    $scope.items.push(item);
+                }
+            } else if ($scope.element.tree) {
                $scope.items = AgendaTree.getFlatTree(Agenda.getAll());
+            } else {
+                $scope.items = $filter('filter')(Agenda.getAll(), {'parent_id': null});
+            }
        });
    }
 ]);
--- a/openslides/agenda/static/js/agenda/site.js
+++ b/openslides/agenda/static/js/agenda/site.js
@ -178,19 +178,31 @@ angular.module('OpenSlidesApp.agenda.site', ['OpenSlidesApp.agenda'])
        };

        // project agenda
-        $scope.projectAgenda = function () {
+        $scope.projectAgenda = function (tree, id) {
            $http.post('/rest/core/projector/1/prune_elements/',
-                    [{name: 'agenda/item-list'}]);
+                    [{name: 'agenda/item-list', tree: tree, id: id}]);
        };
        // check if agenda is projected
-        $scope.isAgendaProjected = function () {
+        $scope.isAgendaProjected = function (tree) {
            // Returns true if there is a projector element with the name
            // 'agenda/item-list'.
            var projector = Projector.get(1);
            if (typeof projector === 'undefined') return false;
            var self = this;
            var predicate = function (element) {
-                return element.name == 'agenda/item-list';
+                var value;
+                if (typeof tree === 'undefined') {
+                    // only main agenda items
+                    value = element.name == 'agenda/item-list' &&
+                        typeof element.id === 'undefined' &&
+                        !element.tree;
+                } else {
+                    // tree with all agenda items
+                    value = element.name == 'agenda/item-list' &&
+                        typeof element.id === 'undefined' &&
+                        element.tree;
+                }
+                return value;
            };
            return typeof _.findKey(projector.elements, predicate) === 'string';
        };
--- a/openslides/agenda/static/templates/agenda/item-list.html
+++ b/openslides/agenda/static/templates/agenda/item-list.html
@ -38,14 +38,26 @@
            <translate>Select ...</translate>
          </button>
          <!-- project agenda button -->
-          <a os-perms="core.can_manage_projector"
+          <div class="btn-group" uib-dropdown>
+            <button os-perms="core.can_manage_projector"
+                type="button"
                class="btn btn-default"
                title="{{ 'Project agenda' | translate }}"
-              ng-click="projectAgenda()"
-              ng-class="{ 'btn-primary': isAgendaProjected() }">
+                ng-click="projectAgenda(tree=true)"
+                ng-class="{ 'btn-primary': isAgendaProjected(tree=true) }">
              <i class="fa fa-video-camera"></i>
              <translate>Agenda</translate>
-          </a>
+            </button>
+            <button type="button" class="btn btn-default"
+                ng-class="{ 'btn-primary': isAgendaProjected() }"
+                uib-dropdown-toggle>
+              <span class="caret"></span>
+            </button>
+            <ul class="uib-dropdown-menu" role="menu" aria-labelledby="split-button">
+              <li role="menuitem"><a href="" ng-click="projectAgenda(tree=true)" translate>All agenda items (Default)</a>
+              <li role="menuitem"><a href="" ng-click="projectAgenda(tree=false)" translate>Only main agenda items</a>
+            </ul>
+          </div>
          <!-- auto numbering button -->
          <a os-perms="core.can_manage_projector"
              class="btn btn-default"
@ -123,12 +135,25 @@
          ng-class="{ 'activeline': item.isProjected(), 'selected': item.selected, 'hiddenrow': item.is_hidden}">
        <!-- projector column -->
        <td ng-show="!isDeleteMode" os-perms="core.can_manage_projector">
-          <a class="btn btn-default btn-sm"
-              ng-class="{ 'btn-primary': item.isProjected() }"
+          <div class="btn-group" style="width:54px;" uib-dropdown>
+            <button os-perms="core.can_manage_projector"
+                type="button"
+                class="btn btn-default btn-sm"
+                title="{{ 'Project item' | translate }}"
                ng-click="item.project()"
-              title="{{ 'Project item' | translate }}">
+                ng-class="{ 'btn-primary': item.isProjected() }">
              <i class="fa fa-video-camera"></i>
-          </a>
+            </button>
+            <button type="button" class="btn btn-default btn-sm slimDropDown"
+                ng-class="{ 'btn-primary': item.isProjected(list=true) }"
+                uib-dropdown-toggle>
+              <span class="caret"></span>
+            </button>
+            <ul class="uib-dropdown-menu" role="menu" aria-labelledby="split-button">
+              <li role="menuitem"><a href="" ng-click="item.project()" translate>Project item (Default)</a>
+              <li role="menuitem"><a href="" ng-click="projectAgenda(tree=true, id=item.id)" translate>Project all sub items</a>
+            </ul>
+          </div>
        <!-- delete selection column -->
        <td ng-show="isDeleteMode" os-perms="agenda.can_manage" class="deleteColumn">
          <input type="checkbox" ng-model="item.selected">
--- a/openslides/agenda/static/templates/agenda/slide-item-list.html
+++ b/openslides/agenda/static/templates/agenda/slide-item-list.html
@ -1,13 +1,13 @@
 <div ng-controller="SlideItemListCtrl" class="content scrollcontent">
-  <h1 translate>Agenda</h1>
+  <h1 ng-if="!element.id" translate>Agenda</h1>
+  <h1 ng-if="element.id">{{ rootItem.getTitle() }}</h1>

  <div class="agendalist">
    <!-- item type: AGENDA_ITEM = 1, HIDDEN_ITEM = 2 -->
    <p ng-repeat="item in items | filter: {type: 1}"
-        ng-class="item.parent_id ? 'subitem' : 'mainitem'">
+        ng-class="{mainitem: item.parentCount == 0, subitem: item.parentCount != 0, done: item.closed}">
      <span ng-repeat="n in [].constructor(item.parentCount) track by $index">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
      {{ item.getListViewTitle() }}
-      <i ng-if="item.closed" class="fa fa-check"></i>
    </p>
  </div>
 </div>
--- a/openslides/core/static/css/app.css
+++ b/openslides/core/static/css/app.css
@ -532,6 +532,11 @@ img {
    background-color: #317796;
 }

+.slimDropDown {
+    padding-left: 4px !important;
+    padding-right: 4px !important;
+}
+
 .spacer, .spacer-top {
    margin-top: 7px;
 }
--- a/openslides/core/static/css/projector.css
+++ b/openslides/core/static/css/projector.css
@ -301,6 +301,9 @@ tr.elected td {
 .agendalist p {
    font-size: 140%;
 }
+.agendalist p.done {
+    color: #9a9898;
+}
 .agendalist .mainitem {
    margin-top: 25px;
 }