From 88a4cf1aa4694e9a79ee968dd74154d1655c9ab9 Mon Sep 17 00:00:00 2001
From: David Sehnal <david.sehnal@gmail.com>
Date: Mon, 25 Nov 2019 13:21:06 +0100
Subject: [PATCH] mol-plugin: SequenceView tweaks
---
src/mol-plugin/skin/base/components/sequence.scss | 2 +-
src/mol-plugin/ui/controls/parameters.tsx | 4 ++--
src/mol-plugin/ui/sequence.tsx | 12 ++++++------
3 files changed, 9 insertions(+), 9 deletions(-)
diff --git a/src/mol-plugin/skin/base/components/sequence.scss b/src/mol-plugin/skin/base/components/sequence.scss
index 83ad8c0da..fbb3729b4 100644
--- a/src/mol-plugin/skin/base/components/sequence.scss
+++ b/src/mol-plugin/skin/base/components/sequence.scss
@@ -27,7 +27,7 @@ $sequence-select-height: 22px;
> select {
display: inline-block;
- max-width: 160px;
+ max-width: 120px;
width: auto;
text-overflow: ellipsis;
font-size: 85%;
diff --git a/src/mol-plugin/ui/controls/parameters.tsx b/src/mol-plugin/ui/controls/parameters.tsx
index 21b6a9466..976895737 100644
--- a/src/mol-plugin/ui/controls/parameters.tsx
+++ b/src/mol-plugin/ui/controls/parameters.tsx
@@ -264,7 +264,7 @@ export class TextControl extends SimpleParam<PD.Text> {
}
}
-export class PureSelectControl extends React.PureComponent<ParamProps<PD.Select<string | number>>> {
+export class PureSelectControl extends React.PureComponent<ParamProps<PD.Select<string | number>> & { title?: string }> {
protected update(value: string | number) {
this.props.onChange({ param: this.props.param, name: this.props.name, value });
}
@@ -279,7 +279,7 @@ export class PureSelectControl extends React.PureComponent<ParamProps<PD.Select
render() {
const isInvalid = this.props.value !== void 0 && !this.props.param.options.some(e => e[0] === this.props.value);
- return <select className='msp-form-control' value={this.props.value !== void 0 ? this.props.value : this.props.param.defaultValue} onChange={this.onChange} disabled={this.props.isDisabled}>
+ return <select className='msp-form-control' title={this.props.title} value={this.props.value !== void 0 ? this.props.value : this.props.param.defaultValue} onChange={this.onChange} disabled={this.props.isDisabled}>
{isInvalid && <option key={this.props.value} value={this.props.value}>{`[Invalid] ${this.props.value}`}</option>}
{this.props.param.options.map(([value, label]) => <option key={value} value={value}>{label}</option>)}
</select>;
diff --git a/src/mol-plugin/ui/sequence.tsx b/src/mol-plugin/ui/sequence.tsx
index 619ecf0cc..f593459a2 100644
--- a/src/mol-plugin/ui/sequence.tsx
+++ b/src/mol-plugin/ui/sequence.tsx
@@ -305,13 +305,13 @@ export class SequenceView extends PluginUIComponent<{ }, SequenceViewState> {
<span>Sequence of</span>
<PureSelectControl param={params.structure} name='structure' value={values.structure} onChange={this.setParamProps} />
- <span>Entity</span>
- <PureSelectControl param={params.entity} name='entity' value={values.entity} onChange={this.setParamProps} />
- <span>Chain</span>
- <PureSelectControl param={params.chain} name='chain' value={values.chain} onChange={this.setParamProps} />
+ {/* <span>Entity</span> */}
+ <PureSelectControl title='Entity' param={params.entity} name='entity' value={values.entity} onChange={this.setParamProps} />
+ {/* <span>Chain</span> */}
+ <PureSelectControl title='Chain' param={params.chain} name='chain' value={values.chain} onChange={this.setParamProps} />
{params.operator.options.length > 1 && <>
- <span>Instance</span>
- <PureSelectControl param={params.operator} name='operator' value={values.operator} onChange={this.setParamProps} />
+ {/* <span>Instance</span> */}
+ <PureSelectControl title='Instance' param={params.operator} name='operator' value={values.operator} onChange={this.setParamProps} />
</>}
</div>
--
GitLab