• Home
  • Categories
  • Recent
  • Popular
  • Top
  • Tags
  • Users
  • Groups
  • Documentation
    • Home
    • Read API
    • Write API
    • Plugin Development
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
v3.5.2 Latest
Buy Hosting

Routing via SVG click. Embedded a href reloading entire application.

Scheduled Pinned Locked Moved Solved Technical Support
8 Posts 2 Posters 2.5k Views
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • K Offline
    K Offline
    Kenny Udovic
    wrote on last edited by Kenny Udovic
    #1

    Currently I am using the persona theme as a base template and building a custom theme for nodebb. One of the first things I've added is svg.tpl which is included in the header.tpl.

    Within the svg I have this href:

     <a href="{config.relative_path}/category/20/my-category" itemprop="url" id="test">
       <path
          style="fill:#d3d3d3"
          d="M 405.19098,251.879 L 405.74898,257.292 L 401.35098,257.81 L 401.01298,254.629 L 400.88598,253.474 L 401.30098,253.43 L 401.43098,253.322 L 401.30098,252.294 L 405.19098,251.879" />
     </a>
    

    When this svg is clicked, the entire page reloads, rather than when a category is clicked and it only reloads the categories section of the theme.

    I'd love for the svg to persist through the navigation of categories and topics. How would I go about doing this?

    1 Reply Last reply
    0
  • julianJ Offline
    julianJ Offline
    julian GNU/Linux
    wrote on last edited by
    #2

    Does it work fine without the SVG? Just a text link?

    1 Reply Last reply
    1
  • K Offline
    K Offline
    Kenny Udovic
    wrote on last edited by Kenny Udovic
    #3

    @julian, Thanks for the response.

    Just tested the text link. It does work with just a text link.

    With that being said, I was planning on using raphael, 3js, or snap.svg and building a custom dynamic UI that tied into some hooks you guys provide, and I am willing to look into getting this problem sorted out.

    Any idea on what might be causing this / where to start looking into to make some modifications to get this working as preferred?

    1 Reply Last reply
    0
  • julianJ Offline
    julianJ Offline
    julian GNU/Linux
    wrote on last edited by
    #4

    That's quite weird... there's no reason I can think of that would explain why a link with SVG content wouldn't work but one with text would...

    1 Reply Last reply
    0
  • K Offline
    K Offline
    Kenny Udovic
    wrote on last edited by
    #5

    @julian

    Yeah, not sure the difference between a normal link and one contained within an svg div.

    Just to make it 100% clear, the link in the svg does in fact load the category page and make it to the correct route, but it causes the entire application to reload. I'll probably be experimenting with this a little bit. I'll let you know when / how / whether I solve this issue.

    1 Reply Last reply
    0
  • julianJ Offline
    julianJ Offline
    julian GNU/Linux
    wrote on last edited by
    #6

    Just to be clear, this is an SVG with a link embedded inside? That would not work because the client-side code we use just detects <a> elements, not ones in an SVG...

    If you can execute js inside an SVG, try ajaxify.go('/topic/123');?

    1 Reply Last reply
    0
  • K Offline
    K Offline
    Kenny Udovic
    wrote on last edited by Kenny Udovic
    #7

    @julian

    Yes. You are correct. The link has been embedded within the SVG.

    Your javascript solution works wonderfully. <path onclick="ajaxify.go('/category/20/my-category');"> brings me to the correct place without reloading the entire application.

    Thanks for your help.

    1 Reply Last reply
    1
  • julianJ Offline
    julianJ Offline
    julian GNU/Linux
    wrote on last edited by
    #8

    Great! Glad to hear it's working now 😄

    1 Reply Last reply
    1

Copyright © 2023 NodeBB | Contributors
  • Login

  • Don't have an account? Register

  • Login or register to search.
Powered by NodeBB Contributors
  • First post
    Last post
0
  • Home
  • Categories
  • Recent
  • Popular
  • Top
  • Tags
  • Users
  • Groups
  • Documentation
    • Home
    • Read API
    • Write API
    • Plugin Development