Agenda list slide improvements

- project summary of selected item
- show full tree OR main agenda items only
- show done items grey (without icon)
This commit is contained in:
Emanuel Schuetze 2016-02-24 21:01:52 +01:00
parent d3d73a019d
commit a6be43809f
7 changed files with 111 additions and 32 deletions

View File

@ -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 &&
typeof element.id !== 'undefined' &&
element.id == self.content_object.id;
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;
},
}
};
}
])

View File

@ -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 () {
$scope.items = AgendaTree.getFlatTree(Agenda.getAll());
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});
}
});
}
]);

View File

@ -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';
};

View File

@ -38,14 +38,26 @@
<translate>Select ...</translate>
</button>
<!-- project agenda button -->
<a os-perms="core.can_manage_projector"
class="btn btn-default"
title="{{ 'Project agenda' | translate }}"
ng-click="projectAgenda()"
ng-class="{ 'btn-primary': isAgendaProjected() }">
<i class="fa fa-video-camera"></i>
<translate>Agenda</translate>
</a>
<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(tree=true)"
ng-class="{ 'btn-primary': isAgendaProjected(tree=true) }">
<i class="fa fa-video-camera"></i>
<translate>Agenda</translate>
</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() }"
ng-click="item.project()"
title="{{ 'Project item' | translate }}">
<i class="fa fa-video-camera"></i>
</a>
<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()"
ng-class="{ 'btn-primary': item.isProjected() }">
<i class="fa fa-video-camera"></i>
</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">

View File

@ -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>

View File

@ -532,6 +532,11 @@ img {
background-color: #317796;
}
.slimDropDown {
padding-left: 4px !important;
padding-right: 4px !important;
}
.spacer, .spacer-top {
margin-top: 7px;
}

View File

@ -301,6 +301,9 @@ tr.elected td {
.agendalist p {
font-size: 140%;
}
.agendalist p.done {
color: #9a9898;
}
.agendalist .mainitem {
margin-top: 25px;
}