Added autofit submenu, with the new 'autofit current design' option a…

…nd fixed autofit behavior

lib/src/view/menu.dart

@@ -490,6 +490,7 @@ It uses cadnano code that crashes on many designs, so it is not guaranteed to wo
   view_menu() {
     var elts = [
       view_menu_show_dna(),
+      view_menu_autofit(),
       view_menu_show_labels(),
       view_menu_mods(),
       view_menu_display_major_ticks_options(),
@@ -504,6 +505,42 @@ It uses cadnano code that crashes on many designs, so it is not guaranteed to wo
     }, elts);
   }
 
+  ReactElement view_menu_autofit() {
+    return (MenuDropdownRight()
+      ..title = 'Autofit Options'
+      ..id = 'view_menu_autofit-dropdown'
+      ..key = 'view_menu_autofit-dropdown'
+      ..className = 'submenu-item')([
+      (MenuBoolean()
+        ..value = props.autofit
+        ..display = 'Auto-fit on loading new design'
+        ..tooltip = '''\
+When loading a new design, the side and main views will be translated to show 
+the lowest-index helix in the upper-left. otherwise, after loading the design, 
+you may not be able to see it because it is translated off the screen.
+
+You may want to uncheck this when working on a design with the scripting 
+library. In that case, when repeatedly re-running the script to modify the 
+design and then re-loading it, it is preferable to keep the design centered 
+at the same location you had before, in order to be able to see the same part 
+of the design you were looking at before changing the script.'''
+        ..name = 'center-on-load'
+        ..onChange = ((_) => props.dispatch(actions.AutofitSet(autofit: !props.autofit)))
+        ..key = 'autofit-on-loading-new-design')(),
+      (MenuDropdownItem()
+        ..display = 'Auto-fit current design'
+        ..tooltip = '''\
+The side and main views will be translated to show 
+the lowest-index helix in the upper-left.
+'''
+        ..on_click = (_){
+          util.fit_and_center();
+          util.dispatch_set_zoom_threshold(true);
+          }
+        ..key = 'autofit-current-design')(),
+    ]);
+  }
+
   ReactElement view_menu_show_dna() {
     return (MenuDropdownRight()
       ..title = 'DNA sequences'
@@ -686,22 +723,6 @@ the surface of a DNA origami."""
 
   List<ReactElement> view_menu_misc() {
     return [
-      (MenuBoolean()
-        ..value = props.autofit
-        ..display = 'Auto-fit on loading new design'
-        ..tooltip = '''\
-When loading a new design, the side and main views will be translated to show 
-the lowest-index helix in the upper-left. otherwise, after loading the design, 
-you may not be able to see it because it is translated off the screen.
-
-You may want to uncheck this when working on a design with the scripting 
-library. In that case, when repeatedly re-running the script to modify the 
-design and then re-loading it, it is preferable to keep the design centered 
-at the same location you had before, in order to be able to see the same part 
-of the design you were looking at before changing the script.'''
-        ..name = 'center-on-load'
-        ..onChange = ((_) => props.dispatch(actions.AutofitSet(autofit: !props.autofit)))
-        ..key = 'autofit-on-loading-new-design')(),
       (MenuBoolean()
         ..value = props.only_display_selected_helices
         ..display = 'Display only selected helices'
@@ -753,8 +774,8 @@ Red : X-axis
 Green : Y-axis
 Blue : Z-axis'''
         ..name = 'show-helices-axis-arrows'
-        ..onChange = ((_) => props.dispatch(actions.ShowAxisArrowsSet(
-            show_helices_axis_arrows: !props.show_helices_axis_arrows)))
+        ..onChange = ((_) => props
+            .dispatch(actions.ShowAxisArrowsSet(show_helices_axis_arrows: !props.show_helices_axis_arrows)))
         ..key = 'show-helices-axis-arrows')(),
       (MenuBoolean()
         ..value = props.show_loopout_length
@@ -1168,7 +1189,8 @@ cadnano_file_loaded(FileReader file_reader, String filename) async {
   try {
     var json_cadnano_text = file_reader.result;
     filename = path.setExtension(filename, '.${constants.default_scadnano_file_extension}');
-    app.dispatch(actions.LoadDNAFile(content: json_cadnano_text, filename: filename, dna_file_type: DNAFileType.cadnano_file));
+    app.dispatch(actions.LoadDNAFile(
+        content: json_cadnano_text, filename: filename, dna_file_type: DNAFileType.cadnano_file));
   } on Exception catch (e) {
     window.alert('Error importing file: ${e}');
   }

web/index.html

@@ -394,11 +394,13 @@
     //XXX: doesn't work like I had hoped; not using it for now
     function fit_and_center() {
         if (typeof side_view_svg_pan_zoom !== 'undefined') {
+            side_view_svg_pan_zoom.resize();
             side_view_svg_pan_zoom.updateBBox(); // not sure why, but this is needed: https://github.com/ariutta/svg-pan-zoom
             side_view_svg_pan_zoom.fit();
             side_view_svg_pan_zoom.center();
         }
         if (typeof main_view_svg_pan_zoom !== 'undefined') {
+            main_view_svg_pan_zoom.resize();
             main_view_svg_pan_zoom.updateBBox(); // not sure why, but this is needed: https://github.com/ariutta/svg-pan-zoom
             main_view_svg_pan_zoom.fit();
             main_view_svg_pan_zoom.center();