midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Housekeeping...

Browse source
This commit is contained in:
Pieter Vander Vennet 2022-12-16 13:44:25 +01:00
parent 339bfab361
commit 9e000d521f
35 changed files with 406 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

6
UI/AllThemesGui.ts
View file

@ -12,7 +12,7 @@ import Toggle from "./Input/Toggle"
import { SubtleButton } from "./Base/SubtleButton"
import { VariableUiElement } from "./Base/VariableUIElement"
import Svg from "../Svg"
import {ImportViewerLinks} from "./BigComponents/UserInformation";
import { ImportViewerLinks } from "./BigComponents/UserInformation"
export default class AllThemesGui {
setup() {
@ -36,7 +36,9 @@ export default class AllThemesGui {
.onClick(() => state.osmConnection.AttemptLogin()),
state.osmConnection.isLoggedIn
),
new ImportViewerLinks(state.osmConnection).SetClass("p-4 border-2 border-gray-500 m-4 block"),
new ImportViewerLinks(state.osmConnection).SetClass(
"p-4 border-2 border-gray-500 m-4 block"
),
Translations.t.general.aboutMapcomplete
.Subs({ osmcha_link: Utils.OsmChaLinkFor(7) })
.SetClass("link-underline"),

26
UI/BaseUIElement.ts
View file

@ -3,7 +3,7 @@
*
* Assumes a read-only configuration, so it has no 'ListenTo'
*/
import {Utils} from "../Utils";
import { Utils } from "../Utils"
export default abstract class BaseUIElement {
protected _constructedHtmlElement: HTMLElement
@ -43,32 +43,32 @@ export default abstract class BaseUIElement {
this._constructedHtmlElement?.scrollTo(0, 0)
}
public ScrollIntoView(options?: {
onlyIfPartiallyHidden?: boolean
}) {
if(this._constructedHtmlElement === undefined){
public ScrollIntoView(options?: { onlyIfPartiallyHidden?: boolean }) {
if (this._constructedHtmlElement === undefined) {
return
}
let alignToTop = true;
if(options?.onlyIfPartiallyHidden){
let alignToTop = true
if (options?.onlyIfPartiallyHidden) {
// Is the element completely in the view?
const parentRect = Utils.findParentWithScrolling(this._constructedHtmlElement.parentElement).getBoundingClientRect();
const elementRect = this._constructedHtmlElement.getBoundingClientRect();
const parentRect = Utils.findParentWithScrolling(
this._constructedHtmlElement.parentElement
).getBoundingClientRect()
const elementRect = this._constructedHtmlElement.getBoundingClientRect()
// Check if the element is within the vertical bounds of the parent element
const topIsVisible = elementRect.top >= parentRect.top
const bottomIsVisible = elementRect.bottom <= parentRect.bottom
const inView = topIsVisible && bottomIsVisible ;
if(inView){
const inView = topIsVisible && bottomIsVisible
if (inView) {
return
}
if(topIsVisible){
if (topIsVisible) {
alignToTop = false
}
}
this._constructedHtmlElement?.scrollIntoView({
behavior: "smooth",
block: "start"
block: "start",
})
}
/**

63
UI/DefaultGUI.ts
View file

@ -1,7 +1,7 @@
import FeaturePipelineState from "../Logic/State/FeaturePipelineState"
import State from "../State"
import {Utils} from "../Utils"
import {UIEventSource} from "../Logic/UIEventSource"
import { Utils } from "../Utils"
import { UIEventSource } from "../Logic/UIEventSource"
import FullWelcomePaneWithTabs from "./BigComponents/FullWelcomePaneWithTabs"
import MapControlButton from "./MapControlButton"
import Svg from "../Svg"
@ -16,7 +16,7 @@ import ScrollableFullScreen from "./Base/ScrollableFullScreen"
import Translations from "./i18n/Translations"
import SimpleAddUI from "./BigComponents/SimpleAddUI"
import StrayClickHandler from "../Logic/Actors/StrayClickHandler"
import {DefaultGuiState} from "./DefaultGuiState"
import { DefaultGuiState } from "./DefaultGuiState"
import LayerConfig from "../Models/ThemeConfig/LayerConfig"
import * as home_location_json from "../assets/layers/home_location/home_location.json"
import NewNoteUi from "./Popup/NewNoteUi"
@ -24,11 +24,11 @@ import Combine from "./Base/Combine"
import AddNewMarker from "./BigComponents/AddNewMarker"
import FilteredLayer from "../Models/FilteredLayer"
import ExtraLinkButton from "./BigComponents/ExtraLinkButton"
import {VariableUiElement} from "./Base/VariableUIElement";
import Img from "./Base/Img";
import UserInformationPanel from "./BigComponents/UserInformation";
import {LoginToggle} from "./Popup/LoginButton";
import {FixedUiElement} from "./Base/FixedUiElement";
import { VariableUiElement } from "./Base/VariableUIElement"
import Img from "./Base/Img"
import UserInformationPanel from "./BigComponents/UserInformation"
import { LoginToggle } from "./Popup/LoginButton"
import { FixedUiElement } from "./Base/FixedUiElement"
/**
* The default MapComplete GUI initializer
@ -127,7 +127,7 @@ export default class DefaultGUI {
addNewPoint,
hasPresets ? new AddNewMarker(state.filteredLayers) : noteMarker
)
state.LastClickLocation.addCallbackAndRunD(_ => {
state.LastClickLocation.addCallbackAndRunD((_) => {
ScrollableFullScreen.collapse()
})
}
@ -167,7 +167,7 @@ export default class DefaultGUI {
leafletMap: state.leafletMap,
layerToShow: selectedElement.layerDef,
features: state.selectedElementsLayer,
state
state,
})
state.leafletMap.addCallbackAndRunD((_) => {
@ -185,34 +185,36 @@ export default class DefaultGUI {
const self = this
new Combine([
Toggle.If(state.featureSwitchUserbadge, () => {
const userInfo = new UserInformationPanel(state)
const mapControl = new MapControlButton(
new VariableUiElement(state.osmConnection.userDetails.map(ud => {
new VariableUiElement(
state.osmConnection.userDetails.map((ud) => {
if (ud?.img === undefined) {
return Svg.person_ui().SetClass("mt-1 block")
}
return new Img(ud?.img);
})).SetClass("block rounded-full overflow-hidden"),
{
dontStyle: true
}
).onClick(() => userInfo.Activate());
return new Img(ud?.img)
})
).SetClass("block rounded-full overflow-hidden"),
{
dontStyle: true,
}
).onClick(() => userInfo.Activate())
return new LoginToggle(
mapControl, Translations.t.general.loginWithOpenStreetMap, state
mapControl,
Translations.t.general.loginWithOpenStreetMap,
state
)
}),
Toggle.If(
state.featureSwitchExtraLinkEnabled,
() => new ExtraLinkButton(state, state.layoutToUse.extraLink)
),
Toggle.If(state.featureSwitchWelcomeMessage, () => self.InitWelcomeMessage()),
Toggle.If(state.featureSwitchIsTesting, () => new FixedUiElement("TESTING").SetClass("alert m-2 border-2 border-black"))
Toggle.If(state.featureSwitchIsTesting, () =>
new FixedUiElement("TESTING").SetClass("alert m-2 border-2 border-black")
),
])
.SetClass("flex flex-col")
.AttachTo("top-left")
@ -229,8 +231,11 @@ export default class DefaultGUI {
.SetClass("flex items-center justify-center normal-background h-full")
.AttachTo("on-small-screen")
Toggle.If(state.featureSwitchSearch, () => new SearchAndGo(state).SetClass("shadow rounded-full h-min w-full overflow-hidden sm:max-w-sm pointer-events-auto")).AttachTo("top-right")
Toggle.If(state.featureSwitchSearch, () =>
new SearchAndGo(state).SetClass(
"shadow rounded-full h-min w-full overflow-hidden sm:max-w-sm pointer-events-auto"
)
).AttachTo("top-right")
new LeftControls(state, guiState).AttachTo("bottom-left")
new RightControls(state).AttachTo("bottom-right")
@ -256,11 +261,7 @@ export default class DefaultGUI {
private InitWelcomeMessage(): BaseUIElement {
const isOpened = this.guiState.welcomeMessageIsOpened
new FullWelcomePaneWithTabs(
isOpened,
this.guiState.welcomeMessageOpenedTab,
this.state
)
new FullWelcomePaneWithTabs(isOpened, this.guiState.welcomeMessageOpenedTab, this.state)
// ?-Button on Desktop, opens panel with close-X.
const help = new MapControlButton(Svg.help_svg())
@ -280,6 +281,6 @@ export default class DefaultGUI {
isOpened.setData(false)
})
return help.SetClass("pointer-events-auto")
return help.SetClass("pointer-events-auto")
}
}