URL Update during page interaction

Ignition
,
1

I want to update a URL based on an interaction from within a page.

Example:
A user selects a new asset from a selector on the page. The page has a path like so: /general/equipmentDashboard/:assetId It uses the last selected asset id if you just navigate to /general/equipmentDashboard. I am trying to do something similar to how the forum updates the active url from your scroll down in the page for which reply you are looking at.

The only way I think I can update the actual URL is from the system.perspective.navigate function which always triggers a reload essentially. This goes for using the /:assetid or ?assetid=someid.

Has anyone else done something like this?

2

The only way I saw of doing this was using JS, which isn't doable in Perspective without either custom modules or JS injection (long story). I decided to play around with @victordcq's JS injections and made a little markdown component that, when loaded, will use history.replaceState to replace the end of the current URL with whatever is in its suffix custom property.

Markdown component JSON 
[
  {
    "type": "ia.display.markdown",
    "version": 0,
    "props": {
      "markdown": {
        "escapeHtml": false
      }
    },
    "meta": {
      "name": "Markdown"
    },
    "position": {
      "x": 300,
      "y": 347,
      "height": 200,
      "width": 200
    },
    "custom": {
      "suffix": "foobar"
    },
    "propConfig": {
      "props.source": {
        "binding": {
          "type": "property",
          "config": {
            "path": "this.custom.suffix"
          },
          "transforms": [
            {
              "code": "\tdef getRawUrl(path):\n\t\treturn path[:path.rindex('/')+1]\n\t\n\tcode =  \"\"\"<img style='display:none' src='/favicon.ico' onload=\\\"\n\t\t\thistory.replaceState(null,null,'\"\"\"+getRawUrl(self.page.props.path)+value+\"\"\"');\t\t\t\t\n\t\t\t\\\"></img>\"\"\".replace(\"\\n\", \"\").replace(\"\\t\", \"\")\n\treturn code",
              "type": "script"
            }
          ]
        }
      }
    }
  }
]

This isn't exactly supported usage so use at your own risk, don't paste random JS into your projects unless you understand it, and so on.

4 Likes
3

I kind of figured this was the case. I have a module I could add this too that has some perspective components, but I was hoping for an out of the box.

Thanks for your reply.

1 Like
4

I feel a bit dumb, but I figured it out.

system.perspective.navigate(page="myPath/:whateverVariable") it works. I don't know why I didn't try page the other day. I was using url :clown_face:

1 Like