[Minor] Opening left menu in new tab shows JSON or 404

[jasperslits]

Present in 2.8.0 but did not test it yet with a beta release.

It's a minor thing but steps to reproduce.

1) Log in to add-on with a browser. I tried Safari and Chrome on a Mac but I assume Windows / Edge will behave the same 2) Right click on left menu item like 'Status' and click open in new tab 3) Expected: Itho status table with left menu present Actual: page just shows JSON content like: {"type":"Filesystem", "isOk":"true", "totalBytes":"131072", "usedBytes":"40960","unsupportedFiles":""} or a 404 for other URLs.

The page opened here is http://wpu.local/status . The 404 is returned for any other URL from the left menu, e.g. http://hru.local/remotes or http://wpu.local/syslog

The changed hostname seems not relevant.

[arjenhiemstra]

That is correct and I'm not sure right away how to change this behavior. All static content is loaded together with all the JavaScript code from mainly one file, this is for performance and stability reasons. The microcontroller used can only handle a limited amount of concurrent connections. After this only status info is being passed back and forth using JSON. The "link" you mention are just signals for the code to replace part of the DOM with new content. Trying to load these without the JavaScript backend will thus not work.

[jasperslits]

I think the links opened in a new tab don't have the Referer HTTP header set. But there are more important requests / bugs to worry about than this one, I just wanted to raise this for awarenes just in case there was a simple fix possible. It's a bit of a corner case so feel free to close this github issue.

[arjenhiemstra]

No prob, thanks for mentioning this. The backend JS listens to click events on the menu:

  $(document).on('click', 'ul.pure-menu-list li a', function (event) {
    var page = $(this).attr('href');
    update_page(page);

And uses the href info to load the new content without requesting anything from the add-on webserver: (simplified)

function update_page(page) {
  $('#main').empty();
  if (page == 'index') { $('#main').append(html_index); }
  if (page == 'syslog') { $('#main').append(html_syslog); }
  if (page == 'status') { $('#main').append(html_ithostatus); }
  if (page == 'remotes') { $('#main').append(html_remotessetup); }
}

This just doesn't work with open in new tab, the webserver doesn't have a directive to handle these URI's. But it makes it a very responsive and fast interface cause all the heavy lifting is done on the browser side.