Skip to content

Commit 128bf83

Browse files
aulneauVeraZab
aulneau
authored and
VeraZab
committed
fixes via vera, other tweaks
1 parent 30efa1c commit 128bf83

File tree

10 files changed

+124
-92
lines changed

10 files changed

+124
-92
lines changed

‎src/PlotlyEditor.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ class PlotlyEditor extends Component {
4949
onUpdate: this.handleUpdate.bind(this),
5050
plotSchema: this.plotSchema,
5151
plotly: this.props.plotly,
52-
traceSelectorConfig: this.props.traceSelectorConfig,
52+
traceTypesConfig: this.props.traceTypesConfig,
5353
};
5454
}
5555

@@ -252,12 +252,12 @@ PlotlyEditor.propTypes = {
252252
onUpdate: PropTypes.func,
253253
plotly: PropTypes.object,
254254
revision: PropTypes.any,
255-
traceSelectorConfig: PropTypes.object,
255+
traceTypesConfig: PropTypes.object,
256256
};
257257

258258
PlotlyEditor.defaultProps = {
259259
locale: 'en',
260-
traceSelectorConfig: {
260+
traceTypesConfig: {
261261
categories: _ => categoryLayout(_),
262262
traces: _ => traceTypes(_),
263263
},
@@ -279,7 +279,7 @@ PlotlyEditor.childContextTypes = {
279279
onUpdate: PropTypes.func,
280280
plotly: PropTypes.object,
281281
plotSchema: PropTypes.object,
282-
traceSelectorConfig: PropTypes.object,
282+
traceTypesConfig: PropTypes.object,
283283
};
284284

285285
export default PlotlyEditor;

‎src/components/containers/Modal.js‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,6 @@ const ModalContent = ({children}) => (
2121
);
2222

2323
class Modal extends Component {
24-
constructor(props) {
25-
super(props);
26-
}
27-
2824
render() {
2925
const {children, title} = this.props;
3026
let classes = 'modal';

‎src/components/fields/TraceSelector.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,8 @@ class TraceSelector extends Component {
4747
const _ = props.localize;
4848
if (props.traceOptions) {
4949
this.traceOptions = props.traceOptions;
50+
} else if (context.traceTypesConfig) {
51+
this.traceOptions = context.traceTypesConfig.traces(_);
5052
} else if (context.plotSchema) {
5153
this.traceOptions = computeTraceOptionsFromSchema(
5254
context.plotSchema,
@@ -102,7 +104,7 @@ class TraceSelector extends Component {
102104
<Field {...props}>
103105
<TraceTypeSelectorButton
104106
{...props}
105-
traceSelectorConfig={this.context.traceSelectorConfig}
107+
traceTypesConfig={this.context.traceTypesConfig}
106108
handleClick={() => this.context.openModal(TraceTypeSelector, props)}
107109
/>
108110
</Field>
@@ -116,7 +118,7 @@ class TraceSelector extends Component {
116118
TraceSelector.contextTypes = {
117119
openModal: PropTypes.func,
118120
advancedTraceTypeSelector: PropTypes.bool,
119-
traceSelectorConfig: PropTypes.object,
121+
traceTypesConfig: PropTypes.object,
120122
plotSchema: PropTypes.object,
121123
config: PropTypes.object,
122124
};

‎src/components/widgets/TraceTypeSelector.js‎

Lines changed: 40 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -23,22 +23,31 @@ const actions = ({value}) => [
2323
];
2424

2525
const renderActionItems = (actionItems, item) =>
26-
actionItems(item).map((action, i) => (
27-
<a
28-
className="trace-item__actions__item"
29-
key={i}
30-
aria-label={action.label}
31-
data-microtip-position={`top-left`}
32-
role="tooltip"
33-
href={action.href}
34-
target="_blank"
35-
>
36-
{action.icon}
37-
</a>
38-
));
26+
actionItems
27+
? actionItems(item).map((action, i) => (
28+
<a
29+
className="trace-item__actions__item"
30+
key={i}
31+
aria-label={action.label}
32+
data-microtip-position={`top-left`}
33+
role="tooltip"
34+
href={action.href}
35+
target="_blank"
36+
>
37+
{action.icon}
38+
</a>
39+
))
40+
: null;
3941

4042
const Item = ({item, active, handleClick, actions, showActions}) => {
4143
const {label, value, icon} = item;
44+
const SimpleIcon = renderTraceIcon(icon ? icon : value);
45+
const ComplexIcon = renderTraceIcon(
46+
icon ? `TraceType${icon}` : `TraceType${value}`
47+
);
48+
49+
const complex = true;
50+
4251
return (
4352
<div
4453
className={`trace-item${active ? ' trace-item--active' : ''}`}
@@ -48,7 +57,19 @@ const Item = ({item, active, handleClick, actions, showActions}) => {
4857
{actions && showActions ? renderActionItems(actions, item) : null}
4958
</div>
5059
<div className="trace-item__image">
51-
<img src={`/_temp/ic-${icon ? icon : value}.svg`} />
60+
{!complex && (
61+
<div className="trace-item__image__svg">
62+
<SimpleIcon />
63+
</div>
64+
)}
65+
{complex && (
66+
<div className="trace-item__image__wrapper">
67+
<img
68+
src={`/_temp/ic-${icon ? icon : value}.svg`}
69+
alt={`Trace Type: ${label}`}
70+
/>
71+
</div>
72+
)}
5273
</div>
5374
<div className="trace-item__label">{label}</div>
5475
</div>
@@ -64,14 +85,14 @@ class TraceTypeSelector extends Component {
6485

6586
renderCategories() {
6687
const {fullValue, localize: _} = this.props;
67-
const {traces, categories} = this.context.traceSelectorConfig;
88+
const {traces, categories} = this.context.traceTypesConfig;
6889

6990
return categories(_).map((category, i) => {
7091
const items = traces(_).filter(
7192
({category: {value}}) => value === category.value
7293
);
7394

74-
const MAX_ITEMS = 6;
95+
const MAX_ITEMS = 4;
7596

7697
let columnClasses = 'trace-grid__column';
7798

@@ -114,7 +135,7 @@ class TraceTypeButton extends React.Component {
114135
handleClick,
115136
fullValue,
116137
localize: _,
117-
traceSelectorConfig: {traces},
138+
traceTypesConfig: {traces},
118139
} = this.props;
119140

120141
const {label, icon, value} = traces(_).find(
@@ -146,10 +167,10 @@ TraceTypeButton.propTypes = {
146167
handleClick: PropTypes.func.isRequired,
147168
fullValue: PropTypes.string.isRequired,
148169
localize: PropTypes.func.isRequired,
149-
traceSelectorConfig: PropTypes.object.isRequired,
170+
traceTypesConfig: PropTypes.object.isRequired,
150171
};
151172
TraceTypeSelector.contextTypes = {
152-
traceSelectorConfig: PropTypes.object,
173+
traceTypesConfig: PropTypes.object,
153174
handleClose: PropTypes.func,
154175
};
155176
Item.propTypes = {

‎src/lib/computeTraceOptionsFromSchema.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ function computeTraceOptionsFromSchema(schema, _, context) {
55
t => !['area', 'scattermapbox'].includes(t)
66
);
77

8-
// explicit map of all supported trace types (as of plotlyjs 1.32)
98
const traceOptions = [
109
{
1110
value: 'scatter',

‎src/lib/customTraceType.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,6 @@ export function traceTypeToPlotlyInitFigure(traceType) {
2525
return {type: 'scatter', mode: 'markers', fill: 'none'};
2626
case 'area':
2727
return {type: 'scatter', fill: 'tozeroy'};
28-
case 'cartesianArea':
29-
return {type: 'scatter', fill: 'tozeroy'};
3028
case 'ohlc':
3129
return {
3230
type: 'ohlc',

‎src/lib/traceTypes.js‎

Lines changed: 52 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -61,21 +61,21 @@ export const traceTypes = _ => [
6161
label: _('Line'),
6262
category: chartCategory(_).SIMPLE,
6363
},
64-
{
65-
value: 'area',
66-
label: _('Area'),
67-
category: chartCategory(_).SIMPLE,
68-
},
64+
// {
65+
// value: 'area',
66+
// label: _('Area'),
67+
// category: chartCategory(_).SIMPLE,
68+
// },
6969
{
7070
value: 'heatmap',
7171
label: _('Heatmap'),
7272
category: chartCategory(_).SIMPLE,
7373
},
74-
{
75-
value: 'table',
76-
label: _('Table'),
77-
category: chartCategory(_).SIMPLE,
78-
},
74+
// {
75+
// value: 'table',
76+
// label: _('Table'),
77+
// category: chartCategory(_).SIMPLE,
78+
// },
7979
{
8080
value: 'contour',
8181
label: _('Contour'),
@@ -126,11 +126,11 @@ export const traceTypes = _ => [
126126
label: _('2D Contour Histogram'),
127127
category: chartCategory(_).DISTRIBUTIONS,
128128
},
129-
{
130-
value: 'violin',
131-
label: _('Violin'),
132-
category: chartCategory(_).DISTRIBUTIONS,
133-
},
129+
// {
130+
// value: 'violin',
131+
// label: _('Violin'),
132+
// category: chartCategory(_).DISTRIBUTIONS,
133+
// },
134134
{
135135
value: 'choropleth',
136136
label: _('Choropleth'),
@@ -156,52 +156,52 @@ export const traceTypes = _ => [
156156
label: _('OHLC'),
157157
category: chartCategory(_).FINANCIAL,
158158
},
159-
{
160-
value: 'parcoords',
161-
label: _('Parallel Coordinates'),
162-
category: chartCategory(_).SPECIALIZED,
163-
},
164-
{
165-
value: 'sankey',
166-
label: _('Sankey'),
167-
category: chartCategory(_).SPECIALIZED,
168-
},
169-
{
170-
value: 'carpet',
171-
label: _('Carpet'),
172-
category: chartCategory(_).SPECIALIZED,
173-
},
174-
{
175-
value: 'scatterpolar',
176-
label: _('Polar Scatter'),
177-
category: chartCategory(_).SPECIALIZED,
178-
},
159+
// {
160+
// value: 'parcoords',
161+
// label: _('Parallel Coordinates'),
162+
// category: chartCategory(_).SPECIALIZED,
163+
// },
164+
// {
165+
// value: 'sankey',
166+
// label: _('Sankey'),
167+
// category: chartCategory(_).SPECIALIZED,
168+
// },
169+
// {
170+
// value: 'carpet',
171+
// label: _('Carpet'),
172+
// category: chartCategory(_).SPECIALIZED,
173+
// },
174+
// {
175+
// value: 'scatterpolar',
176+
// label: _('Polar Scatter'),
177+
// category: chartCategory(_).SPECIALIZED,
178+
// },
179179
{
180180
value: 'scatterternary',
181181
label: _('Ternary Scatter'),
182182
category: chartCategory(_).SPECIALIZED,
183183
},
184-
{
185-
value: 'pointcloud',
186-
label: _('Point Cloud'),
187-
category: chartCategory(_).WEB_GL,
188-
},
184+
// {
185+
// value: 'pointcloud',
186+
// label: _('Point Cloud'),
187+
// category: chartCategory(_).WEB_GL,
188+
// },
189189
{
190190
value: 'scattergl',
191191
icon: 'scatter',
192192
label: _('Scatter GL'),
193193
category: chartCategory(_).WEB_GL,
194194
},
195-
{
196-
value: 'scatterpolarghl',
197-
icon: 'scatterpolar',
198-
label: _('Scatter Polar GL'),
199-
category: chartCategory(_).WEB_GL,
200-
},
201-
{
202-
value: 'heatmapgl',
203-
icon: 'heatmap',
204-
label: _('Heatmap GL'),
205-
category: chartCategory(_).WEB_GL,
206-
},
195+
// {
196+
// value: 'scatterpolarghl',
197+
// icon: 'scatterpolar',
198+
// label: _('Scatter Polar GL'),
199+
// category: chartCategory(_).WEB_GL,
200+
// },
201+
// {
202+
// value: 'heatmapgl',
203+
// icon: 'heatmap',
204+
// label: _('Heatmap GL'),
205+
// category: chartCategory(_).WEB_GL,
206+
// },
207207
];

‎src/styles/components/containers/_modal.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@
8080
// ANIMATIONS
8181

8282
&__backdrop {
83-
@include animate('fade-in', 1.25s);
83+
@include animate('fade-in', 1s);
8484
}
8585
&__card {
8686
@include animate('fsb', 0.85s, 0.1s);
@@ -89,10 +89,10 @@
8989
&--animate-out {
9090
pointer-events: none;
9191
.modal__backdrop {
92-
@include animate('fade-out', 1.25s);
92+
@include animate('fade-out', 0.85s);
9393
}
9494
.modal__card {
95-
@include animate('fsbr', 1.25s);
95+
@include animate('fsbr', 0.85s);
9696
}
9797
}
9898
}

0 commit comments

Comments
 (0)