fix: dropdowns now select chart carousel

jcw780 · Jul 14, 2020 · a65eeb9 · a65eeb9
1 parent 3a89720
commit a65eeb9
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 6 deletions.
diff --git a/src/components/Charts/Charts.tsx b/src/components/Charts/Charts.tsx
@@ -204,7 +204,11 @@ class SubGroup extends React.Component<subGroupProps, {index: number}>{
             const link = links[i];
             link[T.singleLinkIndex.name] = chart[singleChartIndex.name];
             if(carousel){
-                link[T.singleLinkIndex.ref] = this.scrollRef;
+                link[T.singleLinkIndex.ref] = () => {
+                    const {current} = this.scrollRef;
+                    if(current !== undefined || current !== null) window.scrollTo(0, current!.offsetTop);
+                    this.handleSelectButton(String(i));
+                }
             }else{
                 link[T.singleLinkIndex.ref] = chart[singleChartIndex.ref].current!.scrollRef;
             }
@@ -294,7 +298,7 @@ export class ChartGroup extends React.Component<chartGroupProps>{
         });
         //Preinitialize postpenetration names
         this.chartConfigs.post.forEach((chart, i) => {
-            chart[singleChartIndex.name] = 'Horizontal Impact Angle ' + (i + 1);});
+            chart[singleChartIndex.name] = `Horizontal Impact Angle $(i + 1)`;});
 
         const initialJson = require('../../static/initialData.json');
         this.updateData(initialJson, false);

diff --git a/src/components/Navbar/NavDropdownContainer.tsx b/src/components/Navbar/NavDropdownContainer.tsx
@@ -9,12 +9,16 @@ interface propsT{
     links: T.singleLinkT[], title: string,
 }
 export class NavDropdownContainer extends React.Component<propsT>{
-    private makeScroller = (ref : React.RefObject<any>) => {
+    private makeScroller = (ref : React.RefObject<any> | ((any) => void)) => {
         const scrollToRef = (ref : React.RefObject<any>) => {
             const {current} = ref;
-            if(current !== undefined || current !== null) window.scrollTo(0, ref.current!.offsetTop);
+            if(current !== undefined || current !== null) window.scrollTo(0, current!.offsetTop);
+        }
+        if(ref instanceof (Function)){
+            return ref;
+        }else{
+            return () => scrollToRef(ref);
         }
-        return _ => scrollToRef(ref);
     }
     private makeDropdowns = () => {
         return this.props.links.map((link, i) => {

diff --git a/src/components/commonTypes.tsx b/src/components/commonTypes.tsx
@@ -84,7 +84,7 @@ export type chartRefT = React.RefObject<SingleChart>;
 
 //Navbar Links
 export enum singleLinkIndex {name, ref}
-export type singleLinkT = [string, React.RefObject<any>];
+export type singleLinkT = [string, React.RefObject<any> | ((any) => void)];
 export type parameterRefT = React.RefObject<ShellFormsContainer 
 | TargetFormsContainer | SettingsBar>;
 export type linkKeyT = chartT | 'parameters';