Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

42 update configlist defaults navbar configbar #65

Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 2 additions & 5 deletions .github/workflows/build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -33,15 +33,12 @@ jobs:
version: ${{ env.PNPM_VERSION }}
run_install: false

# Run rush install and build on our code
- name: Install Rush
run: node common/scripts/install-run-rush.js install


- name: Persist build output for other workflows
uses: actions/cache@v3
with:
path: dist
key: dist-${{ inputs.cache_sha }}

- name: Rush Build
run: node common/scripts/install-run-rush.js build:core

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"version": "0.0.0",
"type": "module",
"scripts": {
"build": "tsc -b && vite build --watch --config vite.config.ts",
"build": "tsc -b && vite build --config vite.config.ts",
"lint": "eslint .",
"preview": "vite preview",
"dev": "vite dev",
Expand Down
83 changes: 42 additions & 41 deletions src/components/MapBuilder.tsx
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
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
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
Loading