fix map zoom and initial channel on edit

public/themes/classic.css

@@ -534,9 +534,11 @@ r4-channel-slug {
 r4-avatar-update {
 	& fieldset {
 		justify-content: center;
+		align-items: center;
 	}
 	& legend {
 		text-align: center;
+		width: 100%;
 	}
 }
 

src/components/r4-map-position.js

@@ -16,17 +16,20 @@ export default class R4MapPosition extends LitElement {
 	}
 
 	get mapChannels() {
-		return [
-			{
-				...this.channel,
-			},
-			{
+		const channels = []
+		if (this.channel.longitude) {
+			channels.push(this.channel)
+		}
+
+		if (this.newLongitude && this.newLatitude) {
+			channels.push({
 				...this.channel,
 				title: `New position for ${this.channel.slug}`,
 				longitude: this.newLongitude,
 				latitude: this.newLatitude,
-			},
-		]
+			})
+		}
+		return channels
 	}
 
 	onMapClick(event) {

src/components/r4-map.js

@@ -64,12 +64,16 @@ export default class R4Map extends LitElement {
 		this.longitude = 0
 		this.latitude = 0
 		this.markers = []
+		this.zoom = 1
 	}
 
 	async firstUpdated() {
 		this.createMap()
 		this.isReady = true
-		this.zoom = !this.zoom && this.longitude ? 6 : 2
+
+		if (!this.zoom) {
+			this.zoom = 1
+		}
 
 		// Fetch channels and set markers for each.
 		if (!this.channels) {
@@ -115,12 +119,14 @@ export default class R4Map extends LitElement {
 		const rasterLayer = new TileLayer({
 			source: new OSM(),
 		})
+
+		console.log(this.channels)
 		this.map = new Map({
 			target: this.querySelector('main'),
 			layers: [rasterLayer],
 			view: new View({
 				center: [this.longitude, this.latitude],
-				zoom: this.zoom || 8,
+				zoom: this.zoom,
 			}),
 			overlays: [this.overlay],
 		})