Discussion - Relative URL support

[gliechtenstein]

@brad came up with a great feature that takes care of relative URLs. Here's the PR: Jasonette/JASONETTE-Android#35

The solution basically:

1. Looks at the url attribute of the strings.xml (The same url used for the root url of the app itself)
2. Use that as the root url with which all the relative URLs in the app will be resolved.

So for example, if the app's root URL is https://www.jasonbase.com/things/nfk.json, you would be able to specify just the relative path throughout the app like this:

{
  "type": "image",
  "url": "/avatar.png"
}

I like the idea of being able to make the URLs domain independent, which would make the JSON code much more reusable and powerful.

I have a couple of thoughts on this, and also wanted to put this out there for public discussion before we make any decision.

Discussion 1. one root_url per view?

Maybe we can make this more flexible by stating the root url inside the JSON instead of using the hardcoded value from strings.xml? That way instead of having a single global root_url, we can namespace them per view. Also it's 100% powered by the JSON instead of hardcoded values. Here's an example:

{
  "$jason": {
    "head": {
      "root_url": "https://www.jasonbase.com/things",
      "title": "relative path demo",
      ...
    },
    "body": {
      "sections": [{
        "items": [{
          "type": "label",
          "text": "go",
          "href": {
            "url": "/f3h.json"
          }
        }]
      }]
    }
  }
}

Discussion 2. Would this type of approach make the code less readable?

Upon thinking more about this I've come up with some concerns. One of the coolest things about Jasonette is you can basically walk through all the referenced JSON to figure out how the entire app works.

But maybe adding a relative url element puts more burden on people trying to figure out what the JSON does? After all, we're adding one more step for users to think about whenever they come across a url. I'm not suggesting this is a serious problem, but just wanted to bring this to the table and hear what others think.

Discussion 3. Can we use templates to achieve similar effect?

Going back to above example, maybe we can achieve the same effect without introducing new concepts. For example we can $set a local variable called root and use that inside templates. Not exactly as succinct as the original solution suggested by brad but it does make the code more modular and shareable:

{
  "$jason": {
    "head": {
      "root_url": "https://www.jasonbase.com/things",
      "title": "relative path demo",
      "actions": {
        "$load": {
          "type": "$set",
          "options": {
            "root": "https://www.jasonbase.com/things"
          },
          "success": {
            "type": "$render"
          }
      },
      "templates": {
        "body": {
          "sections": [{
            "items": [{
              "type": "label",
              "text": "go",
              "href": {
                "url": "{{$get.root}}/f3h.json"
              }
            }]
          }]
        }
      },
      ...
    }
  }
}

What do you guys think? Any ideas/feedback welcome!

[gtramontina]

HTML allows us to use relative URLs, which, by default, use the current location as the starting point. E.g.:

Current Location: https://app.com/some/where/far

Link href: "away"        -> https://app.com/some/where/far/away
Link href: "../near"     -> https://app.com/some/where/near
Link href: "/right-here" -> https://app.com/right-here

HTML also allows us setting the base path. Similar to the proposed root_url (which I'd suggest for it to be named base instead, for consistency…)

Current Location: https://app.com/some/where/far
Base            : /

Link href: "away"        -> https://app.com/away
Link href: "../near"     -> https://app.com/near (or 404, I can't remember correctly)
Link href: "/right-here" -> https://app.com/right-here

Nothing prevents us from using the templating approach as well, but that's not quite the same thing…

---

Edit: there are probably path resolution libs out there to help out.

[darenr]

It's not really a Jasonette solution, but I do all template expansion on the server and expanding relative URLs is trivial in python, the json tree is walked looking for any key that has an expected URL for a value and uses python's urlparse to rewrite the urls.

I'm not sure I grok the problem, why this would have edge cases or be difficult, the Jasonette code that fetches anything should look at the URL and if it's missing a scheme rewrite the URL in terms of either the view's origin URL $env.view.url or (in order) $cache.base, $global.base (and prohibit user variables from starting with underscore during json lint checking)

Then it doesn't matter if the url is generated by a template or hard coded in the json, it still works. Ideally Jasonette would pass this value in by default to the WebComponents so they too could share in the joys of relative urls

[maks]

@gliechtenstein the reason I brought this up is for me its already difficult to cope with the workflow I set up of: quickly develop using a httpd on my local machine serving to apps run on emu, phone etc. Then once I'm happy, push it to "test" url for alpha test users, then next step I want is to be able to bundle into apk for deploy to Google Play. Currently that means having to have seperate git branches and do manual in-texteditor global search/replace or write a script to do that per @darenr suggestion.

Unfortuntatly given mixins and other urls (eg. for images) templates+$env.view.url is not enough.

My preference is definitely for your suggestion for resolving the url against the url of the current json as that would also better align with using mixins.

I'll get the original PR updated against current master as I need this functionality for my project right now anyway and resubmit.

[gliechtenstein]

I have started looking at this seriously. I do understand the problem (the JSON is not portable enough) but would like to understand the problem a bit better before moving forward.

Unfortuntatly given mixins and other urls (eg. for images) templates+$env.view.url is not enough.

@maks could you elaborate on this a bit? An example snippet that demonstrates how this is tricky would be really helpful.

[maks]

@gliechtenstein Sorry yes, I should have provided concrete examples.
So for example I have a top-level jason like so:

{
  "$jason" : {
    "head" : {
      "title" : "NGV Guide",
      "description": "NGV Guide",
      "icon" : "",
      "actions" : {
        "@" : "http://192.168.1.117:8080/actions.json"
      },
      "templates" : {
        "@" : "http://192.168.1.117:8080/app-template.json"
      },
      "styles" : {
        "@" : "http://192.168.1.117:8080/styles.json"
      }
    }
  }
}

then in for example app-template.json I have more mixins to split out the body and footer, the body mixing then has urls to images that I use for image buttons, etc. Having to put the absolute url in all the files means if I want to go from testing locally (the urls with the IPs above) to eg testing on a server somewhere out on the net it all needs to change. Sure I could do tricks DNS tricks having overrides in my laptops hots file, but then thats doesn't work with a real phone I might test with. Even testing with the android emulator has issues when for instance I'm away from my home network, as I then need to use the emu's network bridge to localhost IP's (10.0.2.2) instead.

Hope that gives an idea of the issue here?

I have thought about just using a grep script to do the replacement each time I need to move between environments but it seems an annoying work around vs being able to support relative urls.

[adefemi171]

Hi all @maks @gliechtenstein , i downloaded the jasonette file to use to run my website on an android platform and i believe the xml form am to change the link to mine is the string.xml which i did but the website wont come up, it just keep on loading and never shows anything. And going through the tutorials i discovered there was a file named settings.plist where i could make some edits but i couldn't find the file in the zip folder i downloaded and also in the folder i deployed on my Android studio.
P.S: The website was written in json and used heroku as DB

[gliechtenstein]

@adefemi171 Please post this as a new issue on Android repo so we don't spam everyone on this thread.

Also please make sure to post:

• The JSON markup you're using
• Your device type
• Your OS version
• Your Android studio version

Especially make sure you post the code you're using, otherwise there's no way to figure out what's going wrong.