Enable subscription only when Live Mode is enabled

This commit is contained in:
Eugene Burmakin 2024-11-07 13:30:58 +01:00
parent ebee214982
commit 31ecedb851
6 changed files with 29 additions and 24 deletions

View file

@ -13,6 +13,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
- New notifications are now being indicated with a blue-ish dot in the top right corner of the screen. Clicking on the bell icon will show you all your notifications.
- New points on the map will now be shown in real-time. No need to reload the map to see new points.
- User can now enable or disable Live Mode in the map controls. When Live Mode is enabled, the map will automatically scroll to the new points as they are being added to the map.
- Scale on the map now shows the distance both in kilometers and miles.
# 0.15.13 - 2024-11-01

View file

@ -2,7 +2,7 @@ import consumer from "./consumer"
consumer.subscriptions.create("ImportsChannel", {
connected() {
console.log("Connected to the imports channel!");
// console.log("Connected to the imports channel!");
},
disconnected() {

View file

@ -2,7 +2,7 @@ import consumer from "./consumer"
consumer.subscriptions.create("NotificationsChannel", {
connected() {
console.log("Connected to the notifications channel!");
// console.log("Connected to the notifications channel!");
},
disconnected() {

View file

@ -10,31 +10,31 @@ export default class extends Controller {
return
}
console.log("Imports controller connected", {
hasIndexTarget: this.hasIndexTarget,
element: this.element,
userId: this.element.dataset.userId
});
// console.log("Imports controller connected", {
// hasIndexTarget: this.hasIndexTarget,
// element: this.element,
// userId: this.element.dataset.userId
// });
this.setupSubscription();
}
setupSubscription() {
const userId = this.element.dataset.userId;
console.log("Setting up subscription with userId:", userId);
// console.log("Setting up subscription with userId:", userId);
this.channel = consumer.subscriptions.create(
{ channel: "ImportsChannel" },
{
connected: () => {
console.log("Successfully connected to ImportsChannel");
// console.log("Successfully connected to ImportsChannel");
// Test that we can receive messages
console.log("Subscription object:", this.channel);
// console.log("Subscription object:", this.channel);
},
disconnected: () => {
console.log("Disconnected from ImportsChannel");
// console.log("Disconnected from ImportsChannel");
},
received: (data) => {
console.log("Received data:", data);
// console.log("Received data:", data);
const row = this.element.querySelector(`tr[data-import-id="${data.import.id}"]`);
if (row) {

View file

@ -12,7 +12,6 @@ import { fetchAndDrawAreas } from "../maps/areas";
import { handleAreaCreated } from "../maps/areas";
import { showFlashMessage } from "../maps/helpers";
import { formatDate } from "../maps/helpers";
import { osmMapLayer } from "../maps/layers";
import { osmHotMapLayer } from "../maps/layers";
@ -44,7 +43,7 @@ export default class extends Controller {
this.routeOpacity = parseFloat(this.userSettings.route_opacity) || 0.6;
this.distanceUnit = this.element.dataset.distance_unit || "km";
this.pointsRenderingMode = this.userSettings.points_rendering_mode || "raw";
this.liveMapEnabled = this.userSettings.liveMapEnabled || false;
this.liveMapEnabled = this.userSettings.live_map_enabled || false;
this.countryCodesMap = countryCodesMap();
this.center = this.markers[this.markers.length - 1] || [52.514568, 13.350111];
@ -85,7 +84,7 @@ export default class extends Controller {
.scale({
position: "bottomright",
metric: true,
imperial: false,
imperial: true,
maxWidth: 120,
})
.addTo(this.map);
@ -142,7 +141,9 @@ export default class extends Controller {
}
});
this.setupSubscription(); // Add this line
if (this.liveMapEnabled) {
this.setupSubscription();
}
}
disconnect() {
@ -155,8 +156,10 @@ export default class extends Controller {
// TODO:
// Only append the point if its timestamp is within current
// timespan
if (this.map && this.map._loaded) {
this.appendPoint(data);
}
}
});
}

View file

@ -10,11 +10,11 @@ export default class extends Controller {
}
connect() {
console.log("[Stimulus] Notifications controller connecting...")
// console.log("[Stimulus] Notifications controller connecting...")
// Clean up any existing subscription
if (this.subscription) {
console.log("[Stimulus] Cleaning up existing subscription")
// console.log("[Stimulus] Cleaning up existing subscription")
this.subscription.unsubscribe()
this.subscription = null
}
@ -24,7 +24,7 @@ export default class extends Controller {
}
disconnect() {
console.log("[Stimulus] Notifications controller disconnecting...")
// console.log("[Stimulus] Notifications controller disconnecting...")
if (this.subscription) {
this.subscription.unsubscribe()
this.subscription = null
@ -32,16 +32,16 @@ export default class extends Controller {
}
createSubscription() {
console.log("[Stimulus] Creating new notification subscription")
// console.log("[Stimulus] Creating new notification subscription")
this.subscription = consumer.subscriptions.create("NotificationsChannel", {
connected: () => {
console.log("[WebSocket] Connected to NotificationsChannel")
// console.log("[WebSocket] Connected to NotificationsChannel")
},
disconnected: () => {
console.log("[WebSocket] Disconnected from NotificationsChannel")
// console.log("[WebSocket] Disconnected from NotificationsChannel")
},
received: (data) => {
console.log("[WebSocket] Received notification:", data)
// console.log("[WebSocket] Received notification:", data)
this.animateBadge()
}
})