bif/java-movieservice
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Excercise 7 done: List studios, alert with details

Browse Source
This commit is contained in:
karl 2019-12-10 15:29:36 +01:00
parent 3bd40b6280
commit 56d8f7fca7
1 changed files with 12 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
MoviesClient/web/index.html
View File

@ -7,7 +7,7 @@
<script> <script>
"use strict"; "use strict";
const MOVIES_RESOURCE_URL = "http://localhost:8080/movieservice/resources/movie"; const STUDIOS_RESOURCE_URL = "http://localhost:8080/movieservice/resources/studio";
const options = { const options = {
mode: "cors", mode: "cors",
@ -17,36 +17,31 @@
} }
}; };
let loadNews = function () { let loadStudioList = function () {
// Studios: ID dranhängen -> 2. Aufruf -> Alert dranhängen fetch(STUDIOS_RESOURCE_URL, options)
fetch(MOVIES_RESOURCE_URL, options)
.then(response => response.json()) .then(response => response.json())
.then(function (moviesList) { .then(function (studioList) {
let html = moviesList.map(movie => document.getElementById("content").innerHTML = studioList.map(studio =>
`<h2>${movie.title}</h2> `<h2>${studio.name} <button onclick="alertStudioDetails(${studio.id})">Get more info</button></h2>`)
<p>${movie.description}</p>
<button onclick="displayDetails(${movie.id})">Get more info</button>`)
.join(""); .join("");
document.getElementById("content").innerHTML = html;
}) })
.catch(error => document.getElementById("content").innerHTML = `Error: ${error}`); .catch(error => document.getElementById("content").innerHTML = `Error: ${error}`);
}; };
let displayDetails = function (id) { let alertStudioDetails = function (id) {
fetch(MOVIES_RESOURCE_URL + "/" + id, options) // TODO: Ugly URL building fetch(STUDIOS_RESOURCE_URL + `/${id}`, options) // TODO: Ugly URL building
.then(response => response.json()) .then(response => response.json())
.then(function (movie) { .then(function (studio) {
alert(movie.length) alert("Country code: " + studio.countrycode + "\n" + "Post code: " + studio.postcode)
}) })
.catch(error => document.getElementById("content").innerHTML = `Error: ${error}`); .catch(error => document.getElementById("content").innerHTML = `Error: ${error}`);
}; };
document.addEventListener("DOMContentLoaded", loadNews); document.addEventListener("DOMContentLoaded", loadStudioList);
</script> </script>
</head> </head>
<body> <body>
<h1>Movies in JavaScript</h1> <h1>Studios</h1>
<div id="content"></div> <div id="content"></div>
</body> </body>
</html> </html>