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 16, 2024
1 parent 08e0fa6 commit 883047a
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 43 deletions.
83 changes: 42 additions & 41 deletions src/components/MapBuilder.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,13 @@ import {
import SingleSelectComplete from './SingleSelectAutoComplete';
import { ConfigSaveUploadButtons } from './ConfigSaveUploadButtons';



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

if (!cgpvContext) {
throw new Error('CGPVContent must be used within a CGPVProvider');
}

const { mapId } = cgpvContext;
const { configJson, handleApplyStateToConfigFile, handleConfigFileChange, handleConfigJsonChange, configFilePath, mapWidth, mapHeight, setMapWidth, setMapHeight } = 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,64 +134,62 @@ 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));
}}
onChange={(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')}
options={zoomOptions}
defaultValue={getProperty('map.viewSettings.minZoom', 0)}
onChange={(value) => updateProperty('map.viewSettings.minZoom', value)}
label="Min Zoom" placeholder="" />
</FormControl>

<FormControl>
<SingleSelectComplete
options={zoomOptions}
defaultValue={getProperty('map.viewSettings.maxZoom')}
defaultValue={getProperty('map.viewSettings.maxZoom', 50)}
onChange={(value) => updateProperty('map.viewSettings.maxZoom', value)}
label="Max Zoom" placeholder="" />
</FormControl>
Expand All @@ -200,15 +199,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 +220,9 @@ 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 +247,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/constants.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -160,4 +160,4 @@ export const corePackagesOptions: ListOptionType[] = [
{ title: 'Swiper', value: 'swiper' }
];

export const zoomOptions: ListOptionType[] = _.range(0, 51).map((value) => ({ title: value.toString(), value }));
export const zoomOptions: ListOptionType[] = _.range(0, 51).map((value) => ({ title: value.toString().padStart(2), value }));
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 883047a

Please sign in to comment.