William Noris
GitHub
commit
018f8e558b
|
|
@ -1,2 +1,4 @@
|
||||||
node_modules/
|
node_modules/
|
||||||
dist/
|
dist/
|
||||||
|
.parcel-cache/
|
||||||
|
.parcel-cache/lock.mdb
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 112 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 96 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 103 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 283 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 77 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 478 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 126 KiB |
|
|
@ -1,12 +1,15 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link rel="stylesheet" href="styles/style.css">
|
<link rel="stylesheet" href="styles/style.css">
|
||||||
|
<script src="scripts/personnages.js" defer type="module"></script>
|
||||||
<title>Characters</title>
|
<title>Characters</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<section class="titre"><a href="index.html">STAR WARS</a></section>
|
<section class="titre"><a href="index.html">STAR WARS</a></section>
|
||||||
<section class="sec-menu">
|
<section class="sec-menu">
|
||||||
|
|
@ -15,9 +18,26 @@
|
||||||
<li id="films"><a href="films.html">Films</a></li>
|
<li id="films"><a href="films.html">Films</a></li>
|
||||||
<li id="planets"><a href="planets.html">Planets</a></li>
|
<li id="planets"><a href="planets.html">Planets</a></li>
|
||||||
<li id="characters"><a href="characters.html">Characters</a></li>
|
<li id="characters"><a href="characters.html">Characters</a></li>
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<section id="recherche">
|
||||||
|
<form action="" id="formRecherche" onSubmit="event.preventDefault(); console.log('click')">
|
||||||
|
<label for="textRecherche">Recherche : </label>
|
||||||
|
<input type="text" name="textRecherche" id="textRecherche">
|
||||||
|
<input type="submit" value="ok">
|
||||||
|
</form>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="resultats" class="accordeon"></section>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="image-charactere"></div>
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
16
films.html
16
films.html
|
|
@ -1,12 +1,15 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link rel="stylesheet" href="styles/style.css">
|
<link rel="stylesheet" href="styles/style.css">
|
||||||
|
<script src="/scripts/films.js" defer type="module"></script>
|
||||||
<title>Films</title>
|
<title>Films</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<section class="titre"><a href="index.html">STAR WARS</a></section>
|
<section class="titre"><a href="index.html">STAR WARS</a></section>
|
||||||
<section class="sec-menu">
|
<section class="sec-menu">
|
||||||
|
|
@ -19,5 +22,18 @@
|
||||||
</nav>
|
</nav>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<section id="recherche">
|
||||||
|
<form action="" id="formRecherche" onSubmit="event.preventDefault(); console.log('click')">
|
||||||
|
<label for="textRecherche">Recherche : </label>
|
||||||
|
<input type="text" name="textRecherche" id="textRecherche">
|
||||||
|
<input type="submit" value="ok">
|
||||||
|
</form>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="resultats" class="accordeon">
|
||||||
|
|
||||||
|
</section>
|
||||||
|
<div class="image-films"></div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -5,7 +5,6 @@
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link rel="stylesheet" href="styles/style.css">
|
<link rel="stylesheet" href="styles/style.css">
|
||||||
<script src="scripts/util.js"></script>
|
|
||||||
<title>Accueil</title>
|
<title>Accueil</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
@ -19,6 +18,9 @@
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</section>
|
</section>
|
||||||
|
<h1 id = "bienvenue">bienvenue</h1>
|
||||||
|
<p id = "presentation">Bienvenue sur la Star Wars database,
|
||||||
|
utilisez le menu pour vous déplacer</p>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
File diff suppressed because it is too large
Load Diff
140
package.json
140
package.json
|
|
@ -6,16 +6,16 @@
|
||||||
"description": "",
|
"description": "",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"abortcontroller-polyfill": "^1.7.3",
|
|
||||||
"acorn-globals": "^4.3.4",
|
|
||||||
"acorn": "^6.4.2",
|
|
||||||
"abab": "^2.0.5",
|
"abab": "^2.0.5",
|
||||||
|
"abortcontroller-polyfill": "^1.7.3",
|
||||||
|
"acorn": "^6.4.2",
|
||||||
|
"acorn-globals": "^4.3.4",
|
||||||
"acorn-walk": "^6.2.0",
|
"acorn-walk": "^6.2.0",
|
||||||
"ajv": "^6.12.6",
|
"ajv": "^6.12.6",
|
||||||
"ansi-escapes": "^4.3.2",
|
|
||||||
"alphanum-sort": "^1.0.2",
|
"alphanum-sort": "^1.0.2",
|
||||||
"ansi-regex": "^5.0.1",
|
"ansi-escapes": "^4.3.2",
|
||||||
"ansi-html-community": "^0.0.8",
|
"ansi-html-community": "^0.0.8",
|
||||||
|
"ansi-regex": "^5.0.1",
|
||||||
"ansi-styles": "^4.3.0",
|
"ansi-styles": "^4.3.0",
|
||||||
"array-equal": "^1.0.0",
|
"array-equal": "^1.0.0",
|
||||||
"array-union": "^2.1.0",
|
"array-union": "^2.1.0",
|
||||||
|
|
@ -50,28 +50,29 @@
|
||||||
"browserify-sign": "^4.2.1",
|
"browserify-sign": "^4.2.1",
|
||||||
"browserify-zlib": "^0.2.0",
|
"browserify-zlib": "^0.2.0",
|
||||||
"browserslist": "^4.17.4",
|
"browserslist": "^4.17.4",
|
||||||
|
"buffer": "^5.7.1",
|
||||||
"buffer-from": "^1.1.2",
|
"buffer-from": "^1.1.2",
|
||||||
|
"buffer-xor": "^1.0.3",
|
||||||
"builtin-status-codes": "^3.0.0",
|
"builtin-status-codes": "^3.0.0",
|
||||||
"bytes": "^3.0.0",
|
"bytes": "^3.0.0",
|
||||||
"buffer": "^5.7.1",
|
|
||||||
"call-bind": "^1.0.2",
|
"call-bind": "^1.0.2",
|
||||||
"callsites": "^3.1.0",
|
"callsites": "^3.1.0",
|
||||||
"caniuse-api": "^3.0.0",
|
"caniuse-api": "^3.0.0",
|
||||||
"caseless": "^0.12.0",
|
|
||||||
"caniuse-lite": "^1.0.30001269",
|
"caniuse-lite": "^1.0.30001269",
|
||||||
|
"caseless": "^0.12.0",
|
||||||
"chalk": "^4.1.2",
|
"chalk": "^4.1.2",
|
||||||
"chrome-trace-event": "^1.0.3",
|
"chrome-trace-event": "^1.0.3",
|
||||||
"cli-cursor": "^3.1.0",
|
|
||||||
"cipher-base": "^1.0.4",
|
"cipher-base": "^1.0.4",
|
||||||
|
"cli-cursor": "^3.1.0",
|
||||||
"cli-spinners": "^2.6.1",
|
"cli-spinners": "^2.6.1",
|
||||||
|
"clone": "^2.1.2",
|
||||||
"color-convert": "^2.0.1",
|
"color-convert": "^2.0.1",
|
||||||
"color-name": "^1.1.4",
|
"color-name": "^1.1.4",
|
||||||
"clone": "^2.1.2",
|
|
||||||
"colord": "^2.8.0",
|
"colord": "^2.8.0",
|
||||||
"command-exists": "^1.2.9",
|
|
||||||
"combined-stream": "^1.0.8",
|
"combined-stream": "^1.0.8",
|
||||||
"concat-map": "^0.0.1",
|
"command-exists": "^1.2.9",
|
||||||
"commander": "^7.2.0",
|
"commander": "^7.2.0",
|
||||||
|
"concat-map": "^0.0.1",
|
||||||
"connect": "^3.7.0",
|
"connect": "^3.7.0",
|
||||||
"console-browserify": "^1.2.0",
|
"console-browserify": "^1.2.0",
|
||||||
"constants-browserify": "^1.0.0",
|
"constants-browserify": "^1.0.0",
|
||||||
|
|
@ -80,22 +81,22 @@
|
||||||
"core-js": "^3.18.3",
|
"core-js": "^3.18.3",
|
||||||
"core-util-is": "^1.0.3",
|
"core-util-is": "^1.0.3",
|
||||||
"cosmiconfig": "^7.0.1",
|
"cosmiconfig": "^7.0.1",
|
||||||
"create-hash": "^1.2.0",
|
|
||||||
"create-ecdh": "^4.0.4",
|
"create-ecdh": "^4.0.4",
|
||||||
|
"create-hash": "^1.2.0",
|
||||||
"create-hmac": "^1.1.7",
|
"create-hmac": "^1.1.7",
|
||||||
"cross-spawn": "^6.0.5",
|
"cross-spawn": "^6.0.5",
|
||||||
"crypto-browserify": "^3.12.0",
|
"crypto-browserify": "^3.12.0",
|
||||||
"css-color-names": "^1.0.1",
|
"css-color-names": "^1.0.1",
|
||||||
"css-declaration-sorter": "^6.1.3",
|
"css-declaration-sorter": "^6.1.3",
|
||||||
"css-modules-loader-core": "^1.1.0",
|
"css-modules-loader-core": "^1.1.0",
|
||||||
"css-selector-tokenizer": "^0.7.3",
|
|
||||||
"css-select": "^4.1.3",
|
"css-select": "^4.1.3",
|
||||||
"css-what": "^5.1.0",
|
"css-selector-tokenizer": "^0.7.3",
|
||||||
"css-tree": "^1.1.3",
|
"css-tree": "^1.1.3",
|
||||||
|
"css-what": "^5.1.0",
|
||||||
"cssesc": "^3.0.0",
|
"cssesc": "^3.0.0",
|
||||||
"cssnano": "^5.0.8",
|
"cssnano": "^5.0.8",
|
||||||
"cssnano-utils": "^2.0.1",
|
|
||||||
"cssnano-preset-default": "^5.1.4",
|
"cssnano-preset-default": "^5.1.4",
|
||||||
|
"cssnano-utils": "^2.0.1",
|
||||||
"csso": "^4.2.0",
|
"csso": "^4.2.0",
|
||||||
"cssom": "^0.3.8",
|
"cssom": "^0.3.8",
|
||||||
"cssstyle": "^1.4.0",
|
"cssstyle": "^1.4.0",
|
||||||
|
|
@ -107,18 +108,17 @@
|
||||||
"define-properties": "^1.1.3",
|
"define-properties": "^1.1.3",
|
||||||
"delayed-stream": "^1.0.0",
|
"delayed-stream": "^1.0.0",
|
||||||
"des.js": "^1.0.1",
|
"des.js": "^1.0.1",
|
||||||
|
"detect-libc": "^1.0.3",
|
||||||
|
"diffie-hellman": "^5.0.3",
|
||||||
"dir-glob": "^3.0.1",
|
"dir-glob": "^3.0.1",
|
||||||
"dom-serializer": "^1.3.2",
|
"dom-serializer": "^1.3.2",
|
||||||
"buffer-xor": "^1.0.3",
|
|
||||||
"diffie-hellman": "^5.0.3",
|
|
||||||
"detect-libc": "^1.0.3",
|
|
||||||
"domutils": "^2.8.0",
|
|
||||||
"domain-browser": "^3.5.0",
|
"domain-browser": "^3.5.0",
|
||||||
|
"domelementtype": "^2.2.0",
|
||||||
"domexception": "^1.0.1",
|
"domexception": "^1.0.1",
|
||||||
"domhandler": "^4.2.2",
|
"domhandler": "^4.2.2",
|
||||||
"domelementtype": "^2.2.0",
|
"domutils": "^2.8.0",
|
||||||
"dotenv-expand": "^5.1.0",
|
|
||||||
"dotenv": "^7.0.0",
|
"dotenv": "^7.0.0",
|
||||||
|
"dotenv-expand": "^5.1.0",
|
||||||
"ecc-jsbn": "^0.1.2",
|
"ecc-jsbn": "^0.1.2",
|
||||||
"ee-first": "^1.1.1",
|
"ee-first": "^1.1.1",
|
||||||
"ejs": "^3.1.6",
|
"ejs": "^3.1.6",
|
||||||
|
|
@ -134,8 +134,8 @@
|
||||||
"es-to-primitive": "^1.2.1",
|
"es-to-primitive": "^1.2.1",
|
||||||
"es6-object-assign": "^1.1.0",
|
"es6-object-assign": "^1.1.0",
|
||||||
"escalade": "^3.1.1",
|
"escalade": "^3.1.1",
|
||||||
"escape-string-regexp": "^1.0.5",
|
|
||||||
"escape-html": "^1.0.3",
|
"escape-html": "^1.0.3",
|
||||||
|
"escape-string-regexp": "^1.0.5",
|
||||||
"escodegen": "^1.14.3",
|
"escodegen": "^1.14.3",
|
||||||
"esprima": "^4.0.1",
|
"esprima": "^4.0.1",
|
||||||
"estraverse": "^4.3.0",
|
"estraverse": "^4.3.0",
|
||||||
|
|
@ -150,24 +150,24 @@
|
||||||
"fast-json-stable-stringify": "^2.1.0",
|
"fast-json-stable-stringify": "^2.1.0",
|
||||||
"fast-levenshtein": "^2.0.6",
|
"fast-levenshtein": "^2.0.6",
|
||||||
"fast-url-parser": "^1.1.3",
|
"fast-url-parser": "^1.1.3",
|
||||||
"fastparse": "^1.1.2",
|
|
||||||
"fastest-levenshtein": "^1.0.12",
|
"fastest-levenshtein": "^1.0.12",
|
||||||
|
"fastparse": "^1.1.2",
|
||||||
|
"fastq": "^1.13.0",
|
||||||
"fault": "^1.0.4",
|
"fault": "^1.0.4",
|
||||||
"filelist": "^1.0.2",
|
"filelist": "^1.0.2",
|
||||||
"fastq": "^1.13.0",
|
|
||||||
"fill-range": "^7.0.1",
|
|
||||||
"filesize": "^6.4.0",
|
"filesize": "^6.4.0",
|
||||||
|
"fill-range": "^7.0.1",
|
||||||
"finalhandler": "^1.1.2",
|
"finalhandler": "^1.1.2",
|
||||||
"foreach": "^2.0.5",
|
|
||||||
"form-data": "^2.3.3",
|
|
||||||
"follow-redirects": "^1.14.4",
|
"follow-redirects": "^1.14.4",
|
||||||
|
"foreach": "^2.0.5",
|
||||||
"forever-agent": "^0.6.1",
|
"forever-agent": "^0.6.1",
|
||||||
|
"form-data": "^2.3.3",
|
||||||
"format": "^0.2.2",
|
"format": "^0.2.2",
|
||||||
"fs.realpath": "^1.0.0",
|
"fs.realpath": "^1.0.0",
|
||||||
"function-bind": "^1.1.1",
|
"function-bind": "^1.1.1",
|
||||||
"get-intrinsic": "^1.1.1",
|
|
||||||
"gensync": "^1.0.0-beta.2",
|
|
||||||
"generic-names": "^2.0.1",
|
"generic-names": "^2.0.1",
|
||||||
|
"gensync": "^1.0.0-beta.2",
|
||||||
|
"get-intrinsic": "^1.1.1",
|
||||||
"get-port": "^4.2.0",
|
"get-port": "^4.2.0",
|
||||||
"get-symbol-description": "^1.0.0",
|
"get-symbol-description": "^1.0.0",
|
||||||
"getpass": "^0.1.7",
|
"getpass": "^0.1.7",
|
||||||
|
|
@ -186,29 +186,29 @@
|
||||||
"has-tostringtag": "^1.0.0",
|
"has-tostringtag": "^1.0.0",
|
||||||
"hash-base": "^3.1.0",
|
"hash-base": "^3.1.0",
|
||||||
"hash.js": "^1.1.7",
|
"hash.js": "^1.1.7",
|
||||||
"hmac-drbg": "^1.0.1",
|
|
||||||
"highlight.js": "^10.4.1",
|
"highlight.js": "^10.4.1",
|
||||||
|
"hmac-drbg": "^1.0.1",
|
||||||
"html-encoding-sniffer": "^1.0.2",
|
"html-encoding-sniffer": "^1.0.2",
|
||||||
"html-tags": "^1.2.0",
|
"html-tags": "^1.2.0",
|
||||||
"htmlnano": "^1.1.1",
|
"htmlnano": "^1.1.1",
|
||||||
"htmlparser2": "^7.1.2",
|
"htmlparser2": "^7.1.2",
|
||||||
"http-proxy": "^1.18.1",
|
"http-proxy": "^1.18.1",
|
||||||
"http-signature": "^1.2.0",
|
|
||||||
"http-proxy-middleware": "^1.3.1",
|
"http-proxy-middleware": "^1.3.1",
|
||||||
"iconv-lite": "^0.4.24",
|
"http-signature": "^1.2.0",
|
||||||
"https-browserify": "^1.0.0",
|
"https-browserify": "^1.0.0",
|
||||||
|
"iconv-lite": "^0.4.24",
|
||||||
"icss-replace-symbols": "^1.1.0",
|
"icss-replace-symbols": "^1.1.0",
|
||||||
"ieee754": "^1.2.1",
|
|
||||||
"icss-utils": "^4.1.1",
|
"icss-utils": "^4.1.1",
|
||||||
|
"ieee754": "^1.2.1",
|
||||||
"iferr": "^1.0.2",
|
"iferr": "^1.0.2",
|
||||||
"ignore": "^5.1.8",
|
"ignore": "^5.1.8",
|
||||||
"import-fresh": "^3.3.0",
|
"import-fresh": "^3.3.0",
|
||||||
"inflight": "^1.0.6",
|
|
||||||
"indexes-of": "^1.0.1",
|
|
||||||
"imurmurhash": "^0.1.4",
|
"imurmurhash": "^0.1.4",
|
||||||
|
"indexes-of": "^1.0.1",
|
||||||
|
"inflight": "^1.0.6",
|
||||||
"inherits": "^2.0.4",
|
"inherits": "^2.0.4",
|
||||||
"is-absolute-url": "^3.0.3",
|
|
||||||
"internal-slot": "^1.0.3",
|
"internal-slot": "^1.0.3",
|
||||||
|
"is-absolute-url": "^3.0.3",
|
||||||
"is-arguments": "^1.1.1",
|
"is-arguments": "^1.1.1",
|
||||||
"is-arrayish": "^0.2.1",
|
"is-arrayish": "^0.2.1",
|
||||||
"is-bigint": "^1.0.4",
|
"is-bigint": "^1.0.4",
|
||||||
|
|
@ -219,8 +219,8 @@
|
||||||
"is-extglob": "^2.1.1",
|
"is-extglob": "^2.1.1",
|
||||||
"is-fullwidth-code-point": "^3.0.0",
|
"is-fullwidth-code-point": "^3.0.0",
|
||||||
"is-generator-function": "^1.0.10",
|
"is-generator-function": "^1.0.10",
|
||||||
"is-html": "^1.1.0",
|
|
||||||
"is-glob": "^4.0.3",
|
"is-glob": "^4.0.3",
|
||||||
|
"is-html": "^1.1.0",
|
||||||
"is-interactive": "^1.0.0",
|
"is-interactive": "^1.0.0",
|
||||||
"is-json": "^2.0.1",
|
"is-json": "^2.0.1",
|
||||||
"is-nan": "^1.3.2",
|
"is-nan": "^1.3.2",
|
||||||
|
|
@ -242,9 +242,9 @@
|
||||||
"isarray": "^1.0.0",
|
"isarray": "^1.0.0",
|
||||||
"isexe": "^2.0.0",
|
"isexe": "^2.0.0",
|
||||||
"isstream": "^0.1.2",
|
"isstream": "^0.1.2",
|
||||||
|
"jake": "^10.8.2",
|
||||||
"js-tokens": "^4.0.0",
|
"js-tokens": "^4.0.0",
|
||||||
"jsbn": "^0.1.1",
|
"jsbn": "^0.1.1",
|
||||||
"jake": "^10.8.2",
|
|
||||||
"jsdom": "^14.1.0",
|
"jsdom": "^14.1.0",
|
||||||
"jsesc": "^2.5.2",
|
"jsesc": "^2.5.2",
|
||||||
"json-parse-even-better-errors": "^2.3.1",
|
"json-parse-even-better-errors": "^2.3.1",
|
||||||
|
|
@ -253,8 +253,8 @@
|
||||||
"json-source-map": "^0.6.1",
|
"json-source-map": "^0.6.1",
|
||||||
"json-stringify-safe": "^5.0.1",
|
"json-stringify-safe": "^5.0.1",
|
||||||
"json5": "^1.0.1",
|
"json5": "^1.0.1",
|
||||||
"levn": "^0.3.0",
|
|
||||||
"jsprim": "^1.4.1",
|
"jsprim": "^1.4.1",
|
||||||
|
"levn": "^0.3.0",
|
||||||
"lilconfig": "^2.0.3",
|
"lilconfig": "^2.0.3",
|
||||||
"lines-and-columns": "^1.1.6",
|
"lines-and-columns": "^1.1.6",
|
||||||
"lmdb-store": "^1.6.9",
|
"lmdb-store": "^1.6.9",
|
||||||
|
|
@ -269,23 +269,23 @@
|
||||||
"lowlight": "^1.17.0",
|
"lowlight": "^1.17.0",
|
||||||
"lru-cache": "^6.0.0",
|
"lru-cache": "^6.0.0",
|
||||||
"md5.js": "^1.3.5",
|
"md5.js": "^1.3.5",
|
||||||
"merge2": "^1.4.1",
|
|
||||||
"mdn-data": "^2.0.14",
|
"mdn-data": "^2.0.14",
|
||||||
|
"merge2": "^1.4.1",
|
||||||
"micromatch": "^4.0.4",
|
"micromatch": "^4.0.4",
|
||||||
|
"miller-rabin": "^4.0.1",
|
||||||
"mime-db": "^1.33.0",
|
"mime-db": "^1.33.0",
|
||||||
"mime-types": "^2.1.18",
|
"mime-types": "^2.1.18",
|
||||||
"miller-rabin": "^4.0.1",
|
|
||||||
"mimic-fn": "^2.1.0",
|
"mimic-fn": "^2.1.0",
|
||||||
"minimalistic-assert": "^1.0.1",
|
"minimalistic-assert": "^1.0.1",
|
||||||
"minimalistic-crypto-utils": "^1.0.1",
|
"minimalistic-crypto-utils": "^1.0.1",
|
||||||
"minimatch": "^3.0.4",
|
"minimatch": "^3.0.4",
|
||||||
"minimist": "^1.2.5",
|
"minimist": "^1.2.5",
|
||||||
|
"mkdirp": "^0.5.5",
|
||||||
"ms": "^2.1.2",
|
"ms": "^2.1.2",
|
||||||
"msgpackr": "^1.4.7",
|
"msgpackr": "^1.4.7",
|
||||||
"msgpackr-extract": "^1.0.14",
|
"msgpackr-extract": "^1.0.14",
|
||||||
"mkdirp": "^0.5.5",
|
|
||||||
"nanocolors": "^0.1.12",
|
|
||||||
"nan": "^2.15.0",
|
"nan": "^2.15.0",
|
||||||
|
"nanocolors": "^0.1.12",
|
||||||
"nanoid": "^3.1.30",
|
"nanoid": "^3.1.30",
|
||||||
"ncp": "^2.0.0",
|
"ncp": "^2.0.0",
|
||||||
"nice-try": "^1.0.5",
|
"nice-try": "^1.0.5",
|
||||||
|
|
@ -294,8 +294,8 @@
|
||||||
"node-gyp-build": "^4.3.0",
|
"node-gyp-build": "^4.3.0",
|
||||||
"node-releases": "^2.0.0",
|
"node-releases": "^2.0.0",
|
||||||
"normalize-url": "^6.1.0",
|
"normalize-url": "^6.1.0",
|
||||||
"nullthrows": "^1.1.1",
|
|
||||||
"nth-check": "^2.0.1",
|
"nth-check": "^2.0.1",
|
||||||
|
"nullthrows": "^1.1.1",
|
||||||
"nwsapi": "^2.2.0",
|
"nwsapi": "^2.2.0",
|
||||||
"oauth-sign": "^0.9.0",
|
"oauth-sign": "^0.9.0",
|
||||||
"object-inspect": "^1.11.0",
|
"object-inspect": "^1.11.0",
|
||||||
|
|
@ -303,8 +303,8 @@
|
||||||
"object-keys": "^1.1.1",
|
"object-keys": "^1.1.1",
|
||||||
"object.assign": "^4.1.2",
|
"object.assign": "^4.1.2",
|
||||||
"on-finished": "^2.3.0",
|
"on-finished": "^2.3.0",
|
||||||
"onetime": "^5.1.2",
|
|
||||||
"once": "^1.4.0",
|
"once": "^1.4.0",
|
||||||
|
"onetime": "^5.1.2",
|
||||||
"open": "^7.4.2",
|
"open": "^7.4.2",
|
||||||
"optionator": "^0.8.3",
|
"optionator": "^0.8.3",
|
||||||
"ora": "^5.4.1",
|
"ora": "^5.4.1",
|
||||||
|
|
@ -314,8 +314,8 @@
|
||||||
"parent-module": "^1.0.1",
|
"parent-module": "^1.0.1",
|
||||||
"parse-asn1": "^5.1.6",
|
"parse-asn1": "^5.1.6",
|
||||||
"parse-json": "^5.2.0",
|
"parse-json": "^5.2.0",
|
||||||
"parseurl": "^1.3.3",
|
|
||||||
"parse5": "^5.1.0",
|
"parse5": "^5.1.0",
|
||||||
|
"parseurl": "^1.3.3",
|
||||||
"path-browserify": "^1.0.1",
|
"path-browserify": "^1.0.1",
|
||||||
"path-is-absolute": "^1.0.1",
|
"path-is-absolute": "^1.0.1",
|
||||||
"path-is-inside": "^1.0.2",
|
"path-is-inside": "^1.0.2",
|
||||||
|
|
@ -326,8 +326,8 @@
|
||||||
"performance-now": "^2.1.0",
|
"performance-now": "^2.1.0",
|
||||||
"picocolors": "^1.0.0",
|
"picocolors": "^1.0.0",
|
||||||
"picomatch": "^2.3.0",
|
"picomatch": "^2.3.0",
|
||||||
"postcss": "^8.3.9",
|
|
||||||
"pn": "^1.1.0",
|
"pn": "^1.1.0",
|
||||||
|
"postcss": "^8.3.9",
|
||||||
"postcss-calc": "^8.0.0",
|
"postcss-calc": "^8.0.0",
|
||||||
"postcss-colormin": "^5.2.0",
|
"postcss-colormin": "^5.2.0",
|
||||||
"postcss-convert-values": "^5.0.1",
|
"postcss-convert-values": "^5.0.1",
|
||||||
|
|
@ -336,8 +336,8 @@
|
||||||
"postcss-discard-empty": "^5.0.1",
|
"postcss-discard-empty": "^5.0.1",
|
||||||
"postcss-discard-overridden": "^5.0.1",
|
"postcss-discard-overridden": "^5.0.1",
|
||||||
"postcss-merge-longhand": "^5.0.2",
|
"postcss-merge-longhand": "^5.0.2",
|
||||||
"postcss-minify-font-values": "^5.0.1",
|
|
||||||
"postcss-merge-rules": "^5.0.2",
|
"postcss-merge-rules": "^5.0.2",
|
||||||
|
"postcss-minify-font-values": "^5.0.1",
|
||||||
"postcss-minify-gradients": "^5.0.2",
|
"postcss-minify-gradients": "^5.0.2",
|
||||||
"postcss-minify-params": "^5.0.1",
|
"postcss-minify-params": "^5.0.1",
|
||||||
"postcss-minify-selectors": "^5.1.0",
|
"postcss-minify-selectors": "^5.1.0",
|
||||||
|
|
@ -348,41 +348,41 @@
|
||||||
"postcss-modules-values": "^1.3.0",
|
"postcss-modules-values": "^1.3.0",
|
||||||
"postcss-normalize-charset": "^5.0.1",
|
"postcss-normalize-charset": "^5.0.1",
|
||||||
"postcss-normalize-display-values": "^5.0.1",
|
"postcss-normalize-display-values": "^5.0.1",
|
||||||
|
"postcss-normalize-positions": "^5.0.1",
|
||||||
"postcss-normalize-repeat-style": "^5.0.1",
|
"postcss-normalize-repeat-style": "^5.0.1",
|
||||||
"postcss-normalize-string": "^5.0.1",
|
"postcss-normalize-string": "^5.0.1",
|
||||||
"postcss-normalize-positions": "^5.0.1",
|
|
||||||
"postcss-normalize-timing-functions": "^5.0.1",
|
"postcss-normalize-timing-functions": "^5.0.1",
|
||||||
"postcss-normalize-unicode": "^5.0.1",
|
"postcss-normalize-unicode": "^5.0.1",
|
||||||
"postcss-normalize-url": "^5.0.2",
|
"postcss-normalize-url": "^5.0.2",
|
||||||
"postcss-normalize-whitespace": "^5.0.1",
|
"postcss-normalize-whitespace": "^5.0.1",
|
||||||
"postcss-ordered-values": "^5.0.2",
|
"postcss-ordered-values": "^5.0.2",
|
||||||
"postcss-reduce-initial": "^5.0.1",
|
"postcss-reduce-initial": "^5.0.1",
|
||||||
"postcss-selector-parser": "^6.0.6",
|
|
||||||
"postcss-reduce-transforms": "^5.0.1",
|
"postcss-reduce-transforms": "^5.0.1",
|
||||||
"postcss-unique-selectors": "^5.0.1",
|
"postcss-selector-parser": "^6.0.6",
|
||||||
"postcss-svgo": "^5.0.2",
|
"postcss-svgo": "^5.0.2",
|
||||||
"posthtml": "^0.16.5",
|
"postcss-unique-selectors": "^5.0.1",
|
||||||
"postcss-value-parser": "^4.1.0",
|
"postcss-value-parser": "^4.1.0",
|
||||||
"posthtml-render": "^3.0.0",
|
"posthtml": "^0.16.5",
|
||||||
"posthtml-parser": "^0.10.1",
|
"posthtml-parser": "^0.10.1",
|
||||||
|
"posthtml-render": "^3.0.0",
|
||||||
"prelude-ls": "^1.1.2",
|
"prelude-ls": "^1.1.2",
|
||||||
"process": "^0.11.10",
|
"process": "^0.11.10",
|
||||||
"process-nextick-args": "^2.0.1",
|
"process-nextick-args": "^2.0.1",
|
||||||
"psl": "^1.8.0",
|
"psl": "^1.8.0",
|
||||||
"punycode": "^1.4.1",
|
|
||||||
"public-encrypt": "^4.0.3",
|
"public-encrypt": "^4.0.3",
|
||||||
"qs": "^6.5.2",
|
"punycode": "^1.4.1",
|
||||||
"purgecss": "^4.0.3",
|
"purgecss": "^4.0.3",
|
||||||
"querystring-es3": "^0.2.1",
|
"qs": "^6.5.2",
|
||||||
"querystring": "^0.2.0",
|
"querystring": "^0.2.0",
|
||||||
"randombytes": "^2.1.0",
|
"querystring-es3": "^0.2.1",
|
||||||
"queue-microtask": "^1.2.3",
|
"queue-microtask": "^1.2.3",
|
||||||
|
"randombytes": "^2.1.0",
|
||||||
"randomfill": "^1.0.4",
|
"randomfill": "^1.0.4",
|
||||||
"range-parser": "^1.2.0",
|
"range-parser": "^1.2.0",
|
||||||
"react-refresh": "^0.9.0",
|
"react-refresh": "^0.9.0",
|
||||||
"readable-stream": "^2.3.7",
|
"readable-stream": "^2.3.7",
|
||||||
"relateurl": "^0.2.7",
|
|
||||||
"regenerator-runtime": "^0.13.9",
|
"regenerator-runtime": "^0.13.9",
|
||||||
|
"relateurl": "^0.2.7",
|
||||||
"request": "^2.88.2",
|
"request": "^2.88.2",
|
||||||
"request-promise-core": "^1.1.4",
|
"request-promise-core": "^1.1.4",
|
||||||
"request-promise-native": "^1.0.9",
|
"request-promise-native": "^1.0.9",
|
||||||
|
|
@ -399,8 +399,8 @@
|
||||||
"semver": "^5.7.1",
|
"semver": "^5.7.1",
|
||||||
"serve-handler": "^6.1.3",
|
"serve-handler": "^6.1.3",
|
||||||
"setimmediate": "^1.0.5",
|
"setimmediate": "^1.0.5",
|
||||||
"shebang-command": "^1.2.0",
|
|
||||||
"sha.js": "^2.4.11",
|
"sha.js": "^2.4.11",
|
||||||
|
"shebang-command": "^1.2.0",
|
||||||
"shebang-regex": "^1.0.0",
|
"shebang-regex": "^1.0.0",
|
||||||
"side-channel": "^1.0.4",
|
"side-channel": "^1.0.4",
|
||||||
"signal-exit": "^3.0.5",
|
"signal-exit": "^3.0.5",
|
||||||
|
|
@ -410,23 +410,23 @@
|
||||||
"source-map-js": "^0.6.2",
|
"source-map-js": "^0.6.2",
|
||||||
"source-map-support": "^0.5.20",
|
"source-map-support": "^0.5.20",
|
||||||
"split2": "^3.2.2",
|
"split2": "^3.2.2",
|
||||||
"sshpk": "^1.16.1",
|
|
||||||
"srcset": "^4.0.0",
|
"srcset": "^4.0.0",
|
||||||
|
"sshpk": "^1.16.1",
|
||||||
"stable": "^0.1.8",
|
"stable": "^0.1.8",
|
||||||
"stealthy-require": "^1.1.1",
|
|
||||||
"statuses": "^1.5.0",
|
"statuses": "^1.5.0",
|
||||||
|
"stealthy-require": "^1.1.1",
|
||||||
"stream-browserify": "^3.0.0",
|
"stream-browserify": "^3.0.0",
|
||||||
"stream-http": "^3.2.0",
|
"stream-http": "^3.2.0",
|
||||||
|
"string_decoder": "^1.3.0",
|
||||||
|
"string-hash": "^1.1.3",
|
||||||
"string-width": "^4.2.3",
|
"string-width": "^4.2.3",
|
||||||
"string.prototype.trimend": "^1.0.4",
|
"string.prototype.trimend": "^1.0.4",
|
||||||
"string.prototype.trimstart": "^1.0.4",
|
"string.prototype.trimstart": "^1.0.4",
|
||||||
"string-hash": "^1.1.3",
|
|
||||||
"string_decoder": "^1.3.0",
|
|
||||||
"strip-ansi": "^6.0.1",
|
"strip-ansi": "^6.0.1",
|
||||||
"stylehacks": "^5.0.1",
|
"stylehacks": "^5.0.1",
|
||||||
"supports-color": "^7.2.0",
|
"supports-color": "^7.2.0",
|
||||||
"svgo": "^2.7.0",
|
|
||||||
"supports-hyperlinks": "^2.2.0",
|
"supports-hyperlinks": "^2.2.0",
|
||||||
|
"svgo": "^2.7.0",
|
||||||
"symbol-tree": "^3.2.4",
|
"symbol-tree": "^3.2.4",
|
||||||
"term-size": "^2.2.1",
|
"term-size": "^2.2.1",
|
||||||
"terminal-link": "^2.1.1",
|
"terminal-link": "^2.1.1",
|
||||||
|
|
@ -436,26 +436,26 @@
|
||||||
"to-fast-properties": "^2.0.0",
|
"to-fast-properties": "^2.0.0",
|
||||||
"to-regex-range": "^5.0.1",
|
"to-regex-range": "^5.0.1",
|
||||||
"tough-cookie": "^2.5.0",
|
"tough-cookie": "^2.5.0",
|
||||||
"tty-browserify": "^0.0.1",
|
|
||||||
"tr46": "^1.0.1",
|
"tr46": "^1.0.1",
|
||||||
|
"tty-browserify": "^0.0.1",
|
||||||
"tunnel-agent": "^0.6.0",
|
"tunnel-agent": "^0.6.0",
|
||||||
"tweetnacl": "^0.14.5",
|
"tweetnacl": "^0.14.5",
|
||||||
"type-fest": "^0.20.2",
|
|
||||||
"type-check": "^0.3.2",
|
"type-check": "^0.3.2",
|
||||||
|
"type-fest": "^0.20.2",
|
||||||
"unbox-primitive": "^1.0.1",
|
"unbox-primitive": "^1.0.1",
|
||||||
"uncss": "^0.17.3",
|
"uncss": "^0.17.3",
|
||||||
"uniq": "^1.0.1",
|
"uniq": "^1.0.1",
|
||||||
"uniqs": "^2.0.0",
|
"uniqs": "^2.0.0",
|
||||||
"uri-js": "^4.4.1",
|
|
||||||
"unpipe": "^1.0.0",
|
"unpipe": "^1.0.0",
|
||||||
|
"uri-js": "^4.4.1",
|
||||||
"url": "^0.11.0",
|
"url": "^0.11.0",
|
||||||
"util": "^0.12.4",
|
"util": "^0.12.4",
|
||||||
"util-deprecate": "^1.0.2",
|
"util-deprecate": "^1.0.2",
|
||||||
"utility-types": "^3.10.0",
|
"utility-types": "^3.10.0",
|
||||||
"utils-merge": "^1.0.1",
|
"utils-merge": "^1.0.1",
|
||||||
"uuid": "^3.4.0",
|
"uuid": "^3.4.0",
|
||||||
"vendors": "^1.0.4",
|
|
||||||
"v8-compile-cache": "^2.3.0",
|
"v8-compile-cache": "^2.3.0",
|
||||||
|
"vendors": "^1.0.4",
|
||||||
"verror": "^1.10.0",
|
"verror": "^1.10.0",
|
||||||
"vm-browserify": "^1.1.2",
|
"vm-browserify": "^1.1.2",
|
||||||
"w3c-hr-time": "^1.0.2",
|
"w3c-hr-time": "^1.0.2",
|
||||||
|
|
@ -463,12 +463,12 @@
|
||||||
"wcwidth": "^1.0.1",
|
"wcwidth": "^1.0.1",
|
||||||
"weak-lru-cache": "^1.1.3",
|
"weak-lru-cache": "^1.1.3",
|
||||||
"webidl-conversions": "^4.0.2",
|
"webidl-conversions": "^4.0.2",
|
||||||
"whatwg-mimetype": "^2.3.0",
|
|
||||||
"whatwg-encoding": "^1.0.5",
|
"whatwg-encoding": "^1.0.5",
|
||||||
|
"whatwg-mimetype": "^2.3.0",
|
||||||
"whatwg-url": "^7.1.0",
|
"whatwg-url": "^7.1.0",
|
||||||
"which": "^1.3.1",
|
"which": "^1.3.1",
|
||||||
"which-typed-array": "^1.1.7",
|
|
||||||
"which-boxed-primitive": "^1.0.2",
|
"which-boxed-primitive": "^1.0.2",
|
||||||
|
"which-typed-array": "^1.1.7",
|
||||||
"word-wrap": "^1.2.3",
|
"word-wrap": "^1.2.3",
|
||||||
"wrap-ansi": "^7.0.0",
|
"wrap-ansi": "^7.0.0",
|
||||||
"wrappy": "^1.0.2",
|
"wrappy": "^1.0.2",
|
||||||
|
|
|
||||||
19
planets.html
19
planets.html
|
|
@ -1,13 +1,16 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link rel="stylesheet" href="styles/style.css">
|
<link rel="stylesheet" href="styles/style.css">
|
||||||
|
<script src="scripts/planets.js" type="module" defer></script>
|
||||||
<title>Planets</title>
|
<title>Planets</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
|
||||||
|
<body id="planets">
|
||||||
<section class="titre"><a href="index.html">STAR WARS</a></section>
|
<section class="titre"><a href="index.html">STAR WARS</a></section>
|
||||||
<section class="sec-menu">
|
<section class="sec-menu">
|
||||||
<nav class="nav-menu">
|
<nav class="nav-menu">
|
||||||
|
|
@ -19,5 +22,19 @@
|
||||||
</nav>
|
</nav>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<section id="recherche">
|
||||||
|
<form action="" id="formRecherche" onSubmit="event.preventDefault(); console.log('click')">
|
||||||
|
<label for="textRecherche">Recherche : </label>
|
||||||
|
<input type="text" name="textRecherche" id="textRecherche">
|
||||||
|
<input type="submit" value="ok">
|
||||||
|
</form>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="resultats" class="accordeon">
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -0,0 +1,33 @@
|
||||||
|
import { api_call } from './util';
|
||||||
|
|
||||||
|
const films = document.getElementById("resultats");
|
||||||
|
|
||||||
|
const API_URL = "https://swapi.dev/api/films/"; // déclare la localisation de la liste des films
|
||||||
|
|
||||||
|
function remplissage(EPISODES) {
|
||||||
|
console.log(EPISODES);
|
||||||
|
|
||||||
|
for (index in EPISODES.results) {
|
||||||
|
films.innerHTML += `
|
||||||
|
<section class="resultat accordeon_item">
|
||||||
|
<h1 class="accordeon_item_header">${EPISODES.results[index].title}</h1>
|
||||||
|
<div class="accordeon_item_body">
|
||||||
|
<div class="column1">
|
||||||
|
<p class= "episode">Episode : ${EPISODES.results[index].episode_id}</p>
|
||||||
|
<p class= "directeur">Directeur : ${EPISODES.results[index].director}</p>
|
||||||
|
<p class= "producteur">Producteur : ${EPISODES.results[index].producer}</p>
|
||||||
|
<p class= "sortie">Date de Sortie : ${EPISODES.results[index].release_date}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>`
|
||||||
|
}
|
||||||
|
const accordeonItemHeader = document.querySelectorAll(".accordeon_item_header");
|
||||||
|
accordeonItemHeader.forEach(accordeonItemHeader => {
|
||||||
|
accordeonItemHeader.addEventListener("click", event => {
|
||||||
|
accordeonItemHeader.classList.toggle("active");
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
api_call(API_URL, remplissage);
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
import { api_call, API_URL, createPagination } from "./util";
|
||||||
|
|
||||||
|
const PERSONNAGES = document.getElementById("resultats");
|
||||||
|
|
||||||
|
|
||||||
|
class People {
|
||||||
|
constructor(birth_year, eye_colo, gender, hair_color, height, mass, skin_color) {
|
||||||
|
this.birth_year = birth_year;
|
||||||
|
this.eye_colo = eye_colo;
|
||||||
|
this.gender = gender;
|
||||||
|
this.hair_color = hair_color;
|
||||||
|
this.height = height;
|
||||||
|
this.mass = mass;
|
||||||
|
this.skin_color = skin_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
console.log('personnage.js loaded');
|
||||||
|
|
||||||
|
//api_call(API_URL+"/people", console.log);
|
||||||
|
|
||||||
|
// fetch(API_URL+"/people")
|
||||||
|
// .then(response => {
|
||||||
|
// return response.json();
|
||||||
|
// })
|
||||||
|
// .then(jsonResp => {
|
||||||
|
// remplissage(jsonResp);
|
||||||
|
// })
|
||||||
|
// .catch(error => {
|
||||||
|
// console.log(`Erreur lors de l'appel API :
|
||||||
|
// ${error.message}`);
|
||||||
|
// });
|
||||||
|
|
||||||
|
function remplissage(json) {
|
||||||
|
console.log(json.results[0]);
|
||||||
|
|
||||||
|
// api_call(API_URL+ "/planets/1", (response) => {
|
||||||
|
// console.log(response);
|
||||||
|
// NAME.innerText = results[i].name;
|
||||||
|
|
||||||
|
// });
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
PERSONNAGES.innerHTML = '';
|
||||||
|
const PERPAGE = json.results.length;
|
||||||
|
const previousUrl = json.previous;
|
||||||
|
const nextUrl = json.next;
|
||||||
|
console.log(previousUrl);
|
||||||
|
console.log(nextUrl);
|
||||||
|
|
||||||
|
for (let i = 0; i < PERPAGE; i++) {
|
||||||
|
const urlbirth_year = json.results[i].birth_year;
|
||||||
|
const urleye_colo = json.results[i].eye_colo;
|
||||||
|
const urlgender = json.results[i].gender;
|
||||||
|
const urlhair_color = json.results[i].hair_color;
|
||||||
|
const urlheight = json.results[i].height;
|
||||||
|
const urlmass = json.results[i].mass;
|
||||||
|
const urlskin_color = json.results[i].skin_color;
|
||||||
|
const urlname = json.results[i].name;
|
||||||
|
const urlhomeworld = json.results[i].homeworld;
|
||||||
|
const urlfilms = json.results[i].films;
|
||||||
|
|
||||||
|
// const gens = new People(urlbirth_year, urleye_colo, urlgender, urlhair_color, urlmass,urlskin_color);
|
||||||
|
// console.log(gens);
|
||||||
|
//Appel Api pour les planetes :
|
||||||
|
|
||||||
|
|
||||||
|
PERSONNAGES.innerHTML +=
|
||||||
|
`<section class="resultat accordeon_item">
|
||||||
|
<h1 class="accordeon_item_header">${urlname}</h1>
|
||||||
|
<div class="accordeon_item_body">
|
||||||
|
<div class="column1">
|
||||||
|
<div id=annéeNaissance>Année de Naissance : ${urlbirth_year} </div>
|
||||||
|
<div id=couleurYeux> Couleur des Yeux : ${urleye_colo}</div>
|
||||||
|
<div id=genre>Genre : ${urlgender}</div>
|
||||||
|
<div id=couleurCheveux> Couleur des Cheveux : ${urlhair_color} </div>
|
||||||
|
<div id= poids> Poids du personnage : ${urlmass} kg</div>
|
||||||
|
<div id= couleurPeau> Couleur de Peau : ${urlskin_color} </div>
|
||||||
|
</div>
|
||||||
|
<div class="column2"> Planète de Naissance : ${urlhomeworld}</div>
|
||||||
|
<div class="column3"> Film où je suis présent : ${urlfilms}</div>
|
||||||
|
</div>
|
||||||
|
</section>`;
|
||||||
|
|
||||||
|
}
|
||||||
|
//Pagination
|
||||||
|
createPagination(previousUrl, nextUrl, PERSONNAGES, remplissage);
|
||||||
|
|
||||||
|
const accordeonItemHeader = document.querySelectorAll(".accordeon_item_header");
|
||||||
|
accordeonItemHeader.forEach(accordeonItemHeader => {
|
||||||
|
accordeonItemHeader.addEventListener("click", event => {
|
||||||
|
accordeonItemHeader.classList.toggle("active");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
api_call(API_URL + "/people", remplissage);
|
||||||
|
console.log('personnage.js loaded');
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
import { api_call, API_URL, createPagination } from "./util";
|
||||||
|
|
||||||
|
|
||||||
|
const planetes = document.getElementById("resultats");
|
||||||
|
|
||||||
|
|
||||||
|
function remplissage(results) {
|
||||||
|
|
||||||
|
planetes.innerHTML = "";
|
||||||
|
|
||||||
|
const previousUrl = results.previous;
|
||||||
|
const nextUrl = results.next;
|
||||||
|
const tabResults = results.results;
|
||||||
|
|
||||||
|
for (resultPlanet of tabResults) {
|
||||||
|
const nom = resultPlanet.name;
|
||||||
|
const diametre = resultPlanet.diameter;
|
||||||
|
const climate = resultPlanet.climate;
|
||||||
|
const terrain = resultPlanet.terrain;
|
||||||
|
const population = resultPlanet.population;
|
||||||
|
|
||||||
|
const tabResidents = resultPlanet.residents;
|
||||||
|
const tabFilms = resultPlanet.films;
|
||||||
|
|
||||||
|
|
||||||
|
planetes.innerHTML +=
|
||||||
|
`<section class="resultat accordeon_item">
|
||||||
|
<h1 class="accordeon_item_header">${nom}</h1>
|
||||||
|
<div class="accordeon_item_body">
|
||||||
|
<div class="column1">
|
||||||
|
<p>${terrain}</p>
|
||||||
|
<p>${climate}</p>
|
||||||
|
<p>${diametre}Km</p>
|
||||||
|
</div>
|
||||||
|
<div class="column2">${tabResidents}</div>
|
||||||
|
<div class="column3">${tabFilms}</div>
|
||||||
|
</div>
|
||||||
|
</section>`;
|
||||||
|
}
|
||||||
|
|
||||||
|
//Pagination
|
||||||
|
createPagination(previousUrl, nextUrl, planetes, remplissage);
|
||||||
|
|
||||||
|
const accordeonItemHeader = document.querySelectorAll(".accordeon_item_header");
|
||||||
|
accordeonItemHeader.forEach(accordeonItemHeader => {
|
||||||
|
accordeonItemHeader.addEventListener("click", event => {
|
||||||
|
accordeonItemHeader.classList.toggle("active");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
api_call(API_URL + "/planets", remplissage);
|
||||||
|
|
||||||
|
|
||||||
|
console.log('planet.js loaded');
|
||||||
|
|
@ -1,18 +1,82 @@
|
||||||
console.log("util.js loaded");
|
console.log("util.js loaded");
|
||||||
|
|
||||||
const URL = "https://swapi.dev/api";
|
export const API_URL = "https://swapi.dev/api";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Envoie un GET à l'api swappi
|
* Envoie une requête GET à l'api swappi
|
||||||
* @param {string} endpoint l'endpoint à interroger (ex: planets)
|
* @param {string} endpoint l'endpoint à interroger (ex: planets)
|
||||||
* @param {function} callback La fonction qui traitera la réponse JSON en retour
|
* @param {function} callback La fonction qui traitera la réponse JSON en retour
|
||||||
*/
|
*/
|
||||||
const api_call = (endpoint, callback) => {
|
export const api_call = (url, callback) => {
|
||||||
fetch(`${URL}/${endpoint}`)
|
fetch(url)
|
||||||
.then(response => {
|
.then(response => {
|
||||||
return response.json();
|
return response.json();
|
||||||
})
|
})
|
||||||
.then(jsonResp => {
|
.then(jsonResp => {
|
||||||
callback(jsonResp);
|
callback(jsonResp);
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.log(`Erreur lors de l'appel API :
|
||||||
|
${error.message}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Récupère le numéro de la page courante
|
||||||
|
* @param {string} url l'url d'un résultat multipage (qui se termine par ?page=2 par exemple)
|
||||||
|
* @returns Le numéro de la page de l'url
|
||||||
|
*/
|
||||||
|
const getPage = (url) => {
|
||||||
|
tabUrl = url.split('/');
|
||||||
|
pageEgal = tabUrl[tabUrl.length - 1];
|
||||||
|
tabPageEgal = pageEgal.split('=');
|
||||||
|
numeroPage = tabPageEgal[tabPageEgal.length - 1];
|
||||||
|
|
||||||
|
return numeroPage;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Ajoutes des boutons de pagination à un élément
|
||||||
|
* @param {string} prevUrl l'url de la page précédente
|
||||||
|
* @param {string} nextUrl l'url de la page suivante
|
||||||
|
* @param {object} elementParent L'objet parent dans lequel ajouter les boutons
|
||||||
|
*/
|
||||||
|
export const createPagination = (prevUrl, nextUrl, elementParent, remplissage) => {
|
||||||
|
console.log("Url précédente : " + prevUrl);
|
||||||
|
console.log("Url suivante : " + nextUrl);
|
||||||
|
const currentPage = (prevUrl == null ? parseInt(getPage(nextUrl)) - 1 : parseInt(getPage(prevUrl)) + 1);
|
||||||
|
console.log("Page courante : " + currentPage);
|
||||||
|
|
||||||
|
let firstPage = false;
|
||||||
|
let lastPage = false;
|
||||||
|
if (prevUrl == null) firstPage = true;
|
||||||
|
if (nextUrl == null) lastPage = true;
|
||||||
|
let previousButton = `<button id="prevButton">Page précédente</button>`;
|
||||||
|
let currentButton = `<span style="color:#ccc;">${currentPage}</span>`;
|
||||||
|
let nextButton = `<button id="nextButton">Page suivante</button>`;
|
||||||
|
|
||||||
|
elementParent.innerHTML += previousButton;
|
||||||
|
elementParent.innerHTML += currentButton;
|
||||||
|
elementParent.innerHTML += nextButton;
|
||||||
|
|
||||||
|
if(firstPage){
|
||||||
|
document.getElementById("prevButton").hidden = true;
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
document.getElementById("prevButton").hidden = false;
|
||||||
|
}
|
||||||
|
if(lastPage){
|
||||||
|
document.getElementById("nextButton").hidden = true;
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
document.getElementById("nextButton").hidden = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
document.getElementById("prevButton").addEventListener("click", () => {
|
||||||
|
api_call(prevUrl, remplissage);
|
||||||
|
});
|
||||||
|
document.getElementById("nextButton").addEventListener("click", () => {
|
||||||
|
api_call(nextUrl, remplissage);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
150
styles/style.css
150
styles/style.css
|
|
@ -1,3 +1,8 @@
|
||||||
|
:root{
|
||||||
|
--jaune: #ffe81f;
|
||||||
|
--blanc: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'star-wars';
|
font-family: 'star-wars';
|
||||||
src: url("../assets/fonts/Starjedi.ttf");
|
src: url("../assets/fonts/Starjedi.ttf");
|
||||||
|
|
@ -7,25 +12,166 @@
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-family: 'star-wars', serif;
|
font-family: 'star-wars', serif;
|
||||||
|
/* color: var(--blanc); */
|
||||||
|
color: #000;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
button{
|
||||||
|
color: #000;
|
||||||
|
padding: 0.2em;
|
||||||
|
margin: 0.2em;
|
||||||
|
border-color: var(--jaune);
|
||||||
|
border-radius: 3%;
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
background-image: url("../assets/imgs/starry_sky.jpg");
|
||||||
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
form label{
|
||||||
|
margin: 0.5em;
|
||||||
|
color: var(--blanc);
|
||||||
|
}
|
||||||
|
|
||||||
|
form input{
|
||||||
|
border-color: var(--jaune);
|
||||||
|
border-radius: 3%;
|
||||||
|
padding: 0.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.titre a{
|
.titre a{
|
||||||
text-decoration: none;
|
margin-top : 20px;
|
||||||
|
background-color: transparent;
|
||||||
|
width: 25%;
|
||||||
|
content: url("../assets/imgs/titre.png");
|
||||||
|
font-size: xx-large;
|
||||||
|
text-decoration: underline;
|
||||||
|
text-decoration-color: var(--jaune);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sec-menu{
|
||||||
|
margin: 1em;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ul-menu{
|
.ul-menu{
|
||||||
|
display: flex;
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
|
font-size: large;
|
||||||
|
color : var(--blanc);
|
||||||
}
|
}
|
||||||
|
|
||||||
.ul-menu li{
|
.ul-menu li{
|
||||||
display: inline;
|
display: inline;
|
||||||
float: left;
|
color : var(--blanc);
|
||||||
margin: 1em;
|
margin: 1em;
|
||||||
|
font-size: large;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ul-menu li a{
|
.ul-menu li a{
|
||||||
display: block;
|
display: block;
|
||||||
|
color : var(--blanc);
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
font-size: large;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
border-bottom: 2px solid var(--jaune);
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-menu li a:hover{
|
||||||
|
border: 2px solid var(--jaune);
|
||||||
|
/* border-radius: 10%; */
|
||||||
|
}
|
||||||
|
|
||||||
|
#bienvenue{
|
||||||
|
text-align: center;
|
||||||
|
background-color: transparent;
|
||||||
|
font-size: 100px;
|
||||||
|
color :var(--jaune) ;
|
||||||
|
text-decoration: underline;
|
||||||
|
text-decoration-color: var(--jaune) ;
|
||||||
|
}
|
||||||
|
#presentation {
|
||||||
|
text-align: center;
|
||||||
|
background-color: transparent;
|
||||||
|
font-size: 40px;
|
||||||
|
color :var(--jaune)
|
||||||
|
}
|
||||||
|
|
||||||
|
div.image-films {
|
||||||
|
background-color: transparent;
|
||||||
|
width: 30%;
|
||||||
|
content: url("../assets/imgs/mando.png");
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
top: 0px;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.image-charactere {
|
||||||
|
background-color: transparent;
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
top: 0px;
|
||||||
|
z-index: -1;
|
||||||
|
width: 30%;
|
||||||
|
content: url("../assets/imgs/grogu.png");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#reponses-films {
|
||||||
|
color : var(--blanc);
|
||||||
|
float: left;
|
||||||
|
margin-top : 200px;
|
||||||
|
margin-left:-350px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.accordeon {
|
||||||
|
color : #000;
|
||||||
|
margin: 1em;
|
||||||
|
}
|
||||||
|
.accordeon_item{
|
||||||
|
background-color:var(--blanc);
|
||||||
|
margin:2rem 0;
|
||||||
|
border-radius: 1rem;
|
||||||
|
box-shadow: 1px 1px 30px rgb(196, 196, 196) ;
|
||||||
|
padding-top: 5px;
|
||||||
|
}
|
||||||
|
.accordeon_item_header{
|
||||||
|
padding: 0.5rem 1rem 0.5rem 1rem;
|
||||||
|
min-height: 3.5rem;
|
||||||
|
line-height: 1.25rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.accordeon_item_body{
|
||||||
|
max-height: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
transition: max-height 0.2s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.accordeon_item_body_content{
|
||||||
|
color : #000;
|
||||||
|
padding: 1.5rem;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.column1, .column2, .column3{
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.accordeon_item_header.active + .accordeon_item_body{
|
||||||
|
max-height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#planets{
|
||||||
|
background-image: url("../assets/imgs/backgroung_dead_trooper.jpg");
|
||||||
|
background-size: cover;
|
||||||
|
background-position: top;
|
||||||
|
background-attachment: fixed;
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue