Skip to content

Commit

Permalink
add defauts config menu when undefined mod menu
Browse files Browse the repository at this point in the history 
closes(42)
  • Loading branch information
@Pewillia
Pewillia committed Dec 10, 2024
1 parent 08e0fa6 commit 6ceda5b
Show file tree
Hide file tree
Showing 2 changed files with 42 additions and 37 deletions.
77 changes: 41 additions & 36 deletions src/components/MapBuilder.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,6 @@ import {
import SingleSelectComplete from './SingleSelectAutoComplete';
import { ConfigSaveUploadButtons } from './ConfigSaveUploadButtons';



export function MapBuilder() {
const cgpvContext = useContext(CGPVContext);

Expand All @@ -36,22 +34,17 @@ export function MapBuilder() {
const [isEn, setEn] = useState<boolean>(true);


const _updateConfigProperty = (property: string, value: any) => {
const _updateConfigProperty = (property: string, value: any) => {
const newConfig = { ...modifiedConfigJson };
if (value === undefined) {
_.unset(newConfig, property);
} else {
_.set(newConfig, property, value);
_.set(newConfig, property, value);
}
setModifiedConfigJson(newConfig);
setIsModified(true);

}

const getProperty = (property: string, defaultValue = undefined) => {
return _.get(configJson, property) ?? defaultValue;
};

const updateProperty = (property: string, value: any) => {
_updateConfigProperty(property, value);
};
Expand All @@ -78,26 +71,32 @@ export function MapBuilder() {
handleConfigJsonChange(modifiedConfigJson);
setIsModified(false);
}

const getProperty = (property: string, defaultValue?: any) => {
return _.get(configJson, property) ?? defaultValue;
};

return(
<Box sx={{ display: 'flex', flexDirection: 'column' }}>



<ConfigSaveUploadButtons />

<Divider sx={{ my: 2 }} />

<Button variant="contained" color="primary" size="small" onClick={handleApplyStateToConfigFile}>
Apply State to Config File
</Button>

<Divider sx={{ my: 2 }} />

<Button onClick={handleApplyConfigChanges}
disabled={!isModified}
variant="contained" color="primary" size="small">
Apply Config Changes
</Button>

<Divider sx={{ my: 2 }} />

<Button variant="contained" color="primary" size="small" onClick={handleApplyStateToConfigFile}>
Apply State to Config File
</Button>


<FormControl component="fieldset" sx={{ mt: 4, gap: 3 }}>

<SingleSelectComplete
Expand All @@ -106,6 +105,8 @@ export function MapBuilder() {
applyGrouping={true}
onChange={(value) => handleConfigFileChange(value)}
label="Select Configuration File" placeholder="" />

<Divider sx={{ my: 1 }} >Map configuration</Divider>

<FormGroup aria-label="position">
<FormLabel component="legend">Map Size</FormLabel>
Expand Down Expand Up @@ -133,60 +134,60 @@ export function MapBuilder() {
</FormControl>
</Box>
</FormGroup>

<SingleSelectComplete
<SingleSelectComplete
options={languageOptions}
defaultValue={(isEn) ? 'English' : 'French'}
defaultValue={(isEn) ? 'en' : 'fr'}
onChange={(event) => {
(isEn) ? cgpv.api.maps[mapId].setLanguage('fr') : cgpv.api.maps[mapId].setLanguage('en');
setEn(!isEn);
}}
label="Change Language" placeholder="" />
label="Map Language" placeholder="" />

<SingleSelectComplete
options={themeOptions}
defaultValue={getProperty('theme')}
defaultValue={getProperty('theme',"geo.ca")}
onChange={(value) => updateProperty('theme', value)}
label="Display Theme" placeholder="" />

<SingleSelectComplete
options={mapInteractionOptions}
defaultValue={getProperty('map.interaction')}
defaultValue={getProperty('map.interaction','dynamic')}
onChange={(value) => updateProperty('map.interaction', value)}
label="Map Interaction" placeholder="" />

<Divider sx={{ my: 1 }}>Base map</Divider>

<SingleSelectComplete
options={basemapOptions}
defaultValue={getProperty('map.basemapOptions.basemapId')}
defaultValue={getProperty('map.basemapOptions.basemapId','transport')}
onChange={(value) => updateProperty('map.basemapOptions.basemapId', value)}
label="Base Map" placeholder="" />

<SingleSelectComplete
options={basemapShading}
defaultValue={Boolean(getProperty('map.basemapOptions.shaded')) ? 'true':'false' }
onChange={(value) => {
updateProperty('map.basemapOptions.shaded', JSON.parse(value));
console.log("value of unshaded=",value,"boolean=", JSON.parse(value));
}}
updateProperty('map.basemapOptions.shaded', JSON.parse(value));
}}
label="Base Map Shaded" placeholder="" />

<SingleSelectComplete
options={basemapLabelling}
defaultValue={Boolean(getProperty('map.basemapOptions.labeled')) ? 'true':'false' }
onChange={(value) => updateProperty('map.basemapOptions.labeled', JSON.parse(value))}
label="Base Map Labeled" placeholder="" />

label="Base Map Labeled" placeholder="" />
<FormGroup aria-label="position">
<FormLabel component="legend">Zoom Levels</FormLabel>

<Box sx={{ display: 'flex', flexDirection: 'row', gap: 2 }}>
<Box sx={{ display: 'flex', flexDirection: 'row', gap: 2 }}>
<FormControl>
<SingleSelectComplete
options={zoomOptions}
defaultValue={getProperty('map.viewSettings.minZoom')}
onChange={(value) => updateProperty('map.viewSettings.minZoom', value)}
label="Min Zoom" placeholder="" />
</FormControl>

<FormControl>
<SingleSelectComplete
options={zoomOptions}
Expand All @@ -200,15 +201,17 @@ export function MapBuilder() {
<FormGroup aria-label="map projection">
<SingleSelectComplete
options={mapProjectionOptions}
defaultValue={getProperty('map.viewSettings.projection')}
defaultValue={ getProperty('map.viewSettings.projection',3978)}
onChange={(value) => updateProperty('map.viewSettings.projection', value)}
label="Map Projection" placeholder="" />
</FormGroup>

<Divider sx={{ my: 1 }} >Map components</Divider>

<FormGroup aria-label="Components">
<FormLabel component="legend">Components</FormLabel>
<PillsAutoComplete
defaultValue={getProperty('components')}
defaultValue={ getProperty('components',["north-arrow","overview-map"])}
onChange={(value) => updateArrayProperty('components', value)}
options={componentsOptions}
label="Components Options"
Expand All @@ -219,9 +222,11 @@ export function MapBuilder() {
<FormGroup aria-label="Navigation Bar Options">
<FormLabel component="legend">Navigation Bar</FormLabel>
<PillsAutoComplete
defaultValue={getProperty('navBar')}
onChange={(value) => updateArrayProperty('navBar', value)}
options={navBarOptions}
defaultValue={
((getProperty('navBar') !== undefined)&&(Array.from(getProperty( 'navBar')!).length)===0) ? ["zoom"] : getProperty('navBar', ["zoom", "home", "basemap-select", "fullscreen"])
}
options = { navBarOptions }
label="Options" placeholder="" />
</FormGroup>

Expand All @@ -246,7 +251,7 @@ export function MapBuilder() {
/>
</FormLabel>
<PillsAutoComplete
defaultValue={getProperty('appBar.tabs.core')}
defaultValue={getProperty('appBar.tabs.core',["geolocator"])}
onChange={(value) => updateArrayProperty('appBar.tabs.core', value)}
options={appBarOptions} label="App-bar Options" placeholder="" />
</FormGroup>
Expand Down
2 changes: 1 addition & 1 deletion src/providers/cgpvContextProvider/cgpvHook.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -267,7 +267,7 @@ export function useCgpvHook(): ICgpvHook {
const str = json.replaceAll(`'`, `"`);
JSON.parse(str);
cgpv.api.config.createMapConfig(str, 'en');
} catch (e: any) {
} catch (e: any) {
return cgpv.api.utilities.core.escapeRegExp(e.message);
}
return null;
Expand Down

0 comments on commit 6ceda5b

Please sign in to comment.