mirror of
https://github.com/ascribe/onion.git
synced 2025-02-14 21:10:27 +01:00
Merge branch 'AD-391-add-filter-functions-to-pieces-an'
This commit is contained in:
commit
15c0ae6430
@ -36,9 +36,9 @@ let AclProxy = React.createClass({
|
|||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
} else {
|
} 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.');
|
console.warn('The aclName you\'re filtering for was not present (or undefined) in the aclObject.');
|
||||||
}
|
} */
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -89,7 +89,7 @@ let Edition = React.createClass({
|
|||||||
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
|
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
|
||||||
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
|
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.closeAllEditionLists();
|
||||||
EditionListActions.clearAllEditionSelections();
|
EditionListActions.clearAllEditionSelections();
|
||||||
|
|
||||||
|
@ -81,7 +81,7 @@ let PieceListBulkModal = React.createClass({
|
|||||||
|
|
||||||
this.fetchSelectedPieceEditionList()
|
this.fetchSelectedPieceEditionList()
|
||||||
.forEach((pieceId) => {
|
.forEach((pieceId) => {
|
||||||
EditionListActions.refreshEditionList(pieceId);
|
EditionListActions.refreshEditionList({pieceId, filterBy: {}});
|
||||||
});
|
});
|
||||||
EditionListActions.clearAllEditionSelections();
|
EditionListActions.clearAllEditionSelections();
|
||||||
},
|
},
|
||||||
|
@ -80,7 +80,7 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({
|
|||||||
title={filterIcon}
|
title={filterIcon}
|
||||||
className="ascribe-piece-list-toolbar-filter-widget">
|
className="ascribe-piece-list-toolbar-filter-widget">
|
||||||
<li style={{'textAlign': 'center'}}>
|
<li style={{'textAlign': 'center'}}>
|
||||||
<em>{getLangText('Show works that')}:</em>
|
<em>{getLangText('Show works I can')}:</em>
|
||||||
</li>
|
</li>
|
||||||
{this.props.filterParams.map((param, i) => {
|
{this.props.filterParams.map((param, i) => {
|
||||||
let label;
|
let label;
|
||||||
@ -100,7 +100,7 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({
|
|||||||
className="filter-widget-item">
|
className="filter-widget-item">
|
||||||
<div className="checkbox-line">
|
<div className="checkbox-line">
|
||||||
<span>
|
<span>
|
||||||
{getLangText('I can') + ' ' + getLangText(label)}
|
{getLangText(label)}
|
||||||
</span>
|
</span>
|
||||||
<input
|
<input
|
||||||
readOnly
|
readOnly
|
||||||
|
@ -6,6 +6,9 @@ import Router from 'react-router';
|
|||||||
import PieceListStore from '../stores/piece_list_store';
|
import PieceListStore from '../stores/piece_list_store';
|
||||||
import PieceListActions from '../actions/piece_list_actions';
|
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 AccordionList from './ascribe_accordion_list/accordion_list';
|
||||||
import AccordionListItem from './ascribe_accordion_list/accordion_list_item';
|
import AccordionListItem from './ascribe_accordion_list/accordion_list_item';
|
||||||
import AccordionListItemTableEditions from './ascribe_accordion_list/accordion_list_item_table_editions';
|
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 AppConstants from '../constants/application_constants';
|
||||||
|
|
||||||
|
import { mergeOptions } from '../utils/general_utils';
|
||||||
|
|
||||||
let PieceList = React.createClass({
|
let PieceList = React.createClass({
|
||||||
propTypes: {
|
propTypes: {
|
||||||
@ -27,16 +31,22 @@ let PieceList = React.createClass({
|
|||||||
mixins: [Router.Navigation, Router.State],
|
mixins: [Router.Navigation, Router.State],
|
||||||
|
|
||||||
getInitialState() {
|
getInitialState() {
|
||||||
return PieceListStore.getState();
|
return mergeOptions(
|
||||||
|
PieceListStore.getState(),
|
||||||
|
EditionListStore.getState()
|
||||||
|
);
|
||||||
},
|
},
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
let page = this.getQuery().page || 1;
|
let page = this.getQuery().page || 1;
|
||||||
|
|
||||||
PieceListStore.listen(this.onChange);
|
PieceListStore.listen(this.onChange);
|
||||||
|
EditionListStore.listen(this.onChange);
|
||||||
|
|
||||||
if (this.state.pieceList.length === 0){
|
if (this.state.pieceList.length === 0){
|
||||||
PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
|
PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
|
||||||
this.state.orderBy, this.state.orderAsc, this.state.filterBy)
|
this.state.orderBy, this.state.orderAsc, this.state.filterBy)
|
||||||
.then(PieceListActions.fetchPieceRequestActions());
|
.then(PieceListActions.fetchPieceRequestActions());
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -49,6 +59,7 @@ let PieceList = React.createClass({
|
|||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
PieceListStore.unlisten(this.onChange);
|
PieceListStore.unlisten(this.onChange);
|
||||||
|
EditionListStore.unlisten(this.onChange);
|
||||||
},
|
},
|
||||||
|
|
||||||
onChange(state) {
|
onChange(state) {
|
||||||
@ -56,13 +67,14 @@ let PieceList = React.createClass({
|
|||||||
},
|
},
|
||||||
|
|
||||||
paginationGoToPage(page) {
|
paginationGoToPage(page) {
|
||||||
// if the users clicks a pager of the pagination,
|
return () => {
|
||||||
// the site should go to the top
|
// if the users clicks a pager of the pagination,
|
||||||
document.body.scrollTop = document.documentElement.scrollTop = 0;
|
// the site should go to the top
|
||||||
|
document.body.scrollTop = document.documentElement.scrollTop = 0;
|
||||||
return () => PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
|
PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search,
|
||||||
this.state.orderBy, this.state.orderAsc,
|
this.state.orderBy, this.state.orderAsc,
|
||||||
this.state.filterBy);
|
this.state.filterBy);
|
||||||
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
getPagination() {
|
getPagination() {
|
||||||
@ -86,8 +98,24 @@ let PieceList = React.createClass({
|
|||||||
},
|
},
|
||||||
|
|
||||||
applyFilterBy(filterBy) {
|
applyFilterBy(filterBy) {
|
||||||
|
// first we need to apply the filter on the piece list
|
||||||
PieceListActions.fetchPieceList(1, this.state.pageSize, this.state.search,
|
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
|
// we have to redirect the user always to page one as it could be that there is no page two
|
||||||
// for filtered pieces
|
// for filtered pieces
|
||||||
this.transitionTo(this.getPathname(), {page: 1});
|
this.transitionTo(this.getPathname(), {page: 1});
|
||||||
@ -100,7 +128,6 @@ let PieceList = React.createClass({
|
|||||||
|
|
||||||
render() {
|
render() {
|
||||||
let loadingElement = (<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />);
|
let loadingElement = (<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<PieceListToolbar
|
<PieceListToolbar
|
||||||
|
@ -61,8 +61,7 @@ class EditionListStore {
|
|||||||
* We often just have to refresh the edition list for a certain pieceId,
|
* We often just have to refresh the edition list for a certain pieceId,
|
||||||
* this method provides exactly that functionality without any side effects
|
* 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
|
// It may happen that the user enters the site logged in already
|
||||||
// through /editions
|
// through /editions
|
||||||
// If he then tries to delete a piece/edition and this method is called,
|
// If he then tries to delete a piece/edition and this method is called,
|
||||||
@ -72,9 +71,18 @@ class EditionListStore {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const prevEditionListLength = this.editionList[pieceId].length;
|
let prevEditionListLength = this.editionList[pieceId].length;
|
||||||
const prevEditionListPage = this.editionList[pieceId].page;
|
let prevEditionListPage = this.editionList[pieceId].page;
|
||||||
const prevEditionListPageSize = this.editionList[pieceId].pageSize;
|
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
|
// to clear an array, david walsh recommends to just set it's length to zero
|
||||||
// http://davidwalsh.name/empty-array
|
// http://davidwalsh.name/empty-array
|
||||||
@ -84,7 +92,7 @@ class EditionListStore {
|
|||||||
EditionsListActions.fetchEditionList(pieceId, 1, prevEditionListLength,
|
EditionsListActions.fetchEditionList(pieceId, 1, prevEditionListLength,
|
||||||
this.editionList[pieceId].orderBy,
|
this.editionList[pieceId].orderBy,
|
||||||
this.editionList[pieceId].orderAsc,
|
this.editionList[pieceId].orderAsc,
|
||||||
this.editionList[pieceId].filterBy)
|
filterBy)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
// reset back to the normal pageSize and page
|
// reset back to the normal pageSize and page
|
||||||
this.editionList[pieceId].page = prevEditionListPage;
|
this.editionList[pieceId].page = prevEditionListPage;
|
||||||
@ -125,9 +133,21 @@ class EditionListStore {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onToggleEditionList(pieceId) {
|
onToggleEditionList(pieceId) {
|
||||||
|
|
||||||
this.isEditionListOpenForPieceId[pieceId] = {
|
this.isEditionListOpenForPieceId[pieceId] = {
|
||||||
show: this.isEditionListOpenForPieceId[pieceId] ? !this.isEditionListOpenForPieceId[pieceId].show : true
|
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() {
|
onCloseAllEditionLists() {
|
||||||
|
Loading…
Reference in New Issue
Block a user