Ludvig commited on
Commit
6c86e78
·
1 Parent(s): 846ae7b

Replaces checkboxes with toggle switches

Browse files
Files changed (2) hide show
  1. Dockerfile +1 -1
  2. design.py +120 -73
Dockerfile CHANGED
@@ -12,7 +12,7 @@ RUN conda env create -f environment.yml
12
  # Make RUN commands use the new environment:
13
  SHELL ["conda", "run", "-n", "plt_env", "/bin/bash", "-c"]
14
 
15
- RUN pip install streamlit==1.23 Pillow lazyeval pandas
16
 
17
  # Demonstrate the environment is activated:
18
  RUN echo "Make sure streamlit is installed:"
 
12
  # Make RUN commands use the new environment:
13
  SHELL ["conda", "run", "-n", "plt_env", "/bin/bash", "-c"]
14
 
15
+ RUN pip install streamlit==1.23 Pillow lazyeval pandas streamlit-toggle-switch
16
 
17
  # Demonstrate the environment is activated:
18
  RUN echo "Make sure streamlit is installed:"
design.py CHANGED
@@ -2,6 +2,8 @@ from typing import List, Callable, Any, Tuple
2
  import json
3
  import streamlit as st
4
  from PIL import Image
 
 
5
 
6
  from text_sections import (
7
  design_text,
@@ -9,6 +11,29 @@ from text_sections import (
9
  from templates import get_templates
10
 
11
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
12
  def _add_select_box(
13
  key: str,
14
  label: str,
@@ -45,7 +70,7 @@ def select_settings():
45
  st.session_state["num_resets"] += 1
46
 
47
  with st.expander("Templates"):
48
- col1, col2, _ = st.columns([1, 1, 3])
49
  with col1:
50
  # Find template with num classes closest to
51
  # the number of classes in the data
@@ -66,9 +91,12 @@ def select_settings():
66
  options=[-1] + templates_available_num_classes,
67
  )
68
  with col2:
69
- st.write(" ")
70
- st.write(" ")
71
- has_sums = st.checkbox("Sum tiles", value=False)
 
 
 
72
 
73
  filtered_templates = {
74
  temp_name: temp
@@ -91,7 +119,11 @@ def select_settings():
91
  )
92
  _, col2, _ = st.columns([5, 6, 5])
93
  with col2:
94
- if st.button("Select", key=temp_name.replace(" ", "_"), on_click=reset_output_callback):
 
 
 
 
95
  with open(
96
  "template_resources/" + template["settings"],
97
  "r",
@@ -154,7 +186,7 @@ def design_section(
154
  st.session_state["form_placeholder"] = st.empty()
155
  with st.session_state["form_placeholder"].container():
156
  with st.form(key=f"settings_form_{st.session_state['num_resets']}"):
157
- col1, col2, col3 = st.columns([4, 2, 2])
158
  with col1:
159
  selected_classes = st.multiselect(
160
  "Select classes (min=2, order is respected)",
@@ -167,12 +199,11 @@ def design_section(
167
  # Reverse by default
168
  selected_classes.reverse()
169
  with col2:
170
- st.write(" ")
171
- st.write(" ")
172
- reverse_class_order = st.checkbox(
173
- "Reverse order",
174
- value=False,
175
- help="Reverse the order of the classes.",
176
  )
177
 
178
  # Color palette
@@ -197,14 +228,10 @@ def design_section(
197
  help="Color of the tiles. Select a preset color palette or create a custom gradient. ",
198
  )
199
  with col2:
200
- st.write("")
201
- st.write(" ")
202
  st.session_state["selected_design_settings"][
203
  "palette_use_custom"
204
- ] = st.checkbox(
205
- "Custom gradient",
206
- value=False,
207
- help="Use a custom gradient for coloring the tiles.",
208
  )
209
  with col3:
210
  st.session_state["selected_design_settings"][
@@ -251,30 +278,38 @@ def design_section(
251
  with col1:
252
  st.session_state["selected_design_settings"][
253
  "show_counts"
254
- ] = st.checkbox(
255
- "Show Counts",
256
- value=get_uploaded_setting(
 
257
  key="show_counts", default=True, type_=bool
258
  ),
 
259
  )
260
  with col2:
261
  st.session_state["selected_design_settings"][
262
  "show_normalized"
263
- ] = st.checkbox(
264
- "Show Normalized (%)",
265
- value=get_uploaded_setting(
 
266
  key="show_normalized", default=True, type_=bool
267
  ),
 
268
  )
269
  with col3:
270
- st.session_state["selected_design_settings"]["show_sums"] = st.checkbox(
271
- "Show Sum Tiles",
272
- value=get_uploaded_setting(
 
 
 
273
  key="show_sums", default=False, type_=bool
274
  ),
275
- help="Show extra row and column with the "
276
- "totals for that row/column.",
277
  )
 
 
278
 
279
  st.markdown("""---""")
280
  st.markdown("**Advanced**:")
@@ -331,31 +366,37 @@ def design_section(
331
  with col1:
332
  st.session_state["selected_design_settings"][
333
  "rotate_y_text"
334
- ] = st.checkbox(
335
- "Rotate y-axis text",
336
- value=get_uploaded_setting(
 
337
  key="rotate_y_text", default=True, type_=bool
338
  ),
339
  )
 
340
  st.session_state["selected_design_settings"][
341
  "place_x_axis_above"
342
- ] = st.checkbox(
343
- "Place x-axis on top",
344
- value=get_uploaded_setting(
345
  key="place_x_axis_above", default=True, type_=bool
346
  ),
 
347
  )
348
  st.session_state["selected_design_settings"][
349
  "counts_on_top"
350
- ] = st.checkbox(
351
- "Counts on top",
352
- value=get_uploaded_setting(
353
  key="counts_on_top", default=False, type_=bool
354
  ),
355
- help="Whether to switch the positions of the counts and normalized counts (%). "
356
- "The counts become the big centralized numbers and the "
357
- "normalized counts go below with a smaller font size.",
358
  )
 
 
 
 
 
359
  with col2:
360
  st.session_state["selected_design_settings"][
361
  "num_digits"
@@ -374,41 +415,45 @@ def design_section(
374
  st.write("Row and column percentages:")
375
  st.session_state["selected_design_settings"][
376
  "show_row_percentages"
377
- ] = st.checkbox(
378
- "Show row percentages",
379
- value=get_uploaded_setting(
380
  key="show_row_percentages",
381
  default=num_classes < 6,
382
  type_=bool,
383
  ),
 
384
  )
385
  st.session_state["selected_design_settings"][
386
  "show_col_percentages"
387
- ] = st.checkbox(
388
- "Show column percentages",
389
- value=get_uploaded_setting(
390
  key="show_col_percentages",
391
  default=num_classes < 6,
392
  type_=bool,
393
  ),
 
394
  )
395
  st.session_state["selected_design_settings"][
396
  "show_arrows"
397
- ] = st.checkbox(
398
- "Show arrows",
399
- value=get_uploaded_setting(
400
  key="show_arrows", default=True, type_=bool
401
  ),
 
402
  )
403
  st.session_state["selected_design_settings"][
404
  "diag_percentages_only"
405
- ] = st.checkbox(
406
- "Diagonal row/column percentages only",
407
- value=get_uploaded_setting(
408
  key="diag_percentages_only",
409
  default=False,
410
  type_=bool,
411
  ),
 
412
  )
413
  with col2:
414
  st.session_state["selected_design_settings"]["arrow_size"] = (
@@ -480,11 +525,12 @@ def design_section(
480
 
481
  st.session_state["selected_design_settings"][
482
  "show_tile_border"
483
- ] = st.checkbox(
484
- "Add tile borders",
485
- value=get_uploaded_setting(
486
  key="show_tile_border", default=False, type_=bool
487
  ),
 
488
  )
489
 
490
  col1, col2, col3 = st.columns(3)
@@ -582,33 +628,34 @@ def design_section(
582
  with col1:
583
  st.session_state["selected_design_settings"][
584
  "show_zero_shading"
585
- ] = st.checkbox(
586
- "Add shading",
587
- value=get_uploaded_setting(
588
  key="show_zero_shading", default=True, type_=bool
589
  ),
 
590
  )
591
  with col2:
592
  st.session_state["selected_design_settings"][
593
  "show_zero_text"
594
- ] = st.checkbox(
595
- "Show text",
596
- value=get_uploaded_setting(
597
  key="show_zero_text", default=False, type_=bool
598
  ),
599
- help="Whether to show counts, normalized (%), etc.",
600
  )
601
  with col3:
602
  st.session_state["selected_design_settings"][
603
  "show_zero_percentages"
604
- ] = st.checkbox(
605
- "Show row/column percentages",
606
- value=get_uploaded_setting(
607
  key="show_zero_percentages",
608
  default=False,
609
  type_=bool,
610
  ),
611
- help="Only relevant when row/column percentages are enabled.",
612
  )
613
 
614
  if True:
@@ -747,15 +794,15 @@ def create_font_settings(
747
  key=k,
748
  value=get_setting_fn(key=k, default=d, type_=str),
749
  ),
750
- make_key("bold"): lambda k, d: st.checkbox(
751
- "Bold",
752
  key=k,
753
- value=get_setting_fn(key=k, default=d, type_=bool),
754
  ),
755
- make_key("italic"): lambda k, d: st.checkbox(
756
- "Italic",
757
  key=k,
758
- value=get_setting_fn(key=k, default=d, type_=bool),
759
  ),
760
  make_key("size"): lambda k, d: st.number_input(
761
  "Size",
 
2
  import json
3
  import streamlit as st
4
  from PIL import Image
5
+ from streamlit_toggle import st_toggle_switch
6
+
7
 
8
  from text_sections import (
9
  design_text,
 
11
  from templates import get_templates
12
 
13
 
14
+ def _add_toggle_vertical(label, key, default, cols=[2, 5]):
15
+ st.markdown(f"<p style='font-size:0.85em;'>{label}</p>", unsafe_allow_html=True)
16
+ col1, _ = st.columns(cols)
17
+ with col1:
18
+ return st_toggle_switch(
19
+ " ",
20
+ default_value=default,
21
+ key=key,
22
+ label_after=True,
23
+ inactive_color="#eb5a53",
24
+ )
25
+
26
+
27
+ def _add_toggle_horizontal(label, key, default):
28
+ return st_toggle_switch(
29
+ label=label,
30
+ default_value=default,
31
+ key=key,
32
+ label_after=True,
33
+ inactive_color="#eb5a53",
34
+ )
35
+
36
+
37
  def _add_select_box(
38
  key: str,
39
  label: str,
 
70
  st.session_state["num_resets"] += 1
71
 
72
  with st.expander("Templates"):
73
+ col1, col2, _ = st.columns([1, 1, 2])
74
  with col1:
75
  # Find template with num classes closest to
76
  # the number of classes in the data
 
91
  options=[-1] + templates_available_num_classes,
92
  )
93
  with col2:
94
+ has_sums = _add_toggle_vertical(
95
+ label="With sum tiles",
96
+ key="filter_sum_tiles",
97
+ default=False,
98
+ cols=[3, 5],
99
+ )
100
 
101
  filtered_templates = {
102
  temp_name: temp
 
119
  )
120
  _, col2, _ = st.columns([5, 6, 5])
121
  with col2:
122
+ if st.button(
123
+ "Select",
124
+ key=temp_name.replace(" ", "_"),
125
+ on_click=reset_output_callback,
126
+ ):
127
  with open(
128
  "template_resources/" + template["settings"],
129
  "r",
 
186
  st.session_state["form_placeholder"] = st.empty()
187
  with st.session_state["form_placeholder"].container():
188
  with st.form(key=f"settings_form_{st.session_state['num_resets']}"):
189
+ col1, col2 = st.columns([4, 4])
190
  with col1:
191
  selected_classes = st.multiselect(
192
  "Select classes (min=2, order is respected)",
 
199
  # Reverse by default
200
  selected_classes.reverse()
201
  with col2:
202
+ reverse_class_order = _add_toggle_vertical(
203
+ label="Reverse class order",
204
+ key="reverse_order",
205
+ default=False,
206
+ cols=[2, 9],
 
207
  )
208
 
209
  # Color palette
 
228
  help="Color of the tiles. Select a preset color palette or create a custom gradient. ",
229
  )
230
  with col2:
 
 
231
  st.session_state["selected_design_settings"][
232
  "palette_use_custom"
233
+ ] = _add_toggle_vertical(
234
+ label="Use custom gradient", key="custom_gradient", default=False
 
 
235
  )
236
  with col3:
237
  st.session_state["selected_design_settings"][
 
278
  with col1:
279
  st.session_state["selected_design_settings"][
280
  "show_counts"
281
+ ] = _add_toggle_vertical(
282
+ label="Show counts",
283
+ key="show_counts",
284
+ default=get_uploaded_setting(
285
  key="show_counts", default=True, type_=bool
286
  ),
287
+ cols=[2, 5],
288
  )
289
  with col2:
290
  st.session_state["selected_design_settings"][
291
  "show_normalized"
292
+ ] = _add_toggle_vertical(
293
+ label="Show normalized (%)",
294
+ key="show_normalized",
295
+ default=get_uploaded_setting(
296
  key="show_normalized", default=True, type_=bool
297
  ),
298
+ cols=[2, 5],
299
  )
300
  with col3:
301
+ st.session_state["selected_design_settings"][
302
+ "show_sums"
303
+ ] = _add_toggle_vertical(
304
+ label="Show sum tiles",
305
+ key="show_sum_tiles",
306
+ default=get_uploaded_setting(
307
  key="show_sums", default=False, type_=bool
308
  ),
309
+ cols=[2, 5],
 
310
  )
311
+ # help="Show extra row and column with the "
312
+ # "totals for that row/column.",
313
 
314
  st.markdown("""---""")
315
  st.markdown("**Advanced**:")
 
366
  with col1:
367
  st.session_state["selected_design_settings"][
368
  "rotate_y_text"
369
+ ] = _add_toggle_horizontal(
370
+ label="Rotate y-axis text",
371
+ key="rotate_y_text",
372
+ default=get_uploaded_setting(
373
  key="rotate_y_text", default=True, type_=bool
374
  ),
375
  )
376
+
377
  st.session_state["selected_design_settings"][
378
  "place_x_axis_above"
379
+ ] = _add_toggle_horizontal(
380
+ label="Place x-axis on top",
381
+ default=get_uploaded_setting(
382
  key="place_x_axis_above", default=True, type_=bool
383
  ),
384
+ key="place_x_axis_above",
385
  )
386
  st.session_state["selected_design_settings"][
387
  "counts_on_top"
388
+ ] = _add_toggle_horizontal(
389
+ label="Counts on top",
390
+ default=get_uploaded_setting(
391
  key="counts_on_top", default=False, type_=bool
392
  ),
393
+ key="counts_on_top",
 
 
394
  )
395
+ # Help note:
396
+ # "Whether to switch the positions of the counts and normalized counts (%). "
397
+ # "The counts become the big centralized numbers and the "
398
+ # "normalized counts go below with a smaller font size."
399
+
400
  with col2:
401
  st.session_state["selected_design_settings"][
402
  "num_digits"
 
415
  st.write("Row and column percentages:")
416
  st.session_state["selected_design_settings"][
417
  "show_row_percentages"
418
+ ] = _add_toggle_horizontal(
419
+ label="Show row percentages",
420
+ default=get_uploaded_setting(
421
  key="show_row_percentages",
422
  default=num_classes < 6,
423
  type_=bool,
424
  ),
425
+ key="show_row_percentages",
426
  )
427
  st.session_state["selected_design_settings"][
428
  "show_col_percentages"
429
+ ] = _add_toggle_horizontal(
430
+ label="Show column percentages",
431
+ default=get_uploaded_setting(
432
  key="show_col_percentages",
433
  default=num_classes < 6,
434
  type_=bool,
435
  ),
436
+ key="show_col_percentages",
437
  )
438
  st.session_state["selected_design_settings"][
439
  "show_arrows"
440
+ ] = _add_toggle_horizontal(
441
+ label="Show arrows",
442
+ default=get_uploaded_setting(
443
  key="show_arrows", default=True, type_=bool
444
  ),
445
+ key="show_arrows",
446
  )
447
  st.session_state["selected_design_settings"][
448
  "diag_percentages_only"
449
+ ] = _add_toggle_horizontal(
450
+ label="Diagonal percentages only",
451
+ default=get_uploaded_setting(
452
  key="diag_percentages_only",
453
  default=False,
454
  type_=bool,
455
  ),
456
+ key="diag_percentages_only",
457
  )
458
  with col2:
459
  st.session_state["selected_design_settings"]["arrow_size"] = (
 
525
 
526
  st.session_state["selected_design_settings"][
527
  "show_tile_border"
528
+ ] = _add_toggle_horizontal(
529
+ label="Add tile borders",
530
+ default=get_uploaded_setting(
531
  key="show_tile_border", default=False, type_=bool
532
  ),
533
+ key="show_tile_border",
534
  )
535
 
536
  col1, col2, col3 = st.columns(3)
 
628
  with col1:
629
  st.session_state["selected_design_settings"][
630
  "show_zero_shading"
631
+ ] = _add_toggle_vertical(
632
+ label="Add shading",
633
+ default=get_uploaded_setting(
634
  key="show_zero_shading", default=True, type_=bool
635
  ),
636
+ key="show_zero_shading",
637
  )
638
  with col2:
639
  st.session_state["selected_design_settings"][
640
  "show_zero_text"
641
+ ] = _add_toggle_vertical(
642
+ label="Show main text",
643
+ default=get_uploaded_setting(
644
  key="show_zero_text", default=False, type_=bool
645
  ),
646
+ key="show_zero_text",
647
  )
648
  with col3:
649
  st.session_state["selected_design_settings"][
650
  "show_zero_percentages"
651
+ ] = _add_toggle_vertical(
652
+ label="Show row/column percentages",
653
+ default=get_uploaded_setting(
654
  key="show_zero_percentages",
655
  default=False,
656
  type_=bool,
657
  ),
658
+ key="show_zero_percentages",
659
  )
660
 
661
  if True:
 
794
  key=k,
795
  value=get_setting_fn(key=k, default=d, type_=str),
796
  ),
797
+ make_key("bold"): lambda k, d: _add_toggle_horizontal(
798
+ label="Bold",
799
  key=k,
800
+ default=get_setting_fn(key=k, default=d, type_=bool),
801
  ),
802
+ make_key("italic"): lambda k, d: _add_toggle_horizontal(
803
+ label="Italic",
804
  key=k,
805
+ default=get_setting_fn(key=k, default=d, type_=bool),
806
  ),
807
  make_key("size"): lambda k, d: st.number_input(
808
  "Size",