[feature] Setting url fragments and applying to that data on both maps #703

dee077 · 2025-09-11T00:50:14Z

Checklist

I have read the OpenWISP Contributing Guidelines.
I have manually tested the changes proposed in this pull request.
I have written new test cases for new code and/or updated existing tests for changes to existing code.
I have updated the documentation.

Reference to Existing Issue

Closes #562.

Description of Changes

Passed the urlFragements from config on both maps to allow fragments to set and apply from netjsongraph.js
Updated the logic in floorplan.js to parse the params first, and if it exists for the indoor map open the floorplan overlay

Blockers

[feature] Update URL with node click of map interactions #238 netjsongraph.js#417

openwisp_monitoring/device/static/monitoring/js/floorplan.js

pandafy

Amazing work Deepanshu! 🚀 🚀 🚀

This PR is on point!!! Just need to add some comments here and there.

openwisp_monitoring/device/templates/admin/dashboard/device_map.html

openwisp_monitoring/device/static/monitoring/js/device-map.js

openwisp_monitoring/device/static/monitoring/js/floorplan.js

pandafy · 2025-09-19T10:50:50Z

openwisp_monitoring/device/static/monitoring/js/floorplan.js

+  const rawUrlFragments = window.location.hash.replace(/^#/, "");
+  const fragments = rawUrlFragments.split(";").filter((f) => f.trim() !== "");


Explain with a comment what are we doing and why are we doing.

Add a TODO to replace this logic after adding a static re-usable method in NetjsonGraph

Added comments!

@dee077 have we already added a re-usable method in netjsongraph.js? If so, can we use it here?

openwisp_monitoring/device/static/monitoring/js/floorplan.js

openwisp_monitoring/tests/test_selenium.py

pandafy

@dee077 Good work with adding the buttons to the device page. But, these buttons are redirecting the user to /admin/ page. The end goal is to create a dedicated page for the map.

I'm unsure if we need field label for the button. I'm attaching the screenshot so @nemesifier can confirm quickly.

openwisp_monitoring/device/admin.py

openwisp_monitoring/device/static/monitoring/js/location-inline.js

openwisp_monitoring/tests/test_selenium.py

dee077 · 2025-10-22T12:59:11Z

Updates

Added a new map page template, which extends the base_site.html of the proxy model Map
The map is on admin/device_monitoring/map url Let me know if you want to change it.
Updated the test to assert for the whole url instead of only checking the url fragments.

pandafy

The dedicated map page works well. I'm still unsure about adding a model just for adding an admin view.

openwisp_monitoring/device/templates/admin/map/map_page.html

openwisp_monitoring/device/static/monitoring/js/location-inline.js

Set URL fragments when clicking nodes in geo and indoor maps, and apply state from URL on load. Fixes #562

pandafy

I have done a thorough review and it looks good to merge except these small details.

@dee077 the CI is failing due to a selenium test. Can you check why?

pandafy · 2025-11-13T10:33:48Z

openwisp_monitoring/device/static/monitoring/js/floorplan.js

+  const rawUrlFragments = window.location.hash.replace(/^#/, "");
+  const fragments = rawUrlFragments.split(";").filter((f) => f.trim() !== "");


@dee077 have we already added a re-usable method in netjsongraph.js? If so, can we use it here?

pandafy · 2025-11-13T10:36:53Z

openwisp_monitoring/device/static/monitoring/js/floorplan.js

+  function removeUrlFragment(locationId) {
+    if (locationId != null) {
+      const id = maps[currentFloor].config.bookmarkableActions.id;
+      maps[currentFloor].utils.removeUrlFragment(id);
+    }
+  }


Can you please help me remember why do we need this?

const rawUrlFragments = window.location.hash.replace(/^#/, ""); const fragments = rawUrlFragments.split(";").filter((f) => f.trim() !== "");

We need the above lines for opening the floorplan overlay div by that time we don't have a netjsongraph instance for the indoor map, so we can't use the method from utils.

removeUrlFragment is used for removing the fragments on closing the overlay div for the indoor map

openwisp_monitoring/device/templates/admin/map/map_page.html

dee077 self-assigned this Sep 11, 2025

dee077 added enhancement New feature or request gsoc-idea labels Sep 11, 2025

dee077 added this to [GSoC25] General Map: Indoor, Mobile, Linkable URLs Sep 11, 2025

dee077 changed the base branch from master to feature/662-improve-ui-device-list-popup-above-geo-map September 11, 2025 00:50

github-advanced-security bot found potential problems Sep 11, 2025

View reviewed changes

openwisp_monitoring/device/static/monitoring/js/floorplan.js Outdated Show resolved Hide resolved

dee077 force-pushed the feature/662-improve-ui-device-list-popup-above-geo-map branch 2 times, most recently from 1ed30c3 to acec94b Compare September 11, 2025 16:40

dee077 force-pushed the feature/562-bookmark-url branch from f570034 to e533011 Compare September 11, 2025 22:29

dee077 moved this to In progress in [GSoC25] General Map: Indoor, Mobile, Linkable URLs Sep 12, 2025

Base automatically changed from feature/662-improve-ui-device-list-popup-above-geo-map to gsoc25-map September 12, 2025 16:32

dee077 moved this from In progress to In review in [GSoC25] General Map: Indoor, Mobile, Linkable URLs Sep 12, 2025

dee077 force-pushed the feature/562-bookmark-url branch from e533011 to b5cd494 Compare September 17, 2025 23:48

dee077 marked this pull request as ready for review September 17, 2025 23:49

dee077 force-pushed the feature/562-bookmark-url branch from 632f83b to 0fa8b29 Compare September 18, 2025 23:10

pandafy requested changes Sep 19, 2025

View reviewed changes

dee077 force-pushed the feature/562-bookmark-url branch 2 times, most recently from ef9e7c4 to 0fa8b29 Compare September 22, 2025 11:29

dee077 force-pushed the feature/562-bookmark-url branch 2 times, most recently from af11750 to 838bb84 Compare October 3, 2025 15:03

pandafy reviewed Oct 6, 2025

View reviewed changes

dee077 force-pushed the feature/562-bookmark-url branch from b7aa2d6 to ff2c879 Compare October 22, 2025 12:04

pandafy reviewed Nov 3, 2025

View reviewed changes

dee077 force-pushed the gsoc25-map branch from 7c44bdc to 164ea99 Compare November 11, 2025 19:32

dee077 added 5 commits November 12, 2025 01:03

[feature] Setting url fragments and applying to that data #562

fdec5ee

Set URL fragments when clicking nodes in geo and indoor maps, and apply state from URL on load. Fixes #562

[fix] Update netjsongraph.min.js

e86d1bc

[fix] Use decode istead of image.onLoad

23ab07f

[fix] Add support for going back in history

6689c61

[tests] Add tests

a8664ac

dee077 added 6 commits November 12, 2025 01:03

[fix] Add comments and fixed tests

8af0e75

[fix] Update netjsongraph.js

4f6332d

[fix] Monkey patch to add buttons in location inline and add Tests

32acecc

[fix] Update netjsongraph.min.js

17d9cae

[feature] Add a new map page and fix tests

6bc7dee

[fix] Added footer block and fixed qa

e6d3c2c

dee077 force-pushed the feature/562-bookmark-url branch from ff2c879 to e6d3c2c Compare November 11, 2025 19:36

[fix] Ci version mismatch

329ead9

pandafy requested changes Nov 13, 2025

View reviewed changes

dee077 added 4 commits November 14, 2025 03:47

[fix] Tests and Qa

c8361c3

[fix] Update netjsongraph.min.js

64c3e7a

[fix] Add custom zoom and fix indentation

c51e95b

[fix] Update netjsongraph.js

5637a30

dee077 force-pushed the feature/562-bookmark-url branch from 30ce3fc to 63d61f5 Compare November 23, 2025 22:27

[fix] Ci

f414c72

dee077 force-pushed the feature/562-bookmark-url branch from 63d61f5 to f414c72 Compare November 23, 2025 22:35

		const rawUrlFragments = window.location.hash.replace(/^#/, "");
		const fragments = rawUrlFragments.split(";").filter((f) => f.trim() !== "");

Uh oh!

[feature] Setting url fragments and applying to that data on both maps #703

Are you sure you want to change the base?

[feature] Setting url fragments and applying to that data on both maps #703

Uh oh!

Conversation

dee077 commented Sep 11, 2025 • edited by pandafy Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Checklist

Reference to Existing Issue

Description of Changes

Uh oh!

Uh oh!

pandafy left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pandafy Sep 19, 2025

Choose a reason for hiding this comment

Uh oh!

dee077 Sep 22, 2025

Choose a reason for hiding this comment

Uh oh!

pandafy Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pandafy left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

dee077 commented Oct 22, 2025

Updates

Uh oh!

pandafy left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pandafy left a comment

Choose a reason for hiding this comment

Uh oh!

pandafy Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

pandafy Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

dee077 Nov 23, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

dee077 commented Sep 11, 2025 •

edited by pandafy

Loading