2d:null 2e:["$","title",null,{"children":"Project 3 | Pokemon Finder | parthivi-varshney | Observable"}] 33:T44b,function renderPokemons(pokemon) { mutable slicesPokemonList = pokemon; let maxAttack = parseInt(pokemon[0].attack); for(let i =0; imaxAttack) { maxAttack = parseInt(pokemon[i].attack); } } return pokemon.map( (p, i) => { if(p.attack == maxAttack) { mutable winner = "visible" } else { mutable winner = "hidden" } console.log("MAX ATTACK", maxAttack) console.log("P ATTACK", p.attack) console.log("VISIBILITY", mutable winner); const pokeCard = htl.html`

${p.name}

` pokeCard.appendChild(htl.html`

WINNER

${getImage(p.name)}`) pokeCard.appendChild(htl.html``) return pokeCard } ); } 34:[{"id":"39dd3796f50017e56d039d8fff04d3ffdf51b377ed9fcf7448dffdbca8d5f9b8afdf4555d7de32c71d3f2503200c007ddf774316a59368c94a0e528f6e8d8bb2","href":"https://static.observableusercontent.com/files/39dd3796f50017e56d039d8fff04d3ffdf51b377ed9fcf7448dffdbca8d5f9b8afdf4555d7de32c71d3f2503200c007ddf774316a59368c94a0e528f6e8d8bb2","name":"pokemon.csv","type":"text/csv","lastModified":1651135794669.51,"size":160616}] 31:{"id":"43bd9439263bb54b","slug":"project-3-pokemon-finder","title":"Project 3 | Pokemon Finder","thumbnail":"c455a242af4dbc8ba9ed1ad1f3b3fa1cb1bcf8268bdc7319937707889def374c","access_level":"public","create_time":"$D2022-04-28T08:47:06.147Z","update_time":"$D2022-05-06T00:07:14.217Z","view_time":null,"first_public_time":"$D2022-05-01T07:36:19.528Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"29c4858a5f0f02f2","login":"parthivi-varshney","name":"","avatar_url":"https://avatars-next.observableusercontent.com/a01697cc8144442f2a54ed31fc7c9c20b22e30c1a6fe52d5b38bd526bf019a9d","tier":"starter_2024"},"version":896,"publish_version":896,"role":null,"authored":false,"authors":[{"type":"individual","id":"36cdff01b518af24","login":"parthivi-varshney","name":"","avatar_url":"https://avatars-next.observableusercontent.com/a01697cc8144442f2a54ed31fc7c9c20b22e30c1a6fe52d5b38bd526bf019a9d","tier":null}],"members":[{"type":"individual","id":"36cdff01b518af24","login":"parthivi-varshney","name":"","avatar_url":"https://avatars-next.observableusercontent.com/a01697cc8144442f2a54ed31fc7c9c20b22e30c1a6fe52d5b38bd526bf019a9d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Project 3 | Pokemon Finder","cells":[{"id":0,"value":"# Project 3 | Pokemon Finder","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":654,"value":"#### Extra Feature :\n - User can select page size with slider.\n - Winner based on attack value will be marked (if all pokemons have same attack value they are all winners).\n - Click on More button to find out more about the pokemon.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":120,"value":"# Abilities","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":117,"value":"viewof abilityFilter = Inputs.checkbox(allAbilities)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":141,"value":"# Type 1","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":145,"value":"viewof type1Filter = Inputs.checkbox(allType1)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"# Type 2","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":164,"value":"viewof type2Filter = Inputs.checkbox(allType2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":172,"value":"# Attack Value","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":178,"value":"viewof attackFilter = Inputs.range([0, attackRange[attackRange.length - 1]], {step:1, value:10})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":648,"value":"#### Select number of pokemons you want visible on one page","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":644,"value":"viewof totalItems = Inputs.range([2,10], {step:1})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":225,"value":"# Pokemons","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":799,"value":"Pagination = {\n \n const target = htl.html`

${divPokemon}

`;\n // \n const onKeyPress = (evt) => {\n if(evt.key === \"ArrowRight\" && mutable page < maxNumPages-1) {\n mutable page += 1;\n \n }\n else if(evt.key === \"ArrowLeft\" && mutable page > 0) {\n mutable page -= 1;\n \n }\n target.dispatchEvent(new Event(\"input\", { bubbles: true }));\n redraw();\n };\n\n target.addEventListener(\"keydown\", onKeyPress);\n\n return target;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":853,"value":"viewof information = {\n if(mutable selectedIndex == undefined) {\n return htl.html`

NO POKEMON SELECTED

`\n }\n else {\n console.log(\"INDEX\",mutable slicesPokemonList[selectedIndex]);\n // let list = mutable slicesPokemonList[selectedIndex].attack\n return htl.html`

NAME: ${mutable slicesPokemonList[selectedIndex].name}

CLASSIFICATION : ${mutable slicesPokemonList[selectedIndex].classfication}

JAPANESE NAME : ${mutable slicesPokemonList[selectedIndex].japanese_name}

ATTACK : ${mutable slicesPokemonList[selectedIndex].attack}

TYPE 1 : ${mutable slicesPokemonList[selectedIndex].type1}

TYPE 2 : ${mutable slicesPokemonList[selectedIndex].type2}

`\n }\n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":871,"value":"## Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":847,"value":"ui = {\n return redraw()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":804,"value":"divPokemon = htl.html`

Page ${page+1} of ${maxNumPages}

`;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":824,"value":"function redraw() {\n mutable check = 1\n console.log(\"SLICED\", filteredList)\n if(filteredList.length>0) {\n mutable pokemonElements = renderPokemons(\n filteredList.slice(page * pageSize, (page + 1) * pageSize)\n );\n divPokemon.appendChild(htl.html`

${mutable pokemonElements}

`); \n }\n else {\n divPokemon.appendChild(htl.html`

NO POKEMONS TO DISPLAY!!

`); \n }\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":864,"value":"mutable slicesPokemonList = [];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":816,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":479,"value":"function getImage(name) {\n let url = `https://raw.githubusercontent.com/rileynwong/pokemon-images-dataset-by-type/master/all/${name.toLowerCase()}.png`;\n const onError = (evt) => {\n if(evt.target.src.endsWith(\".png\")) {\n evt.target.src = evt.target.src.replace(\".png\",\".jpg\");\n }\n }\n const img = htl.html`

`\n return img\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":774,"value":"mutable selectedIndex = null;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":818,"value":"mutable winner = \"hidden\";","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":810,"value":"mutable pageSize = 4;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":808,"value":"mutable page = 0;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":812,"value":"maxNumPages = Math.ceil(filteredList.length/pageSize);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":779,"value":"selectedIndex","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":793,"value":"mutable check = 0;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":784,"value":"mutable pokemonElements = [];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":336,"value":"filteredList = {\n let result = []\n if (abilityFilteredPokemons.length != 0) {\n result = result.concat(abilityFilteredPokemons)\n }\n if (type1FilteredPokemons.length != 0) {\n result = result.concat(type1FilteredPokemons)\n }\n if (type2FilteredPokemons.length != 0) {\n result = result.concat(type2FilteredPokemons)\n }\n if (attackFilteredPokemons.length != 0) {\n result = result.concat(attackFilteredPokemons)\n }\n return [... new Set(result)]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":266,"value":"abilityFilteredPokemons = {\n let result = []\n cleanPokemonData.filter(p => { \n p.abilities.filter(a => {\n console.log(abilityFilter.includes(a))\n if (abilityFilter.includes(a)) {\n result.push(p);\n }\n })\n })\n return result;\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":325,"value":"type1FilteredPokemons = {\n let result = []\n cleanPokemonData.filter(p => { \n if (type1Filter.includes(p.type1)) {\n result.push(p);\n }\n })\n return result;\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":330,"value":"type2FilteredPokemons = {\n let result = []\n cleanPokemonData.filter(p => { \n if (type2Filter.includes(p.type2)) {\n result.push(p);\n }\n })\n return result;\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":334,"value":"attackFilteredPokemons = {\n let result = []\n cleanPokemonData.filter(p => { \n if (attackFilter == p.attack) {\n result.push(p);\n }\n })\n return result;\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"originalPokemonsData = FileAttachment(\"pokemon.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":238,"value":"cleanPokemonData = {\n return originalPokemonsData.map(p => {\n const string = p.abilities.replace(/['\\[\\]\\ ]/g,\"\")\n const list = string.split(\",\")\n p.abilitiesString = string\n p.abilities = list\n return p\n })\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"mutable allAbilities = []","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"getAbilities = {\n let abilities = [];\n cleanPokemonData.map(p => {p.abilities.map(a =>abilities.push(a))});\n mutable allAbilities = [... new Set(abilities)]\n}\n ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"allType1 = {\n let type1 = cleanPokemonData.map(p => p.type1)\n return [... new Set(type1)]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":148,"value":"allType2 = {\n let type2 = cleanPokemonData.map(p => p.type2)\n return [... new Set(type2)]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":169,"value":"attackRange = {\n let sortedList = cleanPokemonData.sort((a,b)=> (parseInt(a.attack) > parseInt(b.attack) ? 1 : -1))\n let attack = sortedList.map(p => parseInt(p.attack))\n return [... new Set(attack)]\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 32:"$31:body"