diff --git a/client/.env b/client/.env new file mode 100644 index 0000000..f761ed7 --- /dev/null +++ b/client/.env @@ -0,0 +1 @@ +VUE_APP_PATCH=9.17.1 \ No newline at end of file diff --git a/client/src/components/RecentActivity.vue b/client/src/components/RecentActivity.vue index 11cb8b2..53e015f 100644 --- a/client/src/components/RecentActivity.vue +++ b/client/src/components/RecentActivity.vue @@ -40,7 +40,9 @@ export default { props: { matches: { type: Array, - required: true + default() { + return [] + } } }, @@ -48,7 +50,18 @@ export default { return { gridDays: [], indexFirstMonday: 0, - nbColumns: 15 + nbColumns: 15, + options: { + year: 'numeric', + month: '2-digit', + day: 'numeric' + } + } + }, + + watch: { + matches() { + this.fillGrid() } }, @@ -62,17 +75,11 @@ export default { createGrid() { const nbDaysInGrid = this.nbColumns * 7 - const options = { - year: 'numeric', - month: '2-digit', - day: 'numeric' - } - // Create array with all the days of the Grid for (let i = 1; i <= nbDaysInGrid; i++) { const day = new Date() day.setDate(day.getDate() - nbDaysInGrid + i) - const formattedDay = day.toLocaleString('fr', options) + const formattedDay = day.toLocaleString('fr', this.options) this.gridDays.push({ date: formattedDay, @@ -82,11 +89,14 @@ export default { }) } + this.fillGrid() + }, + fillGrid() { // Add all the matches made by the summoner for (const key in this.matches) { const match = this.matches[key] const matchTime = new Date(match.timestamp) - const formattedTime = matchTime.toLocaleString('fr', options) + const formattedTime = matchTime.toLocaleString('fr', this.options) const dayOfTheMatch = this.gridDays.filter( e => e.date === formattedTime @@ -119,4 +129,4 @@ export default { } } } - \ No newline at end of file + diff --git a/client/src/main.js b/client/src/main.js index aba817b..612ef28 100644 --- a/client/src/main.js +++ b/client/src/main.js @@ -17,7 +17,7 @@ Vue.use(VueAxios) Vue.component('v-icon', Icon) Vue.component('dot-loader', DotLoader) -Vue.prototype.$patch = '9.17.1' +Vue.prototype.$patch = process.env.VUE_APP_PATCH new Vue({ diff --git a/client/src/plugins/axios.js b/client/src/plugins/axios.js index 0944649..ba563a6 100644 --- a/client/src/plugins/axios.js +++ b/client/src/plugins/axios.js @@ -4,7 +4,7 @@ export const axios = axiosHttp axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest' axios.defaults.headers.common['Content-Type'] = 'application/json' -axios.defaults.baseURL = process.env.NODE_ENV === 'development' ? 'http://localhost:5000/' : 'https://api.valentinkaelin.ch/' +axios.defaults.baseURL = process.env.NODE_ENV === 'development' ? 'http://localhost:3333/' : 'https://api.valentinkaelin.ch/' export default { install (Vue) { diff --git a/client/src/store/index.js b/client/src/store/index.js index 839b977..c436fcc 100644 --- a/client/src/store/index.js +++ b/client/src/store/index.js @@ -1,6 +1,8 @@ import Vue from 'vue' import Vuex from 'vuex' +import * as ddragon from '@/store/modules/ddragon' import * as notification from '@/store/modules/notification' +import * as summoner from '@/store/modules/summoner' Vue.use(Vuex) @@ -8,7 +10,24 @@ const debug = process.env.NODE_ENV !== 'production' export default new Vuex.Store({ modules: { + ddragon, notification, + summoner + }, + state: { + regionsList: { + 'br': 'br1', + 'eune': 'eun1', + 'euw': 'euw1', + 'jp': 'jp1', + 'kr': 'kr', + 'lan': 'la1', + 'las': 'la2', + 'na': 'na1', + 'oce': 'oc1', + 'tr': 'tr1', + 'ru': 'ru' + } }, strict: debug }) diff --git a/client/src/store/modules/ddragon.js b/client/src/store/modules/ddragon.js new file mode 100644 index 0000000..4c9c5f9 --- /dev/null +++ b/client/src/store/modules/ddragon.js @@ -0,0 +1,22 @@ +import { axios } from '@/plugins/axios' + +export const namespaced = true + +export const state = { + champions: [] +} + +export const mutations = { + PUSH_CHAMPIONS(state, champions) { + state.champions = champions + } +} + +export const actions = { + async getChampions({ commit }) { + console.log('API CALL FOR CHAMPIONS') + const endpoint = 'Champion' + const resp = await axios(({ url: 'ddragon', data: { endpoint }, method: 'POST' })) + commit('PUSH_CHAMPIONS', resp.data.data) + } +} diff --git a/client/src/store/modules/summoner.js b/client/src/store/modules/summoner.js new file mode 100644 index 0000000..d67a085 --- /dev/null +++ b/client/src/store/modules/summoner.js @@ -0,0 +1,140 @@ +import { axios } from '@/plugins/axios' +import { timeDifference, secToTime, getRankImg } from '@/helpers/functions.js' +import { maps, gameModes } from '@/data/data.js' +import summonersJSON from '@/data/summoner.json' + +export const namespaced = true + +export const state = { + infos: [], + loading: false, + summonerFound: false +} + +export const mutations = { + SUMMONER_REQUEST(state) { + state.loading = true + }, + SUMMONER_FOUND(state, infos) { + state.summonerFound = true + state.loading = false + state.infos = infos + }, + SUMMONER_NOT_FOUND(state) { + state.summonerFound = false + state.loading = false + } +} + +export const actions = { + async summonerRequest({ commit, dispatch, rootState }, { summoner, region }) { + console.log(summoner, region) + commit('SUMMONER_REQUEST') + try { + const resp = await axios(({ url: 'api', data: { summoner, region }, method: 'POST' })) + await dispatch('ddragon/getChampions', {}, { root: true }) + if (resp.data) { + const infos = createObject(resp.data, rootState.ddragon.champions) + commit('SUMMONER_FOUND', infos) + } else { + commit('SUMMONER_NOT_FOUND') + + dispatch('notification/add', { + type: 'error', + message: 'Summoner not found.' + }, { root: true }) + console.log('Summoner not found - store') + } + } catch (error) { + commit('SUMMONER_NOT_FOUND') + console.log(error) + } + } +} + +function createObject(JSONData, championsInfos) { + console.log('--- ALL INFOS ---') + console.log(JSONData) + + const userStats = JSONData.account + const soloQStats = JSONData.soloQ + const matches = JSONData.matchesDetails + + const matchesInfos = [] + // Loop on all matches + for (let i = 0; i < matches.length; i++) { + const currentMatch = matches[i] + const participantId = currentMatch.participantIdentities.find((p) => p.player.currentAccountId === userStats.accountId).participantId + + const teamId = currentMatch.participants[participantId - 1].teamId + const win = currentMatch.teams.find((t) => t.teamId === teamId).win === 'Win' + + const map = maps[currentMatch.mapId] + let mode = gameModes[currentMatch.queueId] + if (!mode) + mode = 'Undefined gamemode' + const champion = Object.entries(championsInfos).find(([, champion]) => Number(champion.key) === currentMatch.participants[participantId - 1].championId)[0] + const role = currentMatch.participants[participantId - 1].timeline.lane + 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 + const level = currentMatch.participants[participantId - 1].stats.champLevel + + const items = [] + for (let i = 0; i < 6; i++) { + const currentItem = 'item' + i + items.push(getItemLink(currentMatch.participants[participantId - 1].stats[currentItem])) + } + + const gold = (currentMatch.participants[participantId - 1].stats.goldEarned / 1000).toFixed(1) + 'k' + const minions = currentMatch.participants[participantId - 1].stats.totalMinionsKilled + currentMatch.participants[participantId - 1].stats.neutralMinionsKilled + + const firstSum = currentMatch.participants[participantId - 1].spell1Id + const secondSum = currentMatch.participants[participantId - 1].spell2Id + + matchesInfos.push({ + result: win, + map: map, + gamemode: mode, + champ: champion, + role: role, + date: timeAgo, + time: time, + kills: kills, + deaths: deaths, + assists: assists, + level: level, + items: items, + gold: gold, + minions: minions, + firstSum: getSummonerLink(firstSum), + secondSum: getSummonerLink(secondSum) + }) + } // end loop matches + console.log('matches infos just below') + console.log(matchesInfos) + + return { + accountId: userStats.accountId, + allMatches: JSONData.allMatches, + matches: matchesInfos, + profileIconId: userStats.profileIconId, + name: userStats.name, + level: userStats.summonerLevel, + rank: soloQStats ? soloQStats.tier + ' ' + soloQStats.rank : 'Joueur non classé', + rankImgLink: getRankImg(soloQStats), + rankedWins: soloQStats ? soloQStats.wins : undefined, + rankedLosses: soloQStats ? soloQStats.losses : undefined + } +} + +function getItemLink(id) { + return `url('https://ddragon.leagueoflegends.com/cdn/${process.env.VUE_APP_PATCH}/img/item/${id === 0 ? 3637 : id}.png') no-repeat center center / contain` +} + +function getSummonerLink(id) { + const spellName = Object.entries(summonersJSON.data).find(([, spell]) => Number(spell.key) === id)[0] + return `https://ddragon.leagueoflegends.com/cdn/${process.env.VUE_APP_PATCH}/img/spell/${spellName}.png` +} diff --git a/client/src/views/Summoner.vue b/client/src/views/Summoner.vue index 6ac4251..71d0365 100644 --- a/client/src/views/Summoner.vue +++ b/client/src/views/Summoner.vue @@ -1,7 +1,5 @@