Skip to content

Commit

Permalink
Revert "Merge pull request #1346 from hajkmap/feature/1316-PermanentD…
Browse files Browse the repository at this point in the history 
…rawerOption"

This reverts commit 38564d6, reversing
changes made to dbbc37e.

This will be re-merged once #1367 is closed.
  • Loading branch information
@jacobwod
jacobwod committed Aug 7, 2023
1 parent 9a3e7ac commit 55b01ed
Show file tree
Hide file tree
Showing 2 changed files with 62 additions and 154 deletions.
37 changes: 1 addition & 36 deletions new-admin/src/views/mapoptions.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,6 @@ class MapOptions extends Component {
drawerVisible: config.drawerVisible,
drawerVisibleMobile: config.drawerVisibleMobile,
drawerPermanent: config.drawerPermanent,
drawerStatic: config.drawerStatic,
zoomDelta: config.zoomDelta || "",
zoomDuration: config.zoomDuration || "",
title: config.title ? config.title : "",
Expand Down Expand Up @@ -178,7 +177,6 @@ class MapOptions extends Component {
drawerVisible: mapConfig.drawerVisible,
drawerVisibleMobile: mapConfig.drawerVisibleMobile,
drawerPermanent: mapConfig.drawerPermanent,
drawerStatic: mapConfig.drawerStatic,
activeDrawerOnStart: mapConfig.activeDrawerOnStart
? mapConfig.activeDrawerOnStart
: "plugins",
Expand Down Expand Up @@ -369,7 +367,6 @@ class MapOptions extends Component {
case "showRecentlyUsedPlugins":
case "introductionEnabled":
case "introductionShowControlButton":
case "drawerStatic":
case "drawerVisible":
case "drawVisibleMobile":
case "drawerPermanent":
Expand Down Expand Up @@ -448,7 +445,6 @@ class MapOptions extends Component {
config.drawerVisible = this.getValue("drawerVisible");
config.drawerVisibleMobile = this.getValue("drawerVisibleMobile");
config.drawerPermanent = this.getValue("drawerPermanent");
config.drawerStatic = this.getValue("drawerStatic");
config.activeDrawerOnStart = this.getValue("activeDrawerOnStart");
config.geoserverLegendOptions = this.getValue("geoserverLegendOptions");
config.defaultCookieNoticeMessage = this.getValue(
Expand Down Expand Up @@ -1418,32 +1414,6 @@ class MapOptions extends Component {
/>
</div>
<div className="separator">Inställningar för sidopanel</div>
<div>
<input
id="input_drawerStatic"
type="checkbox"
ref="input_drawerStatic"
onChange={(e) => {
this.setState({ drawerStatic: e.target.checked });
if (e.target.checked === true) {
this.setState({
drawerPermanent: false,
drawerVisible: false,
});
}
}}
checked={this.state.drawerStatic}
/>
&nbsp;
<label className="long-label" htmlFor="input_drawerStatic">
Låt sidopanelen vara permanent synlig{" "}
<i
className="fa fa-question-circle"
data-toggle="tooltip"
title="Om aktiv kommer sidopanelen vara permanent synlig och låst"
/>
</label>
</div>
<div>
<input
id="input_drawerVisible"
Expand All @@ -1459,7 +1429,6 @@ class MapOptions extends Component {
}
}}
checked={this.state.drawerVisible}
disabled={this.state.drawerStatic === true}
/>
&nbsp;
<label className="long-label" htmlFor="input_drawerVisible">
Expand All @@ -1480,7 +1449,6 @@ class MapOptions extends Component {
this.setState({ drawerVisibleMobile: e.target.checked });
}}
checked={this.state.drawerVisibleMobile}
disabled={this.state.drawerStatic === true}
/>
&nbsp;
<label className="long-label" htmlFor="input_drawerVisibleMobile">
Expand All @@ -1501,10 +1469,7 @@ class MapOptions extends Component {
this.setState({ drawerPermanent: e.target.checked });
}}
checked={this.state.drawerPermanent}
disabled={
this.state.drawerVisible !== true ||
this.state.drawerStatic === true
}
disabled={this.state.drawerVisible !== true}
/>
&nbsp;
<label className="long-label" htmlFor="input_drawerPermanent">
Expand Down
179 changes: 61 additions & 118 deletions new-client/src/components/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -252,77 +252,13 @@ class App extends React.PureComponent {
: null;
};

isDrawerPermanent = (drawerProps) => {
const { props, activeDrawerContentState, drawerPermanentFromLocalStorage } =
drawerProps;
const { map } = props.config.mapConfig;
// First check if we have anything to render at all and in case we haven't -> do not show drawer
// If on a mobile device, the drawer should never be permanent.
if (activeDrawerContentState === null || isMobile) {
return false;
}
// If drawer is set to static we want the the drawer to be set to permanent
if (map.drawerStatic) {
return true;
}
// If not on mobile, if cookie is not null, use it to show/hide Drawer.
// If cookie is not null, use it to show/hide Drawer.
// If cookie however is null, fall back to the values from config.
if (drawerPermanentFromLocalStorage !== null) {
return drawerPermanentFromLocalStorage;
}
// Finally, check if drawerVisible and drawerPermanent are both true, and return true if they are.
return map.drawerVisible && map.drawerPermanent;
};

isDrawerVisible = (drawerProps) => {
const { props, activeDrawerContentState, drawerPermanentFromLocalStorage } =
drawerProps;
const { map } = props.config.mapConfig;
// First check if we have anything to render at all and in case we haven't -> do not show drawer
if (activeDrawerContentState === null) {
return false;
}
// If on a mobile device, the drawer should never be visible.
if (isMobile && map.drawerVisibleMobile !== undefined) {
return map.drawerVisibleMobile;
}
// If drawer is set to static we want the the drawer to be set to visible
if (map.drawerStatic) {
return true;
}
// If not on mobile, if cookie is not null, use it to show/hide Drawer.
// If cookie is not null, use it to show/hide Drawer.
// If cookie however is null, fall back to the values from config.
if (drawerPermanentFromLocalStorage !== null) {
return drawerPermanentFromLocalStorage;
}
// Finally, we return true if drawerVisible is set, otherwise false
return map.drawerVisible || false;
};

isDrawerStatic = (drawerProps) => {
const { drawerStatic } = drawerProps.props.config.mapConfig.map;
// We check if we have something to render or if user is on mobile.
if (drawerProps.activeDrawerContentState === null || isMobile) {
return false;
}
// And if the drawerStatic is being used at all.
if (drawerStatic !== undefined) {
return drawerStatic;
}
return drawerStatic || false;
};

constructor(props) {
super(props);

const drawerPermanentFromLocalStorage =
this.getDrawerPermanentFromLocalStorage();

const activeDrawerContentFromLocalStorage =
this.getActiveDrawerContentFromLocalStorage();

const canRenderDefaultDrawer = this.hasAnyToolbarTools();

const canRenderCustomDrawer = this.canRenderCustomDrawer(
Expand All @@ -335,6 +271,7 @@ class App extends React.PureComponent {
//if we cant render customContent fall back to mapconfig
//Finally, fall back to 'plugins', the standard tools panel.
//This fall back avoids rendering an empty drawer in the case that draw is set to visible but there is no drawer content in local storage.

const activeDrawerContentState = canRenderCustomDrawer
? activeDrawerContentFromLocalStorage !== null &&
activeDrawerContentFromLocalStorage !== "plugins"
Expand All @@ -344,24 +281,37 @@ class App extends React.PureComponent {
? "plugins"
: null;

const drawerProps = {
props,
activeDrawerContentState,
drawerPermanentFromLocalStorage,
};
// First check if we have anything to render at all and in case we haven't -> do not show drawer
// If on a mobile device, the drawer should never be permanent.
// If not on mobile, if cookie is not null, use it to show/hide Drawer.
// If cookie is not null, use it to show/hide Drawer.
// If cookie however is null, fall back to the values from config.
// Finally, fall back to "false" if no cookie or config is found.
const drawerPermanent =
activeDrawerContentState === null
? false
: isMobile
? false
: drawerPermanentFromLocalStorage !== null
? drawerPermanentFromLocalStorage
: (props.config.mapConfig.map.drawerVisible &&
props.config.mapConfig.map.drawerPermanent) ||
false;

// We check if drawer is set to static
const drawerStatic = this.isDrawerStatic(drawerProps);
// We check if drawer is set to permanent
// If drawerStatic is true, we do not need to check drawerPermanent
const drawerPermanent = drawerStatic
? true
: this.isDrawerPermanent(drawerProps);
// We check if drawer is set to visible
// If drawerStatic is true, we do not need to check drawerVisible
const drawerVisible = drawerStatic
? true
: this.isDrawerVisible(drawerProps);
// First check if we have anything to render at all and in case we haven't -> do not show drawer
// If on a mobile device, and a config property for if the drawer should initially be open is set, base the drawer state on this.
// Otherwise if cookie for "drawerPermanent" is not null, use it to control Drawer visibility,
// If there a no cookie settings, use the config drawVisible setting.
// Finally, don't show the drawer.
const drawerVisible =
activeDrawerContentState === null
? false
: isMobile &&
props.config.mapConfig.map.drawerVisibleMobile !== undefined
? props.config.mapConfig.map.drawerVisibleMobile
: drawerPermanentFromLocalStorage !== null
? drawerPermanentFromLocalStorage
: props.config.mapConfig.map.drawerVisible || false;

this.state = {
alert: false,
Expand All @@ -370,7 +320,6 @@ class App extends React.PureComponent {
mapClickDataResult: {},
drawerVisible: drawerVisible,
drawerPermanent: drawerPermanent,
drawerStatic: drawerStatic,
activeDrawerContent: activeDrawerContentState,
drawerMouseOverLock: false,
};
Expand Down Expand Up @@ -944,40 +893,37 @@ class App extends React.PureComponent {
<DrawerTitle variant="button">{drawerTitle}</DrawerTitle>
</Grid>
{/** Hide Lock button in mobile mode - there's not screen estate to permanently lock Drawer on mobile viewports*/}
{/** Hide Lock button if user has chosen static drawer*/}
{!this.state.drawerStatic && (
<Grid item>
<Hidden mdDown>
<Tooltip
disableInteractive
title={
(this.state.drawerPermanent ? "Lås upp" : "Lås fast") +
" verktygspanelen"
}
<Grid item>
<Hidden mdDown>
<Tooltip
disableInteractive
title={
(this.state.drawerPermanent ? "Lås upp" : "Lås fast") +
" verktygspanelen"
}
>
<IconButton
sx={{ margin: "-12px" }} // Ugh... However, it tightens everything up
onClick={this.togglePermanent}
onMouseEnter={this.handleMouseEnter}
onMouseLeave={this.handleMouseLeave}
size="large"
>
<IconButton
sx={{ margin: "-12px" }} // Ugh... However, it tightens everything up
onClick={this.togglePermanent}
onMouseEnter={this.handleMouseEnter}
onMouseLeave={this.handleMouseLeave}
size="large"
>
{this.state.drawerPermanent ? (
this.state.drawerMouseOverLock ? (
<LockOpenIcon />
) : (
<LockIcon />
)
) : this.state.drawerMouseOverLock ? (
<LockIcon />
) : (
{this.state.drawerPermanent ? (
this.state.drawerMouseOverLock ? (
<LockOpenIcon />
)}
</IconButton>
</Tooltip>
</Hidden>
</Grid>
)}
) : (
<LockIcon />
)
) : this.state.drawerMouseOverLock ? (
<LockIcon />
) : (
<LockOpenIcon />
)}
</IconButton>
</Tooltip>
</Hidden>
</Grid>
</DrawerHeaderGrid>
</>
);
Expand Down Expand Up @@ -1075,15 +1021,12 @@ class App extends React.PureComponent {
<StyledHeader
id="header"
sx={{
justifyContent: this.state.drawerStatic
? "end"
: "space-between",
"& > *": {
pointerEvents: "auto",
},
}}
>
{clean === false && !this.state.drawerStatic && (
{clean === false && (
<DrawerToggleButtons
drawerButtons={this.state.drawerButtons}
globalObserver={this.globalObserver}
Expand Down

0 comments on commit 55b01ed

Please sign in to comment.