Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 5 additions & 3 deletions .github/dependabot.yml
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
version: 2
updates:
- package-ecosystem: "github-actions"
directory: "/"
schedule:
interval: "monthly"
- package-ecosystem: "npm"
directory: "/"
schedule:
interval: "monthly"
reviewers:
- "Naramsim"
groups:
dependencies:
patterns:
- "*"
versioning-strategy: increase
versioning-strategy: auto
15 changes: 8 additions & 7 deletions .github/workflows/test.yml
Original file line number Diff line number Diff line change
Expand Up @@ -7,21 +7,22 @@ jobs:
runs-on: ubuntu-latest
strategy:
matrix:
node-version: [ 16, 18, 20 ]
node-version: [ 16, 18, 20, lts/*, latest ]
steps:
- name: Clone repository
uses: actions/checkout@v2
uses: actions/checkout@v6
- name: Setup node
uses: actions/setup-node@v2
uses: actions/setup-node@v6
with:
node-version: ${{ matrix.node }}
- name: Install dependencies
run: |
npm ci
npm install -g codecov
- name: Build
run: npm run build
- name: Unit test
run: npm t
run: npm run coverage
- name: Upload coverage
uses: codecov/codecov-action@v2
uses: codecov/codecov-action@v6
with:
files: ./lcov.info
token: ${{ secrets.CODECOV_TOKEN }}
3 changes: 1 addition & 2 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
node_modules
*.js.map
.nyc_output
coverage
lcov.info
3 changes: 1 addition & 2 deletions .npmignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
node_modules
test
.travis.yml
webpack.config.js
.github
117 changes: 32 additions & 85 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,11 @@
[![npm](https://img.shields.io/npm/v/pokeapi-js-wrapper)](https://www.npmjs.com/package/pokeapi-js-wrapper)
[![Tests](https://github.com/PokeAPI/pokeapi-js-wrapper/actions/workflows/test.yml/badge.svg)](https://github.com/PokeAPI/pokeapi-js-wrapper/actions/workflows/test.yml)
[![Mocha browser tests](https://img.shields.io/badge/test-browser-brightgreen.svg)](https://pokeapi.github.io/pokeapi-js-wrapper/test/test.html)
[![codecov](https://codecov.io/gh/PokeAPI/pokeapi-js-wrapper/branch/master/graph/badge.svg)](https://codecov.io/gh/PokeAPI/pokeapi-js-wrapper)
[![codecov](https://codecov.io/github/PokeAPI/pokeapi-js-wrapper/graph/badge.svg?token=4oXXOVxG2n)](https://codecov.io/github/PokeAPI/pokeapi-js-wrapper)

Maintainer: [Naramsim](https://github.com/Naramsim)

A PokeAPI wrapper intended for browsers only. Comes fully asynchronous (with [localForage](https://github.com/localForage/localForage)) and built-in cache. Offers also Image Caching through the inclusion of a Service Worker. _For a Node (server-side) wrapper see: [pokedex-promise-v2](https://github.com/PokeAPI/pokedex-promise-v2)_

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
A PokeAPI wrapper intended for browsers. Comes fully asynchronous, zero dependencies and built-in cache. Offers also Image Caching through the inclusion of a Service Worker. _For a Node (server-side) wrapper see: [pokedex-promise-v2](https://github.com/PokeAPI/pokedex-promise-v2)_

- [Install](#install)
- [Usage](#usage)
Expand All @@ -21,49 +18,42 @@ A PokeAPI wrapper intended for browsers only. Comes fully asynchronous (with [lo
- [Endpoints](#endpoints)
- [Root Endpoints list](#root-endpoints-list)
- [Custom URLs and paths](#custom-urls-and-paths)
- [Internet Explorer 8](#internet-explorer-8)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Install

```sh
npm install pokeapi-js-wrapper --save
```

```html
<script src="https://unpkg.com/pokeapi-js-wrapper/dist/index.js"></script>
```

## Usage

```js
const Pokedex = require("pokeapi-js-wrapper")
const P = new Pokedex.Pokedex()
// As a Node module
// npm install pokeapi-js-wrapper --save
const pokedex = await Pokedex.init();
console.log(await pokedex.getPokemonsList())
```

```html
<script>
const P = new Pokedex.Pokedex()
<!-- Included in some HTML -->
<script type="module">
import {Pokedex} from "https://cdn.jsdelivr.net/gh/pokeapi/pokeapi-js-wrapper@beta/src/index.js"
const pokedex = await Pokedex.init();
const version = await pokedex.getVersionByName(1)
console.log(version)
</script>
```

### [Example](https://jsbin.com/jedakor/5/edit?html,console) requests
### [Example](https://jsbin.com/jedakor/9/edit?html,console) requests

```js
// with await, be sure to be in an async function (and in a try/catch)
(async () => {
const golduck = await P.getPokemonByName("golduck")
const golduck = await pokedex.getPokemonByName("golduck")
console.log(golduck)
})()

// or with Promises
P.getPokemonByName("eevee")
pokedex.getPokemonByName("eevee")
.then(function(response) {
console.log(response)
})

P.resource([
pokedex.resource([
"/api/v2/pokemon/36",
"api/v2/berry/8",
"https://pokeapi.co/api/v2/ability/9/",
Expand All @@ -74,11 +64,10 @@ P.resource([

## Configuration

Pass an Object to `Pokedex()` in order to configure it. Available options: `protocol`, `hostName`, `versionPath`, `cache`, `timeout`(ms), and `cacheImages`.
Pass an Object to `Pokedex.init()` in order to configure it. Available options: `protocol`, `hostName`, `versionPath`, `cache`, `timeout`(ms), and `cacheImages`.
Any option is optional :smile:. All the default values can be found [here](https://github.com/PokeAPI/pokeapi-js-wrapper/blob/master/src/config.js#L3-L10)

```js
const Pokedex = require("pokeapi-js-wrapper")
const customOptions = {
protocol: "https",
hostName: "localhost:443",
Expand All @@ -87,7 +76,7 @@ const customOptions = {
timeout: 5 * 1000, // 5s
cacheImages: true
}
const P = new Pokedex.Pokedex(customOptions)
const pokedex = await Pokedex.init(customOptions);
```

### Caching images
Expand All @@ -97,17 +86,17 @@ Pokeapi.co serves its Pokemon images through [Github](https://github.com/PokeAPI
`pokeapi-js-wrapper` enables browsers to cache all these images by:

1. enabling the config parameter `cacheImages`
2. serving [our service worker](https://raw.githubusercontent.com/PokeAPI/pokeapi-js-wrapper/master/dist/pokeapi-js-wrapper-sw.js) from the root of your project
2. serving [our service worker](https://raw.githubusercontent.com/PokeAPI/pokeapi-js-wrapper/master/src/pokeapi-js-wrapper-sw.js) from the root of your project

In this way when `pokeapi-js-wrapper`'s `Pokedex` is created it will install and start the Service Worker you are serving at the root of your server. The Service Worker will intercept all the calls your HTML/CSS/JS are making to get PokeAPI's images and will cache them.
In this way when `pokeapi-js-wrapper`'s `Pokedex` is initialized it will install and start the Service Worker you are serving at the root of your server. The Service Worker will intercept all the calls your HTML/CSS/JS are making to get PokeAPI's images and will cache them.

It's fundamental that you download the Service Worker [we provide](https://raw.githubusercontent.com/PokeAPI/pokeapi-js-wrapper/master/dist/pokeapi-js-wrapper-sw.js)_(Right Click + Save As)_ and you serve it from the root of your project/server. Service Workers in fact cannot be installed from a domain different than yours.
It's fundamental that you download the Service Worker [we provide](https://raw.githubusercontent.com/PokeAPI/pokeapi-js-wrapper/master/src/pokeapi-js-wrapper-sw.js)_(Right Click + Save As)_ and you serve it from the root of your project/server. Service Workers in fact cannot be installed from a domain different than yours.

A [basic example](https://github.com/PokeAPI/pokeapi-js-wrapper/blob/master/test/example-sw.html) is hosted [here](https://pokeapi.github.io/pokeapi-js-wrapper/test/example-sw.html).

## Tests

`pokeapi-js-wrapper` can be tested using two strategies. One is with Node, since this package works with Node (although not recommended), and the other with a browser.
`pokeapi-js-wrapper` can be tested using two strategies. One is with Node, since this package works with Node, and the other with a browser.

```js
npm test
Expand All @@ -120,23 +109,15 @@ Or open `/test/test.html` in your browser. A live version can be found at [`gh-p
All the endpoints and the functions to access PokeAPI's endpoints are listed in the long table below. Each function `.ByName(name)` accepts names and ids. The only 5 functions `.ById(id)` only accept ids. You can also pass an array to each function, it will retrieve the data for each element asynchronously.

```js
P.getPokemonByName("eevee").then(function(response) {
console.log(response)
})
response = await pokedex.getPokemonByName("eevee")

P.getPokemonSpeciesByName(25).then(function(response) {
console.log(response)
})
response = await pokedex.getPokemonSpeciesByName(25)

P.getBerryByName(["cheri", "chesto", 5]).then(function(response) {
// `response` will be an Array containing 3 Objects
// response.forEach((item) => {console.log(item.size)}) // 80,50,20
console.log(response)
})
// `response` will be an Array containing 3 Objects
// response.forEach((item) => {console.log(item.size)}) // 80,50,20
response = await pokedex.getBerryByName(["cheri", "chesto", 5])

P.getMachineById(3).then(function(response) {
console.log(response)
})
response = await pokedex.getMachineById(3)
```

| Function | Mapped PokeAPI endpoint | Documentation |
Expand Down Expand Up @@ -207,42 +188,11 @@ const interval = {
offset: 34,
limit: 10,
}
P.getPokemonsList(interval).then(function(response) {
pokedex.getPokemonsList(interval).then(function(response) {
console.log(response)
})
```

<!--
This is what you will get:

```json
{
"count": 1050,
"next": "https://pokeapi.co/api/v2/pokemon/?offset=43&limit=10",
"previous": "https://pokeapi.co/api/v2/pokemon/?offset=23&limit=10",
"results": [
{
"name": "nidoking",
"url": "https://pokeapi.co/api/v2/pokemon/34/"
},
{
"name": "clefairy",
"url": "https://pokeapi.co/api/v2/pokemon/35/"
},
// ...
{
"name": "golbat",
"url": "https://pokeapi.co/api/v2/pokemon/42/"
},
{
"name": "oddish",
"url": "https://pokeapi.co/api/v2/pokemon/43/"
}
]
}
```
-->

| Function | Mapped PokeAPI endpoint |
| --- | --- |
| `getEndpointsList()` | [/](https://pokeapi.co/api/v2/) |
Expand All @@ -267,6 +217,7 @@ This is what you will get:
| `getItemFlingEffectsList()` | [/item-fling-effect](https://pokeapi.co/api/v2/item-fling-effect/) |
| `getItemPocketsList()` | [/item-pocket](https://pokeapi.co/api/v2/item-pocket/) |
| `getMachinesList()` | [/machine](https://pokeapi.co/api/v2/machine/) |
| `getMeta()` | [/meta](https://pokeapi.co/api/v2/meta/) |
| `getMovesList()` | [/move](https://pokeapi.co/api/v2/move/) |
| `getMoveAilmentsList()` | [/move-ailment](https://pokeapi.co/api/v2/move-ailment/) |
| `getMoveBattleStylesList()` | [/move-battle-style](https://pokeapi.co/api/v2/move-battle-style/) |
Expand Down Expand Up @@ -300,19 +251,15 @@ This is what you will get:
Use `.resource()` to query any URL or path. Also this function accepts both single values and Arrays.

```js
P.resource([
pokedex.resource([
"/api/v2/pokemon/36",
"api/v2/berry/8",
"https://pokeapi.co/api/v2/ability/9/",
]).then(function(response) {
console.log(response)
})

P.resource("api/v2/berry/5").then(function(response) {
pokedex.resource("api/v2/berry/5").then(function(response) {
console.log(response)
})
```

## Internet Explorer 8

In order to target this browser you must load a `Promise` polyfill before `pokeapi-js-wrapper`. You can choose one of your choice, we recommend [jakearchibald/es6-promise](https://cdnjs.com/libraries/es6-promise) or [stefanpenner/es6-promise](https://github.com/stefanpenner/es6-promise)
1 change: 0 additions & 1 deletion codecov.yml

This file was deleted.

3 changes: 0 additions & 3 deletions dist/index.js

This file was deleted.

6 changes: 0 additions & 6 deletions dist/index.js.LICENSE.txt

This file was deleted.

1 change: 0 additions & 1 deletion dist/pokeapi-js-wrapper-sw.js

This file was deleted.

Loading