Skip to content

Commit

Permalink
make few connected components
Browse files Browse the repository at this point in the history 
removed connected components for any view component below ConnectedDesignMainStrands. Related to #87
  • Loading branch information
@dave-doty
dave-doty committed Dec 28, 2019
1 parent a15f0bf commit 35f30e2
Show file tree
Hide file tree
Showing 11 changed files with 325 additions and 148 deletions.
4 changes: 2 additions & 2 deletions lib/src/app.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@ import 'actions/actions.dart' as actions;
// global variable for whole program
App app = App();

//const USE_REDUX_DEV_TOOLS = false;
const USE_REDUX_DEV_TOOLS = true;
const USE_REDUX_DEV_TOOLS = false;
//const USE_REDUX_DEV_TOOLS = true;

const RUN_TEST_CODE_INSTEAD_OF_APP = false;
//const RUN_TEST_CODE_INSTEAD_OF_APP = true;
Expand Down
23 changes: 17 additions & 6 deletions lib/src/view/design_footer.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import 'package:built_collection/built_collection.dart';
import 'package:over_react/over_react_redux.dart';
import 'package:over_react/over_react.dart';
import 'package:scadnano/src/state/edit_mode.dart';
import 'package:scadnano/src/state/strand.dart';

import '../state/helix.dart';
import '../app.dart';
Expand All @@ -11,22 +12,32 @@ import '../state/app_state.dart';
part 'design_footer.over_react.g.dart';

UiFactory<_$DesignFooterProps> ConnectedDesignFooter = connect<AppState, _$DesignFooterProps>(
mapStateToProps: (state) => (DesignFooter()
..show_mouseover_rect = state.ui_state.edit_modes.contains(EditModeChoice.backbone)
..mouseover_datas = state.ui_state.mouseover_datas),
mapStateToPropsWithOwnProps: (state, props) {
BuiltList<MouseoverData> mouseover_datas = state.ui_state.mouseover_datas;
MouseoverData first_mouseover_data =
mouseover_datas.isNotEmpty ? state.ui_state.mouseover_datas.first : null;
Strand strand_first_mouseover_data = mouseover_datas.isNotEmpty
? state.dna_design.substrand_to_strand[first_mouseover_data.substrand]
: null;
return (DesignFooter()
..show_mouseover_rect = state.ui_state.edit_modes.contains(EditModeChoice.backbone)
..mouseover_datas = state.ui_state.mouseover_datas
..strand_first_mouseover_data = strand_first_mouseover_data);
},
)(DesignFooter);

@Factory()
UiFactory<DesignFooterProps> DesignFooter = _$DesignFooter;

@Props()
class _$DesignFooterProps extends UiProps { // FluxUiProps<MouseoverDataStore, MouseoverDataStore> {
class _$DesignFooterProps extends UiProps {
BuiltList<MouseoverData> mouseover_datas;
bool show_mouseover_rect;
Strand strand_first_mouseover_data;
}

@Component2()
class DesignFooterComponent extends UiComponent2<DesignFooterProps> { // FluxUiComponent<DesignFooterProps> {
class DesignFooterComponent extends UiComponent2<DesignFooterProps> {
@override
render() {
BuiltList<MouseoverData> mouseover_datas = props.mouseover_datas;
Expand All @@ -40,7 +51,7 @@ class DesignFooterComponent extends UiComponent2<DesignFooterProps> { // FluxUiC
text = 'helix: ${idx}, offset: ${offset}';
if (mouseover_data.substrand != null) {
int substrand_length = mouseover_data.substrand.dna_length();
var strand = app.state.dna_design.substrand_to_strand[mouseover_data.substrand];
var strand = props.strand_first_mouseover_data;
text += (', ' +
'substrand length: ${substrand_length}, ' +
'strand length: ${strand.dna_length()}, ' +
Expand Down
6 changes: 3 additions & 3 deletions lib/src/view/design_main.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,6 @@ UiFactory<DesignMainProps> DesignMain = _$DesignMain;

@Props()
class _$DesignMainProps extends UiProps {
AppState state;
BuiltList<Helix> helices;
BuiltList<Strand> strands;
BuiltSet<int> side_selected_helix_idxs;
Expand Down Expand Up @@ -75,8 +74,9 @@ class DesignMainComponent extends UiComponent2<DesignMainProps> {
..show_mismatches = props.show_mismatches
..strands = props.strands
..key = 'mismatches')(),
(DesignMainStrands()
..strands = props.strands
// (DesignMainStrands()
// ..strands = props.strands
(ConnectedDesignMainStrands()
..key = 'strands')(),
(DesignMainDNASequences()
..show_dna = props.show_dna
Expand Down
83 changes: 52 additions & 31 deletions lib/src/view/design_main_strand.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,10 @@ import 'package:platform_detect/platform_detect.dart';
import 'package:built_collection/built_collection.dart';
import 'package:react/react.dart' as react;
import 'package:scadnano/src/state/edit_mode.dart';
import 'package:scadnano/src/state/helix.dart';

import 'package:scadnano/src/state/select_mode_state.dart';
import 'package:scadnano/src/state/selectable.dart';
import 'package:smart_dialogs/smart_dialogs.dart';
import '../state/app_state.dart';
import '../state/select_mode.dart';
Expand All @@ -20,14 +22,14 @@ import 'design_main_strand_paths.dart';
import '../util.dart' as util;
import '../constants.dart' as constants;
import '../actions/actions.dart' as actions;
import 'pure_component.dart';

part 'design_main_strand.over_react.g.dart';

UiFactory<_$DesignMainStrandProps> ConnectedDesignMainStrand = connect<AppState, DesignMainStrandProps>(
mapStateToPropsWithOwnProps: (state, props) {
bool selected = DEBUG_SELECT ? false : state.ui_state.selectables_store.selected(props.strand);
bool selectable =
DEBUG_SELECT ? false : state.ui_state.select_mode_state.modes.contains(SelectModeChoice.strand);
bool selected = state.ui_state.selectables_store.selected(props.strand);
bool selectable = state.ui_state.select_mode_state.modes.contains(SelectModeChoice.strand);
return DesignMainStrand()
..selected = selected
..selectable = selectable
Expand All @@ -44,35 +46,45 @@ UiFactory<DesignMainStrandProps> DesignMainStrand = _$DesignMainStrand;
class _$DesignMainStrandProps extends UiProps {
Strand strand;
BuiltSet<int> side_selected_helix_idxs;

bool selected;
bool selectable;
bool select_mode;
bool assign_dna_mode_enabled;
BuiltList<Helix> helices;
SelectablesStore selectables_store;
SelectModeState select_mode_state;
bool select_mode;
bool pencil_mode;
bool ligate_mode;
bool loopout_mode;
bool nick_mode;
bool drawing_potential_crossover;
bool moving_dna_ends;
bool show_mouseover_rect;
}

@Component2()
class DesignMainStrandComponent extends UiComponent2<DesignMainStrandProps> {
class DesignMainStrandComponent extends UiComponent2<DesignMainStrandProps> with PureComponent {
@override
Map get defaultProps =>
(newProps()
..selected = false
..selectable = false);

@override
bool shouldComponentUpdate(Map nextProps, Map nextState) {
Strand strand = nextProps['DesignMainStrandProps.strand'];
bool selected = nextProps['DesignMainStrandProps.selected'];
BuiltSet<int> side_selected_helix_idxs = nextProps['DesignMainStrandProps.side_selected_helix_idxs'];

bool should = !(props.strand == strand &&
props.side_selected_helix_idxs == side_selected_helix_idxs &&
props.selected == selected);
if (!OPTIMIZE_SELECTABLE_CSS_CLASS_MODIFICATION) {
bool selectable = nextProps['DesignMainStrandProps.selectable'];
should = should || (props.selectable != selectable);
}
return should;
}
Map get defaultProps => (newProps()
..selected = false
..selectable = false);

// @override
// bool shouldComponentUpdate(Map nextProps, Map nextState) {
// Strand strand = nextProps['DesignMainStrandProps.strand'];
// bool selected = nextProps['DesignMainStrandProps.selected'];
// BuiltSet<int> side_selected_helix_idxs = nextProps['DesignMainStrandProps.side_selected_helix_idxs'];
//
// bool should = !(props.strand == strand &&
// props.side_selected_helix_idxs == side_selected_helix_idxs &&
// props.selected == selected);
// if (!OPTIMIZE_SELECTABLE_CSS_CLASS_MODIFICATION) {
// bool selectable = nextProps['DesignMainStrandProps.selectable'];
// should = should || (props.selectable != selectable);
// }
// return should;
// }

@override
render() {
Expand All @@ -86,10 +98,7 @@ class DesignMainStrandComponent extends UiComponent2<DesignMainStrandProps> {
} else {
var classname = 'strand';
if (selectable) {
// print('DesignMainStrand.render(): adding selectable class to strand');
classname += ' selectable';
} else {
// print('DesignMainStrand.render(): not adding selectable class to strand');
}
if (selectable && selected) {
classname += ' selected';
Expand All @@ -100,10 +109,22 @@ class DesignMainStrandComponent extends UiComponent2<DesignMainStrandProps> {
..onPointerDown = handle_click_down
..onPointerUp = handle_click_up
..className = classname)([
// (DesignMainStrandPaths()
(ConnectedDesignMainStrandPaths()
// (ConnectedDesignMainStrandPaths()
(DesignMainStrandPaths()
..strand = strand
..key = 'strand-paths')(),
..key = 'strand-paths'
..helices = props.helices
..side_selected_helix_idxs = props.side_selected_helix_idxs
..selectables_store = props.selectables_store
..select_mode_state = props.select_mode_state
..select_mode = props.select_mode
..pencil_mode = props.pencil_mode
..ligate_mode = props.ligate_mode
..loopout_mode = props.loopout_mode
..nick_mode = props.nick_mode
..drawing_potential_crossover = props.drawing_potential_crossover
..moving_dna_ends = props.moving_dna_ends
..show_mouseover_rect = props.show_mouseover_rect)(),
..._insertion_paths(strand, side_selected_helix_idxs),
..._deletion_paths(strand, side_selected_helix_idxs),
]);
Expand Down
7 changes: 5 additions & 2 deletions lib/src/view/design_main_strand_bound_substrand.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import '../state/bound_substrand.dart';
import '../state/app_state.dart';
import '../util.dart' as util;
import '../actions/actions.dart' as actions;
import 'pure_component.dart';

part 'design_main_strand_bound_substrand.over_react.g.dart';

Expand All @@ -29,13 +30,15 @@ UiFactory<DesignMainBoundSubstrandProps> DesignMainBoundSubstrand = _$DesignMain
class _$DesignMainBoundSubstrandProps extends UiProps {
BoundSubstrand substrand;
Color color;
String dna_sequence;

Helix helix;
bool nick_mode_enabled;
String dna_sequence;
}

@Component2()
class DesignMainBoundSubstrandComponent extends UiComponent2<DesignMainBoundSubstrandProps> {
class DesignMainBoundSubstrandComponent extends UiComponent2<DesignMainBoundSubstrandProps>
with PureComponent {
// @override
// bool shouldComponentUpdate(Map nextProps, Map nextState) {
// BoundSubstrand substrand = props.substrand;
Expand Down
12 changes: 7 additions & 5 deletions lib/src/view/design_main_strand_crossover.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import 'package:scadnano/src/state/edit_mode.dart';

import 'package:scadnano/src/state/select_mode.dart';
import 'package:built_collection/built_collection.dart';
import 'package:scadnano/src/view/pure_component.dart';
import '../state/crossover.dart';
import '../state/mouseover_data.dart';
import '../state/strand.dart';
Expand All @@ -24,9 +25,8 @@ UiFactory<DesignMainStrandCrossoverProps> ConnectedDesignMainStrandCrossover =
int next_idx = props.crossover.next_substrand_idx;
var prev_ss = props.strand.substrands[prev_idx];
var next_ss = props.strand.substrands[next_idx];
bool selected = DEBUG_SELECT ? false : state.ui_state.selectables_store.selected(props.crossover);
bool selectable =
DEBUG_SELECT ? false : state.ui_state.select_mode_state.modes.contains(SelectModeChoice.crossover);
bool selected = state.ui_state.selectables_store.selected(props.crossover);
bool selectable = state.ui_state.select_mode_state.modes.contains(SelectModeChoice.crossover);

return DesignMainStrandCrossover()
..selected = selected
Expand All @@ -44,8 +44,9 @@ UiFactory<DesignMainStrandCrossoverProps> DesignMainStrandCrossover = _$DesignMa

@Props()
class _$DesignMainStrandCrossoverProps extends UiProps {
Strand strand;
Crossover crossover;
Strand strand;

BoundSubstrand prev_substrand;
BoundSubstrand next_substrand;
bool show_mouseover_rect;
Expand All @@ -64,7 +65,8 @@ class _$DesignMainStrandCrossoverState extends UiState {

@Component2()
class DesignMainStrandCrossoverComponent
extends UiStatefulComponent2<DesignMainStrandCrossoverProps, DesignMainStrandCrossoverState> {
extends UiStatefulComponent2<DesignMainStrandCrossoverProps, DesignMainStrandCrossoverState>
with PureComponent {
@override
Map get initialState => (newState()..mouse_hover = false);

Expand Down
14 changes: 6 additions & 8 deletions lib/src/view/design_main_strand_dna_end.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,6 @@ import 'package:over_react/over_react.dart';
import 'package:over_react/over_react_redux.dart';
import 'package:react/react.dart' as react;

//import 'package:dnd/dnd.dart';

import 'package:scadnano/src/state/edit_mode.dart';
import 'package:scadnano/src/state/dna_end.dart';
import 'package:scadnano/src/state/helix.dart';
Expand All @@ -19,6 +17,7 @@ import '5p_end.dart';
import '3p_end.dart';
import 'design_main_strand_dna_end_moving.dart';
import '../actions/actions.dart' as actions;
import 'pure_component.dart';

part 'design_main_strand_dna_end.over_react.g.dart';

Expand All @@ -29,9 +28,9 @@ Map mapStateToPropsWithOwnProps(AppState state, DesignMainDNAEndProps props) {
..selectable = state.ui_state.select_mode_state.is_selectable(end)
..select_mode = state.ui_state.edit_modes.contains(EditModeChoice.select)
..helix = state.dna_design.helices[props.substrand.helix]
..pencil_mode = state.ui_state.edit_modes.contains(EditModeChoice.pencil)
..join_mode = state.ui_state.edit_modes.contains(EditModeChoice.ligate)
..moving_this_dna_end = state.ui_state.moving_dna_ends && state.ui_state.selectables_store.selected(end)
..pencil_mode = state.ui_state.edit_modes.contains(EditModeChoice.pencil)
..ligate_mode = state.ui_state.edit_modes.contains(EditModeChoice.ligate)
..drawing_potential_crossover = state.ui_state.drawing_potential_crossover;
}

Expand All @@ -52,13 +51,13 @@ class _$DesignMainDNAEndProps extends UiProps {
bool selectable;
bool select_mode;
bool pencil_mode;
bool join_mode;
bool ligate_mode;
bool drawing_potential_crossover;
bool moving_this_dna_end;
}

@Component2()
class DesignMainDNAEndComponent extends UiComponent2<DesignMainDNAEndProps> {
class DesignMainDNAEndComponent extends UiComponent2<DesignMainDNAEndProps> with PureComponent {
DNAEnd get dna_end => props.is_5p ? props.substrand.dnaend_5p : props.substrand.dnaend_3p;

bool get is_first => props.substrand.is_first && props.is_5p;
Expand All @@ -71,7 +70,6 @@ class DesignMainDNAEndComponent extends UiComponent2<DesignMainDNAEndProps> {
(is_first && props.is_5p ? '-first-substrand' : '') +
(is_last && !props.is_5p ? '-last-substrand' : '');

// if (substrand.selected_5p()) {
if (props.selected) {
classname += ' selected';
}
Expand Down Expand Up @@ -162,7 +160,7 @@ class DesignMainDNAEndComponent extends UiComponent2<DesignMainDNAEndProps> {
app.dispatch(actions.JoinStrandsByCrossover(
potential_crossover: potential_crossover, dna_end_second_click: dna_end));
}
} else if (props.join_mode && (is_first || is_last)) {
} else if (props.ligate_mode && (is_first || is_last)) {
app.dispatch(actions.Ligate(dna_end: dna_end));
}
}
Expand Down
Loading

0 comments on commit 35f30e2

Please sign in to comment.