{ "info": { "author": "Simon Willison", "author_email": "", "bugtrack_url": null, "classifiers": [], "description": "# datasette-json-html\n\n[![PyPI](https://img.shields.io/pypi/v/datasette-json-html.svg)](https://pypi.org/project/datasette-json-html/)\n[![Travis CI](https://travis-ci.com/simonw/datasette-json-html.svg?branch=master)](https://travis-ci.com/simonw/datasette-json-html)\n[![License](https://img.shields.io/badge/license-Apache%202.0-blue.svg)](https://github.com/simonw/datasette-json-html/blob/master/LICENSE)\n\nDatasette plugin for rendering HTML based on JSON values, using the [render_cell plugin hook](https://datasette.readthedocs.io/en/latest/plugins.html#plugin-hook-render-cell).\n\nThis plugin looks for cell values that match a very specific JSON format and converts them into HTML when they are rendered by the Datasette interface.\n\n## Links\n\n {\n \"href\": \"https://simonwillison.net/\",\n \"label\": \"Simon Willison\"\n }\n\nWill be rendered as an `` link:\n\n Simon Willison\n\nYou can set a tooltip on the link using a `\"title\"` key:\n\n\n {\n \"href\": \"https://simonwillison.net/\",\n \"label\": \"Simon Willison\",\n \"title\": \"My blog\"\n }\n\nProduces:\n\n Simon Willison\n\n* [Literal JSON link demo](https://datasette-json-html.datasette.io/demo?sql=select+%27%7B%0D%0A++++%22href%22%3A+%22https%3A%2F%2Fsimonwillison.net%2F%22%2C%0D%0A++++%22label%22%3A+%22Simon+Willison%22%2C%0D%0A++++%22title%22%3A+%22My+blog%22%0D%0A%7D%27)\n\n## List of links\n\n [\n {\n \"href\": \"https://simonwillison.net/\",\n \"label\": \"Simon Willison\"\n },\n {\n \"href\": \"https://github.com/simonw/datasette\",\n \"label\": \"Datasette\"\n }\n ]\n\nWill be rendered as a comma-separated list of `` links:\n\n Simon Willison,\n Datasette\n\nThe `href` property must begin with `https://` or `http://` or `/`, to avoid potential XSS injection attacks (for example URLs that begin with `javascript:`).\n\n* [Literal list of links demo](https://datasette-json-html.datasette.io/demo?sql=select+%27%5B%0D%0A++++%7B%0D%0A++++++++%22href%22%3A+%22https%3A%2F%2Fsimonwillison.net%2F%22%2C%0D%0A++++++++%22label%22%3A+%22Simon+Willison%22%0D%0A++++%7D%2C%0D%0A++++%7B%0D%0A++++++++%22href%22%3A+%22https%3A%2F%2Fgithub.com%2Fsimonw%2Fdatasette%22%2C%0D%0A++++++++%22label%22%3A+%22Datasette%22%0D%0A++++%7D%0D%0A%5D%27)\n\n## Images\n\nThe image tag is more complex. The most basic version looks like this:\n\n {\n \"img_src\": \"https://placekitten.com/200/300\"\n }\n\nThis will render as:\n\n \n\nBut you can also include one or more of `alt`, `caption`, `width` and `href`.\n\nIf you include width or alt, they will be added as attributes:\n\n {\n \"img_src\": \"https://placekitten.com/200/300\",\n \"alt\": \"Kitten\",\n \"width\": 200\n }\n\nProduces:\n\n \"Kitten\"\n\n* [Literal image demo](https://datasette-json-html.datasette.io/demo?sql=select+%27%7B%0D%0A++++%22img_src%22%3A+%22https%3A%2F%2Fplacekitten.com%2F200%2F300%22%2C%0D%0A++++%22alt%22%3A+%22Kitten%22%2C%0D%0A++++%22width%22%3A+200%0D%0A%7D%27)\n\nThe `href` key will cause the image to be wrapped in a link:\n\n {\n \"img_src\": \"https://placekitten.com/200/300\",\n \"href\": \"http://www.example.com\"\n }\n\nProduces:\n\n \n \n \n\nThe `caption` key wraps everything in a fancy figure/figcaption block:\n\n {\n \"img_src\": \"https://placekitten.com/200/300\",\n \"caption\": \"Kitten caption\"\n }\n\nProduces:\n\n
\n \n
Kitten caption
\n
\n\n## Preformatted text\n\nYou can use `{\"pre\": \"text\"}` to render text in a `
` HTML tag:\n\n    {\n        \"pre\": \"This\\nhas\\nnewlines\"\n    }\n\nProduces:\n\n    
This\n    has\n    newlines
\n\nIf the value attached to the `\"pre\"` key is itself a JSON object, that JSON will be pretty-printed:\n\n {\n \"pre\": {\n \"this\": {\n \"object\": [\"is\", \"nested\"]\n }\n }\n }\n\nProduces:\n\n
{\n      "this": {\n        "object": [\n          "is",\n          "nested"\n        ]\n      }\n    }
\n\n* [Preformatted text with JSON demo](https://datasette-json-html.datasette.io/demo?sql=select+%27%7B%0D%0A++++%22pre%22%3A+%7B%0D%0A++++++++%22this%22%3A+%7B%0D%0A++++++++++++%22object%22%3A+%5B%22is%22%2C+%22nested%22%5D%0D%0A++++++++%7D%0D%0A++++%7D%0D%0A%7D%27)\n\n## Using these with SQLite JSON functions\n\nThe most powerful way to make use of this plugin is in conjunction with SQLite's [JSON functions](https://www.sqlite.org/json1.html). For example:\n\n select json_object(\n \"href\", \"https://simonwillison.net/\",\n \"label\", \"Simon Willison\"\n );\n\n* [json_object() link demo](https://datasette-json-html.datasette.io/demo?sql=select+json_object%28%0D%0A++++%22href%22%2C+%22https%3A%2F%2Fsimonwillison.net%2F%22%2C%0D%0A++++%22label%22%2C+%22Simon+Willison%22%0D%0A%29%3B)\n\nYou can use these functions to construct JSON objects that work with the plugin from data in a table:\n\n select id, json_object(\n \"href\", url, \"label\", text\n ) from mytable;\n\n* [Demo that builds links against a table](https://datasette-json-html.datasette.io/demo?sql=select+json_object%28%22href%22%2C+url%2C+%22label%22%2C+package%2C+%22title%22%2C+package+%7C%7C+%22+%22+%7C%7C+url%29+as+package+from+packages)\n\nThe `json_group_array()` function is an aggregate function similar to `group_concat()` - it allows you to construct lists of JSON objects in conjunction with a `GROUP BY` clause.\n\nThis means you can use it to construct dynamic lists of links, for example:\n\n select\n substr(package, 0, 12) as prefix,\n json_group_array(\n json_object(\n \"href\", url,\n \"label\", package\n )\n ) as package_links\n from packages\n group by prefix\n\n* [Demo of json_group_arry()](https://datasette-json-html.datasette.io/demo?sql=select%0D%0A++++substr%28package%2C+0%2C+12%29+as+prefix%2C%0D%0A++++json_group_array%28%0D%0A++++++++json_object%28%0D%0A++++++++++++%22href%22%2C+url%2C%0D%0A++++++++++++%22label%22%2C+package%0D%0A++++++++%29%0D%0A++++%29+as+package_links%0D%0Afrom+packages%0D%0Agroup+by+prefix)\n\n## The `urllib_quote_plus()` SQL function\n\nSince this plugin is designed to be used with SQL that constructs the underlying JSON structure, it is likely you will need to construct dynamic URLs from results returned by a SQL query.\n\nThis plugin registers a custom SQLite function called `urllib_quote_plus()` to help you do that. It lets you use Python's [urllib.parse.quote\\_plus() function](https://docs.python.org/3/library/urllib.parse.html#urllib.parse.quote_plus) from within a SQL query.\n\nHere's an example of how you might use it:\n\n select id, json_object(\n \"href\",\n \"/mydatabase/other_table?_search=\" || urllib_quote_plus(text),\n \"label\", text\n ) from mytable;\n\n\n", "description_content_type": "text/markdown", "docs_url": null, "download_url": "", "downloads": { "last_day": -1, "last_month": -1, "last_week": -1 }, "home_page": "https://github.com/simonw/datasette-json-html", "keywords": "", "license": "Apache License, Version 2.0", "maintainer": "", "maintainer_email": "", "name": "datasette-json-html", "package_url": "https://pypi.org/project/datasette-json-html/", "platform": "", "project_url": "https://pypi.org/project/datasette-json-html/", "project_urls": { "Homepage": "https://github.com/simonw/datasette-json-html" }, "release_url": "https://pypi.org/project/datasette-json-html/0.5/", "requires_dist": [ "datasette" ], "requires_python": "", "summary": "Datasette plugin for rendering HTML based on JSON values", "version": "0.5" }, "last_serial": 5398413, "releases": { "0.1": [ { "comment_text": "", "digests": { "md5": "0cdcb09f9c81a90f0d820fdc173b45bd", "sha256": "275fde7c263584104c7ac080ed0f8e84258b17051d6837119e3cf2b0766064e2" }, "downloads": -1, "filename": "datasette_json_html-0.1-py3-none-any.whl", "has_sig": false, "md5_digest": "0cdcb09f9c81a90f0d820fdc173b45bd", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 3132, "upload_time": "2018-07-31T05:51:44", "url": "https://files.pythonhosted.org/packages/95/07/b3be843a04a44fa93419aca9556022be234340d0c8aa50e3652eadcf5dcd/datasette_json_html-0.1-py3-none-any.whl" } ], "0.2": [ { "comment_text": "", "digests": { "md5": "d158ef70e9826fa1743a5d8f727779b4", "sha256": "e8a5aee9acbab87fdbf4a4b06ea42ed16d832a788fcdd233fca28eb2c555a3ae" }, "downloads": -1, "filename": "datasette_json_html-0.2-py3-none-any.whl", "has_sig": false, "md5_digest": "d158ef70e9826fa1743a5d8f727779b4", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 3356, "upload_time": "2018-07-31T06:09:32", "url": "https://files.pythonhosted.org/packages/57/dc/0830bc397d506818ee5fd712e7238fa1427eb42784d8aa18673cf98239ad/datasette_json_html-0.2-py3-none-any.whl" } ], "0.3": [ { "comment_text": "", "digests": { "md5": "e34f8f78362eb385959383b79df1e1c6", "sha256": "9963101e0986f314b0f9a58a1799411231b6a505b3faca89595466fe8881aa68" }, "downloads": -1, "filename": "datasette_json_html-0.3-py3-none-any.whl", "has_sig": false, "md5_digest": "e34f8f78362eb385959383b79df1e1c6", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 3789, "upload_time": "2018-07-31T15:23:17", "url": "https://files.pythonhosted.org/packages/6e/3d/5b27d000fd0654f580e20d1487d5f0de9b2fcdc6ed8e6a2708a8e9a214c4/datasette_json_html-0.3-py3-none-any.whl" } ], "0.3.1": [ { "comment_text": "", "digests": { "md5": "050b6623807ea067468425522a8a32d3", "sha256": "2bef3c6cdefd89abc2de5cc07e3276c88897ab691b695e67ebfc9c2dfba9e506" }, "downloads": -1, "filename": "datasette_json_html-0.3.1-py3-none-any.whl", "has_sig": false, "md5_digest": "050b6623807ea067468425522a8a32d3", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 3818, "upload_time": "2018-08-06T03:47:32", "url": "https://files.pythonhosted.org/packages/f8/e7/d11d7980e8220a1603880a3b5b11fc438bf8f0a2dbd384c8d4169f561d4d/datasette_json_html-0.3.1-py3-none-any.whl" } ], "0.3.2": [ { "comment_text": "", "digests": { "md5": "56f59add34097e91e78c5dbf8a99998a", "sha256": "8aa135005e2f3995b6adbcd897a53fe357f68f307035481089fb3f489209468d" }, "downloads": -1, "filename": "datasette_json_html-0.3.2-py3-none-any.whl", "has_sig": false, "md5_digest": "56f59add34097e91e78c5dbf8a99998a", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 3946, "upload_time": "2018-08-06T03:49:52", "url": "https://files.pythonhosted.org/packages/8a/e4/728da78ddebbd65d65127b220cb1cd0f54be428a25fed610b63a888cd34e/datasette_json_html-0.3.2-py3-none-any.whl" } ], "0.3.4": [ { "comment_text": "", "digests": { "md5": "13322a3d41dc6cfb6f3b80a2218b5b76", "sha256": "e59cc93f3925620018e5537f227c78735e8d92580e08460d99257dde55c92bc6" }, "downloads": -1, "filename": "datasette_json_html-0.3.4-py3-none-any.whl", "has_sig": false, "md5_digest": "13322a3d41dc6cfb6f3b80a2218b5b76", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 3948, "upload_time": "2018-08-06T04:00:55", "url": "https://files.pythonhosted.org/packages/e7/6b/849633456eac98eb5e4d61327e4994692300f0c292c98d3744af631b96d7/datasette_json_html-0.3.4-py3-none-any.whl" } ], "0.4.0": [ { "comment_text": "", "digests": { "md5": "67b8b60a95c75cf330cc5254301a67b9", "sha256": "31e110862086048f1014da7fd6ad777d432612b51d47ed44599c2aa82c567af2" }, "downloads": -1, "filename": "datasette_json_html-0.4.0-py3-none-any.whl", "has_sig": false, "md5_digest": "67b8b60a95c75cf330cc5254301a67b9", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 8359, "upload_time": "2019-01-02T04:18:07", "url": "https://files.pythonhosted.org/packages/d7/85/12c208c01e4354089ca8e96be5d0213e79a5d05c44b4b9a63176b66ad59c/datasette_json_html-0.4.0-py3-none-any.whl" } ], "0.4.1": [ { "comment_text": "", "digests": { "md5": "f8c652208e59765d8aa64829dce2e24c", "sha256": "d69683d32dc47d3e83b86c04e52e182bffb328a0fc3582cd444bbba453b39f7b" }, "downloads": -1, "filename": "datasette_json_html-0.4.1-py3-none-any.whl", "has_sig": false, "md5_digest": "f8c652208e59765d8aa64829dce2e24c", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 8333, "upload_time": "2019-01-26T23:08:12", "url": "https://files.pythonhosted.org/packages/5f/b9/d437c2c728a7f14858d55780fac09c7ef3b01f4856fd93ab22bf93787588/datasette_json_html-0.4.1-py3-none-any.whl" } ], "0.5": [ { "comment_text": "", "digests": { "md5": "b0ba4fdd40ddf3a129db29d124e6c9b2", "sha256": "e604037de645490f08bc0fa4870ed9f7ca86e6a5f59ea87d9dba9968ce9c1ffd" }, "downloads": -1, "filename": "datasette_json_html-0.5-py3-none-any.whl", "has_sig": false, "md5_digest": "b0ba4fdd40ddf3a129db29d124e6c9b2", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 8995, "upload_time": "2019-06-14T01:33:32", "url": "https://files.pythonhosted.org/packages/e8/04/9d23f5f665b9540d36c85b17a0cada1901ee2b3e81ac5e34237ad176c288/datasette_json_html-0.5-py3-none-any.whl" } ] }, "urls": [ { "comment_text": "", "digests": { "md5": "b0ba4fdd40ddf3a129db29d124e6c9b2", "sha256": "e604037de645490f08bc0fa4870ed9f7ca86e6a5f59ea87d9dba9968ce9c1ffd" }, "downloads": -1, "filename": "datasette_json_html-0.5-py3-none-any.whl", "has_sig": false, "md5_digest": "b0ba4fdd40ddf3a129db29d124e6c9b2", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 8995, "upload_time": "2019-06-14T01:33:32", "url": "https://files.pythonhosted.org/packages/e8/04/9d23f5f665b9540d36c85b17a0cada1901ee2b3e81ac5e34237ad176c288/datasette_json_html-0.5-py3-none-any.whl" } ] }