{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805109341", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805109341, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTEwOTM0MQ==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T17:55:48Z", "updated_at": "2021-03-23T18:41:57Z", "author_association": "OWNER", "body": "Beginnings of a UI element for switching between them:\r\n```html\r\n<div style=\"border: 1px solid rgb(225, 228, 229);\r\n  background-color: rgb(238, 255, 204);\r\n  padding: 0.3em;\r\n  position: relative;\r\n  top: 3px;\r\n  font-family: courier;\">\r\n<a href=\"#\" style=\"display: inline-block; padding-left: 0px; padding-right: 2em;\">JSON</a>\r\n<a href=\"#\" style=\"display: inline-block;\">YAML</a>\r\n</div>\r\n```\r\n<img width=\"646\" alt=\"Metadata_\u2014_Datasette_documentation\" src=\"https://user-images.githubusercontent.com/9599/112194637-51f92500-8bc6-11eb-9662-3faa7ef37538.png\">\r\n\r\nThat `<pre>` has a padding of 12px, so using 12px padding on the tab links should get them to line up better.", "reactions": "{\"total_count\": 1, \"+1\": 1, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805047117", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805047117, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTA0NzExNw==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T16:30:15Z", "updated_at": "2021-03-23T16:46:06Z", "author_association": "OWNER", "body": "https://cdnjs.cloudflare.com/ajax/libs/js-yaml/4.0.0/js-yaml.min.js is only 12.5KB zipped, 38KB total - so that's not a bad option.\r\n\r\nhttps://github.com/nodeca/js-yaml", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805056806", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805056806, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTA1NjgwNg==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T16:43:38Z", "updated_at": "2021-03-23T16:43:38Z", "author_association": "OWNER", "body": "I used this code to get that:\r\n```javascript\r\nvar jsonVersion = JSON.stringify(window.jsyaml.load(document.querySelector('.highlight-yaml').textContent), null, 4);\r\ndiv.querySelector('.highlight pre').innerText = jsonVersion;\r\ndiv.querySelector('.highlight pre').style.whiteSpace = 'pre-wrap'\r\n```", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805055291", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805055291, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTA1NTI5MQ==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T16:41:31Z", "updated_at": "2021-03-23T16:41:31Z", "author_association": "OWNER", "body": "One downside of doing this conversion in JavaScript: it's much harder to get the same JSON syntax highlighting as that provided by Sphinx:\r\n\r\n<img width=\"655\" alt=\"Metadata_\u2014_Datasette_documentation\" src=\"https://user-images.githubusercontent.com/9599/112183909-ef9b2700-8bbb-11eb-882b-aeb387c29e61.png\">\r\n", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805050163", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805050163, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTA1MDE2Mw==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T16:34:35Z", "updated_at": "2021-03-23T16:35:32Z", "author_association": "OWNER", "body": "https://docs.datasette.io/en/stable/metadata.html has this example:\r\n```yaml\r\ntitle: Demonstrating Metadata from YAML\r\ndescription_html: |-\r\n  <p>This description includes a long HTML string</p>\r\n  <ul>\r\n    <li>YAML is better for embedding HTML strings than JSON!</li>\r\n  </ul>\r\nlicense: ODbL\r\nlicense_url: https://opendatacommons.org/licenses/odbl/\r\ndatabases:\r\n  fixtures:\r\n    tables:\r\n      no_primary_key:\r\n        hidden: true\r\n    queries:\r\n      neighborhood_search:\r\n        sql: |-\r\n          select neighborhood, facet_cities.name, state\r\n          from facetable join facet_cities on facetable.city_id = facet_cities.id\r\n          where neighborhood like '%' || :text || '%' order by neighborhood;\r\n        title: Search neighborhoods\r\n        description_html: |-\r\n          <p>This demonstrates <em>basic</em> LIKE search\r\n```\r\n\r\nI ran this in the browser dev tools:\r\n```javascript\r\nvar s = document.createElement('script')\r\ns.src = 'https://cdnjs.cloudflare.com/ajax/libs/js-yaml/4.0.0/js-yaml.min.js'\r\ndocument.head.appendChild(s)\r\nvar yamlExample = document.querySelector('.highlight-yaml').textContent);\r\nconsole.log(JSON.stringify(window.jsyaml.load(yamlExample), null, 4))\r\n```\r\nAnd got:\r\n```json\r\n{\r\n    \"title\": \"Demonstrating Metadata from YAML\",\r\n    \"description_html\": \"<p>This description includes a long HTML string</p>\\n<ul>\\n  <li>YAML is better for embedding HTML strings than JSON!</li>\\n</ul>\",\r\n    \"license\": \"ODbL\",\r\n    \"license_url\": \"https://opendatacommons.org/licenses/odbl/\",\r\n    \"databases\": {\r\n        \"fixtures\": {\r\n            \"tables\": {\r\n                \"no_primary_key\": {\r\n                    \"hidden\": true\r\n                }\r\n            },\r\n            \"queries\": {\r\n                \"neighborhood_search\": {\r\n                    \"sql\": \"select neighborhood, facet_cities.name, state\\nfrom facetable join facet_cities on facetable.city_id = facet_cities.id\\nwhere neighborhood like '%' || :text || '%' order by neighborhood;\",\r\n                    \"title\": \"Search neighborhoods\",\r\n                    \"description_html\": \"<p>This demonstrates <em>basic</em> LIKE search\"\r\n                }\r\n            }\r\n        }\r\n    }\r\n}\r\n```", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805042880", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805042880, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTA0Mjg4MA==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T16:24:32Z", "updated_at": "2021-03-23T16:24:32Z", "author_association": "OWNER", "body": "... actually I think I would do that conversion in Python. The client-side YAML parsers all look a little bit heavy to me in terms of additional page weight.", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-805041522", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 805041522, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNTA0MTUyMg==", "user": {"value": 9599, "label": "simonw"}, "created_at": "2021-03-23T16:22:46Z", "updated_at": "2021-03-23T16:22:46Z", "author_association": "OWNER", "body": "That's a good idea. I could do that with JavaScript - loading YAML and converting it to JSON in JavaScript shouldn't be hard, and it's better than JSON-to-YAML because there's only one correct JSON representation of a YAML file whereas you can represent a JSON document in YAML in a bunch of different ways.", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}
{"html_url": "https://github.com/simonw/datasette/issues/1153#issuecomment-804640440", "issue_url": "https://api.github.com/repos/simonw/datasette/issues/1153", "id": 804640440, "node_id": "MDEyOklzc3VlQ29tbWVudDgwNDY0MDQ0MA==", "user": {"value": 192568, "label": "mroswell"}, "created_at": "2021-03-23T05:58:20Z", "updated_at": "2021-03-23T05:58:20Z", "author_association": "CONTRIBUTOR", "body": "Could there be a little widget that offers conversion from one to the other? ", "reactions": "{\"total_count\": 0, \"+1\": 0, \"-1\": 0, \"laugh\": 0, \"hooray\": 0, \"confused\": 0, \"heart\": 0, \"rocket\": 0, \"eyes\": 0}", "issue": {"value": 771202454, "label": "Use YAML examples in documentation by default, not JSON"}, "performed_via_github_app": null}