4 ms·
Show HN: JsonTree, a tool for turning JSON data into a collapsible html tree
- wingerlang 11y agoAdd a live demo.
- MaxLeiter 11y agohttp://maxleiter.github.io/jsonTree/example/ http://maxleiter.github.io/jsonTree/example/
- wingerlang 11y agoCool. I guess the first thing that struck me was that stuff didn't look too clickable, it is hard to discover things in the structure.
- MaxLeiter 11y agoIts purposefully not styled so the developer can do whatever they want to it
- wingerlang 11y agoI see. How, though? This might be my not-up-to-date CSS knowledge, but they all seem to have the same class. And they also all seem to have the same id, last time I checked and css id should be unique per html document.
- MaxLeiter 11y agoThere’s an option to toggle depth class, and I completely forgot about the ID spec when I wrote it, so thanks. Ill probably add an ID for each containing its name or something.
- fundamental 11y agoNeat demo, though it doesn't work with the default url due to a https vs http conflict in firefox. From the js console I see "Blocked loading mixed active content" and changing the url to some content served over https (e.g. the project's package.json) seems to work fine.
- MaxLeiter 11y agoThanks, fixed
- BillSaysThis 11y agoWhat about a variation where the JSON object is passed in directly and not delivered via URL?
- MaxLeiter 11y agoNever thought of that, good idea though. Do you recommend having the jsonTree() function check if its a valid URL, or using a separate function?
- BillSaysThis 11y agoYou certainly could have a separate function since this would need to know about the in-memory cache of the JSON versus pulling it from the URL. Or you could also refactor the JSONTree function to (a) check if the first param is an object or string and (b) put the meet of the request eventListener (lines 24-35) into a separate function that's called as appropriate in each case.