Mirrors/gamebrary
2
0
Fork 0
mirror of https://github.com/romancm/gamebrary synced 2024-11-10 05:34:15 +00:00
Code Issues Projects Releases Packages Wiki Activity

switch to 2 spaces

Browse source
This commit is contained in:
Roman Cervantes 2019-11-08 12:56:03 -07:00
parent e91b561236
commit 10787e2bfc
54 changed files with 2735 additions and 2729 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
.eslintrc.js
View file

@ -10,7 +10,13 @@ module.exports = {
},
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
extends: ['plugin:vue/essential', 'airbnb-base'],
extends: [
'plugin:vue/essential',
'airbnb-base',
],
rules: {
indent: ['error', 2],
},
// required to lint *.vue files
plugins: [
'vue'
@ -55,7 +61,6 @@ module.exports = {
js: 'never',
vue: 'never'
}],
"indent": ["error", 4],
// disallow reassignment of function parameters
// disallow parameter object manipulation except for specific exclusions
'no-param-reassign': ['error', {

510
src/App.vue
View file

@ -29,288 +29,288 @@ import 'firebase/firestore';
import 'firebase/storage';
firebase.initializeApp({
apiKey: 'AIzaSyA6MsmnLtqT4b11r-j15wwreRypO3AodcA',
authDomain: 'gamebrary.com',
databaseURL: 'https://gamebrary-8c736.firebaseio.com',
projectId: 'gamebrary-8c736',
storageBucket: 'gamebrary-8c736.appspot.com',
messagingSenderId: '324529217902',
apiKey: 'AIzaSyA6MsmnLtqT4b11r-j15wwreRypO3AodcA',
authDomain: 'gamebrary.com',
databaseURL: 'https://gamebrary-8c736.firebaseio.com',
projectId: 'gamebrary-8c736',
storageBucket: 'gamebrary-8c736.appspot.com',
messagingSenderId: '324529217902',
});
const storage = firebase.storage().ref();
const db = firebase.firestore();
export default {
name: 'App',
name: 'App',
components: {
NavHeader,
Toast,
components: {
NavHeader,
Toast,
},
computed: {
...mapState(['user', 'platform', 'wallpaperUrl', 'settings']),
dir() {
return this.settings && this.settings.language === 'ar'
? 'rtl'
: 'ltr';
},
computed: {
...mapState(['user', 'platform', 'wallpaperUrl', 'settings']),
style() {
return this.$route.name === 'game-board' && this.wallpaperUrl
? `background-image: url('${this.wallpaperUrl}')`
: null;
},
dir() {
return this.settings && this.settings.language === 'ar'
? 'rtl'
: 'ltr';
},
style() {
return this.$route.name === 'game-board' && this.wallpaperUrl
? `background-image: url('${this.wallpaperUrl}')`
: null;
},
customWallpaper() {
// eslint-disable-next-line
customWallpaper() {
// eslint-disable-next-line
return this.settings && this.settings.wallpapers && this.platform && this.settings.wallpapers[this.platform.code]
? this.settings.wallpapers[this.platform.code].url
: '';
},
? this.settings.wallpapers[this.platform.code].url
: '';
},
theme() {
const hasPlatform = this.platform && this.platform.code;
const hasTheme = hasPlatform
theme() {
const hasPlatform = this.platform && this.platform.code;
const hasTheme = hasPlatform
&& this.settings
&& this.settings[this.platform.code]
&& this.settings[this.platform.code].theme;
const isGameBoard = this.$route.name === 'game-board';
const isGameBoard = this.$route.name === 'game-board';
const hasPlatformTheme = hasPlatform && hasTheme;
const hasPlatformTheme = hasPlatform && hasTheme;
return isGameBoard && hasPlatformTheme
? `theme-${this.settings[this.platform.code].theme}`
: 'theme-default';
},
return isGameBoard && hasPlatformTheme
? `theme-${this.settings[this.platform.code].theme}`
: 'theme-default';
},
},
watch: {
customWallpaper(value) {
if (value) {
if (this.platform) {
this.loadWallpaper();
}
} else {
this.$store.commit('SET_WALLPAPER_URL', '');
}
},
},
mounted() {
// TODO: REMOVE, call action directly
this.$bus.$on('SAVE_TAGS', this.saveTags);
// TODO: REMOVE, call action directly
this.$bus.$on('SAVE_NOTES', this.saveNotes);
this.init();
},
beforeDestroy() {
this.$bus.$off('SAVE_TAGS');
this.$bus.$off('SAVE_NOTES');
},
methods: {
init() {
if (this.user) {
this.syncData();
return;
}
if (this.customWallpaper) {
this.loadWallpaper();
}
firebase.auth().getRedirectResult().then(({ additionalUserInfo, user }) => {
if (additionalUserInfo && additionalUserInfo.isNewUser) {
this.$store.dispatch('SEND_WELCOME_EMAIL', additionalUserInfo);
}
if (user) {
return this.initUser(user);
}
return this.handleAuthRedirect();
});
},
watch: {
customWallpaper(value) {
if (value) {
if (this.platform) {
this.loadWallpaper();
}
} else {
this.$store.commit('SET_WALLPAPER_URL', '');
}
},
handleAuthRedirect() {
const authProvider = this.$route.params.authProvider || 'google';
const firebaseAuthProvider = authProvider === 'twitter'
? new firebase.auth.TwitterAuthProvider()
: new firebase.auth.GoogleAuthProvider();
firebase.auth().signInWithRedirect(firebaseAuthProvider)
.catch((message) => {
this.$bus.$emit('TOAST', {
message,
type: 'error',
});
});
},
mounted() {
// TODO: REMOVE, call action directly
this.$bus.$on('SAVE_TAGS', this.saveTags);
// TODO: REMOVE, call action directly
this.$bus.$on('SAVE_NOTES', this.saveNotes);
this.init();
loadWallpaper() {
const wallpaperRef = this.customWallpaper;
this.$store.commit('SET_WALLPAPER_URL', '');
storage.child(wallpaperRef).getDownloadURL().then((url) => {
this.$store.commit('SET_WALLPAPER_URL', url);
});
},
beforeDestroy() {
this.$bus.$off('SAVE_TAGS');
this.$bus.$off('SAVE_NOTES');
saveTags(tags, force) {
if (tags) {
// TOOD: move to actions
db.collection('tags').doc(this.user.uid).set(tags, { merge: !force })
.then(() => {
this.$bus.$emit('TOAST', { message: 'Tags updated' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your tag', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
}
},
methods: {
init() {
if (this.user) {
this.syncData();
return;
}
if (this.customWallpaper) {
this.loadWallpaper();
}
firebase.auth().getRedirectResult().then(({ additionalUserInfo, user }) => {
if (additionalUserInfo && additionalUserInfo.isNewUser) {
this.$store.dispatch('SEND_WELCOME_EMAIL', additionalUserInfo);
}
if (user) {
return this.initUser(user);
}
return this.handleAuthRedirect();
});
},
handleAuthRedirect() {
const authProvider = this.$route.params.authProvider || 'google';
const firebaseAuthProvider = authProvider === 'twitter'
? new firebase.auth.TwitterAuthProvider()
: new firebase.auth.GoogleAuthProvider();
firebase.auth().signInWithRedirect(firebaseAuthProvider)
.catch((message) => {
this.$bus.$emit('TOAST', {
message,
type: 'error',
});
});
},
loadWallpaper() {
const wallpaperRef = this.customWallpaper;
this.$store.commit('SET_WALLPAPER_URL', '');
storage.child(wallpaperRef).getDownloadURL().then((url) => {
this.$store.commit('SET_WALLPAPER_URL', url);
});
},
saveTags(tags, force) {
if (tags) {
// TOOD: move to actions
db.collection('tags').doc(this.user.uid).set(tags, { merge: !force })
.then(() => {
this.$bus.$emit('TOAST', { message: 'Tags updated' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your tag', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
}
},
saveNotes(notes, force) {
if (notes) {
// TOOD: move to actions
db.collection('notes').doc(this.user.uid).set(notes, { merge: !force })
.then(() => {
this.$bus.$emit('TOAST', { message: 'Notes updated' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your note', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
}
},
syncData() {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const gameLists = doc.data();
this.$store.commit('SET_GAME_LISTS', gameLists);
}
});
// TOOD: move to actions
db.collection('settings').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const settings = doc.data();
this.$store.commit('SET_SETTINGS', settings);
}
});
// TOOD: move to actions
db.collection('tags').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const tags = doc.data();
this.$store.commit('SET_TAGS', tags);
}
});
// TOOD: move to actions
db.collection('notes').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const notes = doc.data();
this.$store.commit('SET_NOTES', notes);
}
});
},
initUser(user) {
this.$store.commit('SET_USER', user);
this.loadSettings();
this.loadTags();
this.loadLists();
this.syncData();
},
loadSettings() {
// TOOD: move to actions
const docRef = db.collection('settings').doc(this.user.uid);
docRef.get().then((doc) => {
const hasData = doc && doc.exists;
return hasData
? this.$store.commit('SET_SETTINGS', doc.data())
: this.initSettings();
}).catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
loadLists() {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid).get()
.then((doc) => {
if (doc.exists) {
const data = doc.data();
this.$store.commit('SET_GAME_LISTS', data);
} else {
this.initList();
}
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
loadTags() {
// TOOD: move to actions
db.collection('tags').doc(this.user.uid).get()
.then((doc) => {
if (doc.exists) {
const data = doc.data();
this.$store.commit('SET_TAGS', data);
}
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
initList() {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid).set({}, { merge: true })
.then(() => {
this.loadLists();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
initSettings() {
// TOOD: move to actions
db.collection('settings').doc(this.user.uid).set({}, { merge: true })
.then(() => {
this.loadSettings();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
saveNotes(notes, force) {
if (notes) {
// TOOD: move to actions
db.collection('notes').doc(this.user.uid).set(notes, { merge: !force })
.then(() => {
this.$bus.$emit('TOAST', { message: 'Notes updated' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your note', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
}
},
syncData() {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const gameLists = doc.data();
this.$store.commit('SET_GAME_LISTS', gameLists);
}
});
// TOOD: move to actions
db.collection('settings').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const settings = doc.data();
this.$store.commit('SET_SETTINGS', settings);
}
});
// TOOD: move to actions
db.collection('tags').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const tags = doc.data();
this.$store.commit('SET_TAGS', tags);
}
});
// TOOD: move to actions
db.collection('notes').doc(this.user.uid)
.onSnapshot((doc) => {
if (doc.exists) {
const notes = doc.data();
this.$store.commit('SET_NOTES', notes);
}
});
},
initUser(user) {
this.$store.commit('SET_USER', user);
this.loadSettings();
this.loadTags();
this.loadLists();
this.syncData();
},
loadSettings() {
// TOOD: move to actions
const docRef = db.collection('settings').doc(this.user.uid);
docRef.get().then((doc) => {
const hasData = doc && doc.exists;
return hasData
? this.$store.commit('SET_SETTINGS', doc.data())
: this.initSettings();
}).catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
loadLists() {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid).get()
.then((doc) => {
if (doc.exists) {
const data = doc.data();
this.$store.commit('SET_GAME_LISTS', data);
} else {
this.initList();
}
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
loadTags() {
// TOOD: move to actions
db.collection('tags').doc(this.user.uid).get()
.then((doc) => {
if (doc.exists) {
const data = doc.data();
this.$store.commit('SET_TAGS', data);
}
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
initList() {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid).set({}, { merge: true })
.then(() => {
this.loadLists();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
initSettings() {
// TOOD: move to actions
db.collection('settings').doc(this.user.uid).set({}, { merge: true })
.then(() => {
this.loadSettings();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
},
};
</script>

174
src/components/AddGame.vue
View file

@ -55,110 +55,110 @@ import { debounce } from 'lodash';
import { mapState } from 'vuex';
export default {
components: {
GameCardSearch,
IgdbCredit,
Modal,
components: {
GameCardSearch,
IgdbCredit,
Modal,
},
props: {
listId: {
type: [Number, String, Boolean],
required: true,
default: 0,
},
},
props: {
listId: {
type: [Number, String, Boolean],
required: true,
default: 0,
},
},
data() {
return {
searchText: '',
loading: false,
};
},
data() {
return {
searchText: '',
loading: false,
};
},
computed: {
...mapState(['results', 'gameLists', 'platform']),
computed: {
...mapState(['results', 'gameLists', 'platform']),
noResults() {
return this.filteredResults.length === 0
noResults() {
return this.filteredResults.length === 0
&& !this.loading
&& this.searchText.trim().length > 0;
},
list() {
return this.gameLists[this.platform.code];
},
filteredResults() {
return this.results
? this.results.filter(({ id }) => !this.list[this.listId].games.includes(id))
: [];
},
gamesInListNames() {
return this.gamesInList.map(({ name }) => name).join(', ');
},
gamesInList() {
return this.results
? this.results.filter(({ id }) => this.list[this.listId].games.includes(id))
: [];
},
gamesInListMessage() {
const gameCount = this.gamesInList.length;
const plural = gameCount === 1 ? '' : 's';
return `${gameCount} game${plural}`;
},
},
watch: {
searchText(value) {
if (value) {
this.search();
}
},
list() {
return this.gameLists[this.platform.code];
},
mounted() {
if (this.$refs.searchInput) {
this.$refs.searchInput.focus();
}
filteredResults() {
return this.results
? this.results.filter(({ id }) => !this.list[this.listId].games.includes(id))
: [];
},
methods: {
clear() {
this.searchText = '';
this.$store.commit('CLEAR_SEARCH_RESULTS');
},
gamesInListNames() {
return this.gamesInList.map(({ name }) => name).join(', ');
},
added() {
this.$emit('added');
this.$bus.$emit('GAMES_ADDED');
gamesInList() {
return this.results
? this.results.filter(({ id }) => this.list[this.listId].games.includes(id))
: [];
},
if (this.filteredResults.length === 1) {
this.clear();
}
},
gamesInListMessage() {
const gameCount = this.gamesInList.length;
const plural = gameCount === 1 ? '' : 's';
search: debounce(
// eslint-disable-next-line
return `${gameCount} game${plural}`;
},
},
watch: {
searchText(value) {
if (value) {
this.search();
}
},
},
mounted() {
if (this.$refs.searchInput) {
this.$refs.searchInput.focus();
}
},
methods: {
clear() {
this.searchText = '';
this.$store.commit('CLEAR_SEARCH_RESULTS');
},
added() {
this.$emit('added');
this.$bus.$emit('GAMES_ADDED');
if (this.filteredResults.length === 1) {
this.clear();
}
},
search: debounce(
// eslint-disable-next-line
function() {
this.loading = true;
this.loading = true;
this.$store.dispatch('SEARCH', this.searchText)
.then(() => {
this.error = null;
this.loading = false;
this.$refs.searchResults.scrollTop = 0;
})
.catch(({ data }) => {
this.loading = false;
this.error = data;
});
}, 300),
},
this.$store.dispatch('SEARCH', this.searchText)
.then(() => {
this.error = null;
this.loading = false;
this.$refs.searchResults.scrollTop = 0;
})
.catch(({ data }) => {
this.loading = false;
this.error = data;
});
}, 300),
},
};
</script>

42
src/components/GameBoard/GameBoardPlaceholder.vue
View file

@ -25,32 +25,32 @@ import { mapState, mapGetters } from 'vuex';
import Placeholder from '@/components/Placeholder';
export default {
components: {
Placeholder,
components: {
Placeholder,
},
computed: {
...mapState(['gameLists', 'platform']),
...mapGetters(['brandingEnabled']),
lists() {
return this.gameLists && this.platform && this.gameLists[this.platform.code]
? this.gameLists[this.platform.code]
: [];
},
computed: {
...mapState(['gameLists', 'platform']),
...mapGetters(['brandingEnabled']),
lists() {
return this.gameLists && this.platform && this.gameLists[this.platform.code]
? this.gameLists[this.platform.code]
: [];
},
style() {
return this.brandingEnabled
? `background-color: ${this.platform.hex}; opacity: 0.8;`
: null;
},
style() {
return this.brandingEnabled
? `background-color: ${this.platform.hex}; opacity: 0.8;`
: null;
},
},
methods: {
randomColumn() {
return Math.floor(Math.random() * 4) + 1;
},
methods: {
randomColumn() {
return Math.floor(Math.random() * 4) + 1;
},
},
};
</script>

200
src/components/GameCards/GameCard.js
View file

@ -2,112 +2,112 @@
import { mapState } from 'vuex';
export default {
props: {
gameId: Number,
listId: Number,
},
props: {
gameId: Number,
listId: Number,
},
data() {
return {
showEditOptions: false,
};
},
data() {
return {
showEditOptions: false,
};
},
computed: {
...mapState(['settings', 'games', 'gameLists', 'platform', 'user', 'tags', 'activeList', 'notes']),
computed: {
...mapState(['settings', 'games', 'gameLists', 'platform', 'user', 'tags', 'activeList', 'notes']),
showGameRatings() {
return this.settings
showGameRatings() {
return this.settings
&& this.settings[this.platform.code]
&& !this.settings[this.platform.code].hideGameRatings;
},
gameCardClass() {
return [
'game-card',
this.list.view,
];
},
activePlatform() {
return this.gameLists[this.platform.code];
},
note() {
return this.notes && this.notes[this.gameId] && this.notes[this.gameId].text;
},
list() {
return this.activePlatform[this.listId];
},
game() {
return this.games[this.gameId];
},
hasTags() {
return Object.keys(this.tags) && Object.keys(this.tags).length > 0;
},
coverUrl() {
const game = this.games[this.gameId];
return game.cover && game.cover.image_id
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${game.cover.image_id}.jpg`
: '/static/no-image.jpg';
},
addToLabel() {
return this.list.name.length >= 25
? 'list'
: this.list.name;
},
},
methods: {
openDetails() {
this.$bus.$emit('OPEN_GAME', {
id: this.game.id,
listId: this.listId,
});
},
openTags() {
this.$bus.$emit('OPEN_TAGS', this.game.id);
},
addGame() {
const data = {
listId: this.listId,
gameId: this.gameId,
};
this.$emit('added');
this.$store.commit('ADD_GAME', data);
this.$ga.event({
eventCategory: 'game',
eventAction: 'add',
eventLabel: 'addGame',
eventValue: data,
});
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', {
message: `Added ${this.game.name} to list ${this.list.name}`,
imageUrl: this.coverUrl,
});
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
removeTag(tagName) {
this.$store.commit('REMOVE_GAME_TAG', { tagName, gameId: this.gameId });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
gameCardClass() {
return [
'game-card',
this.list.view,
];
},
activePlatform() {
return this.gameLists[this.platform.code];
},
note() {
return this.notes && this.notes[this.gameId] && this.notes[this.gameId].text;
},
list() {
return this.activePlatform[this.listId];
},
game() {
return this.games[this.gameId];
},
hasTags() {
return Object.keys(this.tags) && Object.keys(this.tags).length > 0;
},
coverUrl() {
const game = this.games[this.gameId];
return game.cover && game.cover.image_id
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${game.cover.image_id}.jpg`
: '/static/no-image.jpg';
},
addToLabel() {
return this.list.name.length >= 25
? 'list'
: this.list.name;
},
},
methods: {
openDetails() {
this.$bus.$emit('OPEN_GAME', {
id: this.game.id,
listId: this.listId,
});
},
openTags() {
this.$bus.$emit('OPEN_TAGS', this.game.id);
},
addGame() {
const data = {
listId: this.listId,
gameId: this.gameId,
};
this.$emit('added');
this.$store.commit('ADD_GAME', data);
this.$ga.event({
eventCategory: 'game',
eventAction: 'add',
eventLabel: 'addGame',
eventValue: data,
});
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', {
message: `Added ${this.game.name} to list ${this.list.name}`,
imageUrl: this.coverUrl,
});
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
removeTag(tagName) {
this.$store.commit('REMOVE_GAME_TAG', { tagName, gameId: this.gameId });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
},
};

10
src/components/GameCards/GameCardDefault.vue
View file

@ -46,12 +46,12 @@ import GameCardUtils from '@/components/GameCards/GameCard';
import Tag from '@/components/Tag';
export default {
components: {
GameRating,
Tag,
},
components: {
GameRating,
Tag,
},
mixins: [GameCardUtils],
mixins: [GameCardUtils],
};
</script>

2
src/components/GameCards/GameCardGrid.vue
View file

@ -12,7 +12,7 @@
import GameCardUtils from '@/components/GameCards/GameCard';
export default {
mixins: [GameCardUtils],
mixins: [GameCardUtils],
};
</script>

8
src/components/GameCards/GameCardSearch.vue
View file

@ -27,11 +27,11 @@ import GameRating from '@/components/GameDetail/GameRating';
import GameCardUtils from '@/components/GameCards/GameCard';
export default {
components: {
GameRating,
},
components: {
GameRating,
},
mixins: [GameCardUtils],
mixins: [GameCardUtils],
};
</script>

10
src/components/GameCards/GameCardText.vue
View file

@ -43,12 +43,12 @@ import GameCardUtils from '@/components/GameCards/GameCard';
import Tag from '@/components/Tag';
export default {
components: {
GameRating,
Tag,
},
components: {
GameRating,
Tag,
},
mixins: [GameCardUtils],
mixins: [GameCardUtils],
};
</script>

10
src/components/GameCards/GameCardWide.vue
View file

@ -51,12 +51,12 @@ import GameCardUtils from '@/components/GameCards/GameCard';
import Tag from '@/components/Tag';
export default {
components: {
GameRating,
Tag,
},
components: {
GameRating,
Tag,
},
mixins: [GameCardUtils],
mixins: [GameCardUtils],
};
</script>

42
src/components/GameDetail/GameDetailPlaceholder.vue
View file

@ -23,30 +23,30 @@ import GameRating from '@/components/GameDetail/GameRating';
import Placeholder from '@/components/Placeholder';
export default {
components: {
GameRating,
Placeholder,
components: {
GameRating,
Placeholder,
},
props: {
id: [Number, String],
},
computed: {
...mapState(['games']),
gamePreviewData() {
return this.games[this.id];
},
props: {
id: [Number, String],
},
computed: {
...mapState(['games']),
gamePreviewData() {
return this.games[this.id];
},
coverUrl() {
const game = this.games[this.id];
return game.cover && game.cover.image_id
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${game.cover.image_id}.jpg`
: '/static/no-image.jpg';
},
coverUrl() {
const game = this.games[this.id];
return game.cover && game.cover.image_id
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${game.cover.image_id}.jpg`
: '/static/no-image.jpg';
},
},
};
</script>

50
src/components/GameDetail/GameDetails.vue
View file

@ -45,32 +45,32 @@ import moment from 'moment';
import { mapState, mapGetters } from 'vuex';
export default {
data() {
return {
moment,
};
},
computed: {
...mapState(['game']),
...mapGetters([
'playerPerspectives',
'developers',
'gameModes',
'releaseDate',
'genres',
'publishers',
]),
timeToBeat() {
const momentDate = moment.unix(this.game.time_to_beat);
return this.game && this.game.time_to_beat
? `${momentDate.format('h')}h ${momentDate.format('m')}m`
: null;
},
data() {
return {
moment,
};
},
computed: {
...mapState(['game']),
...mapGetters([
'playerPerspectives',
'developers',
'gameModes',
'releaseDate',
'genres',
'publishers',
]),
timeToBeat() {
const momentDate = moment.unix(this.game.time_to_beat);
return this.game && this.game.time_to_beat
? `${momentDate.format('h')}h ${momentDate.format('m')}m`
: null;
},
},
};
</script>

70
src/components/GameDetail/GameLinks.vue
View file

@ -29,46 +29,46 @@
import { mapState } from 'vuex';
export default {
data() {
return {
linkTypes: {
1: { name: 'official', icon: 'fas fa-home' },
2: { name: 'wikia', icon: 'fas fa-heart' },
3: { name: 'wikipedia', icon: 'fab fa-wikipedia-w' },
4: { name: 'facebook', icon: 'fab fa-facebook-square' },
5: { name: 'twitter', icon: 'fab fa-twitter' },
6: { name: 'twitch', icon: 'fab fa-twitch' },
8: { name: 'instagram', icon: 'fab fa-instagram' },
9: { name: 'youtube', icon: 'fab fa-youtube' },
10: { name: 'iphone', icon: 'fab fa-app-store-ios' },
11: { name: 'ipad' },
12: { name: 'android', icon: 'fab fa-android' },
13: { name: 'steam', icon: 'fab fa-steam' },
14: { name: 'reddit', icon: 'fab fa-reddit' },
15: { name: 'discord', icon: 'fab fa-discord' },
16: { name: 'google_plus', icon: 'fab fa-google' },
17: { name: 'tumblr', icon: 'fab fa-tumblr' },
18: { name: 'linkedin', icon: 'fab fa-linkedin' },
19: { name: 'pinterest', icon: 'fab fa-pinterest' },
20: { name: 'soundcloud', icon: 'fab fa-soundcloud' },
},
};
},
computed: {
...mapState(['game']),
data() {
return {
linkTypes: {
1: { name: 'official', icon: 'fas fa-home' },
2: { name: 'wikia', icon: 'fas fa-heart' },
3: { name: 'wikipedia', icon: 'fab fa-wikipedia-w' },
4: { name: 'facebook', icon: 'fab fa-facebook-square' },
5: { name: 'twitter', icon: 'fab fa-twitter' },
6: { name: 'twitch', icon: 'fab fa-twitch' },
8: { name: 'instagram', icon: 'fab fa-instagram' },
9: { name: 'youtube', icon: 'fab fa-youtube' },
10: { name: 'iphone', icon: 'fab fa-app-store-ios' },
11: { name: 'ipad' },
12: { name: 'android', icon: 'fab fa-android' },
13: { name: 'steam', icon: 'fab fa-steam' },
14: { name: 'reddit', icon: 'fab fa-reddit' },
15: { name: 'discord', icon: 'fab fa-discord' },
16: { name: 'google_plus', icon: 'fab fa-google' },
17: { name: 'tumblr', icon: 'fab fa-tumblr' },
18: { name: 'linkedin', icon: 'fab fa-linkedin' },
19: { name: 'pinterest', icon: 'fab fa-pinterest' },
20: { name: 'soundcloud', icon: 'fab fa-soundcloud' },
},
};
},
computed: {
...mapState(['game']),
hasWebsites() {
return this.game && this.game.websites;
},
hasWebsites() {
return this.game && this.game.websites;
},
},
methods: {
getIcon(id) {
const icon = this.linkTypes[id];
methods: {
getIcon(id) {
const icon = this.linkTypes[id];
return this.icons[icon];
},
return this.icons[icon];
},
},
};
</script>

16
src/components/GameDetail/GameRating.vue
View file

@ -9,16 +9,16 @@
<script>
export default {
props: {
rating: Number,
small: Boolean,
},
props: {
rating: Number,
small: Boolean,
},
computed: {
roundedRating() {
return Math.round((this.rating / 20) * 2) / 2;
},
computed: {
roundedRating() {
return Math.round((this.rating / 20) * 2) / 2;
},
},
};
</script>

82
src/components/GameDetail/GameScreenshots.vue
View file

@ -20,58 +20,58 @@ import { mapState } from 'vuex';
import VueGallery from 'vue-gallery';
export default {
components: {
VueGallery,
},
components: {
VueGallery,
},
data() {
return {
index: null,
};
},
data() {
return {
index: null,
};
},
computed: {
...mapState(['game']),
computed: {
...mapState(['game']),
screenshots() {
// eslint-disable-next-line
screenshots() {
// eslint-disable-next-line
return this.game.screenshots
? this.game.screenshots.map((image, index) => {
const href = `https://images.igdb.com/igdb/image/upload/t_screenshot_huge/${image.image_id}.jpg`;
? this.game.screenshots.map((image, index) => {
const href = `https://images.igdb.com/igdb/image/upload/t_screenshot_huge/${image.image_id}.jpg`;
return {
href,
title: `${this.game.name} (${index + 1} of ${this.game.screenshots.length})`,
};
})
: null;
},
return {
href,
title: `${this.game.name} (${index + 1} of ${this.game.screenshots.length})`,
};
})
: null;
},
coverUrl() {
return this.game && this.game.cover
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${this.game.cover.image_id}.jpg`
: '/static/no-image.jpg';
},
coverUrl() {
return this.game && this.game.cover
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${this.game.cover.image_id}.jpg`
: '/static/no-image.jpg';
},
thumbnails() {
// eslint-disable-next-line
thumbnails() {
// eslint-disable-next-line
return this.game.screenshots ? this.game.screenshots.map((image) => {
return `https://images.igdb.com/igdb/image/upload/t_thumb/${image.image_id}.jpg`;
}) : null;
},
return `https://images.igdb.com/igdb/image/upload/t_thumb/${image.image_id}.jpg`;
}) : null;
},
},
methods: {
close() {
this.index = null;
this.$store.commit('SET_SLIDESHOW_OPEN', false);
},
methods: {
close() {
this.index = null;
this.$store.commit('SET_SLIDESHOW_OPEN', false);
},
openGallery(index) {
this.index = index;
this.$store.commit('SET_SLIDESHOW_OPEN', true);
},
openGallery(index) {
this.index = index;
this.$store.commit('SET_SLIDESHOW_OPEN', true);
},
},
};
</script>

20
src/components/GameDetail/GameVideos.vue
View file

@ -28,19 +28,19 @@
import { mapState } from 'vuex';
export default {
data() {
return {
selectedVideo: null,
};
},
data() {
return {
selectedVideo: null,
};
},
computed: {
...mapState(['game']),
computed: {
...mapState(['game']),
youtubeVideoId() {
return this.selectedVideo || this.game.videos[0].video_id;
},
youtubeVideoId() {
return this.selectedVideo || this.game.videos[0].video_id;
},
},
};
</script>

124
src/components/GameNotes.vue
View file

@ -71,77 +71,77 @@
import { mapState } from 'vuex';
export default {
data() {
return {
editingNote: false,
localNote: {
text: null,
},
};
data() {
return {
editingNote: false,
localNote: {
text: null,
},
};
},
computed: {
...mapState(['game', 'notes']),
hasNote() {
return this.localNote && this.localNote.text;
},
computed: {
...mapState(['game', 'notes']),
formattedNoteText() {
return this.localNote.text.replace(/(?:\r\n|\r|\n)/g, '<br>');
},
},
hasNote() {
return this.localNote && this.localNote.text;
},
mounted() {
this.getNote();
},
formattedNoteText() {
return this.localNote.text.replace(/(?:\r\n|\r|\n)/g, '<br>');
},
methods: {
getNote() {
this.localNote = this.notes && this.notes[this.game.id]
? JSON.parse(JSON.stringify(this.notes[this.game.id]))
: { text: null };
},
mounted() {
this.getNote();
addNote() {
this.getNote();
this.editingNote = true;
},
methods: {
getNote() {
this.localNote = this.notes && this.notes[this.game.id]
? JSON.parse(JSON.stringify(this.notes[this.game.id]))
: { text: null };
},
addNote() {
this.getNote();
this.editingNote = true;
},
editNote() {
this.editingNote = true;
},
reset() {
this.getNote();
this.editingNote = false;
},
deleteNote() {
const updatedNotes = {
...this.notes,
};
this.$delete(updatedNotes, this.game.id);
this.$bus.$emit('SAVE_NOTES', updatedNotes, true);
this.editingNote = false;
this.localNote = {
text: null,
};
},
saveNote() {
const updatedNotes = {
...this.notes,
};
updatedNotes[this.game.id] = this.localNote;
this.$bus.$emit('SAVE_NOTES', updatedNotes);
this.editingNote = false;
},
editNote() {
this.editingNote = true;
},
reset() {
this.getNote();
this.editingNote = false;
},
deleteNote() {
const updatedNotes = {
...this.notes,
};
this.$delete(updatedNotes, this.game.id);
this.$bus.$emit('SAVE_NOTES', updatedNotes, true);
this.editingNote = false;
this.localNote = {
text: null,
};
},
saveNote() {
const updatedNotes = {
...this.notes,
};
updatedNotes[this.game.id] = this.localNote;
this.$bus.$emit('SAVE_NOTES', updatedNotes);
this.editingNote = false;
},
},
};
</script>

18
src/components/IgdbCredit.vue
View file

@ -7,17 +7,17 @@
<script>
export default {
props: {
linkable: Boolean,
},
props: {
linkable: Boolean,
},
computed: {
href() {
return this.linkable
? 'https://www.igdb.com/'
: null;
},
computed: {
href() {
return this.linkable
? 'https://www.igdb.com/'
: null;
},
},
};
</script>

298
src/components/Lists/List.vue
View file

@ -64,181 +64,181 @@ import AddGame from '@/components/AddGame';
import { mapState, mapGetters } from 'vuex';
export default {
name: 'List',
name: 'List',
components: {
GameCardDefault,
GameCardGrid,
GameCardWide,
GameCardText,
AddGame,
ListSettings,
draggable,
},
components: {
GameCardDefault,
GameCardGrid,
GameCardWide,
GameCardText,
AddGame,
ListSettings,
draggable,
},
props: {
name: String,
gameList: [Object, Array],
listIndex: [String, Number],
},
props: {
name: String,
gameList: [Object, Array],
listIndex: [String, Number],
},
data() {
return {
masonry: null,
gameDraggableOptions: {
handle: '.game-drag-handle',
ghostClass: 'card-placeholder',
animation: 500,
group: {
name: 'games',
},
},
gameCardComponents: {
single: 'GameCardDefault',
grid: 'GameCardGrid',
wide: 'GameCardWide',
text: 'GameCardText',
},
};
},
computed: {
...mapState(['user', 'gameLists', 'platform', 'settings', 'games']),
...mapGetters(['brandingEnabled']),
autoSortEnabled() {
const list = this.list[this.listIndex];
return list && list.sortOrder && list.sortOrder !== 'sortByCustom';
data() {
return {
masonry: null,
gameDraggableOptions: {
handle: '.game-drag-handle',
ghostClass: 'card-placeholder',
animation: 500,
group: {
name: 'games',
},
},
gameCardComponents: {
single: 'GameCardDefault',
grid: 'GameCardGrid',
wide: 'GameCardWide',
text: 'GameCardText',
},
};
},
sortedGames() {
const sortOrder = this.list[this.listIndex].sortOrder || 'sortByCustom';
const { gameList } = this;
computed: {
...mapState(['user', 'gameLists', 'platform', 'settings', 'games']),
switch (sortOrder) {
case 'sortByCustom':
return gameList;
case 'sortByRating':
return gameList.sort((a, b) => {
const gameA = this.games[a] && this.games[a].rating
? this.games[a].rating
: 0;
...mapGetters(['brandingEnabled']),
const gameB = this.games[b] && this.games[b].rating
? this.games[b].rating
: 0;
autoSortEnabled() {
const list = this.list[this.listIndex];
if (gameA > gameB) {
return -1;
}
return list && list.sortOrder && list.sortOrder !== 'sortByCustom';
},
return gameA < gameB ? 1 : 0;
});
case 'sortByName':
return gameList.sort((a, b) => {
const gameA = this.games[a] && this.games[a].name
? this.games[a].name.toUpperCase()
: '';
sortedGames() {
const sortOrder = this.list[this.listIndex].sortOrder || 'sortByCustom';
const { gameList } = this;
const gameB = this.games[b] && this.games[b].name
? this.games[b].name.toUpperCase()
: '';
switch (sortOrder) {
case 'sortByCustom':
return gameList;
case 'sortByRating':
return gameList.sort((a, b) => {
const gameA = this.games[a] && this.games[a].rating
? this.games[a].rating
: 0;
if (gameA < gameB) {
return -1;
}
const gameB = this.games[b] && this.games[b].rating
? this.games[b].rating
: 0;
return gameA > gameB ? 1 : 0;
});
default:
return gameList;
if (gameA > gameB) {
return -1;
}
},
list() {
return this.gameLists[this.platform.code];
},
return gameA < gameB ? 1 : 0;
});
case 'sortByName':
return gameList.sort((a, b) => {
const gameA = this.games[a] && this.games[a].name
? this.games[a].name.toUpperCase()
: '';
isEmpty() {
return this.gameList.length === 0;
},
const gameB = this.games[b] && this.games[b].name
? this.games[b].name.toUpperCase()
: '';
view() {
return this.list[this.listIndex].view;
},
if (gameA < gameB) {
return -1;
}
unique() {
return this.list.length === 1;
},
gameCardComponent() {
return this.view && Object.keys(this.gameCardComponents).includes(this.view)
? this.gameCardComponents[this.view]
: 'GameCardDefault';
},
viewClass() {
return this.list[this.listIndex].view || 'single';
},
return gameA > gameB ? 1 : 0;
});
default:
return gameList;
}
},
watch: {
view() {
this.initGrid();
setTimeout(() => {
this.initGrid();
}, 500);
},
gameList() {
this.initGrid();
setTimeout(() => {
this.initGrid();
}, 500);
},
list() {
return this.gameLists[this.platform.code];
},
mounted() {
isEmpty() {
return this.gameList.length === 0;
},
view() {
return this.list[this.listIndex].view;
},
unique() {
return this.list.length === 1;
},
gameCardComponent() {
return this.view && Object.keys(this.gameCardComponents).includes(this.view)
? this.gameCardComponents[this.view]
: 'GameCardDefault';
},
viewClass() {
return this.list[this.listIndex].view || 'single';
},
},
watch: {
view() {
this.initGrid();
setTimeout(() => {
this.initGrid();
setTimeout(() => {
this.initGrid();
}, 500);
}, 500);
},
methods: {
initGrid() {
if (this.view === 'grid') {
this.$nextTick(() => {
// eslint-disable-next-line
gameList() {
this.initGrid();
setTimeout(() => {
this.initGrid();
}, 500);
},
},
mounted() {
this.initGrid();
setTimeout(() => {
this.initGrid();
}, 500);
},
methods: {
initGrid() {
if (this.view === 'grid') {
this.$nextTick(() => {
// eslint-disable-next-line
this.masonry = new Masonry(`.game-grid-${this.listIndex}`, {
itemSelector: '.game-card',
gutter: 4,
});
});
}
},
validateMove({ from, to }) {
const isDifferentList = from.id !== to.id;
const isDuplicate = this.list[to.id].games.includes(Number(this.draggingId));
const validMove = isDifferentList && isDuplicate;
return !validMove;
},
start({ item }) {
this.dragging = true;
this.draggingId = item.id;
},
end() {
this.$emit('end');
},
itemSelector: '.game-card',
gutter: 4,
});
});
}
},
validateMove({ from, to }) {
const isDifferentList = from.id !== to.id;
const isDuplicate = this.list[to.id].games.includes(Number(this.draggingId));
const validMove = isDifferentList && isDuplicate;
return !validMove;
},
start({ item }) {
this.dragging = true;
this.draggingId = item.id;
},
end() {
this.$emit('end');
},
},
};
</script>

146
src/components/Lists/ListAdd.vue
View file

@ -34,91 +34,91 @@ import Modal from '@/components/Modal';
import { mapState } from 'vuex';
export default {
components: {
Modal,
components: {
Modal,
},
data() {
return {
listName: '',
};
},
computed: {
...mapState(['gameLists', 'platform']),
lists() {
return this.gameLists[this.platform.code];
},
data() {
return {
listName: '',
};
title() {
return this.isEmptyBoard
? this.$t('list.addFirstTime')
: this.$t('list.add');
},
computed: {
...mapState(['gameLists', 'platform']),
buttonLabel() {
return this.isEmptyBoard
? this.$t('list.getStarted')
: this.$t('global.save');
},
lists() {
return this.gameLists[this.platform.code];
},
existingListNames() {
return this.lists
? this.lists.map(({ name }) => name.toLowerCase())
: [];
},
title() {
return this.isEmptyBoard
? this.$t('list.addFirstTime')
: this.$t('list.add');
},
isDuplicate() {
return this.existingListNames.includes(this.listName.toLowerCase());
},
buttonLabel() {
return this.isEmptyBoard
? this.$t('list.getStarted')
: this.$t('global.save');
},
existingListNames() {
return this.lists
? this.lists.map(({ name }) => name.toLowerCase())
: [];
},
isDuplicate() {
return this.existingListNames.includes(this.listName.toLowerCase());
},
isEmptyBoard() {
const newList = this.gameLists && this.platform && !this.gameLists[this.platform.code];
const emptyList = this.gameLists[this.platform.code]
isEmptyBoard() {
const newList = this.gameLists && this.platform && !this.gameLists[this.platform.code];
const emptyList = this.gameLists[this.platform.code]
&& this.gameLists[this.platform.code].length === 0;
return newList || emptyList;
},
disabled() {
return this.isDuplicate || !this.listName;
},
return newList || emptyList;
},
methods: {
open() {
this.listName = '';
},
addList() {
if (this.disabled) {
return;
}
const list = {
games: [],
name: this.listName,
};
this.$store.commit('ADD_LIST', list);
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List added' });
this.$refs.listAddModal.close();
this.scroll();
});
},
scroll() {
this.$nextTick(() => {
const gameBoard = document.querySelector('.game-board');
gameBoard.scrollLeft = gameBoard.scrollWidth;
});
},
disabled() {
return this.isDuplicate || !this.listName;
},
},
methods: {
open() {
this.listName = '';
},
addList() {
if (this.disabled) {
return;
}
const list = {
games: [],
name: this.listName,
};
this.$store.commit('ADD_LIST', list);
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List added' });
this.$refs.listAddModal.close();
this.scroll();
});
},
scroll() {
this.$nextTick(() => {
const gameBoard = document.querySelector('.game-board');
gameBoard.scrollLeft = gameBoard.scrollWidth;
});
},
},
};
</script>

194
src/components/Lists/ListSettings.vue
View file

@ -122,115 +122,115 @@ import ToggleSwitch from '@/components/ToggleSwitch';
import { mapState } from 'vuex';
export default {
components: {
Modal,
ToggleSwitch,
components: {
Modal,
ToggleSwitch,
},
props: {
listIndex: {
type: [Number, String, Boolean],
required: true,
default: 0,
},
},
data() {
return {
localList: null,
views: {
single: 'fas fa-square',
grid: 'fas fa-th-large',
wide: 'fas fa-minus',
text: 'fas fa-font',
},
sortOrders: {
sortByName: 'fas fa-sort-alpha-down',
sortByRating: 'fas fa-star',
sortByCustom: 'fas fa-user',
},
};
},
computed: {
...mapState(['user', 'gameLists', 'platform']),
isFirst() {
return this.listIndex === 0;
},
props: {
listIndex: {
type: [Number, String, Boolean],
required: true,
default: 0,
},
activeList() {
return this.gameLists[this.platform.code][this.listIndex];
},
data() {
return {
localList: null,
views: {
single: 'fas fa-square',
grid: 'fas fa-th-large',
wide: 'fas fa-minus',
text: 'fas fa-font',
},
sortOrders: {
sortByName: 'fas fa-sort-alpha-down',
sortByRating: 'fas fa-star',
sortByCustom: 'fas fa-user',
},
};
isLast() {
const lastListIndex = Object.keys(this.gameLists[this.platform.code]).length - 1;
return this.listIndex === lastListIndex;
},
computed: {
...mapState(['user', 'gameLists', 'platform']),
isFirst() {
return this.listIndex === 0;
},
activeList() {
return this.gameLists[this.platform.code][this.listIndex];
},
isLast() {
const lastListIndex = Object.keys(this.gameLists[this.platform.code]).length - 1;
return this.listIndex === lastListIndex;
},
hasMultipleGames() {
return this.activeList.games.length > 1;
},
disableSave() {
return this.localList.name === this.activeList.name;
},
warningMessage() {
const gameCount = this.activeList.games.length;
return `This list contains ${gameCount} games, all games will be deleted as well.`;
},
hasMultipleGames() {
return this.activeList.games.length > 1;
},
mounted() {
this.localList = JSON.parse(JSON.stringify(this.activeList));
disableSave() {
return this.localList.name === this.activeList.name;
},
methods: {
deleteList() {
this.$store.commit('REMOVE_LIST', this.listIndex);
warningMessage() {
const gameCount = this.activeList.games.length;
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List deleted' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
save() {
const gameLists = JSON.parse(JSON.stringify(this.gameLists));
gameLists[this.platform.code][this.listIndex] = this.localList;
this.$store.dispatch('SAVE_LIST', gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List saved' });
this.$refs.listSettingsModal.close();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
// moveList(from, to) {
// this.$store.commit('MOVE_LIST', { from, to });
// // this.save();
// },
open() {
this.localList = JSON.parse(JSON.stringify(this.activeList));
},
close() {
this.localList = null;
},
return `This list contains ${gameCount} games, all games will be deleted as well.`;
},
},
mounted() {
this.localList = JSON.parse(JSON.stringify(this.activeList));
},
methods: {
deleteList() {
this.$store.commit('REMOVE_LIST', this.listIndex);
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List deleted' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
save() {
const gameLists = JSON.parse(JSON.stringify(this.gameLists));
gameLists[this.platform.code][this.listIndex] = this.localList;
this.$store.dispatch('SAVE_LIST', gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List saved' });
this.$refs.listSettingsModal.close();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
// moveList(from, to) {
// this.$store.commit('MOVE_LIST', { from, to });
// // this.save();
// },
open() {
this.localList = JSON.parse(JSON.stringify(this.activeList));
},
close() {
this.localList = null;
},
},
};
</script>

82
src/components/Modal.vue
View file

@ -35,52 +35,52 @@
<script>
export default {
props: {
actionText: String,
title: String,
message: String,
actionButtonClass: {
type: String,
default: 'primary',
},
actionDisabled: Boolean,
large: Boolean,
props: {
actionText: String,
title: String,
message: String,
actionButtonClass: {
type: String,
default: 'primary',
},
actionDisabled: Boolean,
large: Boolean,
},
data() {
return {
show: false,
};
},
computed: {
routeName() {
return this.$route.name;
},
},
watch: {
routeName() {
this.close();
},
},
methods: {
open() {
this.show = true;
this.$emit('open');
},
data() {
return {
show: false,
};
handleAction() {
this.$emit('action');
this.close();
},
computed: {
routeName() {
return this.$route.name;
},
},
watch: {
routeName() {
this.close();
},
},
methods: {
open() {
this.show = true;
this.$emit('open');
},
handleAction() {
this.$emit('action');
this.close();
},
close() {
this.$emit('close');
this.show = false;
},
close() {
this.$emit('close');
this.show = false;
},
},
};
</script>

68
src/components/NavHeader.vue
View file

@ -19,43 +19,43 @@ import Settings from '@/pages/Settings';
import { mapState } from 'vuex';
export default {
components: {
Settings,
components: {
Settings,
},
computed: {
...mapState(['user', 'platform', 'settings']),
isLoggedIn() {
return this.user && this.user.email;
},
computed: {
...mapState(['user', 'platform', 'settings']),
isLoggedIn() {
return this.user && this.user.email;
},
showSettings() {
return this.$route.name === 'game-board';
},
title() {
return this.$route.name === 'game-board' && this.platform
? this.platform.name
: 'Gamebrary';
},
logoRoute() {
if (this.$route.name === 'game-detail' && this.platform) {
return 'game-board';
}
if (this.$route.name === 'settings' && this.platform) {
return 'game-board';
}
if (this.$route.name === 'game-board') {
return 'platforms';
}
return null;
},
showSettings() {
return this.$route.name === 'game-board';
},
title() {
return this.$route.name === 'game-board' && this.platform
? this.platform.name
: 'Gamebrary';
},
logoRoute() {
if (this.$route.name === 'game-detail' && this.platform) {
return 'game-board';
}
if (this.$route.name === 'settings' && this.platform) {
return 'game-board';
}
if (this.$route.name === 'game-board') {
return 'platforms';
}
return null;
},
},
};
</script>

10
src/components/Placeholder.vue
View file

@ -17,11 +17,11 @@
<script>
export default {
props: {
image: Boolean,
large: Boolean,
lines: Number,
},
props: {
image: Boolean,
large: Boolean,
lines: Number,
},
};
</script>

6
src/components/Platforms/PageFooter.vue
View file

@ -24,9 +24,9 @@
import IgdbCredit from '@/components/IgdbCredit';
export default {
components: {
IgdbCredit,
},
components: {
IgdbCredit,
},
};
</script>

68
src/components/Platforms/Platform.vue
View file

@ -20,50 +20,50 @@
import { mapState } from 'vuex';
export default {
props: {
platform: Object,
square: Boolean,
clickable: Boolean,
props: {
platform: Object,
square: Boolean,
clickable: Boolean,
},
computed: {
...mapState(['gameLists', 'settings']),
hexColor() {
return this.platform.hex || '#fff';
},
computed: {
...mapState(['gameLists', 'settings']),
style() {
return `background-color: ${this.hexColor}`;
},
},
hexColor() {
return this.platform.hex || '#fff';
},
style() {
return `background-color: ${this.hexColor}`;
},
methods: {
showCount({ code }) {
return this.ownedPlatform(code) && this.getGameCount(code) > 0;
},
methods: {
showCount({ code }) {
return this.ownedPlatform(code) && this.getGameCount(code) > 0;
},
changePlatform() {
if (this.clickable) {
this.$store.commit('SET_PLATFORM', this.platform);
this.$router.push({ name: 'game-board' });
}
},
changePlatform() {
if (this.clickable) {
this.$store.commit('SET_PLATFORM', this.platform);
this.$router.push({ name: 'game-board' });
}
},
ownedPlatform(platformCode) {
const isOwned = this.gameLists
ownedPlatform(platformCode) {
const isOwned = this.gameLists
&& this.gameLists[platformCode]
&& Object.keys(this.gameLists[platformCode]).length;
return isOwned && this.clickable;
},
getGameCount(platform) {
return this.gameLists[platform]
.map(({ games }) => games.length)
.reduce((totalCount, listCount) => totalCount + listCount);
},
return isOwned && this.clickable;
},
getGameCount(platform) {
return this.gameLists[platform]
.map(({ games }) => games.length)
.reduce((totalCount, listCount) => totalCount + listCount);
},
},
};
</script>

62
src/components/Releases/Releases.vue
View file

@ -36,40 +36,40 @@ import ReleasesPlaceholder from '@/components/Releases/ReleasesPlaceholder';
import { mapState } from 'vuex';
export default {
components: {
VueMarkdown,
ReleasesPlaceholder,
components: {
VueMarkdown,
ReleasesPlaceholder,
},
data() {
return {
loaded: false,
};
},
computed: {
...mapState(['releases']),
},
mounted() {
this.loaded = Boolean(this.releases);
this.load();
},
methods: {
formattedDate(date) {
return moment(date).fromNow();
},
data() {
return {
loaded: false,
};
},
computed: {
...mapState(['releases']),
},
mounted() {
this.loaded = Boolean(this.releases);
this.load();
},
methods: {
formattedDate(date) {
return moment(date).fromNow();
},
load() {
// TODO: use await / async
this.$store.dispatch('LOAD_RELEASES')
.then(() => {
this.loaded = true;
});
},
load() {
// TODO: use await / async
this.$store.dispatch('LOAD_RELEASES')
.then(() => {
this.loaded = true;
});
},
},
};
</script>

6
src/components/Releases/ReleasesPlaceholder.vue
View file

@ -16,9 +16,9 @@
import Placeholder from '@/components/Placeholder';
export default {
components: {
Placeholder,
},
components: {
Placeholder,
},
};
</script>

69
src/components/Settings/AboutSettings.vue
View file

@ -1,19 +1,20 @@
<template lang="html">
<div>
<div class="github-buttons">
<github-button href="https://github.com/romancm/gamebrary/subscription" data-show-count="true" aria-label="Watch romancm/gamebrary on GitHub">Watch</github-button>
<github-button href="https://github.com/romancm/gamebrary" data-show-count="true" aria-label="Star romancm/gamebrary on GitHub">Star</github-button>
<github-button href="https://github.com/romancm/gamebrary/fork" data-show-count="true" aria-label="Fork romancm/gamebrary on GitHub">Fork</github-button>
<github-button href="https://github.com/romancm/gamebrary/issues" data-show-count="true" aria-label="Issue romancm/gamebrary on GitHub">Issue</github-button>
</div>
<vue-markdown :source="readme" v-if="readme" />
<footer>
<i class="far fa-copyright" /> {{ moment().format('YYYY') }} Gamebrary
</footer>
<div>
<div class="github-buttons">
<github-button href="https://github.com/romancm/gamebrary/subscription" data-show-count="true" aria-label="Watch romancm/gamebrary on GitHub">Watch</github-button>
<github-button href="https://github.com/romancm/gamebrary" data-show-count="true" aria-label="Star romancm/gamebrary on GitHub">Star</github-button>
<github-button href="https://github.com/romancm/gamebrary/fork" data-show-count="true" aria-label="Fork romancm/gamebrary on GitHub">Fork</github-button>
<github-button href="https://github.com/romancm/gamebrary/issues" data-show-count="true" aria-label="Issue romancm/gamebrary on GitHub">Issue</github-button>
</div>
<vue-markdown :source="readme" v-if="readme" />
<footer>
<i class="far fa-copyright" /> {{ moment().format('YYYY') }} Gamebrary
</footer>
</div>
</template>
<script>
@ -23,31 +24,31 @@ import VueMarkdown from 'vue-markdown';
import GithubButton from 'vue-github-button';
export default {
components: {
GithubButton,
VueMarkdown,
},
components: {
GithubButton,
VueMarkdown,
},
data() {
return {
readme: null,
moment,
};
},
data() {
return {
readme: null,
moment,
};
},
mounted() {
axios.get('https://raw.githubusercontent.com/romancm/gamebrary/master/README.md')
.then(({ data }) => {
const formattedData = data.replace(/100px/g, '50px');
mounted() {
axios.get('https://raw.githubusercontent.com/romancm/gamebrary/master/README.md')
.then(({ data }) => {
const formattedData = data.replace(/100px/g, '50px');
this.readme = formattedData;
});
},
this.readme = formattedData;
});
},
};
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
.github-buttons, footer {
text-align: center;
}
.github-buttons, footer {
text-align: center;
}
</style>

100
src/components/Settings/GameBoardSettings.vue
View file

@ -64,65 +64,65 @@ import WallpaperUpload from '@/components/WallpaperUpload';
import ToggleSwitch from '@/components/ToggleSwitch';
export default {
components: {
WallpaperUpload,
Modal,
ToggleSwitch,
components: {
WallpaperUpload,
Modal,
ToggleSwitch,
},
props: {
value: Object,
},
data() {
return {
themes,
};
},
computed: {
...mapState(['user', 'platform', 'gameLists']),
shareText() {
return `Check out my ${this.platform.name} collection at Gamebrary`;
},
props: {
value: Object,
tweetUrl() {
return `https://twitter.com/intent/tweet?text=${this.shareText}&url=${encodeURIComponent(this.shareUrl)}`;
},
data() {
return {
themes,
};
redditUrl() {
return `https://www.reddit.com/submit?url=${this.shareUrl}&title=${this.shareText}`;
},
computed: {
...mapState(['user', 'platform', 'gameLists']),
shareUrl() {
const url = process.env.NODE_ENV === 'development'
? 'http://localhost:4000'
: 'https://app.gamebrary.com';
shareText() {
return `Check out my ${this.platform.name} collection at Gamebrary`;
},
tweetUrl() {
return `https://twitter.com/intent/tweet?text=${this.shareText}&url=${encodeURIComponent(this.shareUrl)}`;
},
redditUrl() {
return `https://www.reddit.com/submit?url=${this.shareUrl}&title=${this.shareText}`;
},
shareUrl() {
const url = process.env.NODE_ENV === 'development'
? 'http://localhost:4000'
: 'https://app.gamebrary.com';
return `${url}/s?id=${this.user.uid}&list=${this.platform.code}`;
},
return `${url}/s?id=${this.user.uid}&list=${this.platform.code}`;
},
},
mounted() {
if (!this.value[this.platform.code]) {
this.value[this.platform.code] = {};
}
},
methods: {
deletePlatform() {
this.$store.commit('REMOVE_PLATFORM');
this.$store.dispatch('SAVE_LIST_NO_MERGE', this.gameLists)
.then(() => {
this.$router.push({ name: 'platforms' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
mounted() {
if (!this.value[this.platform.code]) {
this.value[this.platform.code] = {};
}
},
methods: {
deletePlatform() {
this.$store.commit('REMOVE_PLATFORM');
this.$store.dispatch('SAVE_LIST_NO_MERGE', this.gameLists)
.then(() => {
this.$router.push({ name: 'platforms' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
},
};
</script>

24
src/components/Settings/PlatformsSettings.vue
View file

@ -29,21 +29,21 @@ import ToggleSwitch from '@/components/ToggleSwitch';
import { mapState } from 'vuex';
export default {
components: {
ToggleSwitch,
},
components: {
ToggleSwitch,
},
props: {
value: Object,
},
props: {
value: Object,
},
computed: {
...mapState(['gameLists']),
computed: {
...mapState(['gameLists']),
// TODO: use getter instead
hasLists() {
return Object.keys(this.gameLists).length > 0;
},
// TODO: use getter instead
hasLists() {
return Object.keys(this.gameLists).length > 0;
},
},
};
</script>

14
src/components/Settings/SettingsGlobal.vue
View file

@ -25,15 +25,15 @@
<script>
export default {
props: {
value: Object,
},
props: {
value: Object,
},
computed: {
hasLists() {
return Object.keys(this.gameLists).length > 0;
},
computed: {
hasLists() {
return Object.keys(this.gameLists).length > 0;
},
},
};
</script>

208
src/components/Settings/TagsSettings.vue
View file

@ -73,122 +73,122 @@ import Modal from '@/components/Modal';
import { mapState } from 'vuex';
export default {
components: {
Tag,
Modal,
components: {
Tag,
Modal,
},
data() {
return {
localTags: {},
tagName: '',
tagHex: '',
originalTagName: '',
editing: false,
defaultColor: '#ffcc00',
};
},
computed: {
...mapState(['tags']),
newTag() {
return {
hex: this.tagHex,
games: [],
};
},
data() {
return {
localTags: {},
tagName: '',
tagHex: '',
originalTagName: '',
editing: false,
defaultColor: '#ffcc00',
};
},
textColor() {
const hexColor = this.tagHex ? this.tagHex.replace('#', 0) : '#000000';
computed: {
...mapState(['tags']),
const r = parseInt(hexColor.substr(0, 2), 16);
const g = parseInt(hexColor.substr(2, 2), 16);
const b = parseInt(hexColor.substr(4, 2), 16);
newTag() {
return {
hex: this.tagHex,
games: [],
};
},
textColor() {
const hexColor = this.tagHex ? this.tagHex.replace('#', 0) : '#000000';
const r = parseInt(hexColor.substr(0, 2), 16);
const g = parseInt(hexColor.substr(2, 2), 16);
const b = parseInt(hexColor.substr(4, 2), 16);
// eslint-disable-next-line
// eslint-disable-next-line
const yiq = ((r*299)+(g*587)+(b*114))/1000;
return yiq >= 128 ? 'dark' : 'light';
},
isDuplicate() {
const tagName = this.tagName.toLowerCase();
const lowerCaseTags = Object.keys(this.localTags).map(field => field.toLowerCase());
return lowerCaseTags && lowerCaseTags.includes(tagName);
},
hasTags() {
return Object.keys(this.localTags).length > 0;
},
actionLabel() {
return this.editing
? this.$t('global.save')
: this.$t('tags.createTag');
},
return yiq >= 128 ? 'dark' : 'light';
},
mounted() {
this.reset();
isDuplicate() {
const tagName = this.tagName.toLowerCase();
const lowerCaseTags = Object.keys(this.localTags).map(field => field.toLowerCase());
return lowerCaseTags && lowerCaseTags.includes(tagName);
},
hasTags() {
return Object.keys(this.localTags).length > 0;
},
actionLabel() {
return this.editing
? this.$t('global.save')
: this.$t('tags.createTag');
},
},
mounted() {
this.reset();
this.localTags = JSON.parse(JSON.stringify(this.tags));
},
methods: {
submit() {
if (this.editing) {
this.saveTag();
} else {
this.createTag();
}
},
saveTag() {
const { tagName, tagHex, tempTag } = this;
if (tempTag.tagName !== tagName || tempTag.hex !== tagHex) {
this.$store.commit('UPDATE_TAG', { tagName, tagHex, tempTag });
this.$bus.$emit('SAVE_TAGS', this.tags);
this.localTags = JSON.parse(JSON.stringify(this.tags));
this.reset();
}
},
methods: {
submit() {
if (this.editing) {
this.saveTag();
} else {
this.createTag();
}
},
saveTag() {
const { tagName, tagHex, tempTag } = this;
if (tempTag.tagName !== tagName || tempTag.hex !== tagHex) {
this.$store.commit('UPDATE_TAG', { tagName, tagHex, tempTag });
this.$bus.$emit('SAVE_TAGS', this.tags);
this.localTags = JSON.parse(JSON.stringify(this.tags));
this.reset();
}
},
updateColor(e) {
this.tagHex = e.srcElement.value;
},
createTag() {
if (!this.tagHex || !this.tagName || this.isDuplicate) {
return;
}
this.$set(this.localTags, this.tagName, this.newTag);
this.$bus.$emit('SAVE_TAGS', this.localTags);
this.reset();
},
deleteTag(tagName) {
this.$delete(this.localTags, tagName);
this.$bus.$emit('SAVE_TAGS', this.localTags, true);
this.reset();
},
reset() {
this.tagName = '';
this.tagHex = this.defaultColor;
this.editing = false;
},
editTag({ hex }, tagName) {
this.tempTag = { tagName, hex };
this.tagName = tagName;
this.tagHex = hex;
this.editing = true;
},
updateColor(e) {
this.tagHex = e.srcElement.value;
},
createTag() {
if (!this.tagHex || !this.tagName || this.isDuplicate) {
return;
}
this.$set(this.localTags, this.tagName, this.newTag);
this.$bus.$emit('SAVE_TAGS', this.localTags);
this.reset();
},
deleteTag(tagName) {
this.$delete(this.localTags, tagName);
this.$bus.$emit('SAVE_TAGS', this.localTags, true);
this.reset();
},
reset() {
this.tagName = '';
this.tagHex = this.defaultColor;
this.editing = false;
},
editTag({ hex }, tagName) {
this.tempTag = { tagName, hex };
this.tagName = tagName;
this.tagHex = hex;
this.editing = true;
},
},
};
</script>

44
src/components/Tag.vue
View file

@ -18,36 +18,36 @@
<script>
export default {
props: {
readonly: Boolean,
label: String,
hex: String,
},
props: {
readonly: Boolean,
label: String,
hex: String,
},
computed: {
textColor() {
const hexColor = this.hex ? this.hex.replace('#', 0) : '#000000';
computed: {
textColor() {
const hexColor = this.hex ? this.hex.replace('#', 0) : '#000000';
const r = parseInt(hexColor.substr(0, 2), 16);
const g = parseInt(hexColor.substr(2, 2), 16);
const b = parseInt(hexColor.substr(4, 2), 16);
const r = parseInt(hexColor.substr(0, 2), 16);
const g = parseInt(hexColor.substr(2, 2), 16);
const b = parseInt(hexColor.substr(4, 2), 16);
// eslint-disable-next-line
// eslint-disable-next-line
const yiq = ((r*299)+(g*587)+(b*114))/1000;
return yiq >= 128 ? 'dark' : 'light';
},
return yiq >= 128 ? 'dark' : 'light';
},
},
methods: {
action() {
this.$emit('action');
},
methods: {
action() {
this.$emit('action');
},
close() {
this.$emit('close');
},
close() {
this.$emit('close');
},
},
};
</script>

114
src/components/Toast.vue
View file

@ -11,66 +11,66 @@
<script>
export default {
data() {
return {
message: '',
imageUrl: null,
type: 'success',
timer: 2000,
show: false,
timeout: null,
toastTypes: {
success: 'fas fa-check',
warning: 'fas fa-exclamation',
error: 'fas fa-times',
},
};
data() {
return {
message: '',
imageUrl: null,
type: 'success',
timer: 2000,
show: false,
timeout: null,
toastTypes: {
success: 'fas fa-check',
warning: 'fas fa-exclamation',
error: 'fas fa-times',
},
};
},
computed: {
iconName() {
return this.toastTypes[this.type];
},
},
watch: {
show() {
clearTimeout(this.timeout);
this.timeout = setTimeout(() => {
this.close();
}, this.timer);
},
},
mounted() {
this.$bus.$on('TOAST', this.toast);
},
beforeDestroy() {
this.$bus.$off('TOAST');
},
methods: {
toast({ message, type, imageUrl }) {
this.timer = type === 'error'
? 5000
: 2000;
this.message = message || null;
this.imageUrl = imageUrl || null;
this.type = Object.keys(this.toastTypes).includes(type)
? type
: 'success';
this.show = Boolean(message);
},
computed: {
iconName() {
return this.toastTypes[this.type];
},
},
watch: {
show() {
clearTimeout(this.timeout);
this.timeout = setTimeout(() => {
this.close();
}, this.timer);
},
},
mounted() {
this.$bus.$on('TOAST', this.toast);
},
beforeDestroy() {
this.$bus.$off('TOAST');
},
methods: {
toast({ message, type, imageUrl }) {
this.timer = type === 'error'
? 5000
: 2000;
this.message = message || null;
this.imageUrl = imageUrl || null;
this.type = Object.keys(this.toastTypes).includes(type)
? type
: 'success';
this.show = Boolean(message);
},
close() {
this.show = false;
},
close() {
this.show = false;
},
},
};
</script>

50
src/components/ToggleSwitch.vue
View file

@ -14,35 +14,35 @@
<script>
export default {
props: {
value: Boolean,
id: String,
label: String,
props: {
value: Boolean,
id: String,
label: String,
},
data() {
return {
localValue: null,
};
},
watch: {
value(value) {
if (value) {
this.localValue = JSON.parse(JSON.stringify(this.value));
}
},
data() {
return {
localValue: null,
};
localValue(value) {
this.$emit('input', value);
},
},
watch: {
value(value) {
if (value) {
this.localValue = JSON.parse(JSON.stringify(this.value));
}
},
localValue(value) {
this.$emit('input', value);
},
},
mounted() {
if (this.value !== undefined) {
this.localValue = JSON.parse(JSON.stringify(this.value));
}
},
mounted() {
if (this.value !== undefined) {
this.localValue = JSON.parse(JSON.stringify(this.value));
}
},
};
</script>

140
src/components/WallpaperUpload.vue
View file

@ -64,84 +64,84 @@ import 'firebase/firestore';
import { mapState } from 'vuex';
export default {
components: {
Modal,
components: {
Modal,
},
data() {
return {
progressUpload: 0,
file: File,
uploadTask: '',
wallpapers: {},
loading: false,
};
},
computed: {
...mapState(['user', 'settings', 'platform', 'wallpaperUrl']),
},
mounted() {
this.wallpapers = this.settings && this.settings.wallpapers
? JSON.parse(JSON.stringify(this.settings.wallpapers))
: {};
if (!this.wallpapers[this.platform.code]) {
this.wallpapers[this.platform.code] = {};
}
},
methods: {
triggerUpload() {
this.$refs.fileInput.click();
},
data() {
return {
progressUpload: 0,
file: File,
uploadTask: '',
wallpapers: {},
loading: false,
};
removeWallpaper() {
delete this.wallpapers[this.platform.code].url;
this.saveSettings();
},
computed: {
...mapState(['user', 'settings', 'platform', 'wallpaperUrl']),
saveSettings() {
const settings = {
...this.settings,
wallpapers: this.wallpapers,
};
this.$store.dispatch('SAVE_SETTINGS', settings)
.then(() => {
this.$bus.$emit('TOAST', { message: 'Settings saved' });
this.loading = false;
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your settings', type: 'error' });
this.loading = false;
});
},
mounted() {
this.wallpapers = this.settings && this.settings.wallpapers
? JSON.parse(JSON.stringify(this.settings.wallpapers))
: {};
handleUpload(e) {
this.loading = true;
const file = e.target.files[0];
const extenstion = file.name.split('.')[1];
if (!this.wallpapers[this.platform.code]) {
this.wallpapers[this.platform.code] = {};
}
},
methods: {
triggerUpload() {
this.$refs.fileInput.click();
},
removeWallpaper() {
delete this.wallpapers[this.platform.code].url;
this.saveSettings();
},
saveSettings() {
const settings = {
...this.settings,
wallpapers: this.wallpapers,
};
this.$store.dispatch('SAVE_SETTINGS', settings)
.then(() => {
this.$bus.$emit('TOAST', { message: 'Settings saved' });
this.loading = false;
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your settings', type: 'error' });
this.loading = false;
});
},
handleUpload(e) {
this.loading = true;
const file = e.target.files[0];
const extenstion = file.name.split('.')[1];
firebase.storage().ref(`${this.user.uid}/wallpapers/${this.platform.code}.${extenstion}`).put(file)
.then(({ state, metadata }) => {
if (state === 'success') {
if (!this.wallpapers[this.platform.code]) {
this.wallpapers[this.platform.code] = {};
}
this.wallpapers[this.platform.code].url = metadata.fullPath;
this.saveSettings({
...this.settings,
wallpapers: this.wallpapers,
});
}
});
},
firebase.storage().ref(`${this.user.uid}/wallpapers/${this.platform.code}.${extenstion}`).put(file)
.then(({ state, metadata }) => {
if (state === 'success') {
if (!this.wallpapers[this.platform.code]) {
this.wallpapers[this.platform.code] = {};
}
this.wallpapers[this.platform.code].url = metadata.fullPath;
this.saveSettings({
...this.settings,
wallpapers: this.wallpapers,
});
}
});
},
},
};
</script>

20
src/i18n/index.js
View file

@ -1,16 +1,16 @@
/* eslint-disable global-require */
const messages = {
ar: require('./ar.json'),
cs: require('./cs.json'),
de: require('./de.json'),
en: require('./en.json'),
es: require('./es.json'),
eu: require('./eu.json'),
fr: require('./fr.json'),
it: require('./it.json'),
pl: require('./pl.json'),
ja: require('./ja.json'),
ar: require('./ar.json'),
cs: require('./cs.json'),
de: require('./de.json'),
en: require('./en.json'),
es: require('./es.json'),
eu: require('./eu.json'),
fr: require('./fr.json'),
it: require('./it.json'),
pl: require('./pl.json'),
ja: require('./ja.json'),
};
export default messages;

56
src/main.js
View file

@ -14,11 +14,11 @@ import router from './router';
const EventBus = new Vue();
Object.defineProperties(Vue.prototype, {
$bus: {
get() {
return EventBus;
},
$bus: {
get() {
return EventBus;
},
},
});
Vue.use(VueAnalytics, { id: 'UA-120053966-1', router });
@ -27,48 +27,48 @@ Vue.use(VueFire);
Vue.use(VueI18n);
if (process.env.NODE_ENV !== 'development') {
Raven
.config('https://15928bc58e7b45ac93878da6d8146064@sentry.io/1315568')
.addPlugin(RavenVue, Vue)
.install();
Raven
.config('https://15928bc58e7b45ac93878da6d8146064@sentry.io/1315568')
.addPlugin(RavenVue, Vue)
.install();
}
Vue.config.productionTip = false;
router.beforeEach((to, from, next) => {
if (to.meta.requiresAuth && !store.getters.auth) {
next('/');
} else {
if (to.meta && to.meta.title) {
document.title = `${to.meta.title} - Gamebrary`;
}
next();
if (to.meta.requiresAuth && !store.getters.auth) {
next('/');
} else {
if (to.meta && to.meta.title) {
document.title = `${to.meta.title} - Gamebrary`;
}
next();
}
});
const vuexStorage = localStorage && localStorage.vuex
? JSON.parse(localStorage.vuex)
: null;
? JSON.parse(localStorage.vuex)
: null;
if (vuexStorage && vuexStorage.user && window.FS && window.location.origin.indexOf('localhost') === -1) {
const { displayName, email, dateJoined } = vuexStorage.user;
const { displayName, email, dateJoined } = vuexStorage.user;
window.FS.identify(vuexStorage.user.uid, { displayName, email, dateJoined });
window.FS.identify(vuexStorage.user.uid, { displayName, email, dateJoined });
}
const locale = vuexStorage && vuexStorage.settings && vuexStorage.settings.language
? vuexStorage.settings.language
: 'en';
? vuexStorage.settings.language
: 'en';
const i18n = new VueI18n({ locale, messages });
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
i18n,
store,
components: { App },
template: '<App/>',
el: '#app',
router,
i18n,
store,
components: { App },
template: '<App/>',
});

260
src/pages/GameBoard.vue
View file

@ -69,147 +69,147 @@ import { mapState } from 'vuex';
import draggable from 'vuedraggable';
export default {
components: {
draggable,
List,
GameBoardPlaceholder,
ListAdd,
Tag,
GameDetail,
Modal,
components: {
draggable,
List,
GameBoardPlaceholder,
ListAdd,
Tag,
GameDetail,
Modal,
},
data() {
return {
dragging: false,
draggingId: null,
loading: false,
gameData: null,
gameDetailListIndex: null,
gameDetailId: null,
gameTagsId: null,
queryLimit: 500,
};
},
computed: {
...mapState(['user', 'gameLists', 'platform', 'tags', 'games']),
list() {
return this.gameLists && this.platform && this.gameLists[this.platform.code]
? this.gameLists[this.platform.code]
: null;
},
},
mounted() {
if (!this.platform) {
this.$router.push({ name: 'platforms' });
return;
}
this.load();
this.setPageTitle();
this.$bus.$on('OPEN_GAME', this.openGame);
this.$bus.$on('OPEN_TAGS', this.openTags);
},
beforeDestroy() {
this.$bus.$off('OPEN_GAME');
this.$bus.$off('OPEN_TAGS');
},
methods: {
tryAdd(games, tagName) {
if (!games.includes(this.gameTagsId)) {
this.addTag(tagName);
}
},
data() {
return {
dragging: false,
draggingId: null,
loading: false,
gameData: null,
gameDetailListIndex: null,
gameDetailId: null,
gameTagsId: null,
queryLimit: 500,
};
addTag(tagName) {
this.$store.commit('ADD_GAME_TAG', { tagName, gameId: this.gameTagsId });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
computed: {
...mapState(['user', 'gameLists', 'platform', 'tags', 'games']),
list() {
return this.gameLists && this.platform && this.gameLists[this.platform.code]
? this.gameLists[this.platform.code]
: null;
},
closeGame() {
this.setPageTitle();
this.gameDetailId = null;
this.$store.commit('CLEAR_ACTIVE_GAME');
},
mounted() {
if (!this.platform) {
this.$router.push({ name: 'platforms' });
return;
}
this.load();
this.setPageTitle();
this.$bus.$on('OPEN_GAME', this.openGame);
this.$bus.$on('OPEN_TAGS', this.openTags);
setPageTitle() {
document.title = this.platform
? `${this.platform.name} - Gamebrary`
: 'Gamebrary';
},
beforeDestroy() {
this.$bus.$off('OPEN_GAME');
this.$bus.$off('OPEN_TAGS');
removeTag(tagName) {
this.$store.commit('REMOVE_GAME_TAG', { tagName, gameId: this.gameTagsId });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
methods: {
tryAdd(games, tagName) {
if (!games.includes(this.gameTagsId)) {
this.addTag(tagName);
}
},
addTag(tagName) {
this.$store.commit('ADD_GAME_TAG', { tagName, gameId: this.gameTagsId });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
closeGame() {
this.setPageTitle();
this.gameDetailId = null;
this.$store.commit('CLEAR_ACTIVE_GAME');
},
setPageTitle() {
document.title = this.platform
? `${this.platform.name} - Gamebrary`
: 'Gamebrary';
},
removeTag(tagName) {
this.$store.commit('REMOVE_GAME_TAG', { tagName, gameId: this.gameTagsId });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
openGame({ id, listId }) {
this.gameDetailId = id;
this.gameDetailListIndex = listId;
this.$refs.game.open();
},
openTags(id) {
this.gameTagsId = id;
this.$refs.tag.open(id);
},
dragEnd() {
this.dragging = false;
this.draggingId = null;
this.updateLists();
},
updateLists() {
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List updated' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
load() {
const flattenedList = this.list
? this.list.map(({ games }) => games).flat()
: [];
const dedupedList = Array.from(new Set(flattenedList));
return dedupedList.length > this.queryLimit
? this.loadGamesInChunks(dedupedList)
: this.loadGames(dedupedList);
},
loadGames(gameList) {
if (gameList && gameList.length > 0) {
this.loading = true;
this.$store.dispatch('LOAD_GAMES', gameList.toString())
.then(() => {
this.loading = false;
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Error loading games', type: 'error' });
});
}
},
loadGamesInChunks(gameList) {
const chunkedGameList = chunk(gameList, this.queryLimit);
chunkedGameList.forEach((gameListChunk) => {
this.loadGames(gameListChunk);
});
},
openGame({ id, listId }) {
this.gameDetailId = id;
this.gameDetailListIndex = listId;
this.$refs.game.open();
},
openTags(id) {
this.gameTagsId = id;
this.$refs.tag.open(id);
},
dragEnd() {
this.dragging = false;
this.draggingId = null;
this.updateLists();
},
updateLists() {
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', { message: 'List updated' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
load() {
const flattenedList = this.list
? this.list.map(({ games }) => games).flat()
: [];
const dedupedList = Array.from(new Set(flattenedList));
return dedupedList.length > this.queryLimit
? this.loadGamesInChunks(dedupedList)
: this.loadGames(dedupedList);
},
loadGames(gameList) {
if (gameList && gameList.length > 0) {
this.loading = true;
this.$store.dispatch('LOAD_GAMES', gameList.toString())
.then(() => {
this.loading = false;
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Error loading games', type: 'error' });
});
}
},
loadGamesInChunks(gameList) {
const chunkedGameList = chunk(gameList, this.queryLimit);
chunkedGameList.forEach((gameListChunk) => {
this.loadGames(gameListChunk);
});
},
},
};
</script>

254
src/pages/GameDetail.vue
View file

@ -105,144 +105,144 @@ import IgdbCredit from '@/components/IgdbCredit';
import GameDetailPlaceholder from '@/components/GameDetail/GameDetailPlaceholder';
export default {
components: {
IgdbCredit,
Tag,
GameRating,
GameLinks,
Placeholder,
GameScreenshots,
GameNotes,
Platform,
GameVideos,
GameDetails,
GameDetailPlaceholder,
components: {
IgdbCredit,
Tag,
GameRating,
GameLinks,
Placeholder,
GameScreenshots,
GameNotes,
Platform,
GameVideos,
GameDetails,
GameDetailPlaceholder,
},
props: {
id: [Number, String],
listId: [Number, String],
},
data() {
return {
tab: 'details',
tabs: [
{
value: 'details',
icon: 'fab fa-youtube',
text: 'Details',
component: 'GameDetails',
},
{
value: 'videos',
icon: 'fab fa-youtube',
text: 'Videos',
component: 'GameVideos',
},
{
value: 'screenshots',
icon: 'fas fa-images',
text: 'Screenshots',
component: 'GameScreenshots',
},
{
value: 'links',
icon: 'fas fa-link',
text: 'Links',
component: 'GameLinks',
},
],
};
},
computed: {
...mapState(['game', 'user', 'platform', 'tags', 'gameLists', 'games']),
...mapGetters(['ageRatings', 'gamePlatforms']),
hasTags() {
return Object.keys(this.tags) && Object.keys(this.tags).length > 0;
},
props: {
id: [Number, String],
listId: [Number, String],
activeComponent() {
const activeTab = this.tabs.find(tab => tab.value === this.tab);
return activeTab
? activeTab.component
: '';
},
data() {
return {
tab: 'details',
tabs: [
{
value: 'details',
icon: 'fab fa-youtube',
text: 'Details',
component: 'GameDetails',
},
{
value: 'videos',
icon: 'fab fa-youtube',
text: 'Videos',
component: 'GameVideos',
},
{
value: 'screenshots',
icon: 'fas fa-images',
text: 'Screenshots',
component: 'GameScreenshots',
},
{
value: 'links',
icon: 'fas fa-link',
text: 'Links',
component: 'GameLinks',
},
],
};
activePlatform() {
return this.gameLists[this.platform.code];
},
computed: {
...mapState(['game', 'user', 'platform', 'tags', 'gameLists', 'games']),
...mapGetters(['ageRatings', 'gamePlatforms']),
hasTags() {
return Object.keys(this.tags) && Object.keys(this.tags).length > 0;
},
activeComponent() {
const activeTab = this.tabs.find(tab => tab.value === this.tab);
return activeTab
? activeTab.component
: '';
},
activePlatform() {
return this.gameLists[this.platform.code];
},
list() {
return this.activePlatform[this.listId];
},
coverUrl() {
return this.games[this.id] && this.games[this.id].cover
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${this.games[this.id].cover.image_id}.jpg`
: '/static/no-image.jpg';
},
list() {
return this.activePlatform[this.listId];
},
mounted() {
this.loadGame(this.id);
coverUrl() {
return this.games[this.id] && this.games[this.id].cover
? `https://images.igdb.com/igdb/image/upload/t_cover_small_2x/${this.games[this.id].cover.image_id}.jpg`
: '/static/no-image.jpg';
},
},
mounted() {
this.loadGame(this.id);
},
methods: {
removeTag(tagName) {
this.$store.commit('REMOVE_GAME_TAG', { tagName, gameId: this.game.id });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
methods: {
removeTag(tagName) {
this.$store.commit('REMOVE_GAME_TAG', { tagName, gameId: this.game.id });
this.$bus.$emit('SAVE_TAGS', this.tags);
},
openTags() {
this.$bus.$emit('OPEN_TAGS', this.id);
},
loadGame(gameId) {
this.$store.commit('CLEAR_ACTIVE_GAME');
this.$store.dispatch('LOAD_GAME', gameId)
.then(() => {
if (this.game) {
this.$ga.event({
eventCategory: 'game',
eventAction: 'view',
eventLabel: 'gameViewed',
eventValue: `${this.platform.name} - ${this.game.name}`,
});
document.title = `${this.game.name} (${this.platform.name}) - Gamebrary`;
}
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Error loading game', type: 'error' });
});
},
removeGame() {
const data = {
listId: this.listId,
gameId: this.game.id,
};
this.$store.commit('REMOVE_GAME', data);
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', {
message: `Removed ${this.game.name} from list ${this.list.name}`,
imageUrl: this.coverUrl,
});
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
openTags() {
this.$bus.$emit('OPEN_TAGS', this.id);
},
loadGame(gameId) {
this.$store.commit('CLEAR_ACTIVE_GAME');
this.$store.dispatch('LOAD_GAME', gameId)
.then(() => {
if (this.game) {
this.$ga.event({
eventCategory: 'game',
eventAction: 'view',
eventLabel: 'gameViewed',
eventValue: `${this.platform.name} - ${this.game.name}`,
});
document.title = `${this.game.name} (${this.platform.name}) - Gamebrary`;
}
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Error loading game', type: 'error' });
});
},
removeGame() {
const data = {
listId: this.listId,
gameId: this.game.id,
};
this.$store.commit('REMOVE_GAME', data);
this.$store.dispatch('SAVE_LIST', this.gameLists)
.then(() => {
this.$bus.$emit('TOAST', {
message: `Removed ${this.game.name} from list ${this.list.name}`,
imageUrl: this.coverUrl,
});
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
},
};
</script>

12
src/pages/NotFound.vue
View file

@ -11,13 +11,13 @@
<script>
export default {
computed: {
homeUrl() {
return process.env.NODE_ENV === 'development'
? 'http://localhost:4000'
: 'https://app.gamebrary.com';
},
computed: {
homeUrl() {
return process.env.NODE_ENV === 'development'
? 'http://localhost:4000'
: 'https://app.gamebrary.com';
},
},
};
</script>

82
src/pages/Platforms.vue
View file

@ -24,57 +24,57 @@ import { mapState } from 'vuex';
let msnry = null;
export default {
components: {
Platform,
PageFooter,
components: {
Platform,
PageFooter,
},
data() {
return {
platforms,
};
},
computed: {
...mapState(['gameLists', 'platform', 'settings']),
// TODO: move to getter and replace other instances
hasLists() {
return Object.keys(this.gameLists).length > 0;
},
data() {
return {
platforms,
};
ownedListsOnly() {
return this.settings && this.settings.ownedListsOnly;
},
computed: {
...mapState(['gameLists', 'platform', 'settings']),
filteredPlatforms() {
const availableLists = this.ownedListsOnly
? this.platforms.filter(({ code }) => this.gameLists[code])
: this.platforms;
// TODO: move to getter and replace other instances
hasLists() {
return Object.keys(this.gameLists).length > 0;
},
if (msnry) {
msnry.reloadItems();
msnry.layout();
}
ownedListsOnly() {
return this.settings && this.settings.ownedListsOnly;
},
filteredPlatforms() {
const availableLists = this.ownedListsOnly
? this.platforms.filter(({ code }) => this.gameLists[code])
: this.platforms;
if (msnry) {
msnry.reloadItems();
msnry.layout();
}
return this.settings && this.settings.sortListsAlphabetically
? sortBy(availableLists, 'name')
: availableLists;
},
return this.settings && this.settings.sortListsAlphabetically
? sortBy(availableLists, 'name')
: availableLists;
},
},
mounted() {
this.initGrid();
},
mounted() {
this.initGrid();
},
methods: {
initGrid() {
msnry = new Masonry('.platforms', {
itemSelector: '.platform',
gutter: 16,
});
},
methods: {
initGrid() {
msnry = new Masonry('.platforms', {
itemSelector: '.platform',
gutter: 16,
});
},
},
};
</script>

38
src/pages/SessionExpired.vue
View file

@ -11,28 +11,28 @@
<script>
export default {
computed: {
exitUrl() {
// TODO: move to getter and replace other instances
return process.env.NODE_ENV === 'development'
? 'http://localhost:3000'
: 'https://gamebrary.com';
},
homeUrl() {
// TODO: move to getter and replace other instances
return process.env.NODE_ENV === 'development'
? 'http://localhost:4000'
: 'https://app.gamebrary.com';
},
computed: {
exitUrl() {
// TODO: move to getter and replace other instances
return process.env.NODE_ENV === 'development'
? 'http://localhost:3000'
: 'https://gamebrary.com';
},
methods: {
login() {
this.$store.commit('CLEAR_SESSION');
window.location.href = this.homeUrl;
},
homeUrl() {
// TODO: move to getter and replace other instances
return process.env.NODE_ENV === 'development'
? 'http://localhost:4000'
: 'https://app.gamebrary.com';
},
},
methods: {
login() {
this.$store.commit('CLEAR_SESSION');
window.location.href = this.homeUrl;
},
},
};
</script>

190
src/pages/Settings.vue
View file

@ -50,114 +50,114 @@ import firebase from 'firebase/app';
import Releases from '@/components/Releases/Releases';
export default {
components: {
Modal,
Releases,
GameBoardSettings,
SettingsGlobal,
AboutSettings,
TagsSettings,
components: {
Modal,
Releases,
GameBoardSettings,
SettingsGlobal,
AboutSettings,
TagsSettings,
},
data() {
return {
activeSection: null,
activeComponent: null,
language: null,
reloading: false,
localSettings: null,
moment,
defaultSettings: {
language: 'en',
theme: {
global: 'theme-default',
},
},
};
},
computed: {
...mapState(['user', 'gameLists', 'settings', 'platform']),
dateJoined() {
return moment(this.user.dateJoined).format('LL');
},
data() {
return {
activeSection: null,
activeComponent: null,
language: null,
reloading: false,
localSettings: null,
moment,
defaultSettings: {
language: 'en',
theme: {
global: 'theme-default',
},
},
};
isGameBoard() {
return this.$route.name === 'game-board';
},
computed: {
...mapState(['user', 'gameLists', 'settings', 'platform']),
exitUrl() {
// TODO: move to getter and replace other instances
return process.env.NODE_ENV === 'development'
? 'http://localhost:3000'
: 'https://gamebrary.com';
},
},
dateJoined() {
return moment(this.user.dateJoined).format('LL');
},
mounted() {
this.localSettings = this.settings !== null
? JSON.parse(JSON.stringify(this.settings))
: JSON.parse(JSON.stringify(this.defaultSettings));
isGameBoard() {
return this.$route.name === 'game-board';
},
if (this.platform && !this.localSettings[this.platform.code]) {
this.localSettings[this.platform.code] = {
theme: 'theme-default',
};
}
},
exitUrl() {
// TODO: move to getter and replace other instances
return process.env.NODE_ENV === 'development'
? 'http://localhost:3000'
: 'https://gamebrary.com';
},
methods: {
save() {
this.$store.dispatch('SAVE_SETTINGS', this.localSettings)
.then(() => {
this.$bus.$emit('TOAST', { message: 'Settings saved' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your settings', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
mounted() {
this.localSettings = this.settings !== null
? JSON.parse(JSON.stringify(this.settings))
: JSON.parse(JSON.stringify(this.defaultSettings));
deleteAccount() {
const db = firebase.firestore();
if (this.platform && !this.localSettings[this.platform.code]) {
this.localSettings[this.platform.code] = {
theme: 'theme-default',
};
}
// TODO: Add progress bar, delete tags, files, etc...
// TOOD: move to actions
db.collection('settings').doc(this.user.uid).delete()
.then(() => {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid).delete()
.then(() => {
this.$bus.$emit('TOAST', { message: 'Account deleted' });
this.exit();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
methods: {
save() {
this.$store.dispatch('SAVE_SETTINGS', this.localSettings)
.then(() => {
this.$bus.$emit('TOAST', { message: 'Settings saved' });
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'There was an error saving your settings', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
deleteAccount() {
const db = firebase.firestore();
// TODO: Add progress bar, delete tags, files, etc...
// TOOD: move to actions
db.collection('settings').doc(this.user.uid).delete()
.then(() => {
// TOOD: move to actions
db.collection('lists').doc(this.user.uid).delete()
.then(() => {
this.$bus.$emit('TOAST', { message: 'Account deleted' });
this.exit();
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
})
.catch(() => {
this.$bus.$emit('TOAST', { message: 'Authentication error', type: 'error' });
this.$router.push({ name: 'sessionExpired' });
});
},
signOut() {
firebase.auth().signOut()
.then(() => {
this.exit();
})
.catch((error) => {
this.$bus.$emit('TOAST', { message: error, type: 'error' });
});
},
exit() {
this.$store.commit('CLEAR_SESSION');
window.location.href = this.exitUrl;
},
signOut() {
firebase.auth().signOut()
.then(() => {
this.exit();
})
.catch((error) => {
this.$bus.$emit('TOAST', { message: error, type: 'error' });
});
},
exit() {
this.$store.commit('CLEAR_SESSION');
window.location.href = this.exitUrl;
},
},
};
</script>

620
src/platforms.js
View file

@ -1,314 +1,314 @@
// Platforms reference:
// https://gist.github.com/romancm/3e58f307b8c475cace6a28eae8aee2b5
export default [
{
name: 'Nintendo Switch',
code: 'nintendo-switch',
hex: '#ce181e',
id: 130,
brandingEnabled: true,
},
{
name: 'PlayStation 4',
code: 'ps4',
hex: '#2e6db4',
id: 48,
brandingEnabled: true,
},
{
name: 'Xbox One',
code: 'xbox-one',
id: 49,
hex: '#177d3e',
brandingEnabled: true,
},
{
name: 'PlayStation Vita',
code: 'playstation-vita',
id: 46,
},
{
name: 'Steam',
code: 'steam',
id: 92,
hex: '#171a21',
},
{
name: 'NES',
code: 'nes',
hex: '#ffffff',
id: 18,
},
{
name: 'Wii',
code: 'wii',
hex: '#ffffff',
id: 5,
},
{
name: 'Nintendo 64',
code: 'nintendo-64',
id: 4,
},
{
name: 'Playstation',
code: 'ps',
hex: '#fff',
id: 7,
},
{
name: 'Playstation 2',
code: 'ps2',
hex: '#fff',
id: 8,
},
{
name: 'Playstation 3',
code: 'ps3',
hex: '#fff',
id: 9,
},
{
name: 'PC - Windows',
code: 'win',
id: 6,
},
{
name: 'Super Nintendo',
code: 'snes',
id: 19,
},
{
name: 'Sega Mega Drive / Genesis',
code: 'sega-genesis',
id: 29,
},
{
name: 'Xbox',
code: 'xbox',
id: 11,
},
{
name: 'Xbox 360',
code: 'xbox-360',
id: 12,
},
{
name: 'MS-DOS',
code: 'msdos',
id: 13,
},
{
name: 'Mac',
code: 'mac',
id: 14,
},
{
name: 'Commodore C64/128',
code: 'commodore-64',
id: 15,
hex: '#6f685f',
},
{
name: 'Amiga',
code: 'amiga',
id: 16,
},
{
name: 'Nintendo DS',
code: 'nintendo-ds',
id: '20,159',
},
{
name: 'Nintendo GameCube',
code: 'nintendo-gamecube',
id: 21,
},
{
name: 'Game Boy Color',
code: 'gameboy-color',
id: 22,
},
{
name: 'Dreamcast',
code: 'dreamcast',
id: 23,
},
{
name: 'Game Boy Advance',
code: 'gameboy-advance',
id: 24,
hex: '#1F00CC',
},
{
name: 'Sega 32X',
code: 'sega-32x',
id: 30,
},
{
name: 'Sega Saturn',
code: 'sega-saturn',
id: 32,
},
{
name: 'Game Boy',
code: 'gameboy',
id: 33,
},
{
name: 'Sega Game Gear',
code: 'game-gear',
id: 35,
},
{
name: 'Nintendo 3DS',
code: 'n3ds',
id: '37,137',
},
{
name: 'PSP',
code: 'psp',
id: 38,
},
{
name: 'Wii U',
code: 'wii-u',
id: 41,
},
{
name: '3DO Interactive Multiplayer',
code: '3do',
id: 50,
},
{
name: 'Atari 8-bit',
code: 'atari-800',
id: 65,
},
{
name: 'Atari 2600',
code: 'atari-2600',
id: 59,
},
{
name: 'Atari 7800',
code: 'atari-7800',
id: 60,
},
{
name: 'Neo Geo CD',
code: 'neo-geo-cd',
id: 136,
},
{
name: 'Atari Lynx',
code: 'atari-lynx',
id: 61,
hex: '#000',
},
{
name: 'Atari Jaguar',
code: 'atari-jaguar',
id: 62,
hex: '#231f20',
},
{
name: 'Atari ST',
code: 'atari-st',
id: 63,
},
{
name: 'Sega Master System',
code: 'sega-master-system',
id: 64,
},
{
name: 'Atari 5200',
code: 'atari-5200',
id: 66,
},
{
name: 'Intellivision',
code: 'intellivision',
id: 67,
},
{
name: 'ColecoVision',
code: 'colecovision',
id: 68,
hex: '#000',
},
{
name: 'Vectrex',
code: 'vectrex',
id: 70,
},
{
name: 'Commodore VIC-20',
code: 'vic-20',
id: 71,
},
{
name: 'Apple II',
code: 'apple-2',
hex: '#fff',
id: 75,
},
{
name: 'Sega CD',
code: 'sega-cd',
hex: '#000',
id: 78,
},
{
name: 'Neo Geo MVS',
code: 'neo-geo',
id: '79,80',
},
{
name: 'TurboGrafx-16 (PC Engine / SuperGrafx)',
code: 'pc-engine',
id: '86,128',
},
{
name: 'Nintendo Virtual Boy',
code: 'virtual-boy',
id: 87,
},
{
name: 'Odyssey',
code: 'odyssey',
id: 88,
},
// {
// name: 'Commodore PET',
// code: 'commodore-pet',
// id: 89,
// },
{
name: 'Commodore 16',
code: 'commodore',
id: 93,
},
// {
// name: 'Philips CD-i',
// code: 'philips-cd-i',
// id: 117,
// },
{
name: 'Neo Geo Pocket',
code: 'neo-geo-pocket',
id: '119,120',
},
{
name: 'WonderSwan Color',
code: 'wonderswan-color',
id: 123,
},
{
name: 'Turbografx-16/PC Engine CD',
code: 'turbografx-16',
hex: '#000',
id: 150,
},
{
name: 'Nintendo Switch',
code: 'nintendo-switch',
hex: '#ce181e',
id: 130,
brandingEnabled: true,
},
{
name: 'PlayStation 4',
code: 'ps4',
hex: '#2e6db4',
id: 48,
brandingEnabled: true,
},
{
name: 'Xbox One',
code: 'xbox-one',
id: 49,
hex: '#177d3e',
brandingEnabled: true,
},
{
name: 'PlayStation Vita',
code: 'playstation-vita',
id: 46,
},
{
name: 'Steam',
code: 'steam',
id: 92,
hex: '#171a21',
},
{
name: 'NES',
code: 'nes',
hex: '#ffffff',
id: 18,
},
{
name: 'Wii',
code: 'wii',
hex: '#ffffff',
id: 5,
},
{
name: 'Nintendo 64',
code: 'nintendo-64',
id: 4,
},
{
name: 'Playstation',
code: 'ps',
hex: '#fff',
id: 7,
},
{
name: 'Playstation 2',
code: 'ps2',
hex: '#fff',
id: 8,
},
{
name: 'Playstation 3',
code: 'ps3',
hex: '#fff',
id: 9,
},
{
name: 'PC - Windows',
code: 'win',
id: 6,
},
{
name: 'Super Nintendo',
code: 'snes',
id: 19,
},
{
name: 'Sega Mega Drive / Genesis',
code: 'sega-genesis',
id: 29,
},
{
name: 'Xbox',
code: 'xbox',
id: 11,
},
{
name: 'Xbox 360',
code: 'xbox-360',
id: 12,
},
{
name: 'MS-DOS',
code: 'msdos',
id: 13,
},
{
name: 'Mac',
code: 'mac',
id: 14,
},
{
name: 'Commodore C64/128',
code: 'commodore-64',
id: 15,
hex: '#6f685f',
},
{
name: 'Amiga',
code: 'amiga',
id: 16,
},
{
name: 'Nintendo DS',
code: 'nintendo-ds',
id: '20,159',
},
{
name: 'Nintendo GameCube',
code: 'nintendo-gamecube',
id: 21,
},
{
name: 'Game Boy Color',
code: 'gameboy-color',
id: 22,
},
{
name: 'Dreamcast',
code: 'dreamcast',
id: 23,
},
{
name: 'Game Boy Advance',
code: 'gameboy-advance',
id: 24,
hex: '#1F00CC',
},
{
name: 'Sega 32X',
code: 'sega-32x',
id: 30,
},
{
name: 'Sega Saturn',
code: 'sega-saturn',
id: 32,
},
{
name: 'Game Boy',
code: 'gameboy',
id: 33,
},
{
name: 'Sega Game Gear',
code: 'game-gear',
id: 35,
},
{
name: 'Nintendo 3DS',
code: 'n3ds',
id: '37,137',
},
{
name: 'PSP',
code: 'psp',
id: 38,
},
{
name: 'Wii U',
code: 'wii-u',
id: 41,
},
{
name: '3DO Interactive Multiplayer',
code: '3do',
id: 50,
},
{
name: 'Atari 8-bit',
code: 'atari-800',
id: 65,
},
{
name: 'Atari 2600',
code: 'atari-2600',
id: 59,
},
{
name: 'Atari 7800',
code: 'atari-7800',
id: 60,
},
{
name: 'Neo Geo CD',
code: 'neo-geo-cd',
id: 136,
},
{
name: 'Atari Lynx',
code: 'atari-lynx',
id: 61,
hex: '#000',
},
{
name: 'Atari Jaguar',
code: 'atari-jaguar',
id: 62,
hex: '#231f20',
},
{
name: 'Atari ST',
code: 'atari-st',
id: 63,
},
{
name: 'Sega Master System',
code: 'sega-master-system',
id: 64,
},
{
name: 'Atari 5200',
code: 'atari-5200',
id: 66,
},
{
name: 'Intellivision',
code: 'intellivision',
id: 67,
},
{
name: 'ColecoVision',
code: 'colecovision',
id: 68,
hex: '#000',
},
{
name: 'Vectrex',
code: 'vectrex',
id: 70,
},
{
name: 'Commodore VIC-20',
code: 'vic-20',
id: 71,
},
{
name: 'Apple II',
code: 'apple-2',
hex: '#fff',
id: 75,
},
{
name: 'Sega CD',
code: 'sega-cd',
hex: '#000',
id: 78,
},
{
name: 'Neo Geo MVS',
code: 'neo-geo',
id: '79,80',
},
{
name: 'TurboGrafx-16 (PC Engine / SuperGrafx)',
code: 'pc-engine',
id: '86,128',
},
{
name: 'Nintendo Virtual Boy',
code: 'virtual-boy',
id: 87,
},
{
name: 'Odyssey',
code: 'odyssey',
id: 88,
},
// {
// name: 'Commodore PET',
// code: 'commodore-pet',
// id: 89,
// },
{
name: 'Commodore 16',
code: 'commodore',
id: 93,
},
// {
// name: 'Philips CD-i',
// code: 'philips-cd-i',
// id: 117,
// },
{
name: 'Neo Geo Pocket',
code: 'neo-geo-pocket',
id: '119,120',
},
{
name: 'WonderSwan Color',
code: 'wonderswan-color',
id: 123,
},
{
name: 'Turbografx-16/PC Engine CD',
code: 'turbografx-16',
hex: '#000',
id: 150,
},
];

78
src/router.js
View file

@ -8,43 +8,43 @@ import NotFound from '@/pages/NotFound';
Vue.use(Router);
export default new Router({
mode: 'history',
routes: [
{
name: 'platforms',
path: '/platforms',
component: Platforms,
meta: {
title: 'Platforms',
},
},
{
name: 'sessionExpired',
path: '/session-expired',
component: SessionExpired,
meta: {
title: 'Session expired',
},
},
{
path: '/',
name: 'game-board',
component: GameBoard,
},
{
path: '/settings',
name: 'settings',
component: GameBoard,
},
{
path: '/auth/:authProvider',
name: 'auth',
component: GameBoard,
},
{
path: '*',
name: 'not-found',
component: NotFound,
},
],
mode: 'history',
routes: [
{
name: 'platforms',
path: '/platforms',
component: Platforms,
meta: {
title: 'Platforms',
},
},
{
name: 'sessionExpired',
path: '/session-expired',
component: SessionExpired,
meta: {
title: 'Session expired',
},
},
{
path: '/',
name: 'game-board',
component: GameBoard,
},
{
path: '/settings',
name: 'settings',
component: GameBoard,
},
{
path: '/auth/:authProvider',
name: 'auth',
component: GameBoard,
},
{
path: '*',
name: 'not-found',
component: NotFound,
},
],
});

162
src/store/actions.js
View file

@ -6,96 +6,96 @@ const API_BASE = 'https://us-central1-gamebrary-8c736.cloudfunctions.net';
// const API_BASE = 'http://localhost:5000/gamebrary-8c736/us-central1';
export default {
LOAD_GAMES({ commit }, gameList) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/games?games=${gameList}`)
.then(({ data }) => {
commit('CACHE_GAME_DATA', data);
resolve();
}).catch(reject);
});
},
LOAD_GAMES({ commit }, gameList) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/games?games=${gameList}`)
.then(({ data }) => {
commit('CACHE_GAME_DATA', data);
resolve();
}).catch(reject);
});
},
SAVE_LIST({ commit, state }, payload) {
const db = firebase.firestore();
SAVE_LIST({ commit, state }, payload) {
const db = firebase.firestore();
db.collection('lists').doc(state.user.uid).set(payload, { merge: true })
.then(() => {
commit('SAVE_LISTS', payload);
});
},
db.collection('lists').doc(state.user.uid).set(payload, { merge: true })
.then(() => {
commit('SAVE_LISTS', payload);
});
},
SAVE_LIST_NO_MERGE({ commit, state }, payload) {
const db = firebase.firestore();
SAVE_LIST_NO_MERGE({ commit, state }, payload) {
const db = firebase.firestore();
db.collection('lists').doc(state.user.uid).set(payload, { merge: false })
.then(() => {
commit('SAVE_LISTS', payload);
});
},
db.collection('lists').doc(state.user.uid).set(payload, { merge: false })
.then(() => {
commit('SAVE_LISTS', payload);
});
},
SAVE_SETTINGS({ commit, state }, settings) {
const db = firebase.firestore();
SAVE_SETTINGS({ commit, state }, settings) {
const db = firebase.firestore();
return new Promise((resolve, reject) => {
db.collection('settings').doc(state.user.uid).set(settings, { merge: true })
.then(() => {
commit('SET_SETTINGS', settings);
resolve();
})
.catch(reject);
});
},
return new Promise((resolve, reject) => {
db.collection('settings').doc(state.user.uid).set(settings, { merge: true })
.then(() => {
commit('SET_SETTINGS', settings);
resolve();
})
.catch(reject);
});
},
LOAD_RELEASES({ commit }) {
return new Promise((resolve, reject) => {
axios.get('https://api.github.com/repos/romancm/gamebrary/releases')
.then(({ data }) => {
commit('SET_RELEASES', data);
resolve();
}).catch(reject);
});
},
LOAD_RELEASES({ commit }) {
return new Promise((resolve, reject) => {
axios.get('https://api.github.com/repos/romancm/gamebrary/releases')
.then(({ data }) => {
commit('SET_RELEASES', data);
resolve();
}).catch(reject);
});
},
LOAD_PUBLIC_GAMES({ commit }, gameList) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/games?games=${gameList}`)
.then(({ data }) => {
commit('SET_PUBLIC_GAME_DATA', data);
resolve();
}).catch(reject);
});
},
LOAD_PUBLIC_GAMES({ commit }, gameList) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/games?games=${gameList}`)
.then(({ data }) => {
commit('SET_PUBLIC_GAME_DATA', data);
resolve();
}).catch(reject);
});
},
LOAD_GAME({ commit }, gameId) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/game?gameId=${gameId}`)
.then(({ data }) => {
commit('SET_ACTIVE_GAME', data);
resolve();
}).catch(reject);
});
},
LOAD_GAME({ commit }, gameId) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/game?gameId=${gameId}`)
.then(({ data }) => {
commit('SET_ACTIVE_GAME', data);
resolve();
}).catch(reject);
});
},
SEARCH({ commit, state }, searchText) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/search?search=${searchText}&platform=${state.platform.id}`)
.then(({ data }) => {
commit('SET_SEARCH_RESULTS', data);
commit('CACHE_GAME_DATA', data);
resolve();
}).catch(reject);
});
},
SEARCH({ commit, state }, searchText) {
return new Promise((resolve, reject) => {
axios.get(`${API_BASE}/search?search=${searchText}&platform=${state.platform.id}`)
.then(({ data }) => {
commit('SET_SEARCH_RESULTS', data);
commit('CACHE_GAME_DATA', data);
resolve();
}).catch(reject);
});
},
SEND_WELCOME_EMAIL(context, additionalUserInfo) {
return new Promise((resolve, reject) => {
if (additionalUserInfo && additionalUserInfo.profile) {
axios.get(`${API_BASE}/email?address=${additionalUserInfo.profile.email}&template_id=welcome`)
.catch(reject);
} else {
reject();
}
});
},
SEND_WELCOME_EMAIL(context, additionalUserInfo) {
return new Promise((resolve, reject) => {
if (additionalUserInfo && additionalUserInfo.profile) {
axios.get(`${API_BASE}/email?address=${additionalUserInfo.profile.email}&template_id=welcome`)
.catch(reject);
} else {
reject();
}
});
},
};

180
src/store/getters.js
View file

@ -1,100 +1,100 @@
import platforms from '@/platforms';
export default {
// eslint-disable-next-line
// eslint-disable-next-line
ageRatings: () => {
return {
1: '3',
2: '7',
3: '12',
4: '16',
5: '18',
6: 'RP',
7: 'EC',
8: 'E',
9: 'E10',
10: 'T',
11: 'M',
12: 'AO',
};
},
releaseDate: (state) => {
// eslint-disable-next-line
const releaseDate = state.game && state.game.release_dates
? state.game.release_dates.filter(({ platform }) => state.platform.id === platform)
: null;
return releaseDate && releaseDate.length
? releaseDate[0].date
: null;
},
developers: (state) => {
const developers = state.game && state.game.involved_companies
? state.game.involved_companies.filter(({ developer }) => developer)
: null;
return developers
? developers.map(publisher => publisher.company.name).join(', ')
: null;
},
publishers: (state) => {
const publishers = state.game && state.game.involved_companies
? state.game.involved_companies.filter(({ publisher }) => publisher)
: null;
return publishers
? publishers.map(publisher => publisher.company.name).join(', ')
: null;
},
genres: (state) => {
const genres = state.game && state.game.genres
? state.game.genres
: null;
return genres
? genres.map(genre => genre.name).join(', ')
: null;
},
playerPerspectives: (state) => {
const perspectives = state.game && state.game.player_perspectives
? state.game.player_perspectives
: null;
return perspectives
? perspectives.map(perspective => perspective.name).join(', ')
: null;
},
gameModes: (state) => {
const gameModes = state.game && state.game.game_modes
? state.game.game_modes
: null;
return gameModes
? gameModes.map(gameMode => gameMode.name).join(', ')
: null;
},
gamePlatforms: (state) => {
const gamePlatforms = state.game && state.game.platforms
? state.game.platforms.map(platform => platform.id)
: null;
return platforms.filter(({ id }) => id !== state.platform.id && gamePlatforms.includes(id));
},
return {
1: '3',
2: '7',
3: '12',
4: '16',
5: '18',
6: 'RP',
7: 'EC',
8: 'E',
9: 'E10',
10: 'T',
11: 'M',
12: 'AO',
};
},
releaseDate: (state) => {
// eslint-disable-next-line
const releaseDate = state.game && state.game.release_dates
? state.game.release_dates.filter(({ platform }) => state.platform.id === platform)
: null;
return releaseDate && releaseDate.length
? releaseDate[0].date
: null;
},
developers: (state) => {
const developers = state.game && state.game.involved_companies
? state.game.involved_companies.filter(({ developer }) => developer)
: null;
return developers
? developers.map(publisher => publisher.company.name).join(', ')
: null;
},
publishers: (state) => {
const publishers = state.game && state.game.involved_companies
? state.game.involved_companies.filter(({ publisher }) => publisher)
: null;
return publishers
? publishers.map(publisher => publisher.company.name).join(', ')
: null;
},
genres: (state) => {
const genres = state.game && state.game.genres
? state.game.genres
: null;
return genres
? genres.map(genre => genre.name).join(', ')
: null;
},
playerPerspectives: (state) => {
const perspectives = state.game && state.game.player_perspectives
? state.game.player_perspectives
: null;
return perspectives
? perspectives.map(perspective => perspective.name).join(', ')
: null;
},
gameModes: (state) => {
const gameModes = state.game && state.game.game_modes
? state.game.game_modes
: null;
return gameModes
? gameModes.map(gameMode => gameMode.name).join(', ')
: null;
},
gamePlatforms: (state) => {
const gamePlatforms = state.game && state.game.platforms
? state.game.platforms.map(platform => platform.id)
: null;
return platforms.filter(({ id }) => id !== state.platform.id && gamePlatforms.includes(id));
},
// eslint-disable-next-line
activeList: ({ gameLists, platform, activeListIndex }) => gameLists[platform.code][activeListIndex],
brandingEnabled: ({ settings, platform }) => {
const brandingEnabled = settings && settings.branding;
const brandingAvailble = platform && platform.brandingEnabled && Boolean(platform.hex);
brandingEnabled: ({ settings, platform }) => {
const brandingEnabled = settings && settings.branding;
const brandingAvailble = platform && platform.brandingEnabled && Boolean(platform.hex);
return Boolean(brandingEnabled && brandingAvailble);
},
return Boolean(brandingEnabled && brandingAvailble);
},
};

14
src/store/index.js
View file

@ -10,14 +10,14 @@ import getters from './getters';
Vue.use(Vuex);
const vuexLocalStorage = new VuexPersist({
key: 'vuex',
storage: window.localStorage,
key: 'vuex',
storage: window.localStorage,
});
export default new Vuex.Store({
state,
actions,
mutations,
getters,
plugins: [vuexLocalStorage.plugin],
state,
actions,
mutations,
getters,
plugins: [vuexLocalStorage.plugin],
});

258
src/store/mutations.js
View file

@ -1,167 +1,167 @@
import Vue from 'vue';
export default {
SET_USER(state, data) {
state.user = {
lastLogin: data.metadata.lastSignInTime,
uid: data.uid,
displayName: data.displayName,
email: data.email,
emailVerified: data.emailVerified,
dateJoined: data.metadata.creationTime,
photoURL: data.photoURL,
};
},
SET_USER(state, data) {
state.user = {
lastLogin: data.metadata.lastSignInTime,
uid: data.uid,
displayName: data.displayName,
email: data.email,
emailVerified: data.emailVerified,
dateJoined: data.metadata.creationTime,
photoURL: data.photoURL,
};
},
SET_GAME_LISTS(state, lists) {
state.gameLists = lists;
},
SET_GAME_LISTS(state, lists) {
state.gameLists = lists;
},
SET_SLIDESHOW_OPEN(state, status) {
state.galleryOpen = status;
},
SET_SLIDESHOW_OPEN(state, status) {
state.galleryOpen = status;
},
SET_WALLPAPER_URL(state, url) {
state.wallpaperUrl = url;
},
SET_WALLPAPER_URL(state, url) {
state.wallpaperUrl = url;
},
UPDATE_TAG(state, { tagName, tagHex, tempTag }) {
const updatedTag = {
...state.tags[tempTag.tagName],
hex: tagHex,
};
UPDATE_TAG(state, { tagName, tagHex, tempTag }) {
const updatedTag = {
...state.tags[tempTag.tagName],
hex: tagHex,
};
const renaming = tagName !== tempTag.tagName;
const renaming = tagName !== tempTag.tagName;
if (renaming) {
Vue.set(state.tags, tagName, updatedTag);
Vue.delete(state.tags, tempTag.tagName);
} else {
state.tags[tempTag.tagName] = updatedTag;
}
},
if (renaming) {
Vue.set(state.tags, tagName, updatedTag);
Vue.delete(state.tags, tempTag.tagName);
} else {
state.tags[tempTag.tagName] = updatedTag;
}
},
SET_RELEASES(state, releases) {
state.releases = releases;
},
SET_RELEASES(state, releases) {
state.releases = releases;
},
SET_TAGS(state, tags) {
state.tags = tags;
},
SET_TAGS(state, tags) {
state.tags = tags;
},
SET_NOTES(state, notes) {
state.notes = notes;
},
SET_NOTES(state, notes) {
state.notes = notes;
},
ADD_GAME_TAG(state, { tagName, gameId }) {
state.tags[tagName].games.push(gameId);
},
ADD_GAME_TAG(state, { tagName, gameId }) {
state.tags[tagName].games.push(gameId);
},
REMOVE_GAME_TAG(state, { tagName, gameId }) {
state.tags[tagName].games.splice(state.tags[tagName].games.indexOf(gameId), 1);
},
REMOVE_GAME_TAG(state, { tagName, gameId }) {
state.tags[tagName].games.splice(state.tags[tagName].games.indexOf(gameId), 1);
},
CLEAR_SESSION(state) {
state.user = null;
state.activeListIndex = null;
state.gameLists = {};
state.settings = null;
state.platform = null;
state.results = null;
state.games = {};
state.publicGameData = {};
state.game = null;
},
CLEAR_SESSION(state) {
state.user = null;
state.activeListIndex = null;
state.gameLists = {};
state.settings = null;
state.platform = null;
state.results = null;
state.games = {};
state.publicGameData = {};
state.game = null;
},
SET_SEARCH_RESULTS(state, results) {
state.results = results;
},
SET_SEARCH_RESULTS(state, results) {
state.results = results;
},
CLEAR_SEARCH_RESULTS(state) {
state.results = [];
},
CLEAR_SEARCH_RESULTS(state) {
state.results = [];
},
SET_ACTIVE_GAME(state, [game]) {
state.game = game;
},
SET_ACTIVE_GAME(state, [game]) {
state.game = game;
},
CLEAR_ACTIVE_GAME(state) {
state.game = null;
},
CLEAR_ACTIVE_GAME(state) {
state.game = null;
},
SET_EDIT_GAME(state, { listId, gameId }) {
state.editGame = gameId;
state.activeListIndex = listId;
},
SET_EDIT_GAME(state, { listId, gameId }) {
state.editGame = gameId;
state.activeListIndex = listId;
},
SET_ACTIVE_LIST_INDEX(state, listIndex) {
state.activeListIndex = listIndex;
},
SET_ACTIVE_LIST_INDEX(state, listIndex) {
state.activeListIndex = listIndex;
},
CLEAR_ACTIVE_LIST_INDEX(state) {
state.activeListIndex = null;
state.addingList = false;
},
CLEAR_ACTIVE_LIST_INDEX(state) {
state.activeListIndex = null;
state.addingList = false;
},
SET_PLATFORM(state, platform) {
state.platform = platform;
},
SET_PLATFORM(state, platform) {
state.platform = platform;
},
SAVE_LISTS(state, lists) {
state.gameLists = lists;
},
SAVE_LISTS(state, lists) {
state.gameLists = lists;
},
UPDATE_LIST_TYPE(state, { listIndex, type }) {
state.gameLists[state.platform.code][listIndex].type = type;
},
UPDATE_LIST_TYPE(state, { listIndex, type }) {
state.gameLists[state.platform.code][listIndex].type = type;
},
SET_SETTINGS(state, settings) {
state.settings = settings;
},
SET_SETTINGS(state, settings) {
state.settings = settings;
},
// MOVE_LIST(state, { from, to }) {
// const cutOut = state.gameLists[state.platform.code].splice(from, 1)[0];
//
// state.gameLists[state.platform.code].splice(to, 0, cutOut);
// },
// MOVE_LIST(state, { from, to }) {
// const cutOut = state.gameLists[state.platform.code].splice(from, 1)[0];
//
// state.gameLists[state.platform.code].splice(to, 0, cutOut);
// },
REMOVE_LIST(state, index) {
state.gameLists[state.platform.code].splice(index, 1);
},
REMOVE_LIST(state, index) {
state.gameLists[state.platform.code].splice(index, 1);
},
REMOVE_PLATFORM(state) {
Vue.delete(state.gameLists, state.platform.code);
},
REMOVE_PLATFORM(state) {
Vue.delete(state.gameLists, state.platform.code);
},
ADD_GAME(state, { gameId, listId }) {
const currentList = state.gameLists[state.platform.code][listId];
ADD_GAME(state, { gameId, listId }) {
const currentList = state.gameLists[state.platform.code][listId];
currentList.games.push(gameId);
},
currentList.games.push(gameId);
},
ADD_LIST(state, list) {
if (!state.gameLists[state.platform.code]) {
Vue.set(state.gameLists, state.platform.code, []);
}
ADD_LIST(state, list) {
if (!state.gameLists[state.platform.code]) {
Vue.set(state.gameLists, state.platform.code, []);
}
state.gameLists[state.platform.code].push(list);
},
state.gameLists[state.platform.code].push(list);
},
REMOVE_GAME(state, { gameId, listId }) {
const currentList = state.gameLists[state.platform.code][listId];
REMOVE_GAME(state, { gameId, listId }) {
const currentList = state.gameLists[state.platform.code][listId];
currentList.games.splice(currentList.games.indexOf(gameId), 1);
},
currentList.games.splice(currentList.games.indexOf(gameId), 1);
},
CACHE_GAME_DATA(state, data) {
data.forEach((game) => {
Vue.set(state.games, game.id, { ...game });
});
},
CACHE_GAME_DATA(state, data) {
data.forEach((game) => {
Vue.set(state.games, game.id, { ...game });
});
},
SET_PUBLIC_GAME_DATA(state, data) {
data.forEach((game) => {
Vue.set(state.publicGameData, game.id, { ...game });
});
},
SET_PUBLIC_GAME_DATA(state, data) {
data.forEach((game) => {
Vue.set(state.publicGameData, game.id, { ...game });
});
},
};

28
src/store/state.js
View file

@ -1,16 +1,16 @@
export default {
user: null,
releases: null,
tags: {},
notes: {},
activeListIndex: null,
gameLists: {},
settings: null,
platform: null,
results: null,
galleryOpen: false,
games: {},
publicGameData: {},
game: null,
wallpaperUrl: null,
user: null,
releases: null,
tags: {},
notes: {},
activeListIndex: null,
gameLists: {},
settings: null,
platform: null,
results: null,
galleryOpen: false,
games: {},
publicGameData: {},
game: null,
wallpaperUrl: null,
};

64
src/themes.js
View file

@ -1,38 +1,38 @@
export default [
{
name: 'Default',
id: 'default',
description: '',
author: {
name: 'Gamebrary staff',
url: 'http://google.com',
},
{
name: 'Default',
id: 'default',
description: '',
author: {
name: 'Gamebrary staff',
url: 'http://google.com',
},
{
name: 'City lights',
id: 'city-lights',
description: 'Inspired on the awesome theme developed by YummyGum http://citylights.xyz/',
author: {
name: 'Gamebrary staff',
url: 'http://gamebrary.com',
},
},
{
name: 'City lights',
id: 'city-lights',
description: 'Inspired on the awesome theme developed by YummyGum http://citylights.xyz/',
author: {
name: 'Gamebrary staff',
url: 'http://gamebrary.com',
},
{
name: 'Dark',
id: 'dark',
description: 'Dark theme',
author: {
name: 'Gamebrary staff',
url: 'http://gamebrary.com',
},
},
{
name: 'Dark',
id: 'dark',
description: 'Dark theme',
author: {
name: 'Gamebrary staff',
url: 'http://gamebrary.com',
},
{
name: 'Blue',
id: 'blue',
description: 'Blue theme',
author: {
name: 'Gamebrary staff',
url: 'http://gamebrary.com',
},
},
{
name: 'Blue',
id: 'blue',
description: 'Blue theme',
author: {
name: 'Gamebrary staff',
url: 'http://gamebrary.com',
},
},
];

48
test/unit/karma.conf.js
View file

@ -6,28 +6,28 @@
const webpackConfig = require('../../build/webpack.test.conf');
module.exports = function karmaConfig(config) {
config.set({
// to run in additional browsers:
// 1. install corresponding karma launcher
// http://karma-runner.github.io/0.13/config/browsers.html
// 2. add it to the `browsers` array below.
browsers: ['PhantomJS'],
frameworks: ['mocha', 'sinon-chai', 'phantomjs-shim'],
reporters: ['spec', 'coverage'],
files: ['./index.js'],
preprocessors: {
'./index.js': ['webpack', 'sourcemap'],
},
webpack: webpackConfig,
webpackMiddleware: {
noInfo: true,
},
coverageReporter: {
dir: './coverage',
reporters: [
{ type: 'lcov', subdir: '.' },
{ type: 'text-summary' },
],
},
});
config.set({
// to run in additional browsers:
// 1. install corresponding karma launcher
// http://karma-runner.github.io/0.13/config/browsers.html
// 2. add it to the `browsers` array below.
browsers: ['PhantomJS'],
frameworks: ['mocha', 'sinon-chai', 'phantomjs-shim'],
reporters: ['spec', 'coverage'],
files: ['./index.js'],
preprocessors: {
'./index.js': ['webpack', 'sourcemap'],
},
webpack: webpackConfig,
webpackMiddleware: {
noInfo: true,
},
coverageReporter: {
dir: './coverage',
reporters: [
{ type: 'lcov', subdir: '.' },
{ type: 'text-summary' },
],
},
});
};