31:[] 2f:{"title":"Interactive list with autocomplete","cells":[{"id":0,"value":"# Interactive list with autocomplete","pinned":false,"hidden":false,"mode":"md"},{"id":99,"value":"//grid_two_dataframes = await html`

\n//

${viewof nom_commune}

\n//

${update}

\n//

${list_selected}

\n//

`","pinned":true,"hidden":false,"mode":"ojs"},{"id":7,"value":"viewof nom_commune = Inputs.text({\n label: \"Choix de la commune\",\n placeholder: \"Entrer le nom d'une commune\",\n datalist: codes_communes.map(d => d.LIBELLE),\n submit: true\n //value: \"Toulouse\"\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":96,"value":"//borrowed from https://observablehq.com/@danyx/lists-of-items-with-add-delete-buttons#\n\n// Here we show a message that the list is empty or otherwise\n// return a ul tag with one nested li tag for each item\n// Each item gets an a tag with an onclick handler that\n// triggers setting items to a copy of items with the item at its index\n// filtered out.\nlist_selected = { if (items.length === 0) {\n return html`

There are no items in the list

`\n }\n else {\n return html`

\n \n (mutable items = items.filter(\n (item, filterindex) => filterindex != index\n ))}>\n ${gain} 🗑\n \n

\n`\n}\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":86,"value":"html`\n\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":275,"value":"{\n mutable items = unique([...mutable items, nom_commune])\n return items\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":89,"value":"// The button has an onclick handler that mutates the target. Since\n// in this case the target is an array we make a copy, add the current newItemInput \n// value and set the items array to the new value\nupdate = {\n const button = html``;\n button.onclick = () => {\n let newItems = [...mutable items, nom_commune];\n mutable items = unique(newItems);\n };\n return button;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":94,"value":"// The mutable items array. This is what you would use for further calculations\nmutable items = [\"\"]","pinned":true,"hidden":false,"mode":"ojs"},{"id":67,"value":"//viewof liste_villes_select = Inputs.checkbox(\n// x.filter(d => d != \"\"), {label: \"Villes sélectionnées\"}\n//)","pinned":true,"hidden":true,"mode":"ojs"},{"id":18,"value":"## Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":222,"value":"function removeElement(arr, value) {\n const index = arr.indexOf(value);\n if (index !== -1) {\n arr.splice(index, 1);\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":76,"value":"function unique(data, accessor) {\n return Array.from(new Set(accessor ? data.map(accessor) : data));\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":62,"value":"x = unique(\n push_mutable(d)\n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":60,"value":"d = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":57,"value":"function push_mutable(d){\n d.push(nom_commune);\n return d ;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":33,"value":"codes_communes","pinned":true,"hidden":false,"mode":"ojs"},{"id":29,"value":"codes_communes = await db.query(`SELECT COM, LIBELLE from cog`) ","pinned":true,"hidden":false,"mode":"ojs"},{"id":27,"value":"Inputs.table(\n db.query(`SELECT * FROM cog`)\n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":13,"value":"url_cog = \"s3://projet-cartiflette/diffusion/shapefiles-test1/year=2022/administrative_level=COMMUNE/crs=None/france_entiere=raw/vectorfile_format=parquet/provider=INSEE/source=COG/raw.parquet\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":11,"value":"configuredClient = {\n const client = await DuckDBClient.of();\n await client.sql`\n SET s3_endpoint='minio.lab.sspcloud.fr'\n `;\n return client;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":9,"value":"db = {\n await configuredClient.query(`\n CREATE VIEW cog AS \n SELECT * FROM read_parquet('${url_cog}') ;\n `);\n return configuredClient\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":268,"value":"import {html} from \"@observablehq/htl\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}