add filterBy to edition list action|store

js/actions/edition_list_actions.js

@@ -17,21 +17,21 @@ class EditionListActions {
         );
     }
 
-    fetchEditionList(pieceId, page, pageSize, orderBy, orderAsc) {
+    fetchEditionList(pieceId, page, pageSize, orderBy, orderAsc, filterBy) {
-        if(!orderBy && typeof orderAsc === 'undefined') {
+        if(!orderBy && typeof orderAsc === 'undefined' || !orderAsc) {
             orderBy = 'edition_number';
             orderAsc = true;
         }
 
         // Taken from: http://stackoverflow.com/a/519157/1263876
-        if(typeof page === 'undefined' && typeof pageSize === 'undefined') {
+        if(typeof page === 'undefined' || !page && typeof pageSize === 'undefined' || !pageSize) {
             page = 1;
             pageSize = 10;
         }
 
         return Q.Promise((resolve, reject) => {
             EditionListFetcher
-                .fetch(pieceId, page, pageSize, orderBy, orderAsc)
+                .fetch(pieceId, page, pageSize, orderBy, orderAsc, filterBy)
                 .then((res) => {
                     this.actions.updateEditionList({
                         pieceId,
@@ -39,6 +39,7 @@ class EditionListActions {
                         pageSize,
                         orderBy,
                         orderAsc,
+                        filterBy,
                         'editionListOfPiece': res.editions,
                         'count': res.count
                     });

js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js

@@ -6,10 +6,14 @@ import classNames from 'classnames';
 import EditionListActions from '../../actions/edition_list_actions';
 import EditionListStore from '../../stores/edition_list_store';
 
+import PieceListActions from '../../actions/piece_list_actions';
+import PieceListStore from '../../stores/piece_list_store';
+
 import Button from 'react-bootstrap/lib/Button';
 
 import CreateEditionsButton from '../ascribe_buttons/create_editions_button';
 
+import { mergeOptions } from '../../utils/general_utils';
 import { getLangText } from '../../utils/lang_utils';
 
 let AccordionListItemEditionWidget = React.createClass({
@@ -21,15 +25,20 @@ let AccordionListItemEditionWidget = React.createClass({
     },
 
     getInitialState() {
-        return EditionListStore.getState();
+        return mergeOptions(
+            EditionListStore.getState(),
+            PieceListStore.getState()
+        );
     },
 
     componentDidMount() {
         EditionListStore.listen(this.onChange);
+        PieceListStore.listen(this.onChange);
     },
 
     componentWillUnmount() {
         EditionListStore.unlisten(this.onChange);
+        PieceListStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -47,7 +56,7 @@ let AccordionListItemEditionWidget = React.createClass({
             EditionListActions.toggleEditionList(pieceId);
         } else {
             EditionListActions.toggleEditionList(pieceId);
-            EditionListActions.fetchEditionList(pieceId);
+            EditionListActions.fetchEditionList(pieceId, null, null, null, null, this.state.filterBy);
         }
     },
 

js/components/ascribe_accordion_list/accordion_list_item_table_editions.js

@@ -76,13 +76,9 @@ let AccordionListItemTableEditions = React.createClass({
         });
 
         let editionList = this.state.editionList[this.props.parentId];
-        EditionListActions.fetchEditionList(this.props.parentId, editionList.page + 1, editionList.pageSize);
+        EditionListActions.fetchEditionList(this.props.parentId, editionList.page + 1, editionList.pageSize,
+                                            editionList.orderBy, editionList.orderAsc, editionList.filterBy);
     },
-
-    changeEditionListOrder(orderBy, orderAsc) {
-        EditionListActions.fetchEditionList(this.props.parentId, orderBy, orderAsc);
-    },
-
     render() {
         let selectedEditionsCount = 0;
         let allEditionsCount = 0;

js/components/ascribe_buttons/create_editions_button.js

@@ -44,7 +44,9 @@ let CreateEditionsButton = React.createClass({
     startPolling() {
         // start polling until editions are defined
         let pollingIntervalIndex = setInterval(() => {
-            EditionListActions.fetchEditionList(this.props.piece.id)
+            let editionsForPiece = this.state.editionList[this.props.piece.id];
+
+            EditionListActions.fetchEditionList(this.props.piece.id, null, null, null, null, editionsForPiece.filterBy)
             .then((res) => {
 
                 clearInterval(this.state.pollingIntervalIndex);

js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js

@@ -103,6 +103,7 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({
                                 <span onClick={this.filterBy(param)}>
                                     {getLangText('I can') + ' ' + getLangText(name)}
                                     <input
+                                        readOnly
                                         type="checkbox"
                                         checked={this.state.filterBy[param]} />
                                 </span>

js/components/ascribe_table/table_item_subtable.js

@@ -1,113 +0,0 @@
-'use strict';
-
-import React from 'react';
-
-import { ColumnModel } from './models/table_models';
-
-import EditionListStore from '../../stores/edition_list_store';
-import EditionListActions from '../../actions/edition_list_actions';
-
-
-import Table from './table';
-import TableItemWrapper from './table_item_wrapper';
-import TableItemText from './table_item_text';
-import TableItemAcl from './table_item_acl';
-import TableItemSelectable from './table_item_selectable';
-import TableItemSubtableButton from './table_item_subtable_button';
-
-
-let TableItemSubtable = React.createClass({
-    propTypes: {
-        columnList: React.PropTypes.arrayOf(React.PropTypes.instanceOf(ColumnModel)),
-        columnContent: React.PropTypes.object
-    },
-
-    getInitialState() {
-        return {
-            'open': false
-        };
-    },
-
-    componentDidMount() {
-        EditionListStore.listen(this.onChange);
-    },
-
-    componentWillUnmount() {
-        EditionListStore.unlisten(this.onChange);
-    },
-
-    onChange(state) {
-        this.setState(state);
-    },
-
-    loadEditionList() {
-        if(this.state.open) {
-            this.setState({
-                'open': false
-            });
-        } else {
-
-            EditionListActions.fetchEditionList(this.props.columnContent.id);
-            this.setState({
-                'open': true,
-                'editionList': EditionListStore.getState()
-            });
-        }
-    },
-
-    selectItem(parentId, itemId) {
-        EditionListActions.selectEdition({
-            'pieceId': parentId,
-            'editionId': itemId
-        });
-    },
-
-    render() {
-
-        let renderEditionListTable = () => {
-
-            let columnList = [
-                new ColumnModel('edition_number', 'Number', TableItemText, 2, false),
-                new ColumnModel('user_registered', 'User', TableItemText, 4, true),
-                new ColumnModel('acl', 'Actions', TableItemAcl, 4, true)
-            ];
-
-            if(this.state.open && this.state.editionList[this.props.columnContent.id] && this.state.editionList[this.props.columnContent.id].length) {
-                return (
-                    <div className="row">
-                      <div className="col-xs-12 col-sm-12 col-md-12 col-lg-12">
-                        <Table itemList={this.state.editionList[this.props.columnContent.id]} columnList={columnList}>
-                            {this.state.editionList[this.props.columnContent.id].map((edition, i) => {
-                                return (
-                                    <TableItemSelectable
-                                        className="ascribe-table-item-selectable"
-                                        selectItem={this.selectItem}
-                                        parentId={this.props.columnContent.id}
-                                        key={i} />
-                                );
-                            })}
-                        </Table>
-                      </div>  
-                    </div>
-                );
-            }
-        };
-
-        return (
-            <div className="col-xs-12 col-sm-12 col-md-12 col-lg-12 ascribe-table-item">
-                <div className="row">
-                    <TableItemWrapper
-                        columnList={this.props.columnList}
-                        columnContent={this.props.columnContent}
-                        columnWidth={12} />
-                    <div className="col-xs-1 col-sm-1 col-md-1 col-lg-1 ascribe-table-item-column">
-                        <TableItemSubtableButton content="+" onClick={this.loadEditionList} />
-                    </div>
-                </div>
-                {renderEditionListTable()}
-            </div>
-        );
-    }
-});
-
-export default TableItemSubtable;

js/components/ascribe_table/table_item_subtable_button.js

@@ -1,23 +0,0 @@
-'use strict';
-
-import React from 'react';
-
-let TableItemSubtableButton = React.createClass({
-    
-    propTypes: {
-        content: React.PropTypes.string.isRequired,
-        onClick: React.PropTypes.func.isRequired
-    },
-
-    render() {
-        return (
-            <span>
-                <button type="button" className="btn btn-default btn-sm ascribe-table-expand-button" onClick={this.props.onClick}>
-                    {this.props.content}
-                </button>
-            </span>
-        );
-    }
-});
-
-export default TableItemSubtableButton;

js/fetchers/edition_list_fetcher.js

@@ -3,20 +3,26 @@
 import requests from '../utils/requests';
 
 import { generateOrderingQueryParams } from '../utils/fetch_api_utils';
-
+import { mergeOptions } from '../utils/general_utils';
 
 let EditionListFetcher = {
     /**
      * Fetches a list of editions from the API.
      */
-    fetch(pieceId, page, pageSize, orderBy, orderAsc) {
+    fetch(pieceId, page, pageSize, orderBy, orderAsc, filterBy) {
         let ordering = generateOrderingQueryParams(orderBy, orderAsc);
-        return requests.get('editions_list', {
+
-            'piece_id': pieceId,
+        let queryParams = mergeOptions(
+            {
                 page,
                 pageSize,
-            ordering
+                ordering,
-        });
+                piece_id: pieceId
+            },
+            filterBy
+        );
+
+        return requests.get('editions_list', queryParams);
     }
 };
 

js/stores/edition_list_store.js

@@ -12,7 +12,7 @@ class EditionListStore {
         this.bindActions(EditionsListActions);
     }
 
-    onUpdateEditionList({pieceId, editionListOfPiece, page, pageSize, orderBy, orderAsc, count}) {
+    onUpdateEditionList({pieceId, editionListOfPiece, page, pageSize, orderBy, orderAsc, count, filterBy}) {
         
         /*
             Basically there are two modes an edition list can be updated.
@@ -54,6 +54,7 @@ class EditionListStore {
         this.editionList[pieceId].orderBy = orderBy;
         this.editionList[pieceId].orderAsc = orderAsc;
         this.editionList[pieceId].count = count;
+        this.editionList[pieceId].filterBy = filterBy;
     }
 
     /**
@@ -80,7 +81,10 @@ class EditionListStore {
         this.editionList[pieceId].length = 0;
 
         // refetch editions with adjusted page size
-        EditionsListActions.fetchEditionList(pieceId, 1, prevEditionListLength, this.editionList[pieceId].orderBy, this.editionList[pieceId].orderAsc)
+        EditionsListActions.fetchEditionList(pieceId, 1, prevEditionListLength,
+                                            this.editionList[pieceId].orderBy,
+                                            this.editionList[pieceId].orderAsc,
+                                            this.editionList[pieceId].filterBy)
             .then(() => {
                 // reset back to the normal pageSize and page
                 this.editionList[pieceId].page = prevEditionListPage;