wait for a requested chart on start up

viewer/App.jsx

@@ -289,7 +289,7 @@ class App extends React.Component {
         let lastChart=mapholder.getLastChartKey();
         if (startpage === 'mainpage' && globalStore.getData(keys.properties.startNavPage) && lastChart){
             const delayedStart=()=>{
-                this.history.replace(startpage,{selectChart:lastChart})
+                this.history.push('navpage');
             }
             this.history.push(startpage,{noInitial:true});
             Promise.all(this.pendingActions)

viewer/components/OverlayDialog.jsx

@@ -373,6 +373,16 @@ const Dialogs = {
 
 
 };
+export const dialogDisplay=(content,closeCallback)=>{
+    let Display=InputMonitor(DialogDisplay);
+    return(
+        <Display
+            className="nested"
+            content={content}
+            closeCallback={closeCallback}
+        />
+    );
+}
 /**
  * a helper that will add dialog functionality to a component
  * it will maintain a variable inside the component state that holds the dialog
@@ -418,16 +428,9 @@ export const dialogHelper=(thisref,stateName,opt_closeCallback)=>{
         },
         getRender(){
             if (!thisref.state[stateName]) return null;
-            let Display=InputMonitor(DialogDisplay);
-            return(
-                <Display
-                    className="nested"
-                    content={thisref.state[stateName]}
-                    closeCallback={()=>{
-                        this.hideDialog()
-                    }}
-                    />
-            );
+            return dialogDisplay(thisref.state[stateName],()=>{
+                this.hideDialog()
+            });
         },
         isShowing(){
           return !!thisref.state[stateName];

viewer/gui/MainPage.jsx

@@ -25,7 +25,6 @@ import {RecursiveCompare} from '../util/compare';
 import LocalStorage from '../util/localStorageManager';
 import splitsupport from "../util/splitsupport";
 import LeaveHandler from '../util/leavehandler';
-import OverlayDialog, {dialogHelper} from "../components/OverlayDialog";
 
 
 
@@ -125,7 +124,6 @@ class MainPage extends React.Component {
             this.fillList();
         },{sequence:keys.gui.global.reloadSequence});
         this.timer=GuiHelper.lifecycleTimer(this,(sequence)=>{
-            this.checkChartRequest();
             this.fillList(sequence);
         },3000,true);
         let self=this;
@@ -147,11 +145,6 @@ class MainPage extends React.Component {
         },"page",["selectChart","nextChart","previousChart"]);
         this.showNavpage=this.showNavpage.bind(this);
         this.ChartItem=this.ChartItem.bind(this);
-        this.dialogHelper=dialogHelper(this,'waitChart',()=>{
-            this.setState({waitingDone:true});
-            console.log("chart waiting cancelled");
-            this.props.history.replace('mainpage');
-        });
 
     }
 
@@ -165,33 +158,6 @@ class MainPage extends React.Component {
         this.props.history.push('navpage');
     };
 
-    checkChartRequest(){
-        if (this.props.options && this.props.options.selectChart && ! this.state.waitingDone) {
-            if (!this.dialogHelper.isShowing()) {
-                this.chartWaitCount = 5;
-                this.dialogHelper.showDialog(
-                    OverlayDialog.createAlertDialog("waiting for chart " + this.props.options.selectChart,
-                        () => {
-                            this.dialogHelper.hideDialog();
-                        }
-                    ));
-            }
-        }
-        if (this.dialogHelper.isShowing()){
-            this.chartWaitCount-=1;
-            if (this.chartWaitCount < 0 || ! (this.props.options && this.props.options.selectChart)){
-                this.dialogHelper.hideDialog();
-            }
-            let chartlist=this.state.chartList||[];
-            chartlist.forEach((chart)=>{
-                if (chart.key === this.props.options.selectChart){
-                    this.props.history.replace('mainpage');
-                    this.showNavpage(chart);
-                }
-            })
-        }
-    }
-
 
     getButtons() {
         return [
@@ -319,10 +285,6 @@ class MainPage extends React.Component {
 
     componentDidMount() {
         globalStore.storeData(keys.gui.global.soundEnabled,true);
-        this.checkChartRequest();
-    }
-    componentDidUpdate(prevProps, prevState, snapshot) {
-        this.checkChartRequest();
     }
 
     selectChart(offset){

viewer/gui/NavPage.jsx

@@ -8,7 +8,7 @@ import React from 'react';
 import MapPage,{overlayDialog} from '../components/MapPage.jsx';
 import Toast from '../components/Toast.jsx';
 import NavHandler from '../nav/navdata.js';
-import OverlayDialog from '../components/OverlayDialog.jsx';
+import OverlayDialog, {dialogDisplay} from '../components/OverlayDialog.jsx';
 import Helper from '../util/helper.js';
 import GuiHelpers from '../util/GuiHelpers.js';
 import MapHolder from '../map/mapholder.js';
@@ -32,6 +32,11 @@ import {InputReadOnly} from "../components/Inputs";
 import assign from 'object-assign';
 import WidgetFactory from "../components/WidgetFactory";
 import ItemList from "../components/ItemList";
+import mapholder from "../map/mapholder.js";
+import Page from "../components/Page";
+import Dialogs from "../components/OverlayDialog.jsx";
+import Requests from "../util/requests";
+import DB from "../components/DialogButton";
 
 const RouteHandler=NavHandler.getRoutingHandler();
 
@@ -223,7 +228,8 @@ class NavPage extends React.Component{
         this.getButtons=this.getButtons.bind(this);
         this.mapEvent=this.mapEvent.bind(this);
         this.state={
-            showWpButtons: false
+            showWpButtons: false,
+            sequence: 0
         };
         this.showWpButtons=this.showWpButtons.bind(this);
         this.widgetClick=this.widgetClick.bind(this);
@@ -353,6 +359,35 @@ class NavPage extends React.Component{
         if (globalStore.getData(keys.properties.mapLockMode) === 'center'){
             MapHolder.setBoatOffset();
         }
+        this.checkChartCount=30;
+        this.checkChartTimer=GuiHelpers.lifecycleTimer(this,(seq)=>{
+            let neededChart=this.needsChartLoad();
+            if (! neededChart){
+                this.checkChartTimer.startTimer(seq);
+                return;
+            }
+            this.checkChartCount--;
+            if (this.checkChartCount < 0){
+                this.props.history.pop();
+                return;
+            }
+            Requests.getJson("?request=list&type=chart",{timeout:3*parseFloat(globalStore.getData(keys.properties.networkTimeout))}).
+                then((json)=>{
+                    this.checkChartTimer.startTimer(seq);
+                    (json.items||[]).forEach((chartEntry)=>{
+                        if (!chartEntry.key) chartEntry.key=chartEntry.chartKey||chartEntry.url;
+                        if (chartEntry.key === neededChart){
+                            mapholder.setChartEntry(chartEntry);
+                            this.setState({sequence:this.state.sequence+1});
+                        }
+                    })
+                })
+                .catch(()=>{this.checkChartTimer.startTimer(seq)});
+        },1000,true);
+    }
+    needsChartLoad(){
+        if (mapholder.getCurrentChartEntry()) return;
+        return mapholder.getLastChartKey()
     }
     widgetClick(item,data,panel,invertEditDirection){
         let pagePanels=LayoutHandler.getPagePanels(PAGENAME);
@@ -652,6 +687,28 @@ class NavPage extends React.Component{
             autohide=globalStore.getData(keys.properties.hideButtonTime,30)*1000;
         }
         let pageProperties=Helper.filteredAssign(MapPage.propertyTypes,self.props);
+        let neededChart=this.needsChartLoad();
+        if (neededChart){
+            let Dialog=dialogDisplay((props)=>{
+                return (<div className="inner">
+                    <h3 className="dialogTitle">Waiting for chart</h3>
+
+                    <div className="dialogText">{neededChart}</div>
+                    <div className="dialogButtons">
+                        <DB name="cancel" onClick={()=>this.props.history.pop()}>Cancel</DB>
+                    </div>
+                </div>)
+                },
+                ()=>this.props.history.pop());
+            return (
+                <Page
+                    {...pageProperties}
+                    id={PAGENAME}
+                    buttonList={self.getButtons()}
+                    mainContent={Dialog}
+                    />
+            );
+        }
         return (
             <MapPage
                 {...pageProperties}