Data is retrieved from API
This commit is contained in:
@@ -1,8 +1,11 @@
|
||||
package be.naaturel.unluckiest.controllers;
|
||||
|
||||
import be.naaturel.unluckiest.entities.ScoreEntity;
|
||||
import be.naaturel.unluckiest.models.Score;
|
||||
import be.naaturel.unluckiest.repositories.ScoreRepo;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.http.ResponseEntity;
|
||||
import org.springframework.web.bind.annotation.GetMapping;
|
||||
import org.springframework.web.bind.annotation.PostMapping;
|
||||
import org.springframework.web.bind.annotation.RequestBody;
|
||||
import org.springframework.web.bind.annotation.RestController;
|
||||
@@ -10,12 +13,32 @@ import org.springframework.web.bind.annotation.RestController;
|
||||
@RestController
|
||||
public class ScoreController {
|
||||
|
||||
private final ScoreRepo scoreRepo;
|
||||
|
||||
@Autowired
|
||||
public ScoreController(){
|
||||
public ScoreController(ScoreRepo scoreRepo){
|
||||
this.scoreRepo = scoreRepo;
|
||||
}
|
||||
|
||||
@PostMapping("/api/submit")
|
||||
public ResponseEntity<?> register(@RequestBody Score s){
|
||||
return null;
|
||||
public ResponseEntity<?> submit(@RequestBody Score s){
|
||||
|
||||
ScoreEntity se = new ScoreEntity();
|
||||
se.owner = s.getOwner();
|
||||
se.value = s.getValue();
|
||||
|
||||
try{
|
||||
scoreRepo.save(se);
|
||||
} catch (Exception e){
|
||||
return ResponseEntity.internalServerError().build();
|
||||
}
|
||||
|
||||
return ResponseEntity.ok().build();
|
||||
}
|
||||
|
||||
@GetMapping("/api/leaderboard")
|
||||
public ResponseEntity<?> leaderboard(){
|
||||
return ResponseEntity.ok(scoreRepo.findLeaderboard());
|
||||
}
|
||||
|
||||
}
|
||||
@@ -10,4 +10,12 @@ public class Score {
|
||||
this.value = value;
|
||||
}
|
||||
|
||||
public String getOwner(){
|
||||
return this.owner;
|
||||
}
|
||||
|
||||
public int getValue(){
|
||||
return this.value;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
package be.naaturel.unluckiest.repositories;
|
||||
|
||||
import be.naaturel.unluckiest.entities.ScoreEntity;
|
||||
import be.naaturel.unluckiest.models.Score;
|
||||
import org.springframework.data.jpa.repository.JpaRepository;
|
||||
import org.springframework.data.jpa.repository.Query;
|
||||
|
||||
import java.util.List;
|
||||
import java.util.Optional;
|
||||
|
||||
public interface ScoreRepo
|
||||
extends JpaRepository<ScoreEntity, String> {
|
||||
|
||||
@Query(
|
||||
value = "SELECT * FROM Score s HAVING 10;",
|
||||
nativeQuery = true)
|
||||
|
||||
List<ScoreEntity> findLeaderboard();
|
||||
}
|
||||
@@ -7,9 +7,9 @@ sec.cors.authorizedMethods=GET,POST,PUT,DELETE,OPTION
|
||||
sec.cors.authorizedHeader=Authorization,Content-type
|
||||
|
||||
#=============DATABASE=============
|
||||
spring.datasource.url=jdbc:${DB_URL}
|
||||
spring.datasource.username=${DB_USER}
|
||||
spring.datasource.password=${DB_PASSWORD}
|
||||
spring.datasource.url=jdbc:mysql://127.0.0.1:3306/unluckiest_db
|
||||
spring.datasource.username=root
|
||||
spring.datasource.password=
|
||||
|
||||
spring.jpa.database-platform=org.hibernate.dialect.MariaDBDialect
|
||||
spring.jpa.show-sql=true
|
||||
|
||||
1
front/.idea/vcs.xml
generated
1
front/.idea/vcs.xml
generated
@@ -2,5 +2,6 @@
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
<mapping directory="$PROJECT_DIR$/.." vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
@@ -21,7 +21,7 @@ export const options = {
|
||||
app: ({ head, body, assets, nonce, env }) => "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<title>Unluckiest</title>\n\n\t\t<link rel=\"stylesheet\"\n\t\t\t href=\"https://fonts.googleapis.com/css?family=Afacad+Flux\">\n\t\t<style>\n\t\t\tbody {\n\t\t\t\tfont-family: 'Afacad Flux', serif;\n\t\t\t\tfont-size: 48px;\n\t\t\t}\n\t\t</style>\n\n\t\t<meta charset=\"utf-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n\n\t\t<link rel=\"stylesheet\" href=\"" + assets + "/style/app.css\" />\n\t\t<link rel=\"stylesheet\" href=\"" + assets + "/style/menu.css\" />\n\n\t\t<link rel=\"icon\" href=\"" + assets + "/favicon.png\" />\n\n\t\t" + head + "\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\">\n\t\t<div style=\"display: contents\">" + body + "</div>\n\t</body>\n</html>\n",
|
||||
error: ({ status, message }) => "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<title>" + message + "</title>\n\n\t\t<style>\n\t\t\tbody {\n\t\t\t\t--bg: white;\n\t\t\t\t--fg: #222;\n\t\t\t\t--divider: #ccc;\n\t\t\t\tbackground: var(--bg);\n\t\t\t\tcolor: var(--fg);\n\t\t\t\tfont-family:\n\t\t\t\t\tsystem-ui,\n\t\t\t\t\t-apple-system,\n\t\t\t\t\tBlinkMacSystemFont,\n\t\t\t\t\t'Segoe UI',\n\t\t\t\t\tRoboto,\n\t\t\t\t\tOxygen,\n\t\t\t\t\tUbuntu,\n\t\t\t\t\tCantarell,\n\t\t\t\t\t'Open Sans',\n\t\t\t\t\t'Helvetica Neue',\n\t\t\t\t\tsans-serif;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\theight: 100vh;\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.error {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tmax-width: 32rem;\n\t\t\t\tmargin: 0 1rem;\n\t\t\t}\n\n\t\t\t.status {\n\t\t\t\tfont-weight: 200;\n\t\t\t\tfont-size: 3rem;\n\t\t\t\tline-height: 1;\n\t\t\t\tposition: relative;\n\t\t\t\ttop: -0.05rem;\n\t\t\t}\n\n\t\t\t.message {\n\t\t\t\tborder-left: 1px solid var(--divider);\n\t\t\t\tpadding: 0 0 0 1rem;\n\t\t\t\tmargin: 0 0 0 1rem;\n\t\t\t\tmin-height: 2.5rem;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t}\n\n\t\t\t.message h1 {\n\t\t\t\tfont-weight: 400;\n\t\t\t\tfont-size: 1em;\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t@media (prefers-color-scheme: dark) {\n\t\t\t\tbody {\n\t\t\t\t\t--bg: #222;\n\t\t\t\t\t--fg: #ddd;\n\t\t\t\t\t--divider: #666;\n\t\t\t\t}\n\t\t\t}\n\t\t</style>\n\t</head>\n\t<body>\n\t\t<div class=\"error\">\n\t\t\t<span class=\"status\">" + status + "</span>\n\t\t\t<div class=\"message\">\n\t\t\t\t<h1>" + message + "</h1>\n\t\t\t</div>\n\t\t</div>\n\t</body>\n</html>\n"
|
||||
},
|
||||
version_hash: "i17ecb"
|
||||
version_hash: "jr2x5n"
|
||||
};
|
||||
|
||||
export async function get_hooks() {
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
|
||||
{#each scores as score, i}
|
||||
<li class="item">
|
||||
<div class="name"><img src="" alt=""/> {score.playerName} </div><div class="score"> {score.value} pts.</div>
|
||||
<div class="name"><img src="" alt=""/> {score.owner} </div><div class="score"> {score.value} pts.</div>
|
||||
</li>
|
||||
{/each}
|
||||
|
||||
|
||||
31
front/src/lib/stores/requests.ts
Normal file
31
front/src/lib/stores/requests.ts
Normal file
@@ -0,0 +1,31 @@
|
||||
import {scoreStore} from "./scoreStore";
|
||||
import {Score} from "../models/score";
|
||||
|
||||
export async function submitScore(owner: string, value : number){
|
||||
return await handleRequest("http://localhost:8080/api/submit/",
|
||||
{
|
||||
method:"POST",
|
||||
body : JSON.stringify({owner:owner, value:value}),
|
||||
headers: new Headers({'content-type': 'application/json'})
|
||||
});
|
||||
}
|
||||
|
||||
export async function getLeaderboard(){
|
||||
return await handleRequest("http://localhost:8080/api/leaderboard",
|
||||
{ method:"GET" });
|
||||
}
|
||||
|
||||
async function handleRequest(url : string, init : object){
|
||||
return await fetch(url, init)
|
||||
.then(response => {
|
||||
if(response.status === 500) throw new Error(`${response.text()}`);
|
||||
if(!response.ok) throw new Error(`${response.status} : ${response.body}`);
|
||||
return response
|
||||
})
|
||||
.then(response => {
|
||||
return response.json();
|
||||
})
|
||||
.catch(error => {
|
||||
return `Exception: ${error.message}`;
|
||||
});
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
import {writable} from "svelte/store";
|
||||
import {Score} from "../models/score";
|
||||
import {browser} from "$app/environment"
|
||||
import {getLeaderboard} from "./requests";
|
||||
|
||||
let localStorageKey = "scores"
|
||||
|
||||
@@ -8,13 +9,12 @@ function isBrowser() {
|
||||
return typeof window !== 'undefined' && typeof window.localStorage !== 'undefined';
|
||||
}
|
||||
|
||||
function createStore(){
|
||||
function createStore(scores : Score[]){
|
||||
//const storedValue = isBrowser() ? localStorage.getItem(localStorageKey) : null;
|
||||
|
||||
const storedValue = isBrowser() ? localStorage.getItem(localStorageKey) : null;
|
||||
const { set, update, subscribe } = writable<Score[]>(scores);
|
||||
|
||||
const { set, update, subscribe } = writable<Score[]>(!storedValue ? [] : JSON.parse(storedValue));
|
||||
|
||||
if (isBrowser()) subscribe(value => localStorage.setItem(localStorageKey, JSON.stringify(value)));
|
||||
//if (isBrowser()) subscribe(value => localStorage.setItem(localStorageKey, JSON.stringify(value)));
|
||||
|
||||
return {
|
||||
update,
|
||||
@@ -31,4 +31,9 @@ function createStore(){
|
||||
};
|
||||
}
|
||||
|
||||
export const scoreStore = createStore();
|
||||
async function createStoreFromAPI(){
|
||||
let scores = await getLeaderboard();
|
||||
return createStore(scores)
|
||||
}
|
||||
|
||||
export const scoreStore= createStoreFromAPI();
|
||||
@@ -1,7 +1,18 @@
|
||||
<script>
|
||||
import {scoreStore} from "$lib/stores/scoreStore.ts"
|
||||
import { onMount } from 'svelte';
|
||||
import { scoreStore } from "$lib/stores/scoreStore.ts";
|
||||
import LeaderBoard from "$lib/components/LeaderBoard.svelte";
|
||||
|
||||
let scores;
|
||||
|
||||
onMount(async () => {
|
||||
scores = await scoreStore;
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<LeaderBoard bind:scores={$scoreStore}></LeaderBoard>
|
||||
{#if scores}
|
||||
<LeaderBoard bind:scores={$scores}></LeaderBoard>
|
||||
{:else}
|
||||
<p>Loading leaderboard...</p>
|
||||
{/if}
|
||||
Reference in New Issue
Block a user