30:T48b,{ const container = html`

`; let fpoke = {}; if (type !== 'Select') { fpoke = pokemons.filter(d => d.types.map(dt => dt.type.name).includes(type) ); } else { fpoke = pokemons; } fpoke.reverse().map(d => { const poke = html`

`; const name = d.name; poke.appendChild( html`

` ); poke.appendChild( html`

${name.charAt(0).toUpperCase() + name.slice(1)}

` ); const abilities = d.abilities.map(d => { return d.ability.name; }); const len = abilities.length; poke.appendChild( html`

${abilities.map((d, i) => { if (i !== len - 1) { return d + " • "; } else { return d; } })}

` ); container.appendChild(poke); }); // Observable notebooks do not support event listeners on HTML🙁 // document.querySelectorAll('.poke').forEach(card => { // console.log(card); // card.addEventListener('click', showModal); // }); return container; }31:[] 2e:{"title":"Pokedex","cells":[{"id":0,"value":"md`# Pokedex`","pinned":false,"hidden":false,"mode":"ojs"},{"id":91,"value":"viewof limit = slider({\n min: 10,\n max: 500,\n step: 10,\n value: 40,\n description: \"Number of pokemons\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":448,"value":"viewof type = select({\n options: types,\n description: \"Pokemon type\",\n value: \"Select\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":249,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"},{"id":229,"value":"md`\n---\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":66,"value":"md `## Dependencies`","pinned":false,"hidden":false,"mode":"ojs"},{"id":243,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"raw = fetch(`https://pokeapi.co/api/v2/pokemon?limit=${limit}/`).then(res =>\n res.json()).then(data => data.results\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":102,"value":"pokemons = {\n const prom = raw.map(d => {\n return fetch(d.url).then(res => res.json());\n });\n\n return Promise.all(prom).then(res => res);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":425,"value":"types = {\n const result = fetch(\"https://pokeapi.co/api/v2/type\")\n .then(res => res.json())\n .then(d => d.results)\n .then(d => d.map(d => d.name));\n\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":342,"value":"// Determine height boundaries for small, medium and large pokemons\n// vl\n// .markRect()\n// .data(heights)\n// .encode(\n// vl\n// .x()\n// .fieldQ(\"height\")\n// .bin({ step: 1 })\n// .title(\"Pokemon height\"),\n// vl\n// .y()\n// .aggregate(\"count\")\n// .title(\"Frequency\")\n// )\n// .render()\n\nconsole.log('asf')","pinned":false,"hidden":false,"mode":"ojs"},{"id":326,"value":"heights = {\n const h = pokemons.map(d => {\n return { height: d.height };\n });\n return h.filter(d => d.height <= 30);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":332,"value":"d3.deviation(heights, d => d.height)","pinned":false,"hidden":false,"mode":"ojs"},{"id":465,"value":"types.unshift(\"Select\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"d3 = require('d3')","pinned":false,"hidden":false,"mode":"ojs"},{"id":338,"value":"import { vl } from '@vega/vega-lite-api'","pinned":false,"hidden":false,"mode":"ojs"},{"id":53,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":58,"value":"import {select} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":388,"value":"import { button } from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}