From 8a18d894cc41f17e419fb35f7e63d139d8e2e57c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= Date: Mon, 1 Jun 2015 15:12:31 +0200 Subject: [PATCH] add clear selection functionality --- index.html | 2 +- js/actions/edition_list_actions.js | 3 +- .../accordion_list_item_table_editions.js | 2 +- .../piece_list_toolbar.js | 54 ++++++++++++++----- js/components/piece_list.js | 2 +- js/stores/edition_list_store.js | 15 ++++++ sass/ascribe-piece-list-toolbar.scss | 20 +++++++ sass/main.scss | 14 +++-- 8 files changed, 90 insertions(+), 22 deletions(-) create mode 100644 sass/ascribe-piece-list-toolbar.scss diff --git a/index.html b/index.html index 4c875443..8b61e4b0 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@ -
+
diff --git a/js/actions/edition_list_actions.js b/js/actions/edition_list_actions.js index 48e02d2d..78cc0eeb 100644 --- a/js/actions/edition_list_actions.js +++ b/js/actions/edition_list_actions.js @@ -6,7 +6,8 @@ class EditionListActions { constructor() { this.generateActions( 'updateEditionList', - 'selectEdition' + 'selectEdition', + 'clearAllEditionSelections' ); } diff --git a/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js b/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js index 2432e019..2b3bd5c0 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js @@ -49,7 +49,7 @@ let AccordionListItemTableEditions = React.createClass({ new TableColumnContentModel((item) => { return { 'editionId': item.id, 'pieceId': this.props.parentId, 'selectItem': this.selectItem, 'selected': item.selected }}, '', '', TableItemCheckbox, 1, false), new TableColumnContentModel((item) => { return { 'content': item.edition_number }}, 'num_editions', 'Nr', TableItemText, 1, false), new TableColumnContentModel((item) => { return { 'content': item.bitcoin_id }}, 'bitcoin_id', 'Bitcoin Address', TableItemText, 5, false), - new TableColumnContentModel((item) => { return { 'content': item.acl }}, 'acl', 'Actions', TableItemAclFiltered, 5, false) + new TableColumnContentModel((item) => { return { 'content': item.acl }}, 'acl', 'Actions', TableItemAclFiltered, 4, false) ]; return ( diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js index 4840b27a..f7b04cc6 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js @@ -1,11 +1,16 @@ import React from 'react'; import EditionListStore from '../../stores/edition_list_store'; +import EditionListActions from '../../actions/edition_list_actions'; import AclButton from '../acl_button'; import PieceListToolbarSelectedEditionsWidget from './piece_list_toolbar_selected_editions_widget'; let PieceListToolbar = React.createClass({ + propTypes: { + className: React.PropTypes.string + }, + getInitialState() { return EditionListStore.getState(); }, @@ -66,25 +71,46 @@ let PieceListToolbar = React.createClass({ return availableAcls; }, + clearAllSelections() { + EditionListActions.clearAllEditionSelections(); + }, + render() { let availableAcls = this.getAvailableAcls(); - return ( -
-
-
- -
-
- - - - + if(availableAcls.length > 0) { + return ( +
+
+
+

+
+
+ +           + clear all +
+
+

+
+
+ + + + +
+
+
-
- ); + ); + } else { + return null; + } + } }); diff --git a/js/components/piece_list.js b/js/components/piece_list.js index 3f36cfe2..9580ffb1 100644 --- a/js/components/piece_list.js +++ b/js/components/piece_list.js @@ -50,6 +50,7 @@ let PieceList = React.createClass({ return (
+ {this.state.pieceList.map((item, i) => { - return ( { + this.editionList[pieceId] + .forEach((edition) => { + try { + delete edition.selected; + } catch(err) { + //just ignore + } + }); + }); + } }; export default alt.createStore(EditionListStore); \ No newline at end of file diff --git a/sass/ascribe-piece-list-toolbar.scss b/sass/ascribe-piece-list-toolbar.scss new file mode 100644 index 00000000..6093aed9 --- /dev/null +++ b/sass/ascribe-piece-list-toolbar.scss @@ -0,0 +1,20 @@ +.ascribe-piece-list-toolbar { + position: fixed; + top:0; + width:1170px; + height:6em; + background-color: #FAFAFA; + + border-left: 0.1em solid #E0E0E0; + border-right: 0.1em solid #E0E0E0; + border-top: 0.1em solid #E0E0E0; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; + border-bottom: 0.2em solid #E0E0E0; + z-index:9999; +} + +.piece-list-toolbar-clear-all { + text-decoration: underline; + cursor:pointer; +} \ No newline at end of file diff --git a/sass/main.scss b/sass/main.scss index 419da031..471a6124 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -6,6 +6,7 @@ @import './ascribe-fonts/style'; @import './ascribe-fonts/ascribe-fonts'; @import 'ascribe-accordion_list'; +@import 'ascribe-piece-list-toolbar'; .hidden { display: none; @@ -14,6 +15,12 @@ .navbar-default { border-left:0; border-right:0; + margin-bottom: 3em; +} + +.clear-margins-and-paddings { + padding-left:0; + padding-right:0; } .ascribe-color { @@ -68,6 +75,9 @@ .ascribe-table-item-column > * { display: table-cell; vertical-align: middle; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; } .ascribe-table-item-selected { @@ -78,10 +88,6 @@ cursor: default; } -.piece-list-toolbar { - height:3em; -} - .no-margin { margin-right: 0; margin-left: 0;