-
Notifications
You must be signed in to change notification settings - Fork 0
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
Navigation update separate mobile desktop #48
Merged
Merged
Changes from 34 commits
Commits
Show all changes
36 commits
Select commit
Hold shift + click to select a range
d062f92
add Mobile and Desktop Pages
JesJehle cc42efa
Merge branch 'screen-size' into navigation-update-seperate-mobile-des…
JesJehle 21d7a6f
Merge branch 'main' into navigation-update-seperate-mobile-desktop
JesJehle 56ceed9
adding mobile and Desktop Navigation
JesJehle 125488b
build DesktopPage
JesJehle ba0945d
adjust InventoryList
JesJehle 3ffa513
adjust base layer selection
JesJehle d3ef153
adjust map
JesJehle b4f6447
delete mobile page
JesJehle 649856a
implemt TreeDetails using navigation
mmaelicke 4931923
use react-router directly
mmaelicke 76389a0
cleanup
mmaelicke 3c79137
add Settings page to desktop navigation
mmaelicke 1a4ced0
Merge pull request #49 from hydrocode-de/use-nested-router
JesJehle 9f32fb6
using list instead of cards, add a add to bockmark button.
JesJehle 2d6cf51
updating VisualMapSelection
JesJehle b7ca57a
added additional map buttons
JesJehle 7cdca4b
added RangeFilter as popover for desktop
JesJehle 8441eb0
adding map buttons to map component
JesJehle bf79de2
wip
JesJehle d1118e2
set fixed width for Tree Details and adjust IonGrid
JesJehle ef8b5b0
adding MapButtonGroup to Desktop
JesJehle 1fbd971
working on activeActionButton
JesJehle 37266d9
updated visual map selection
JesJehle 3f5e960
map style selection on mobile
JesJehle d20b5a0
finished visual map selection
JesJehle d0e50ed
added RangeFilter to desktop and mobile
JesJehle d42b802
inspecting bug
JesJehle d9dfcb3
added variable selection component and satte
JesJehle 5d22776
addded correct variable state to button
JesJehle f58fa1a
reorganising and cleaning
JesJehle 576a148
adding modal reference for each modal
JesJehle a906c0b
clean up
JesJehle 33dba97
fixing spacing
JesJehle c988043
disable Selection button
mmaelicke 85d328f
fixing issues of review
JesJehle File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
File renamed without changes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
import { | ||
IonContent, | ||
IonHeader, | ||
IonPage, | ||
IonRouterOutlet, | ||
IonTitle, | ||
IonToolbar, | ||
} from "@ionic/react"; | ||
import { IonReactRouter } from "@ionic/react-router"; | ||
import React from "react"; | ||
import { Redirect, Route } from "react-router"; | ||
import InventoryListPage from "./pages/InventoryListPage"; | ||
import MapPage from "./pages/MobilePage"; | ||
import SettingsPage from "./pages/SettingsPage"; | ||
import TreeOverviewPage from "./pages/TreeOverviewPage"; | ||
|
||
const MobileNavigation: React.FC = () => { | ||
console.log("Running Mobile Navigation"); | ||
return ( | ||
<IonReactRouter> | ||
<IonRouterOutlet> | ||
<Redirect exact from="/" to="/map" /> | ||
<Route exact path="/map"> | ||
<MapPage /> | ||
</Route> | ||
<Route exact path="/list"> | ||
<InventoryListPage /> | ||
</Route> | ||
<Route exact path="/settings"> | ||
<SettingsPage /> | ||
</Route> | ||
<Route path="/list/:id" component={TreeOverviewPage} /> | ||
</IonRouterOutlet> | ||
</IonReactRouter> | ||
); | ||
}; | ||
|
||
export default MobileNavigation; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,78 @@ | ||
import { IonButton, IonImg, IonNote } from "@ionic/react"; | ||
import { useEffect, useState } from "react"; | ||
import { useLayers } from "../context/layers"; | ||
|
||
interface ActiveMapSelectionButtonProps { | ||
height: number; | ||
width: number; | ||
} | ||
|
||
const ActiveMapSelectionButton: React.FC<ActiveMapSelectionButtonProps> = ({ | ||
height, | ||
width, | ||
}) => { | ||
const layers = useLayers(); | ||
|
||
const [src, setSrc] = useState("assets/openstreetmap.png"); | ||
const [titel, setTitel] = useState("OSM"); | ||
|
||
useEffect(() => { | ||
if (layers.activeBaseLayer.toString() === "density") { | ||
setSrc("assets/density.png"); | ||
setTitel("Density"); | ||
} else if (layers.activeBaseLayer.toString() === "dtm") { | ||
setSrc("assets/dtm.png"); | ||
setTitel("DTM"); | ||
} else if (layers.activeBaseLayer.toString() === "ortho") { | ||
setSrc("assets/ortho.png"); | ||
setTitel("Ortho"); | ||
} else { | ||
setSrc("assets/openstreetmap.png"); | ||
setTitel("OSM"); | ||
} | ||
}, [layers.activeBaseLayer]); | ||
|
||
return ( | ||
<IonButton | ||
id="open-map-selection-popover" | ||
class="ion-no-padding" | ||
style={{ | ||
height: height, | ||
width: width, | ||
}} | ||
> | ||
<div | ||
style={{ | ||
height: height, | ||
width: width, | ||
// padding: isHoverDTM ? 2 : 0, | ||
borderColor: "#0fac0c", | ||
borderWidth: 2, | ||
borderStyle: "solid", | ||
borderRadius: 2, | ||
display: "flex", | ||
alignItems: "end", | ||
justifyContent: "center", | ||
}} | ||
> | ||
<div style={{ position: "absolute", zIndex: -1 }}> | ||
<IonImg src={src}></IonImg> | ||
</div> | ||
<div | ||
style={{ | ||
backgroundColor: "#0fac0c", | ||
height: height / 4, | ||
width: "100%", | ||
display: "flex", | ||
alignItems: "center", | ||
justifyContent: "center", | ||
}} | ||
> | ||
<IonNote style={{ color: "white" }}>{titel}</IonNote> | ||
</div> | ||
</div> | ||
</IonButton> | ||
); | ||
}; | ||
|
||
export default ActiveMapSelectionButton; |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
a comment about the purpose would be nice