1
0
mirror of https://github.com/ascribe/onion.git synced 2024-11-15 01:25:17 +01:00

Merge branch 'AD-391-add-filter-functions-to-pieces-an'

This commit is contained in:
Tim Daubenschütz 2015-08-07 13:24:36 +02:00
commit 15c0ae6430
6 changed files with 68 additions and 21 deletions

View File

@ -36,9 +36,9 @@ let AclProxy = React.createClass({
</span>
);
} else {
if(typeof this.props.aclObject[this.props.aclName] === 'undefined') {
/* if(typeof this.props.aclObject[this.props.aclName] === 'undefined') {
console.warn('The aclName you\'re filtering for was not present (or undefined) in the aclObject.');
}
} */
return null;
}
}

View File

@ -89,7 +89,7 @@ let Edition = React.createClass({
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
EditionListActions.refreshEditionList(this.props.edition.parent);
EditionListActions.refreshEditionList({pieceId: this.props.edition.parent});
EditionListActions.closeAllEditionLists();
EditionListActions.clearAllEditionSelections();

View File

@ -81,7 +81,7 @@ let PieceListBulkModal = React.createClass({
this.fetchSelectedPieceEditionList()
.forEach((pieceId) => {
EditionListActions.refreshEditionList(pieceId);
EditionListActions.refreshEditionList({pieceId, filterBy: {}});
});
EditionListActions.clearAllEditionSelections();
},

View File

@ -80,7 +80,7 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({
title={filterIcon}
className="ascribe-piece-list-toolbar-filter-widget">
<li style={{'textAlign': 'center'}}>
<em>{getLangText('Show works that')}:</em>
<em>{getLangText('Show works I can')}:</em>
</li>
{this.props.filterParams.map((param, i) => {
let label;
@ -100,7 +100,7 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({
className="filter-widget-item">
<div className="checkbox-line">
<span>
{getLangText('I can') + ' ' + getLangText(label)}
{getLangText(label)}
</span>
<input
readOnly

View File

@ -6,6 +6,9 @@ import Router from 'react-router';
import PieceListStore from '../stores/piece_list_store';
import PieceListActions from '../actions/piece_list_actions';
import EditionListStore from '../stores/edition_list_store';
import EditionListActions from '../actions/edition_list_actions';
import AccordionList from './ascribe_accordion_list/accordion_list';
import AccordionListItem from './ascribe_accordion_list/accordion_list_item';
import AccordionListItemTableEditions from './ascribe_accordion_list/accordion_list_item_table_editions';
@ -17,6 +20,7 @@ import PieceListToolbar from './ascribe_piece_list_toolbar/piece_list_toolbar';
import AppConstants from '../constants/application_constants';
import { mergeOptions } from '../utils/general_utils';
let PieceList = React.createClass({
propTypes: {
@ -27,16 +31,22 @@ let PieceList = React.createClass({
mixins: [Router.Navigation, Router.State],
getInitialState() {
return PieceListStore.getState();
return mergeOptions(
PieceListStore.getState(),
EditionListStore.getState()
);
},
componentDidMount() {
let page = this.getQuery().page || 1;
PieceListStore.listen(this.onChange);
EditionListStore.listen(this.onChange);
if (this.state.pieceList.length === 0){
PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc, this.state.filterBy)
.then(PieceListActions.fetchPieceRequestActions());
.then(PieceListActions.fetchPieceRequestActions());
}
},
@ -49,6 +59,7 @@ let PieceList = React.createClass({
componentWillUnmount() {
PieceListStore.unlisten(this.onChange);
EditionListStore.unlisten(this.onChange);
},
onChange(state) {
@ -56,13 +67,14 @@ let PieceList = React.createClass({
},
paginationGoToPage(page) {
// if the users clicks a pager of the pagination,
// the site should go to the top
document.body.scrollTop = document.documentElement.scrollTop = 0;
return () => PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
return () => {
// if the users clicks a pager of the pagination,
// the site should go to the top
document.body.scrollTop = document.documentElement.scrollTop = 0;
PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc,
this.state.filterBy);
};
},
getPagination() {
@ -86,8 +98,24 @@ let PieceList = React.createClass({
},
applyFilterBy(filterBy) {
// first we need to apply the filter on the piece list
PieceListActions.fetchPieceList(1, this.state.pageSize, this.state.search,
this.state.orderBy, this.state.orderAsc, filterBy);
this.state.orderBy, this.state.orderAsc, filterBy)
.then(() => {
// but also, we need to filter all the open edition lists
this.state.pieceList
.forEach((piece) => {
// but only if they're actually open
if(this.state.isEditionListOpenForPieceId[piece.id].show) {
EditionListActions.refreshEditionList({
pieceId: piece.id,
filterBy
});
}
});
});
// we have to redirect the user always to page one as it could be that there is no page two
// for filtered pieces
this.transitionTo(this.getPathname(), {page: 1});
@ -100,7 +128,6 @@ let PieceList = React.createClass({
render() {
let loadingElement = (<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />);
return (
<div>
<PieceListToolbar

View File

@ -61,8 +61,7 @@ class EditionListStore {
* We often just have to refresh the edition list for a certain pieceId,
* this method provides exactly that functionality without any side effects
*/
onRefreshEditionList(pieceId) {
onRefreshEditionList({pieceId, filterBy}) {
// It may happen that the user enters the site logged in already
// through /editions
// If he then tries to delete a piece/edition and this method is called,
@ -72,9 +71,18 @@ class EditionListStore {
return;
}
const prevEditionListLength = this.editionList[pieceId].length;
const prevEditionListPage = this.editionList[pieceId].page;
const prevEditionListPageSize = this.editionList[pieceId].pageSize;
let prevEditionListLength = this.editionList[pieceId].length;
let prevEditionListPage = this.editionList[pieceId].page;
let prevEditionListPageSize = this.editionList[pieceId].pageSize;
// we can also refresh the edition list using filterBy,
// if we decide not to do that then the old filter will just be applied.
if(filterBy && Object.keys(filterBy).length <= 0) {
filterBy = this.editionList[pieceId].filterBy;
prevEditionListLength = 10;
prevEditionListPage = 1;
prevEditionListPageSize = 10;
}
// to clear an array, david walsh recommends to just set it's length to zero
// http://davidwalsh.name/empty-array
@ -84,7 +92,7 @@ class EditionListStore {
EditionsListActions.fetchEditionList(pieceId, 1, prevEditionListLength,
this.editionList[pieceId].orderBy,
this.editionList[pieceId].orderAsc,
this.editionList[pieceId].filterBy)
filterBy)
.then(() => {
// reset back to the normal pageSize and page
this.editionList[pieceId].page = prevEditionListPage;
@ -125,9 +133,21 @@ class EditionListStore {
}
onToggleEditionList(pieceId) {
this.isEditionListOpenForPieceId[pieceId] = {
show: this.isEditionListOpenForPieceId[pieceId] ? !this.isEditionListOpenForPieceId[pieceId].show : true
};
// When loading all editions of a piece, closing the table and then applying the filter
// the merge fails, as the edition list is not refreshed when closed.
// Therefore in the case of a filter application when closed, we need to reload the
// edition list
if(!this.isEditionListOpenForPieceId[pieceId].show) {
// to clear an array, david walsh recommends to just set it's length to zero
// http://davidwalsh.name/empty-array
this.editionList[pieceId].length = 0;
}
}
onCloseAllEditionLists() {