mirror of
https://github.com/vkaelin/LeagueStats.git
synced 2026-03-25 12:57:28 +00:00
Fix PurgeCSS, fix backend, use localStorage
This commit is contained in:
Valentin Kaelin
parent
cc630f002b
commit
c26b7a2191
14 changed files with 242 additions and 142 deletions
|
|
@ -8,7 +8,8 @@ module.exports = {
|
|||
'eslint:recommended'
|
||||
],
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
//'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
'no-console': 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
|
||||
},
|
||||
parserOptions: {
|
||||
|
|
|
|||
35
client/package-lock.json
generated
35
client/package-lock.json
generated
|
|
@ -8228,6 +8228,18 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"postcss-import": {
|
||||
"version": "12.0.1",
|
||||
"resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-12.0.1.tgz",
|
||||
"integrity": "sha512-3Gti33dmCjyKBgimqGxL3vcV8w9+bsHwO5UrBawp796+jdardbcFl4RP5w/76BwNL7aGzpKstIfF9I+kdE8pTw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"postcss": "^7.0.1",
|
||||
"postcss-value-parser": "^3.2.3",
|
||||
"read-cache": "^1.0.0",
|
||||
"resolve": "^1.1.7"
|
||||
}
|
||||
},
|
||||
"postcss-js": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-2.0.0.tgz",
|
||||
|
|
@ -8995,6 +9007,23 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"read-cache": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
||||
"integrity": "sha1-5mTvMRYRZsl1HNvo28+GtftY93Q=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"pify": "^2.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"read-file-stdin": {
|
||||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmjs.org/read-file-stdin/-/read-file-stdin-0.2.1.tgz",
|
||||
|
|
@ -10970,6 +10999,12 @@
|
|||
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.10.tgz",
|
||||
"integrity": "sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ=="
|
||||
},
|
||||
"vue-awesome": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/vue-awesome/-/vue-awesome-3.5.1.tgz",
|
||||
"integrity": "sha512-oWPAoC1B/0aTxrw04MFxjVsXFsTz6f26KRxF5ItP59BM7uaAdJ8toHp7iFE5rpS/NOJJBheGPJIelfA5nzU4aA==",
|
||||
"dev": true
|
||||
},
|
||||
"vue-axios": {
|
||||
"version": "2.1.4",
|
||||
"resolved": "https://registry.npmjs.org/vue-axios/-/vue-axios-2.1.4.tgz",
|
||||
|
|
|
|||
|
|
@ -21,8 +21,10 @@
|
|||
"babel-eslint": "^10.0.1",
|
||||
"eslint": "^5.8.0",
|
||||
"eslint-plugin-vue": "^5.0.0",
|
||||
"postcss-import": "^12.0.1",
|
||||
"purgecss": "^1.1.0",
|
||||
"tailwindcss": "^1.0.0-beta.3",
|
||||
"vue-awesome": "^3.5.1",
|
||||
"vue-template-compiler": "^2.5.21"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,20 +1,29 @@
|
|||
const tailwindcss = require("tailwindcss");
|
||||
const autoprefixer = require("autoprefixer");
|
||||
const purgecss = require("@fullhuman/postcss-purgecss");
|
||||
const postcssImport = require('postcss-import')
|
||||
|
||||
class TailwindExtractor {
|
||||
static extract(content) {
|
||||
return content.match(/[A-Za-z0-9-_:\/]+/g) || [];
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
plugins: [
|
||||
tailwindcss("./tailwind.config.js"),
|
||||
autoprefixer({
|
||||
add: true,
|
||||
grid: true
|
||||
}),
|
||||
//Only add purgecss in production
|
||||
process.env.NODE_ENV === "production"? purgecss({
|
||||
content: [
|
||||
"./src/**/*.html",
|
||||
"./src/**/*.vue"
|
||||
]
|
||||
}): ""
|
||||
]
|
||||
};
|
||||
plugins: [
|
||||
postcssImport,
|
||||
tailwindcss('./tailwind.config.js'),
|
||||
purgecss({
|
||||
content: ['./src/**/*.vue'],
|
||||
whitelist: ['html', 'body'],
|
||||
extractors: [
|
||||
{
|
||||
extractor: TailwindExtractor,
|
||||
|
||||
extensions: ['html', 'js', 'vue']
|
||||
}
|
||||
]
|
||||
}),
|
||||
autoprefixer
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div id="app">
|
||||
<div id="app" class="font-sans bg-gray-200">
|
||||
<div class="nav">
|
||||
<router-link to="/">Accueil</router-link> |
|
||||
<router-link :to="`/summoner/${summoner}`">
|
||||
|
|
@ -14,12 +14,8 @@
|
|||
|
||||
<style>
|
||||
#app {
|
||||
font-family: 'Avenir', Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
margin-top: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<li class="match">
|
||||
<li class="match" :class="data.result ? 'win' : 'lose'">
|
||||
<div class="content-container">
|
||||
|
||||
<div class="first">
|
||||
|
|
@ -62,7 +62,6 @@ export default {
|
|||
|
||||
|
||||
<style scoped>
|
||||
/* --- MATCHES --- */
|
||||
.match {
|
||||
background: #fff;
|
||||
padding: 10px 0;
|
||||
|
|
@ -148,4 +147,3 @@ export default {
|
|||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,3 @@
|
|||
// import json from '@/data/item.json'
|
||||
|
||||
// export default {
|
||||
// data() {
|
||||
// return {
|
||||
// myJson: json
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
export const championsId = { 266: "Aatrox", 103: "Ahri", 84: "Akali", 12: "Alistar", 32: "Amumu", 34: "Anivia", 1: "Annie", 22: "Ashe", 136: "AurelionSol", 268: "Azir", 432: "Bard", 53: "Blitzcrank", 63: "Brand", 201: "Braum", 51: "Caitlyn", 164: "Camille", 69: "Cassiopeia", 31: "Chogath", 42: "Corki", 122: "Darius", 131: "Diana", 119: "Draven", 36: "DrMundo", 245: "Ekko", 60: "Elise", 28: "Evelynn", 81: "Ezreal", 9: "Fiddlesticks", 114: "Fiora", 105: "Fizz", 3: "Galio", 41: "Gangplank", 86: "Garen", 150: "Gnar", 79: "Gragas", 104: "Graves", 120: "Hecarim", 74: "Heimerdinger", 420: "Illaoi", 39: "Irelia", 427: "Ivern", 40: "Janna", 59: "JarvanIV", 24: "Jax", 126: "Jayce", 202: "Jhin", 222: "Jinx", 145: "Kaisa", 429: "Kalista", 43: "Karma", 30: "Karthus", 38: "Kassadin", 55: "Katarina", 10: "Kayle", 141: "Kayn", 85: "Kennen", 121: "Khazix", 203: "Kindred", 240: "Kled", 96: "KogMaw", 7: "Leblanc", 64: "LeeSin", 89: "Leona", 127: "Lissandra", 236: "Lucian", 117: "Lulu", 99: "Lux", 54: "Malphite", 90: "Malzahar", 57: "Maokai", 11: "MasterYi", 21: "MissFortune", 62: "MonkeyKing", 82: "Mordekaiser", 25: "Morgana", 267: "Nami", 75: "Nasus", 111: "Nautilus", 76: "Nidalee", 56: "Nocturne", 20: "Nunu", 2: "Olaf", 61: "Orianna", 516: "Ornn", 80: "Pantheon", 78: "Poppy", 555: "Pyke", 133: "Quinn", 497: "Rakan", 33: "Rammus", 421: "RekSai", 58: "Renekton", 107: "Rengar", 92: "Riven", 68: "Rumble", 13: "Ryze", 113: "Sejuani", 35: "Shaco", 98: "Shen", 102: "Shyvana", 27: "Singed", 14: "Sion", 15: "Sivir", 72: "Skarner", 37: "Sona", 16: "Soraka", 50: "Swain", 134: "Syndra", 223: "TahmKench", 163: "Taliyah", 91: "Talon", 44: "Taric", 17: "Teemo", 412: "Thresh", 18: "Tristana", 48: "Trundle", 23: "Tryndamere", 4: "TwistedFate", 29: "Twitch", 77: "Udyr", 6: "Urgot", 110: "Varus", 67: "Vayne", 45: "Veigar", 161: "Velkoz", 254: "Vi", 112: "Viktor", 8: "Vladimir", 106: "Volibear", 19: "Warwick", 498: "Xayah", 101: "Xerath", 5: "XinZhao", 157: "Yasuo", 83: "Yorick", 154: "Zac", 238: "Zed", 115: "Ziggs", 26: "Zilean", 142: "Zoe", 143: "Zyra" };
|
||||
|
||||
export const maps = { 10: "The Twisted Treeline", 11: "Summoner's Rift", 12: "Howling Abyss" };
|
||||
|
|
|
|||
55
client/src/helpers/functions.js
Normal file
55
client/src/helpers/functions.js
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
/**
|
||||
* Return the relative time betweeen a chosen moment and the current time
|
||||
* @param previous : time we want to get difference
|
||||
*/
|
||||
export function timeDifference(previous) {
|
||||
var current = new Date();
|
||||
var msPerMinute = 60 * 1000;
|
||||
var msPerHour = msPerMinute * 60;
|
||||
var msPerDay = msPerHour * 24;
|
||||
var msPerWeek = msPerDay * 7;
|
||||
var elapsed = current - previous;
|
||||
|
||||
if (elapsed < msPerMinute) {
|
||||
return Math.round(elapsed / 1000) + 's';
|
||||
} else if (elapsed < msPerHour) {
|
||||
return Math.round(elapsed / msPerMinute) + 'm';
|
||||
} else if (elapsed < msPerDay) {
|
||||
return Math.round(elapsed / msPerHour) + 'h';
|
||||
} else if (elapsed < msPerWeek) {
|
||||
return Math.round(elapsed / msPerDay) + 'j';
|
||||
} else {
|
||||
var oldDate = new Date(previous);
|
||||
var day = oldDate.getDate() < 10 ? '0' + oldDate.getDate() : oldDate.getDate();
|
||||
var month = oldDate.getMonth() < 9 ? '0' + (oldDate.getMonth() + 1) : (oldDate.getMonth() + 1);
|
||||
return day + '.' + month + '.' + oldDate.getFullYear().toString().substr(-2);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Return time in a formatted way
|
||||
* @param sec : time in seconds to convert
|
||||
*/
|
||||
export function secToTime(sec) {
|
||||
var min = Math.floor(sec / 60);
|
||||
var newSec = sec - min * 60;
|
||||
return min + ':' + (newSec < 10 ? '0' + newSec : newSec); //
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Return the link of the rank image
|
||||
* @param soloQStats : stats in soloQ of the player
|
||||
*/
|
||||
export function getRankImg(soloQStats) {
|
||||
if (!soloQStats) {
|
||||
return 'https://cdn.valentinkaelin.ch/riot/tier-icons/provisional.png';
|
||||
}
|
||||
|
||||
if (soloQStats.tier != 'MASTER' && soloQStats.tier != 'CHALLENGER') {
|
||||
return 'https://cdn.valentinkaelin.ch/riot/tier-icons/' + soloQStats.tier.toLowerCase() + '_' + soloQStats.rank.toLowerCase() + '.png';
|
||||
} else {
|
||||
return 'https://cdn.valentinkaelin.ch/riot/tier-icons/' + soloQStats.tier.toLowerCase() + '.png';
|
||||
}
|
||||
}
|
||||
|
|
@ -3,13 +3,15 @@ import axios from 'axios'
|
|||
import VueAxios from 'vue-axios'
|
||||
|
||||
import '@/assets/css/tailwind.css'
|
||||
import 'vue-awesome/icons'
|
||||
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import Icon from 'vue-awesome/components/Icon'
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
||||
Vue.use(VueAxios, axios)
|
||||
Vue.component('v-icon', Icon)
|
||||
|
||||
|
||||
new Vue({
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
search: ""
|
||||
search: ''
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -1,40 +1,50 @@
|
|||
<template>
|
||||
<div>
|
||||
<button class="debug"></button>
|
||||
<button class="debug" @click="this.resetLocalStorage"></button>
|
||||
|
||||
<div class="search">
|
||||
<div class="container mx-auto">
|
||||
<form class="flex items-center mb-6" id="changeName" method="get" action="summoners">
|
||||
<input type="search" class="hadow appearance-none border rounded w-full py-2 px-3 text-grey-darker leading-tight focus:outline-none focus:shadow-outline mr-1" id="name" name="username" placeholder="Pseudo du Joueur">
|
||||
<button type="submit" class="bg-white hover:bg-grey-lightest text-grey-darkest font-semibold py-2 px-4 mr-1 border border-grey-light rounded shadow">Chercher</button>
|
||||
<button id="refresh" class="bg-white hover:bg-grey-lightest text-grey-darkest font-semibold py-2 px-4 border border-grey-light rounded shadow">
|
||||
<i class="fas fa-sync"></i>
|
||||
<form @submit.prevent="redirect" class="flex items-center">
|
||||
<input type="text" placeholder="Entre un pseudo" class="bg-gray-300 p-2 rounded-l outline-none focus:bg-gray-400" v-model="search">
|
||||
<button class="bg-teal-500 p-2 text-white rounded-r hover:bg-teal-400" type="submit">Rechercher</button>
|
||||
|
||||
<button
|
||||
v-if="summonerFound"
|
||||
id="refresh"
|
||||
class="block bg-white hover:bg-gray-100 text-gray-800 font-semibold py-2 px-4 border border-gray-400 rounded shadow ml-2"
|
||||
>
|
||||
<v-icon name="sync"/>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container mx-auto pb-16">
|
||||
<div class="player shadow-md" v-if="localInfos.name">
|
||||
<div class="player__pp" :style="{background: `url(https://cdn.valentinkaelin.ch/riot/profileicon/${localInfos.profileIconId}.png) center/cover`}"></div>
|
||||
<h1 class="player__name">{{ localInfos.name }}</h1>
|
||||
<h3 class="player__level">{{ localInfos.level }}</h3>
|
||||
<h3 class="player__rank">{{ localInfos.rank }}</h3>
|
||||
<div class="player__rank-img" :style="{background: `url(${localInfos.rankImgLink}) center/cover`}"></div>
|
||||
<h3 class="player__ratio">{{ localInfos.rankedWins ? localInfos.rankedWins + ' wins / ' + localInfos.rankedLosses + ' losses' : "Joueur non classé" }}</h3>
|
||||
<template v-if="summonerFound">
|
||||
<div class="container mx-auto pb-16">
|
||||
<div class="player shadow-md" v-if="localInfos.name">
|
||||
<div class="player__pp" :style="{background: `url(https://cdn.valentinkaelin.ch/riot/profileicon/${localInfos.profileIconId}.png) center/cover`}"></div>
|
||||
<h1 class="player__name">{{ localInfos.name }}</h1>
|
||||
<h3 class="player__level">{{ localInfos.level }}</h3>
|
||||
<h3 class="player__rank">{{ localInfos.rank }}</h3>
|
||||
<div class="player__rank-img" :style="{background: `url(${localInfos.rankImgLink}) center/cover`}"></div>
|
||||
<h3 class="player__ratio">{{ localInfos.rankedWins ? localInfos.rankedWins + ' wins / ' + localInfos.rankedLosses + ' losses' : "Joueur non classé" }}</h3>
|
||||
|
||||
<ul class="list-matches--debug">
|
||||
<Match
|
||||
v-for="(match, index) in localInfos.matches" :key="index"
|
||||
:data="localInfos.matches[index]"
|
||||
/>
|
||||
</ul>
|
||||
<ul class="list-matches--debug">
|
||||
<Match
|
||||
v-for="(match, index) in localInfos.matches" :key="index"
|
||||
:data="localInfos.matches[index]"
|
||||
/>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div v-else>
|
||||
<p>Loading player's information...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<p>Loading player's information...</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<p>Le joueur est introuvable.</p>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -42,6 +52,7 @@
|
|||
<script>
|
||||
import Match from '@/components/Match.vue';
|
||||
import { championsId, maps, gameModes } from "@/data/data.js";
|
||||
import { timeDifference, secToTime, getRankImg } from "@/helpers/functions.js";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
|
@ -50,10 +61,50 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
localInfos: {},
|
||||
nameChosen: this.$route.params.name
|
||||
nameChosen: this.$route.params.name,
|
||||
search: '',
|
||||
summonerFound: true
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
apiCall() {
|
||||
const summoner = this.$route.params.name;
|
||||
this.axios({
|
||||
method: "POST",
|
||||
//url: "https://vue.valentinkaelin.ch/api",
|
||||
url: "http://localhost:5000/api",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
data: {
|
||||
summoner
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
return response.data;
|
||||
})
|
||||
.then(jsonData => {
|
||||
if(jsonData) {
|
||||
this.summonerFound = true
|
||||
this.createObject(jsonData)
|
||||
} else {
|
||||
this.summonerFound = false
|
||||
console.log('Summoner not found')
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
checkLocalStorage() {
|
||||
if (localStorage[this.$route.params.name]) {
|
||||
console.log('cached')
|
||||
this.summonerFound = true
|
||||
this.localInfos = JSON.parse(localStorage[this.$route.params.name])
|
||||
} else {
|
||||
this.apiCall()
|
||||
}
|
||||
},
|
||||
createObject(JSONData) {
|
||||
//console.log('--- ALL INFOS ---')
|
||||
//console.log(JSONData);
|
||||
|
|
@ -88,8 +139,8 @@ export default {
|
|||
mode = 'Undefined gamemode';
|
||||
const champion = championsId[currentMatch.participants[participantId - 1].championId];
|
||||
const role = currentMatch.participants[participantId - 1].timeline.lane;
|
||||
const timeAgo = this.timeDifference(currentMatch.gameCreation);
|
||||
const time = this.secToTime(currentMatch.gameDuration);
|
||||
const timeAgo = timeDifference(currentMatch.gameCreation);
|
||||
const time = secToTime(currentMatch.gameDuration);
|
||||
const kills = currentMatch.participants[participantId - 1].stats.kills;
|
||||
const deaths = currentMatch.participants[participantId - 1].stats.deaths;
|
||||
const assists = currentMatch.participants[participantId - 1].stats.assists;
|
||||
|
|
@ -130,7 +181,7 @@ export default {
|
|||
name: userStats.name,
|
||||
level: userStats.summonerLevel,
|
||||
rank: soloQStats ? soloQStats.tier + ' ' + soloQStats.rank : 'Joueur non classé',
|
||||
rankImgLink: this.getRankImg(soloQStats),
|
||||
rankImgLink: getRankImg(soloQStats),
|
||||
rankedWins: soloQStats ? soloQStats.wins : undefined,
|
||||
rankedLosses: soloQStats ? soloQStats.losses : undefined
|
||||
}
|
||||
|
|
@ -141,68 +192,23 @@ export default {
|
|||
console.log(this.localInfos);
|
||||
|
||||
localStorage[this.nameChosen] = JSON.stringify(this.localInfos);
|
||||
//displayContent(localStorage[this.nameChosen]);
|
||||
},
|
||||
getRankImg(soloQStats) {
|
||||
if (!soloQStats) {
|
||||
return "https://cdn.valentinkaelin.ch/riot/tier-icons/provisional.png";
|
||||
}
|
||||
if (soloQStats.tier != "MASTER" && soloQStats.tier != "CHALLENGER") {
|
||||
return ("https://cdn.valentinkaelin.ch/riot/tier-icons/" + soloQStats.tier.toLowerCase() + "_" + soloQStats.rank.toLowerCase() + ".png");
|
||||
}
|
||||
return ("https://cdn.valentinkaelin.ch/riot/tier-icons/" + soloQStats.tier.toLowerCase() + ".png");
|
||||
redirect() {
|
||||
this.$router.push("/summoner/" + this.search)
|
||||
},
|
||||
secToTime(sec) {
|
||||
var min = Math.floor(sec / 60);
|
||||
var newSec = sec - min * 60;
|
||||
return min + ":" + (newSec < 10 ? "0" + newSec : newSec);
|
||||
},
|
||||
timeDifference(previous) {
|
||||
var current = new Date();
|
||||
var msPerMinute = 60 * 1000;
|
||||
var msPerHour = msPerMinute * 60;
|
||||
var msPerDay = msPerHour * 24;
|
||||
var msPerWeek = msPerDay * 7;
|
||||
var elapsed = current - previous;
|
||||
|
||||
if (elapsed < msPerMinute) {
|
||||
return Math.round(elapsed / 1000) + 's';
|
||||
} else if (elapsed < msPerHour) {
|
||||
return Math.round(elapsed / msPerMinute) + 'm';
|
||||
} else if (elapsed < msPerDay) {
|
||||
return Math.round(elapsed / msPerHour) + 'h';
|
||||
} else if (elapsed < msPerWeek) {
|
||||
return Math.round(elapsed / msPerDay) + 'j';
|
||||
} else {
|
||||
var oldDate = new Date(previous);
|
||||
var day = oldDate.getDate() < 10 ? '0' + oldDate.getDate() : oldDate.getDate();
|
||||
var month = oldDate.getMonth() < 9 ? '0' + (oldDate.getMonth() + 1) : (oldDate.getMonth() + 1);
|
||||
return day + '.' + month + '.' + oldDate.getFullYear().toString().substr(-2);
|
||||
}
|
||||
resetLocalStorage() {
|
||||
console.log('CLEAR LOCALSTORAGE')
|
||||
localStorage.clear()
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
const summoner = this.$route.params.name;
|
||||
this.axios({
|
||||
method: "POST",
|
||||
url: "http://localhost:5000/api",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
data: {
|
||||
summoner
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
return response.data;
|
||||
})
|
||||
.then(jsonData => {
|
||||
console.log(jsonData);
|
||||
this.createObject(jsonData);
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
this.checkLocalStorage()
|
||||
},
|
||||
watch: {
|
||||
$route() {
|
||||
console.log('route changed')
|
||||
this.checkLocalStorage()
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -234,10 +240,6 @@ export default {
|
|||
padding: 32px 0;
|
||||
}
|
||||
|
||||
#refresh {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.player {
|
||||
text-align: center;
|
||||
margin: 16px auto 0;
|
||||
|
|
|
|||
6
server/package-lock.json
generated
6
server/package-lock.json
generated
|
|
@ -105,6 +105,12 @@
|
|||
"delayed-stream": "~1.0.0"
|
||||
}
|
||||
},
|
||||
"connect-history-api-fallback": {
|
||||
"version": "1.6.0",
|
||||
"resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
|
||||
"integrity": "sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==",
|
||||
"dev": true
|
||||
},
|
||||
"content-disposition": {
|
||||
"version": "0.5.2",
|
||||
"resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
|
||||
|
|
|
|||
|
|
@ -16,5 +16,8 @@
|
|||
"express": "^4.16.4",
|
||||
"request": "^2.88.0",
|
||||
"request-promise": "^4.2.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"connect-history-api-fallback": "^1.6.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,10 +6,7 @@ const bodyParser = require('body-parser');
|
|||
const rp = require('request-promise');
|
||||
const Promise = require("bluebird");
|
||||
const app = express()
|
||||
|
||||
// DEV
|
||||
var cors = require('cors');
|
||||
app.use(cors({origin: '*'}));
|
||||
const history = require('connect-history-api-fallback');
|
||||
|
||||
/* Global Variables */
|
||||
const key = process.env.API_KEY;
|
||||
|
|
@ -22,25 +19,29 @@ let finalJSON = [];
|
|||
/* Set Port */
|
||||
app.set('port', (process.env.PORT || 5000))
|
||||
|
||||
/* DEV */
|
||||
var cors = require('cors');
|
||||
app.use(cors({origin: '*'}));
|
||||
|
||||
/* PRODUCTION */
|
||||
/*const staticFileMiddleware = express.static(path.join(__dirname + '/dist'));
|
||||
app.use(staticFileMiddleware);
|
||||
app.use(history({
|
||||
disableDotRule: true,
|
||||
verbose: true
|
||||
}));
|
||||
app.use(staticFileMiddleware);
|
||||
|
||||
app.get('/', function (req, res) {
|
||||
res.render(path.join(__dirname + '/dist/index.html'));
|
||||
});*/
|
||||
|
||||
/* To retrieve data of post request */
|
||||
app.use(bodyParser.json()); // to support JSON-encoded bodies
|
||||
app.use(bodyParser.urlencoded({ // to support URL-encoded bodies
|
||||
extended: true
|
||||
}));
|
||||
|
||||
// /* Homepage */
|
||||
// app.get('/', function (request, response) {
|
||||
// response.sendFile(path.join(__dirname, 'home.html'));
|
||||
// });
|
||||
|
||||
// /* Summoners pages */
|
||||
// app.get('/summoners', function (request, response) {
|
||||
// response.sendFile(path.join(__dirname, 'summoner.html'));
|
||||
// });
|
||||
|
||||
// /* Public assets folder */
|
||||
// app.use('/public', express.static(__dirname + '/public'));
|
||||
|
||||
/* Launch app */
|
||||
app.listen(app.get('port'), () => console.log(`RiotAPI app listening on port ${app.get('port')}!`))
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue