mirror of
https://github.com/romancm/gamebrary
synced 2024-11-10 05:34:15 +00:00
Layout tweaks and game news improvements
This commit is contained in:
parent
bac32e2fe3
commit
1efc5c87bc
35 changed files with 1675 additions and 1606 deletions
|
@ -14,6 +14,9 @@
|
|||
"deploy": "firebase deploy"
|
||||
},
|
||||
"dependencies": {
|
||||
"@bbob/core": "^2.8.1",
|
||||
"@bbob/html": "^2.8.1",
|
||||
"@bbob/preset-html5": "^2.8.1",
|
||||
"@vue-stripe/vue-stripe": "^4.4.2",
|
||||
"axios": "^0.21.1",
|
||||
"bootstrap": "^4.5.2",
|
||||
|
@ -23,7 +26,7 @@
|
|||
"firebase-admin": "^9.2.0",
|
||||
"firebase-functions": "^3.11.0",
|
||||
"firebaseui": "^4.8.0",
|
||||
"js-bbcode-parser": "^3.0.5",
|
||||
"js-bbcode-parser": "^4.0.0",
|
||||
"lodash.chunk": "^4.2.0",
|
||||
"lodash.groupby": "^4.6.0",
|
||||
"lodash.orderby": "^4.6.0",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template lang="html">
|
||||
<b-card
|
||||
v-if="active"
|
||||
v-if="active || empty"
|
||||
class="flex-shrink-0"
|
||||
no-body
|
||||
v-click-outside="reset"
|
||||
|
@ -55,6 +55,10 @@
|
|||
import { mapState } from 'vuex';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
empty: Boolean,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
listName: '',
|
||||
|
|
|
@ -1,36 +0,0 @@
|
|||
<template lang="html">
|
||||
<div class="empty-board text-center rounded p-3 mx-auto my-2 bg-secondary">
|
||||
<p class="lead">This board is empty!</p>
|
||||
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
:to="{ name: 'board.edit', params: { id: board.id } }"
|
||||
>
|
||||
Edit board
|
||||
</b-button>
|
||||
|
||||
<!-- <b-button
|
||||
block
|
||||
variant="primary"
|
||||
>
|
||||
Add list
|
||||
</b-button> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
...mapState(['board']),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" rel="stylesheet/scss" scoped>
|
||||
.empty-board {
|
||||
width: 300px;
|
||||
}
|
||||
</style>
|
|
@ -1,38 +1,38 @@
|
|||
<template lang="html">
|
||||
<div class="mt-3">
|
||||
<div v-if="gameGenres" class="pr-2 pb-2 small">
|
||||
<div v-if="gameGenres" class="pr-2 pb-2">
|
||||
<strong>Genres:</strong>
|
||||
|
||||
{{ gameGenres }}
|
||||
</div>
|
||||
|
||||
<div v-if="gameModes" class="pr-2 pb-2 small">
|
||||
<div v-if="gameModes" class="pr-2 pb-2">
|
||||
<strong>{{ $t('board.gameModal.gameModes') }}: </strong>
|
||||
<span class="text-wrap">{{ gameModes }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="gameDevelopers" class="pr-2 pb-2 small">
|
||||
<div v-if="gameDevelopers" class="pr-2 pb-2">
|
||||
<strong>{{ $t('board.gameModal.developers') }}: </strong>
|
||||
<span class="text-wrap">{{ gameDevelopers }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="gamePublishers" class="pr-2 pb-2 small">
|
||||
<div v-if="gamePublishers" class="pr-2 pb-2">
|
||||
<strong>{{ $t('board.gameModal.publishers') }}: </strong>
|
||||
<span class="text-wrap">{{ gamePublishers }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="playerPerspectives" class="pr-2 pb-2 small">
|
||||
<div v-if="playerPerspectives" class="pr-2 pb-2">
|
||||
<strong>{{ $t('board.gameModal.perspective') }}: </strong>
|
||||
<span class="text-wrap">{{ playerPerspectives }}</span>
|
||||
</div>
|
||||
|
||||
<div class="pr-2 pb-2 small">
|
||||
<div class="pr-2 pb-2">
|
||||
<strong>Available for: </strong>
|
||||
|
||||
<span class="text-wrap">{{ gamePlatforms || 'N/A' }}</span>
|
||||
</div>
|
||||
|
||||
<div class="pr-2 pb-2 small">
|
||||
<div class="pr-2 pb-2">
|
||||
<strong>{{ $t('board.gameModal.releaseDate') }}</strong>
|
||||
<ol v-if="releaseDates" class="list-unstyled mb-0">
|
||||
<li
|
||||
|
|
|
@ -107,7 +107,7 @@ export default {
|
|||
|
||||
const igdbVideos = this.game?.videos?.map((video) => {
|
||||
return {
|
||||
imageUrl: `https://img.youtube.com/vi/${video.video_id}/sddefault.jpg`,
|
||||
imageUrl: `https://img.youtube.com/vi/${video.video_id}/default.jpg`,
|
||||
videoUrl: `https://www.youtube.com/embed/${video.video_id}?rel=0&autoplay=1`,
|
||||
video: true,
|
||||
source: 'youtube',
|
||||
|
|
|
@ -41,7 +41,7 @@
|
|||
|
||||
<b-button
|
||||
v-else
|
||||
class="mr-3"
|
||||
class="mr-2"
|
||||
variant="dark"
|
||||
:to="{ name: 'auth' }"
|
||||
>
|
||||
|
|
|
@ -1,46 +1,48 @@
|
|||
<template lang="html">
|
||||
<b-container class="py-3">
|
||||
<div v-html="formattedReadme" />
|
||||
<!-- <vue-markdown
|
||||
class="w-100"
|
||||
v-if="readme"
|
||||
:source="readme"
|
||||
/> -->
|
||||
<section>
|
||||
<b-container class="py-3">
|
||||
<div v-html="formattedReadme" />
|
||||
<!-- <vue-markdown
|
||||
class="w-100"
|
||||
v-if="readme"
|
||||
:source="readme"
|
||||
/> -->
|
||||
|
||||
<div v-if="repo" class="mb-4">
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary/subscription"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.watch') }} <b-badge variant="light">{{ repo.watchers }}</b-badge>
|
||||
</b-button>
|
||||
<div v-if="repo" class="mb-4">
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary/subscription"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.watch') }} <b-badge variant="light">{{ repo.watchers }}</b-badge>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.star') }} <b-badge variant="light">{{ repo.stargazers_count }}</b-badge>
|
||||
</b-button>
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.star') }} <b-badge variant="light">{{ repo.stargazers_count }}</b-badge>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary/fork"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.fork') }} <b-badge variant="light">{{ repo.forks }}</b-badge>
|
||||
</b-button>
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary/fork"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.fork') }} <b-badge variant="light">{{ repo.forks }}</b-badge>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary/issues"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.issues') }} <b-badge variant="light">{{ repo.open_issues }}</b-badge>
|
||||
</b-button>
|
||||
</div>
|
||||
</b-container>
|
||||
<b-button
|
||||
size="sm"
|
||||
href="https://github.com/romancm/gamebrary/issues"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('gitHub.issues') }} <b-badge variant="light">{{ repo.open_issues }}</b-badge>
|
||||
</b-button>
|
||||
</div>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,18 +1,20 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">Login</portal>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">Login</portal>
|
||||
|
||||
<b-alert
|
||||
class="mx-auto text-center"
|
||||
:show="showExpiredAlert"
|
||||
style="width: 220px"
|
||||
variant="warning"
|
||||
>
|
||||
Session expired
|
||||
</b-alert>
|
||||
<b-alert
|
||||
class="mx-auto text-center"
|
||||
:show="showExpiredAlert"
|
||||
style="width: 220px"
|
||||
variant="warning"
|
||||
>
|
||||
Session expired
|
||||
</b-alert>
|
||||
|
||||
<section id="auth" />
|
||||
</b-container>
|
||||
<section id="auth" />
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -43,9 +43,10 @@
|
|||
:key="list.name"
|
||||
/>
|
||||
|
||||
<empty-board v-if="empty" />
|
||||
|
||||
<add-list v-else-if="user && user.uid && user.uid === board.owner" />
|
||||
<add-list
|
||||
v-if="isBoardOwner"
|
||||
:empty="empty"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<b-alert
|
||||
|
@ -60,7 +61,6 @@
|
|||
|
||||
<script>
|
||||
import BoardPlaceholder from '@/components/Board/BoardPlaceholder';
|
||||
import EmptyBoard from '@/components/Board/EmptyBoard';
|
||||
import AddList from '@/components/Board/AddList';
|
||||
import GameList from '@/components/Lists/GameList';
|
||||
import chunk from 'lodash.chunk';
|
||||
|
@ -70,7 +70,6 @@ export default {
|
|||
components: {
|
||||
GameList,
|
||||
BoardPlaceholder,
|
||||
EmptyBoard,
|
||||
AddList,
|
||||
},
|
||||
|
||||
|
|
|
@ -1,62 +1,64 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">Create board</portal>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">Create board</portal>
|
||||
|
||||
<b-form @submit.prevent="createBoard" class="field centered">
|
||||
<b-form-group label="Board name:" label-for="boardName">
|
||||
<b-form-input
|
||||
id="boardName"
|
||||
v-model.trim="board.name"
|
||||
placeholder="PS4 collection, Nintendo Switch, etc..."
|
||||
autofocus
|
||||
required
|
||||
/>
|
||||
</b-form-group>
|
||||
<b-form @submit.prevent="createBoard" class="field centered">
|
||||
<b-form-group label="Board name:" label-for="boardName">
|
||||
<b-form-input
|
||||
id="boardName"
|
||||
v-model.trim="board.name"
|
||||
placeholder="PS4 collection, Nintendo Switch, etc..."
|
||||
autofocus
|
||||
required
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label="Board description"
|
||||
label-for="boardDescription"
|
||||
>
|
||||
<b-form-textarea
|
||||
id="boardDescription"
|
||||
v-model="board.description"
|
||||
maxlength="280"
|
||||
rows="2"
|
||||
/>
|
||||
</b-form-group>
|
||||
<b-form-group
|
||||
label="Board description"
|
||||
label-for="boardDescription"
|
||||
>
|
||||
<b-form-textarea
|
||||
id="boardDescription"
|
||||
v-model="board.description"
|
||||
maxlength="280"
|
||||
rows="2"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<!-- <b-form-group
|
||||
label="Board template"
|
||||
>
|
||||
<b-form-radio-group
|
||||
v-model="selectedTemplate"
|
||||
:options="boardTemplatesOptions"
|
||||
name="radios-btn-default"
|
||||
description="Optional"
|
||||
/>
|
||||
<!-- <b-form-group
|
||||
label="Board template"
|
||||
>
|
||||
<b-form-radio-group
|
||||
v-model="selectedTemplate"
|
||||
:options="boardTemplatesOptions"
|
||||
name="radios-btn-default"
|
||||
description="Optional"
|
||||
/>
|
||||
|
||||
<b-row v-if="selectedTemplate" class="mt-3">
|
||||
<b-col v-for="column in boardTemplates[selectedTemplate]" :key="column">
|
||||
<b-card
|
||||
:header="column"
|
||||
header-tag="header"
|
||||
header-class="p-1 pl-2"
|
||||
hide-footer
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-form-group> -->
|
||||
<b-row v-if="selectedTemplate" class="mt-3">
|
||||
<b-col v-for="column in boardTemplates[selectedTemplate]" :key="column">
|
||||
<b-card
|
||||
:header="column"
|
||||
header-tag="header"
|
||||
header-class="p-1 pl-2"
|
||||
hide-footer
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-form-group> -->
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
loading
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<template v-else>Create board</template>
|
||||
</b-button>
|
||||
</b-form>
|
||||
</b-container>
|
||||
<b-button
|
||||
variant="primary"
|
||||
loading
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<template v-else>Create board</template>
|
||||
</b-button>
|
||||
</b-form>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
<!-- TODO: finish -->
|
||||
<template lang="html">
|
||||
<b-container>
|
||||
Create note
|
||||
|
|
|
@ -1,58 +1,60 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
:to="{ name: 'tags' }"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Create tag
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<form @submit.prevent="submit" class="field centered">
|
||||
<b-form-input
|
||||
v-model.trim="tag.name"
|
||||
class="mb-3 field"
|
||||
maxlength="20"
|
||||
:placeholder="$t('tags.form.inputPlaceholder')"
|
||||
required
|
||||
trim
|
||||
/>
|
||||
|
||||
<p>Background color</p>
|
||||
<v-swatches v-model="tag.bgColor" show-fallback />
|
||||
|
||||
<p>Text color</p>
|
||||
<v-swatches v-model="tag.textColor" show-fallback />
|
||||
|
||||
<p>Preview</p>
|
||||
|
||||
<b-button
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
:to="{ name: 'tags' }"
|
||||
rounded
|
||||
block
|
||||
size="sm"
|
||||
class="mr-2 mb-2 field"
|
||||
variant="outline-light"
|
||||
:style="`background-color: ${tag.bgColor}; color: ${tag.textColor}`"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
{{ tag.name || 'Tag preview' }}
|
||||
</b-button>
|
||||
|
||||
Create tag
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<form @submit.prevent="submit" class="field centered">
|
||||
<b-form-input
|
||||
v-model.trim="tag.name"
|
||||
class="mb-3 field"
|
||||
maxlength="20"
|
||||
:placeholder="$t('tags.form.inputPlaceholder')"
|
||||
required
|
||||
trim
|
||||
/>
|
||||
|
||||
<p>Background color</p>
|
||||
<v-swatches v-model="tag.bgColor" show-fallback />
|
||||
|
||||
<p>Text color</p>
|
||||
<v-swatches v-model="tag.textColor" show-fallback />
|
||||
|
||||
<p>Preview</p>
|
||||
|
||||
<b-button
|
||||
rounded
|
||||
block
|
||||
size="sm"
|
||||
class="mr-2 mb-2 field"
|
||||
variant="outline-light"
|
||||
:style="`background-color: ${tag.bgColor}; color: ${tag.textColor}`"
|
||||
>
|
||||
{{ tag.name || 'Tag preview' }}
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>Create</span>
|
||||
</b-button>
|
||||
</form>
|
||||
</b-container>
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>Create</span>
|
||||
</b-button>
|
||||
</form>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<game-boards />
|
||||
</b-container>
|
||||
<section>
|
||||
<b-container>
|
||||
<game-boards />
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,100 +1,102 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<page-title
|
||||
title="Dev tools"
|
||||
/>
|
||||
<section>
|
||||
<b-container>
|
||||
<page-title
|
||||
title="Dev tools"
|
||||
/>
|
||||
|
||||
<div
|
||||
v-for="variant in variants"
|
||||
:key="variant"
|
||||
class="mb-3"
|
||||
>
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="variant"
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
<div
|
||||
v-for="variant in variants"
|
||||
:key="variant"
|
||||
class="mb-3"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="variant"
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="`outline-${variant}`"
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="`${variant}`"
|
||||
pill
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="`${variant}`"
|
||||
squared
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
</div>
|
||||
|
||||
<h1>Axiom Verge</h1>
|
||||
<h2>Axiom Verge</h2>
|
||||
<h3>Axiom Verge</h3>
|
||||
<h4>Axiom Verge</h4>
|
||||
<h5>Axiom Verge</h5>
|
||||
<h6>Axiom Verge</h6>
|
||||
|
||||
<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>
|
||||
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
|
||||
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
|
||||
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
|
||||
<div class="p-3 mb-2 bg-warning text-dark">.bg-warning</div>
|
||||
<div class="p-3 mb-2 bg-info text-white">.bg-info</div>
|
||||
<div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
|
||||
<div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
|
||||
<div class="p-3 mb-2 bg-white text-dark">.bg-white</div>
|
||||
<div class="p-3 mb-2 bg-transparent text-dark">.bg-transparent</div>
|
||||
|
||||
<b-dropdown text="Dropdown Button">
|
||||
<b-dropdown-item>First Action</b-dropdown-item>
|
||||
<b-dropdown-item>Second Action</b-dropdown-item>
|
||||
<b-dropdown-item>Third Action</b-dropdown-item>
|
||||
<b-dropdown-divider></b-dropdown-divider>
|
||||
<b-dropdown-item active>Active action</b-dropdown-item>
|
||||
<b-dropdown-item disabled>Disabled action</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
|
||||
<b-alert show variant="primary">Primary Alert</b-alert>
|
||||
<b-alert show variant="secondary">Secondary Alert</b-alert>
|
||||
<b-alert show variant="success">Success Alert</b-alert>
|
||||
<b-alert show variant="danger">Danger Alert</b-alert>
|
||||
<b-alert show variant="warning">Warning Alert</b-alert>
|
||||
<b-alert show variant="info">Info Alert</b-alert>
|
||||
<b-alert show variant="light">Light Alert</b-alert>
|
||||
<b-alert show variant="dark">Dark Alert</b-alert>
|
||||
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="`outline-${variant}`"
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
@click="$store.commit('SET_SESSION_EXPIRED', true)"
|
||||
variant="warning"
|
||||
>
|
||||
{{ variant }}
|
||||
Expire session
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="`${variant}`"
|
||||
pill
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
v-for="size in ['sm', '', 'lg']"
|
||||
:variant="`${variant}`"
|
||||
squared
|
||||
:key="size"
|
||||
:size="size"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ variant }}
|
||||
</b-button>
|
||||
</div>
|
||||
|
||||
<h1>Axiom Verge</h1>
|
||||
<h2>Axiom Verge</h2>
|
||||
<h3>Axiom Verge</h3>
|
||||
<h4>Axiom Verge</h4>
|
||||
<h5>Axiom Verge</h5>
|
||||
<h6>Axiom Verge</h6>
|
||||
|
||||
<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>
|
||||
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
|
||||
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
|
||||
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
|
||||
<div class="p-3 mb-2 bg-warning text-dark">.bg-warning</div>
|
||||
<div class="p-3 mb-2 bg-info text-white">.bg-info</div>
|
||||
<div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
|
||||
<div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
|
||||
<div class="p-3 mb-2 bg-white text-dark">.bg-white</div>
|
||||
<div class="p-3 mb-2 bg-transparent text-dark">.bg-transparent</div>
|
||||
|
||||
<b-dropdown text="Dropdown Button">
|
||||
<b-dropdown-item>First Action</b-dropdown-item>
|
||||
<b-dropdown-item>Second Action</b-dropdown-item>
|
||||
<b-dropdown-item>Third Action</b-dropdown-item>
|
||||
<b-dropdown-divider></b-dropdown-divider>
|
||||
<b-dropdown-item active>Active action</b-dropdown-item>
|
||||
<b-dropdown-item disabled>Disabled action</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
|
||||
<b-alert show variant="primary">Primary Alert</b-alert>
|
||||
<b-alert show variant="secondary">Secondary Alert</b-alert>
|
||||
<b-alert show variant="success">Success Alert</b-alert>
|
||||
<b-alert show variant="danger">Danger Alert</b-alert>
|
||||
<b-alert show variant="warning">Warning Alert</b-alert>
|
||||
<b-alert show variant="info">Info Alert</b-alert>
|
||||
<b-alert show variant="light">Light Alert</b-alert>
|
||||
<b-alert show variant="dark">Dark Alert</b-alert>
|
||||
|
||||
<b-button
|
||||
@click="$store.commit('SET_SESSION_EXPIRED', true)"
|
||||
variant="warning"
|
||||
>
|
||||
Expire session
|
||||
</b-button>
|
||||
</b-container>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,141 +1,143 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'board', params: { id: board.id } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Edit board
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<b-row>
|
||||
<b-col>
|
||||
<b-modal id="boardWallpaper" size="xl" scrollable hide-footer>
|
||||
<template v-slot:modal-header="{ close }">
|
||||
<modal-header
|
||||
title="Wallpaper"
|
||||
@close="close"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<wallpapers-list selectable @select="selectWallpaper" :selected="board.backgroundUrl" />
|
||||
</b-modal>
|
||||
|
||||
<form
|
||||
ref="boardSettingsForm"
|
||||
class="field centered"
|
||||
@submit.stop.prevent="saveBoard"
|
||||
>
|
||||
<b-form-group
|
||||
:label="$t('board.settings.nameLabel')"
|
||||
label-for="name"
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'board', params: { id: board.id } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<b-form-input
|
||||
id="name"
|
||||
v-model="board.name"
|
||||
required
|
||||
/>
|
||||
</b-form-group>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
<b-form-group
|
||||
:label="$t('board.settings.descriptionLabel')"
|
||||
label-for="description"
|
||||
Edit board
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<b-row>
|
||||
<b-col>
|
||||
<b-modal id="boardWallpaper" size="xl" scrollable hide-footer>
|
||||
<template v-slot:modal-header="{ close }">
|
||||
<modal-header
|
||||
title="Wallpaper"
|
||||
@close="close"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<wallpapers-list selectable @select="selectWallpaper" :selected="board.backgroundUrl" />
|
||||
</b-modal>
|
||||
|
||||
<form
|
||||
ref="boardSettingsForm"
|
||||
class="field centered"
|
||||
@submit.stop.prevent="saveBoard"
|
||||
>
|
||||
<b-form-textarea
|
||||
id="description"
|
||||
v-model="board.description"
|
||||
maxlength="280"
|
||||
rows="3"
|
||||
<b-form-group
|
||||
:label="$t('board.settings.nameLabel')"
|
||||
label-for="name"
|
||||
>
|
||||
<b-form-input
|
||||
id="name"
|
||||
v-model="board.name"
|
||||
required
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
:label="$t('board.settings.descriptionLabel')"
|
||||
label-for="description"
|
||||
>
|
||||
<b-form-textarea
|
||||
id="description"
|
||||
v-model="board.description"
|
||||
maxlength="280"
|
||||
rows="3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-checkbox v-model="board.isPublic" switch class="mb-2">
|
||||
Public
|
||||
</b-form-checkbox>
|
||||
|
||||
<b-alert show variant="info" v-if="board.isPublic" class="m-0 text-truncate">
|
||||
<strong>Public Board URL</strong>
|
||||
<br>
|
||||
<small>{{ `https://gamebrary.com/b/${board.id}` }}</small>
|
||||
</b-alert>
|
||||
|
||||
<hr class="my-3">
|
||||
|
||||
<b-form-group
|
||||
label="Board background"
|
||||
class="m-0"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-checkbox v-model="board.isPublic" switch class="mb-2">
|
||||
Public
|
||||
</b-form-checkbox>
|
||||
<div class="d-flex align-items-start">
|
||||
<v-swatches
|
||||
v-model="board.backgroundColor"
|
||||
show-fallback
|
||||
popover-x="left"
|
||||
/>
|
||||
|
||||
<b-alert show variant="info" v-if="board.isPublic" class="m-0 text-truncate">
|
||||
<strong>Public Board URL</strong>
|
||||
<br>
|
||||
<small>{{ `https://gamebrary.com/b/${board.id}` }}</small>
|
||||
</b-alert>
|
||||
|
||||
<hr class="my-3">
|
||||
|
||||
<b-form-group
|
||||
label="Board background"
|
||||
class="m-0"
|
||||
/>
|
||||
|
||||
<div class="d-flex align-items-start">
|
||||
<v-swatches
|
||||
v-model="board.backgroundColor"
|
||||
show-fallback
|
||||
popover-x="left"
|
||||
/>
|
||||
<b-button
|
||||
v-if="board.backgroundColor"
|
||||
@click="board.backgroundColor = null"
|
||||
variant="light"
|
||||
class="ml-2"
|
||||
>
|
||||
<!-- <i class="fas fa-trash fa-fw" aria-hidden /> -->
|
||||
<i class="fas fa-times fa-fw" aria-hidden></i>
|
||||
</b-button>
|
||||
</div>
|
||||
|
||||
<b-button
|
||||
v-if="board.backgroundColor"
|
||||
@click="board.backgroundColor = null"
|
||||
v-b-modal.boardWallpaper
|
||||
variant="light"
|
||||
class="ml-2"
|
||||
class="mb-2"
|
||||
block
|
||||
>
|
||||
<!-- <i class="fas fa-trash fa-fw" aria-hidden /> -->
|
||||
<i class="fas fa-times fa-fw" aria-hidden></i>
|
||||
Choose background image
|
||||
</b-button>
|
||||
</div>
|
||||
|
||||
<b-button
|
||||
v-b-modal.boardWallpaper
|
||||
variant="light"
|
||||
class="mb-2"
|
||||
block
|
||||
>
|
||||
Choose background image
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="board.backgroundUrl"
|
||||
variant="link"
|
||||
class="mb-2"
|
||||
block
|
||||
@click="board.backgroundUrl = null"
|
||||
>
|
||||
<i class="fas fa-trash fa-fw" aria-hidden /> Remove background image
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
v-if="board.backgroundUrl"
|
||||
variant="link"
|
||||
class="mb-2"
|
||||
block
|
||||
@click="board.backgroundUrl = null"
|
||||
>
|
||||
<i class="fas fa-trash fa-fw" aria-hidden /> Remove background image
|
||||
</b-button>
|
||||
<mini-board
|
||||
v-if="board.backgroundUrl || board.backgroundColor"
|
||||
v-b-modal.boardWallpaper
|
||||
:board="board"
|
||||
/>
|
||||
|
||||
<mini-board
|
||||
v-if="board.backgroundUrl || board.backgroundColor"
|
||||
v-b-modal.boardWallpaper
|
||||
:board="board"
|
||||
/>
|
||||
<hr class="my-3">
|
||||
|
||||
<hr class="my-3">
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>{{ $t('global.save') }}</span>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>{{ $t('global.save') }}</span>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="link"
|
||||
@click="confirmDelete"
|
||||
>
|
||||
{{ $t('board.settings.deleteBoard') }}
|
||||
</b-button>
|
||||
</form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-button
|
||||
variant="link"
|
||||
@click="confirmDelete"
|
||||
>
|
||||
{{ $t('board.settings.deleteBoard') }}
|
||||
</b-button>
|
||||
</form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,111 +1,113 @@
|
|||
<!-- TODO: use getter to get tags with game info added to it -->
|
||||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
:to="{ name: 'tags' }"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Edit tag
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
variant="light"
|
||||
variant="danger"
|
||||
class="mr-2"
|
||||
:to="{ name: 'tags' }"
|
||||
@click="promptDeleteTag(tag.name)"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
<i class="fas fa-trash-alt fa-fw" aria-hidden />
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
Edit tag
|
||||
</div>
|
||||
</portal>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
variant="danger"
|
||||
class="mr-2"
|
||||
@click="promptDeleteTag(tag.name)"
|
||||
>
|
||||
<i class="fas fa-trash-alt fa-fw" aria-hidden />
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<b-row v-else>
|
||||
<b-col>
|
||||
<form
|
||||
class="field centered"
|
||||
@submit.prevent="saveTag"
|
||||
>
|
||||
<label for="tagName">Tag name:</label>
|
||||
|
||||
<b-form-input
|
||||
id="tagName"
|
||||
v-model.trim="tag.name"
|
||||
class="mb-3 field"
|
||||
maxlength="20"
|
||||
:placeholder="$t('tags.form.inputPlaceholder')"
|
||||
required
|
||||
trim
|
||||
/>
|
||||
|
||||
<p>Background color</p>
|
||||
|
||||
<v-swatches
|
||||
v-model="tag.bgColor"
|
||||
show-fallback
|
||||
popover-x="left"
|
||||
/>
|
||||
<p>Text color</p>
|
||||
|
||||
<v-swatches
|
||||
v-model="tag.textColor"
|
||||
show-fallback
|
||||
popover-x="left"
|
||||
/>
|
||||
|
||||
<p>Preview</p>
|
||||
|
||||
<b-button
|
||||
v-if="tag.name"
|
||||
rounded
|
||||
size="sm"
|
||||
class="mr-2 mb-4"
|
||||
variant="transparent"
|
||||
:style="`background-color: ${tag.bgColor}; color: ${tag.textColor}`"
|
||||
<b-row v-else>
|
||||
<b-col>
|
||||
<form
|
||||
class="field centered"
|
||||
@submit.prevent="saveTag"
|
||||
>
|
||||
{{ tag.name }}
|
||||
</b-button>
|
||||
<label for="tagName">Tag name:</label>
|
||||
|
||||
<hr />
|
||||
<!-- TODO: Put games tagged in collapsible and lazy load images -->
|
||||
<b-form-input
|
||||
id="tagName"
|
||||
v-model.trim="tag.name"
|
||||
class="mb-3 field"
|
||||
maxlength="20"
|
||||
:placeholder="$t('tags.form.inputPlaceholder')"
|
||||
required
|
||||
trim
|
||||
/>
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>Save</span>
|
||||
</b-button>
|
||||
<p>Background color</p>
|
||||
|
||||
<hr />
|
||||
<v-swatches
|
||||
v-model="tag.bgColor"
|
||||
show-fallback
|
||||
popover-x="left"
|
||||
/>
|
||||
<p>Text color</p>
|
||||
|
||||
<p>Games tagged</p>
|
||||
<v-swatches
|
||||
v-model="tag.textColor"
|
||||
show-fallback
|
||||
popover-x="left"
|
||||
/>
|
||||
|
||||
<!-- TODO: add quick game picker -->
|
||||
<b-alert :show="tag.games.length === 0" variant="light" class="field">
|
||||
No games tagged
|
||||
</b-alert>
|
||||
<p>Preview</p>
|
||||
|
||||
<b-img
|
||||
v-for="game in tag.games"
|
||||
:key="game"
|
||||
:src="getCoverUrl(game)"
|
||||
class="cursor-pointer rounded mr-2 mb-2"
|
||||
width="80"
|
||||
@click="$router.push({ name: 'game', params: { id: games[game].id, slug: games[game].slug }})"
|
||||
/>
|
||||
</form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-button
|
||||
v-if="tag.name"
|
||||
rounded
|
||||
size="sm"
|
||||
class="mr-2 mb-4"
|
||||
variant="transparent"
|
||||
:style="`background-color: ${tag.bgColor}; color: ${tag.textColor}`"
|
||||
>
|
||||
{{ tag.name }}
|
||||
</b-button>
|
||||
|
||||
<hr />
|
||||
<!-- TODO: Put games tagged in collapsible and lazy load images -->
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>Save</span>
|
||||
</b-button>
|
||||
|
||||
<hr />
|
||||
|
||||
<p>Games tagged</p>
|
||||
|
||||
<!-- TODO: add quick game picker -->
|
||||
<b-alert :show="tag.games.length === 0" variant="light" class="field">
|
||||
No games tagged
|
||||
</b-alert>
|
||||
|
||||
<b-img
|
||||
v-for="game in tag.games"
|
||||
:key="game"
|
||||
:src="getCoverUrl(game)"
|
||||
class="cursor-pointer rounded mr-2 mb-2"
|
||||
width="80"
|
||||
@click="$router.push({ name: 'game', params: { id: games[game].id, slug: games[game].slug }})"
|
||||
/>
|
||||
</form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,8 +1,5 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
Explore public game boards
|
||||
</portal>
|
||||
<game-boards />
|
||||
|
||||
<!-- <div class="game-deals">
|
||||
|
@ -23,15 +20,3 @@ export default {
|
|||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" rel="stylesheet/scss" scoped>
|
||||
// .explore-page {
|
||||
// display: grid;
|
||||
// grid-template-columns: 1fr 300px;
|
||||
// grid-gap: 1rem;
|
||||
// }
|
||||
// .game-deals {
|
||||
// height: calc(100vh - 200px);
|
||||
// overflow-y: auto;
|
||||
// }
|
||||
</style>
|
||||
|
|
|
@ -1,101 +1,103 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
<section>
|
||||
<b-container>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<b-row v-else>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-row v-else>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
v-if="game"
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Notes
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
v-if="game"
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug } }"
|
||||
:to="{ name: 'notes' }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
>
|
||||
All notes
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
Notes
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
:to="{ name: 'notes' }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
All notes
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-col cols="12" sm="6">
|
||||
<game-note
|
||||
v-if="showPreview"
|
||||
:note="{ note }"
|
||||
class="mt-3 mt-sm-0"
|
||||
/>
|
||||
|
||||
<router-link
|
||||
v-else-if="game"
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug }}"
|
||||
class="float-right"
|
||||
>
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="12" sm="6">
|
||||
<form class="mt-3 mt-sm-0 mb-3 field">
|
||||
<b-form-textarea
|
||||
v-model.trim="note"
|
||||
placeholder="Type note here"
|
||||
rows="3"
|
||||
max-rows="20"
|
||||
<b-col cols="12" sm="6">
|
||||
<game-note
|
||||
v-if="showPreview"
|
||||
:note="{ note }"
|
||||
class="mt-3 mt-sm-0"
|
||||
/>
|
||||
|
||||
<b-link
|
||||
class="small"
|
||||
variant="link"
|
||||
v-b-modal.markdown-cheatsheet
|
||||
<router-link
|
||||
v-else-if="game"
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug }}"
|
||||
class="float-right"
|
||||
>
|
||||
<i class="fab fa-markdown fa-fw" />
|
||||
Markdown supported
|
||||
</b-link>
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
|
||||
<footer class="mt-2 d-flex">
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
@click="saveNote"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>{{ $t('global.save') }}</span>
|
||||
</b-button>
|
||||
<b-col cols="12" sm="6">
|
||||
<form class="mt-3 mt-sm-0 mb-3 field">
|
||||
<b-form-textarea
|
||||
v-model.trim="note"
|
||||
placeholder="Type note here"
|
||||
rows="3"
|
||||
max-rows="20"
|
||||
/>
|
||||
|
||||
<b-button
|
||||
variant="danger"
|
||||
class="ml-2"
|
||||
v-if="!saving"
|
||||
:disabled="deleting"
|
||||
@click="deleteNote"
|
||||
<b-link
|
||||
class="small"
|
||||
variant="link"
|
||||
v-b-modal.markdown-cheatsheet
|
||||
>
|
||||
<b-spinner small v-if="deleting" />
|
||||
<i v-else class="fas fa-trash fa-fw" aria-hidden />
|
||||
</b-button>
|
||||
<i class="fab fa-markdown fa-fw" />
|
||||
Markdown supported
|
||||
</b-link>
|
||||
|
||||
<b-button
|
||||
variant="light"
|
||||
class="ml-auto"
|
||||
@click="showPreview = !showPreview"
|
||||
>
|
||||
<i class="fas fa-eye fa-fw" aria-hidden />
|
||||
Toggle preview
|
||||
</b-button>
|
||||
</footer>
|
||||
</form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<footer class="mt-2 d-flex">
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
@click="saveNote"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>{{ $t('global.save') }}</span>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="danger"
|
||||
class="ml-2"
|
||||
v-if="!saving"
|
||||
:disabled="deleting"
|
||||
@click="deleteNote"
|
||||
>
|
||||
<b-spinner small v-if="deleting" />
|
||||
<i v-else class="fas fa-trash fa-fw" aria-hidden />
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="light"
|
||||
class="ml-auto"
|
||||
@click="showPreview = !showPreview"
|
||||
>
|
||||
<i class="fas fa-eye fa-fw" aria-hidden />
|
||||
Toggle preview
|
||||
</b-button>
|
||||
</footer>
|
||||
</form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,192 +1,194 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<template v-else-if="game">
|
||||
<portal to="pageTitle">
|
||||
<b-button
|
||||
v-if="originBoardId"
|
||||
:to="{ name: 'board', params: { id: originBoardId } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<portal to="headerActions" v-if="user">
|
||||
<b-button-group class="mr-2">
|
||||
<game-tags-dropdown />
|
||||
<section>
|
||||
<b-container>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<template v-else-if="game">
|
||||
<portal to="pageTitle">
|
||||
<b-button
|
||||
v-if="originBoardId"
|
||||
:to="{ name: 'board', params: { id: originBoardId } }"
|
||||
variant="light"
|
||||
@click="$router.push({ name: 'game.progress', params: { id: game.id, slug: game.slug } })"
|
||||
class="mr-2"
|
||||
>
|
||||
<template v-if="progress">
|
||||
{{ progress }}%
|
||||
</template>
|
||||
<i v-else class="fa-solid fa-stopwatch" />
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-button
|
||||
:to="{ name: 'game.notes', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
>
|
||||
<i class="fa-solid fa-note-sticky fa-fw" />
|
||||
</b-button>
|
||||
<portal to="headerActions" v-if="user">
|
||||
<b-button-group class="mr-2">
|
||||
<game-tags-dropdown />
|
||||
|
||||
<add-remove-game />
|
||||
</b-button-group>
|
||||
</portal>
|
||||
<game-media-modal />
|
||||
|
||||
<b-row>
|
||||
<b-col
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
xl="3"
|
||||
>
|
||||
<div class="position-relative cursor-pointer" v-b-modal.mediaModal>
|
||||
<i class="fa-solid fa-play play-button color-white text-white font-size-xl" />
|
||||
|
||||
<b-img
|
||||
:src="gameCoverUrl"
|
||||
:alt="game.name"
|
||||
rounded
|
||||
fluid
|
||||
/>
|
||||
</div>
|
||||
|
||||
<section
|
||||
v-if="gameNews.length"
|
||||
tag="a"
|
||||
class="bg-light d-none d-sm-flex rounded px-2 mt-2 flex-column"
|
||||
>
|
||||
<h5 class="pt-2">Latest news:</h5>
|
||||
|
||||
<router-link
|
||||
v-for="article in gameNews"
|
||||
:key="article.gid"
|
||||
:to="{ name: 'game.news', params: { id: game.id, slug: game.slug } }"
|
||||
class="d-flex mb-2"
|
||||
<b-button
|
||||
variant="light"
|
||||
@click="$router.push({ name: 'game.progress', params: { id: game.id, slug: game.slug } })"
|
||||
>
|
||||
<template v-if="progress">
|
||||
{{ progress }}%
|
||||
</template>
|
||||
<i v-else class="fa-solid fa-stopwatch" />
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
:to="{ name: 'game.notes', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
>
|
||||
<i class="fa-solid fa-note-sticky fa-fw" />
|
||||
</b-button>
|
||||
|
||||
<add-remove-game />
|
||||
</b-button-group>
|
||||
</portal>
|
||||
<game-media-modal />
|
||||
|
||||
<b-row>
|
||||
<b-col
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
xl="3"
|
||||
>
|
||||
<div class="position-relative cursor-pointer" v-b-modal.mediaModal>
|
||||
<i class="fa-solid fa-play play-button color-white text-white font-size-xl" />
|
||||
|
||||
<b-img
|
||||
v-if="article.imageUrl"
|
||||
:src="article.imageUrl"
|
||||
width="100"
|
||||
:src="gameCoverUrl"
|
||||
:alt="game.name"
|
||||
rounded
|
||||
class="float-left mr-2"
|
||||
fluid
|
||||
/>
|
||||
</div>
|
||||
|
||||
<small class="pr-2">{{ article.title }}</small>
|
||||
</router-link>
|
||||
</section>
|
||||
<section
|
||||
v-if="gameNews.length"
|
||||
tag="a"
|
||||
class="bg-light d-none d-sm-flex rounded px-2 mt-2 flex-column"
|
||||
>
|
||||
<h5 class="pt-2">Latest news:</h5>
|
||||
|
||||
<!-- <amazon-links class="mt-2" /> -->
|
||||
|
||||
<game-note
|
||||
v-if="note"
|
||||
:note="note"
|
||||
class="cursor-pointer mt-3"
|
||||
@click.native="$router.push({ name: 'game.notes', params: { id: game.id, slug: game.slug } })"
|
||||
/>
|
||||
|
||||
<game-in-list :class="{ 'text-white': steamBackground }" />
|
||||
|
||||
<!-- <game-speedruns /> -->
|
||||
|
||||
<!-- <div v-if="gameAchievements"> -->
|
||||
<!-- <pre>{{ gameAchievements }}</pre> -->
|
||||
<!-- </div> -->
|
||||
</b-col>
|
||||
|
||||
<b-col
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="8"
|
||||
xl="9"
|
||||
>
|
||||
<!-- bg-white -->
|
||||
<article :class="[' rounded', steamBackground ? 'bg-white mt-2 mt-md-0 p-3' : 'px-sm-3 p-0']">
|
||||
<header class="d-flex align-items-start justify-content-between pb-2">
|
||||
<game-titles />
|
||||
|
||||
<aside>
|
||||
<!-- <b-button :href="metacriticScore.url" variant="success" v-if="metacriticScore.url">
|
||||
{{ metacriticScore.score }}
|
||||
|
||||
</b-button> -->
|
||||
<b-button
|
||||
v-for="({ bgColor, textColor, name, index }) in tagsApplied"
|
||||
:key="name"
|
||||
<router-link
|
||||
v-for="article in gameNews"
|
||||
:key="article.gid"
|
||||
:to="{ name: 'game.news', params: { id: game.id, slug: game.slug } }"
|
||||
class="d-flex mb-2"
|
||||
>
|
||||
<b-img
|
||||
v-if="article.imageUrl"
|
||||
:src="article.imageUrl"
|
||||
width="100"
|
||||
rounded
|
||||
size="sm"
|
||||
variant="transparent"
|
||||
class="mr-1 mb-2"
|
||||
:style="`background-color: ${bgColor}; color: ${textColor}`"
|
||||
:to="{ name: 'tag.edit', params: { id: index } }"
|
||||
>
|
||||
<i class="fa-solid fa-tag mr-1" />
|
||||
{{ name }}
|
||||
</b-button>
|
||||
class="float-left mr-2"
|
||||
/>
|
||||
|
||||
<small class="pr-2">{{ article.title }}</small>
|
||||
</router-link>
|
||||
</section>
|
||||
|
||||
<!-- <amazon-links class="mt-2" /> -->
|
||||
|
||||
<game-note
|
||||
v-if="note"
|
||||
:note="note"
|
||||
class="cursor-pointer mt-3"
|
||||
@click.native="$router.push({ name: 'game.notes', params: { id: game.id, slug: game.slug } })"
|
||||
/>
|
||||
|
||||
<game-in-list :class="{ 'text-white': steamBackground }" />
|
||||
|
||||
<!-- <game-speedruns /> -->
|
||||
|
||||
<!-- <div v-if="gameAchievements"> -->
|
||||
<!-- <pre>{{ gameAchievements }}</pre> -->
|
||||
<!-- </div> -->
|
||||
</b-col>
|
||||
|
||||
<b-col
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="8"
|
||||
xl="9"
|
||||
>
|
||||
<!-- bg-white -->
|
||||
<article :class="[' rounded', steamBackground ? 'bg-white mt-2 mt-md-0 p-3' : 'px-sm-3 p-0']">
|
||||
<header class="d-flex align-items-start justify-content-between pb-2">
|
||||
<game-titles />
|
||||
|
||||
<aside>
|
||||
<!-- <b-button :href="metacriticScore.url" variant="success" v-if="metacriticScore.url">
|
||||
{{ metacriticScore.score }}
|
||||
|
||||
</b-button> -->
|
||||
<b-button
|
||||
v-for="({ bgColor, textColor, name, index }) in tagsApplied"
|
||||
:key="name"
|
||||
rounded
|
||||
size="sm"
|
||||
variant="transparent"
|
||||
class="mr-1 mb-2"
|
||||
:style="`background-color: ${bgColor}; color: ${textColor}`"
|
||||
:to="{ name: 'tag.edit', params: { id: index } }"
|
||||
>
|
||||
<i class="fa-solid fa-tag mr-1" />
|
||||
{{ name }}
|
||||
</b-button>
|
||||
</aside>
|
||||
</header>
|
||||
|
||||
<aside class="supplemental-info bg-white field float-right ml-5 pb-2">
|
||||
<b-img
|
||||
v-if="gameHeaderImage"
|
||||
v-b-modal.mediaModal
|
||||
:src="gameHeaderImage"
|
||||
class="mb-2"
|
||||
rounded
|
||||
fluid
|
||||
/>
|
||||
|
||||
<b-img
|
||||
v-if="gameScrenshot"
|
||||
v-b-modal.mediaModal
|
||||
:src="gameScrenshot"
|
||||
rounded
|
||||
fluid
|
||||
/>
|
||||
|
||||
<game-websites />
|
||||
</aside>
|
||||
</header>
|
||||
|
||||
<aside class="supplemental-info bg-white field float-right ml-5 pb-2">
|
||||
<b-img
|
||||
v-if="gameHeaderImage"
|
||||
v-b-modal.mediaModal
|
||||
:src="gameHeaderImage"
|
||||
class="mb-2"
|
||||
rounded
|
||||
fluid
|
||||
/>
|
||||
<game-description />
|
||||
<game-details />
|
||||
<game-ratings />
|
||||
</article>
|
||||
|
||||
<b-img
|
||||
v-if="gameScrenshot"
|
||||
v-b-modal.mediaModal
|
||||
:src="gameScrenshot"
|
||||
rounded
|
||||
fluid
|
||||
/>
|
||||
<small
|
||||
v-if="legalNotice"
|
||||
class="text-muted"
|
||||
v-html="legalNotice"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<game-websites />
|
||||
</aside>
|
||||
<similar-games />
|
||||
</template>
|
||||
|
||||
<game-description />
|
||||
<game-details />
|
||||
<game-ratings />
|
||||
</article>
|
||||
|
||||
<small
|
||||
v-if="legalNotice"
|
||||
class="text-muted"
|
||||
v-html="legalNotice"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<similar-games />
|
||||
</template>
|
||||
|
||||
<div class="pt-5" v-else>
|
||||
<div class="d-flex justify-content-center align-items-center" id="main">
|
||||
<h1 class="mr-3 pr-3 align-top border-right inline-block align-content-center">404</h1>
|
||||
<div class="inline-block align-middle">
|
||||
<h2 class="font-weight-normal lead" id="desc">Game was not found.</h2>
|
||||
<div class="pt-5" v-else>
|
||||
<div class="d-flex justify-content-center align-items-center" id="main">
|
||||
<h1 class="mr-3 pr-3 align-top border-right inline-block align-content-center">404</h1>
|
||||
<div class="inline-block align-middle">
|
||||
<h2 class="font-weight-normal lead" id="desc">Game was not found.</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <timeline
|
||||
v-if="twitterHandle"
|
||||
:id="twitterHandle"
|
||||
sourceType="profile"
|
||||
>
|
||||
loading...
|
||||
</timeline> -->
|
||||
</b-container>
|
||||
<!-- <timeline
|
||||
v-if="twitterHandle"
|
||||
:id="twitterHandle"
|
||||
sourceType="profile"
|
||||
>
|
||||
loading...
|
||||
</timeline> -->
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,59 +1,61 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Track progress
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
|
||||
<b-row>
|
||||
<b-col cols="12" sm="6">
|
||||
<router-link :to="{ name: 'game', params: { id: game.id, slug: game.slug }}" class="float-right">
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="12" sm="6" class="mt-3 mt-sm-0 mb-3">
|
||||
<b-input-group :prepend="`${progress}%`" class="field mb-2">
|
||||
<b-form-input
|
||||
size="lg"
|
||||
v-model="progress"
|
||||
type="range"
|
||||
max="100"
|
||||
step="1"
|
||||
/>
|
||||
</b-input-group>
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
class="mr-2"
|
||||
@click="saveProgress"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>{{ $t('global.save') }}</span>
|
||||
</b-button>
|
||||
|
||||
Track progress
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
|
||||
<b-row>
|
||||
<b-col cols="12" sm="6">
|
||||
<router-link :to="{ name: 'game', params: { id: game.id, slug: game.slug }}" class="float-right">
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="12" sm="6" class="mt-3 mt-sm-0 mb-3">
|
||||
<b-input-group :prepend="`${progress}%`" class="field mb-2">
|
||||
<b-form-input
|
||||
size="lg"
|
||||
v-model="progress"
|
||||
type="range"
|
||||
max="100"
|
||||
step="1"
|
||||
/>
|
||||
</b-input-group>
|
||||
|
||||
<b-button
|
||||
variant="primary"
|
||||
:disabled="saving"
|
||||
class="mr-2"
|
||||
@click="saveProgress"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<span v-else>{{ $t('global.save') }}</span>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
:disabled="deleting"
|
||||
variant="danger"
|
||||
@click="deleteProgress"
|
||||
>
|
||||
<b-spinner small v-if="deleting" />
|
||||
<i v-else class="fas fa-trash fa-fw" aria-hidden />
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-button
|
||||
:disabled="deleting"
|
||||
variant="danger"
|
||||
@click="deleteProgress"
|
||||
>
|
||||
<b-spinner small v-if="deleting" />
|
||||
<i v-else class="fas fa-trash fa-fw" aria-hidden />
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,87 +1,90 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'settings' }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'settings' }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Notes
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<portal to="headerActions">
|
||||
<div class="mr-2">
|
||||
<b-form-input
|
||||
v-if="!showEmptyState"
|
||||
type="search"
|
||||
class="d-none d-sm-block"
|
||||
placeholder="Search notes"
|
||||
v-model="search"
|
||||
/>
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<empty-state
|
||||
v-else-if="showEmptyState"
|
||||
illustration="notes.png"
|
||||
:title="$t('notes.title')"
|
||||
message="Looks like you don't have any notes yet."
|
||||
>
|
||||
<b-button variant="light" :to="{ name: 'notes.create' }">
|
||||
Add note
|
||||
</b-button>
|
||||
</empty-state>
|
||||
|
||||
Notes
|
||||
</div>
|
||||
</portal>
|
||||
<b-row v-else-if="noteGames.length">
|
||||
<b-col>
|
||||
<b-form-input
|
||||
v-if="!showEmptyState"
|
||||
type="search"
|
||||
class="d-sm-none field mb-3"
|
||||
placeholder="Search notes"
|
||||
v-model="search"
|
||||
/>
|
||||
|
||||
<portal to="headerActions">
|
||||
<div class="mr-2">
|
||||
<b-form-input
|
||||
v-if="!showEmptyState"
|
||||
type="search"
|
||||
class="d-none d-sm-block"
|
||||
placeholder="Search notes"
|
||||
v-model="search"
|
||||
/>
|
||||
</div>
|
||||
</portal>
|
||||
<b-card-group columns>
|
||||
<b-card
|
||||
v-for="(game, index) in noteGames"
|
||||
body-class="p-2"
|
||||
:key="index"
|
||||
>
|
||||
<b-card-text>
|
||||
<b-button
|
||||
v-if="game"
|
||||
variant="light"
|
||||
size="sm"
|
||||
class="d-flex p-2 mb-2 align-items-center"
|
||||
:to="{ name: 'game.notes', params: { id: game.id, slug: game.slug }}"
|
||||
>
|
||||
<b-img
|
||||
:src="getCoverUrl(game.id)"
|
||||
class="cursor-pointer rounded"
|
||||
width="30"
|
||||
/>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
<div class="ml-2 overflow-hidden">
|
||||
<h5>{{ game.name }}</h5>
|
||||
</div>
|
||||
</b-button>
|
||||
|
||||
<empty-state
|
||||
v-else-if="showEmptyState"
|
||||
illustration="notes.png"
|
||||
:title="$t('notes.title')"
|
||||
message="Looks like you don't have any notes yet."
|
||||
>
|
||||
<b-button variant="light" :to="{ name: 'notes.create' }">
|
||||
Add note
|
||||
</b-button>
|
||||
</empty-state>
|
||||
|
||||
<b-row v-else-if="noteGames.length">
|
||||
<b-col>
|
||||
<b-form-input
|
||||
v-if="!showEmptyState"
|
||||
type="search"
|
||||
class="d-sm-none field mb-3"
|
||||
placeholder="Search notes"
|
||||
v-model="search"
|
||||
/>
|
||||
|
||||
<b-card-group columns>
|
||||
<b-card
|
||||
v-for="(game, index) in noteGames"
|
||||
:key="index"
|
||||
>
|
||||
<b-card-text>
|
||||
<b-button
|
||||
v-if="game"
|
||||
variant="light"
|
||||
size="sm"
|
||||
class="d-flex p-2 mb-2 align-items-center"
|
||||
:to="{ name: 'game.notes', params: { id: game.id, slug: game.slug }}"
|
||||
>
|
||||
<b-img
|
||||
:src="getCoverUrl(game.id)"
|
||||
class="cursor-pointer rounded"
|
||||
width="30"
|
||||
/>
|
||||
|
||||
<div class="ml-2 overflow-hidden">
|
||||
<h5>{{ game.name }}</h5>
|
||||
</div>
|
||||
</b-button>
|
||||
|
||||
<p class="note-text text-muted small" v-if="filteredNotes[index]">
|
||||
{{ filteredNotes[index].note }}
|
||||
</p>
|
||||
</b-card-text>
|
||||
</b-card>
|
||||
</b-card-group>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<p class="note-text text-muted small" v-if="filteredNotes[index]">
|
||||
{{ filteredNotes[index].note }}
|
||||
</p>
|
||||
</b-card-text>
|
||||
</b-card>
|
||||
</b-card-group>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,15 +1,17 @@
|
|||
<template lang="html">
|
||||
<b-container class="py-2">
|
||||
<h1>Privacy Policy</h1>
|
||||
<p>Your privacy is important to us. It is Gamebrary's policy to respect your privacy regarding any information we may collect from you across our website, <a href="http://gamebrary.com">http://gamebrary.com</a>, and other sites we own and operate.</p>
|
||||
<p>We only ask for personal information when we truly need it to provide a service to you. We collect it by fair and lawful means, with your knowledge and consent. We also let you know why we’re collecting it and how it will be used.</p>
|
||||
<p>We only retain collected information for as long as necessary to provide you with your requested service. What data we store, we’ll protect within commercially acceptable means to prevent loss and theft, as well as unauthorised access, disclosure, copying, use or modification.</p>
|
||||
<p>We don’t share any personally identifying information publicly or with third-parties, except when required to by law.</p>
|
||||
<p>Our website may link to external sites that are not operated by us. Please be aware that we have no control over the content and practices of these sites, and cannot accept responsibility or liability for their respective privacy policies.</p>
|
||||
<p>You are free to refuse our request for your personal information, with the understanding that we may be unable to provide you with some of your desired services.</p>
|
||||
<p>Your continued use of our website will be regarded as acceptance of our practices around privacy and personal information. If you have any questions about how we handle user data and personal information, feel free to contact us.</p>
|
||||
<p>This policy is effective as of 22 January 2019.</p>
|
||||
</b-container>
|
||||
<section>
|
||||
<b-container class="py-2">
|
||||
<h1>Privacy Policy</h1>
|
||||
<p>Your privacy is important to us. It is Gamebrary's policy to respect your privacy regarding any information we may collect from you across our website, <a href="http://gamebrary.com">http://gamebrary.com</a>, and other sites we own and operate.</p>
|
||||
<p>We only ask for personal information when we truly need it to provide a service to you. We collect it by fair and lawful means, with your knowledge and consent. We also let you know why we’re collecting it and how it will be used.</p>
|
||||
<p>We only retain collected information for as long as necessary to provide you with your requested service. What data we store, we’ll protect within commercially acceptable means to prevent loss and theft, as well as unauthorised access, disclosure, copying, use or modification.</p>
|
||||
<p>We don’t share any personally identifying information publicly or with third-parties, except when required to by law.</p>
|
||||
<p>Our website may link to external sites that are not operated by us. Please be aware that we have no control over the content and practices of these sites, and cannot accept responsibility or liability for their respective privacy policies.</p>
|
||||
<p>You are free to refuse our request for your personal information, with the understanding that we may be unable to provide you with some of your desired services.</p>
|
||||
<p>Your continued use of our website will be regarded as acceptance of our practices around privacy and personal information. If you have any questions about how we handle user data and personal information, feel free to contact us.</p>
|
||||
<p>This policy is effective as of 22 January 2019.</p>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,207 +1,209 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">Profile</portal>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">Profile</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<form
|
||||
v-else-if="profile"
|
||||
class="field centered"
|
||||
@submit.prevent="save"
|
||||
>
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
:to="{ name: 'public.profile', params: { userName: profile.userName } }"
|
||||
class="mr-2"
|
||||
>
|
||||
View profile
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Name"
|
||||
label-for="name"
|
||||
<form
|
||||
v-else-if="profile"
|
||||
class="field centered"
|
||||
@submit.prevent="save"
|
||||
>
|
||||
<b-form-input
|
||||
id="name"
|
||||
v-model="profile.name"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="About you"
|
||||
label-for="bio"
|
||||
>
|
||||
<b-form-input
|
||||
id="bio"
|
||||
v-model="profile.bio"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Location"
|
||||
label-for="location"
|
||||
>
|
||||
<b-form-input
|
||||
id="location"
|
||||
v-model="profile.location"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Website"
|
||||
label-for="website"
|
||||
>
|
||||
<b-form-input
|
||||
id="website"
|
||||
v-model="profile.website"
|
||||
class="mb-3"
|
||||
@blur="autoformatWebsite"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Twitter"
|
||||
label-for="twitter"
|
||||
>
|
||||
<b-form-input
|
||||
id="twitter"
|
||||
v-model="profile.twitter"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Nintendo Friend Code"
|
||||
label-for="friendCode"
|
||||
>
|
||||
<b-form-input
|
||||
id="friendCode"
|
||||
v-model="profile.friendCode"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Playstation online ID"
|
||||
label-for="psnId"
|
||||
>
|
||||
<b-form-input
|
||||
id="psnId"
|
||||
v-model="profile.psnId"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Steam friend code"
|
||||
label-for="steamFriendCode"
|
||||
>
|
||||
<b-form-input
|
||||
id="steamFriendCode"
|
||||
v-model="profile.steamFriendCode"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Xbox Gamertag"
|
||||
label-for="gamerTag"
|
||||
>
|
||||
<b-form-input
|
||||
id="gamerTag"
|
||||
v-model="profile.gamerTag"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<footer class="mt-3 mb-5">
|
||||
<b-button
|
||||
variant="primary"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
<template v-else>Save</template>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="link"
|
||||
class="text-danger"
|
||||
:disabled="deleting"
|
||||
@click="confirmDeleteProfile"
|
||||
>
|
||||
<b-spinner small v-if="deleting" />
|
||||
<template v-else>Delete profile</template>
|
||||
</b-button>
|
||||
</footer>
|
||||
</form>
|
||||
|
||||
<form
|
||||
v-else
|
||||
class="field centered"
|
||||
@submit.prevent="checkUserNameAvailability"
|
||||
>
|
||||
<p class="text-muted text-center">Choose a user name to get started!</p>
|
||||
|
||||
<b-input-group class="mb-3">
|
||||
<b-form-input
|
||||
id="userName"
|
||||
autocomplete="off"
|
||||
v-model.trim="userName"
|
||||
size="lg"
|
||||
:minlength="$options.MIN_PROFILE_LENGTH"
|
||||
:maxlength="$options.MAX_PROFILE_LENGTH"
|
||||
required
|
||||
:state="available"
|
||||
@input="formatUserName"
|
||||
/>
|
||||
|
||||
<template #append>
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
:to="{ name: 'public.profile', params: { userName: profile.userName } }"
|
||||
class="mr-2"
|
||||
>
|
||||
View profile
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Name"
|
||||
label-for="name"
|
||||
>
|
||||
<b-form-input
|
||||
id="name"
|
||||
v-model="profile.name"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="About you"
|
||||
label-for="bio"
|
||||
>
|
||||
<b-form-input
|
||||
id="bio"
|
||||
v-model="profile.bio"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Location"
|
||||
label-for="location"
|
||||
>
|
||||
<b-form-input
|
||||
id="location"
|
||||
v-model="profile.location"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Website"
|
||||
label-for="website"
|
||||
>
|
||||
<b-form-input
|
||||
id="website"
|
||||
v-model="profile.website"
|
||||
class="mb-3"
|
||||
@blur="autoformatWebsite"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Twitter"
|
||||
label-for="twitter"
|
||||
>
|
||||
<b-form-input
|
||||
id="twitter"
|
||||
v-model="profile.twitter"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Nintendo Friend Code"
|
||||
label-for="friendCode"
|
||||
>
|
||||
<b-form-input
|
||||
id="friendCode"
|
||||
v-model="profile.friendCode"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Playstation online ID"
|
||||
label-for="psnId"
|
||||
>
|
||||
<b-form-input
|
||||
id="psnId"
|
||||
v-model="profile.psnId"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Steam friend code"
|
||||
label-for="steamFriendCode"
|
||||
>
|
||||
<b-form-input
|
||||
id="steamFriendCode"
|
||||
v-model="profile.steamFriendCode"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group
|
||||
label-class="m-0 text-muted"
|
||||
label="Xbox Gamertag"
|
||||
label-for="gamerTag"
|
||||
>
|
||||
<b-form-input
|
||||
id="gamerTag"
|
||||
v-model="profile.gamerTag"
|
||||
class="mb-3"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<footer class="mt-3 mb-5">
|
||||
<b-button
|
||||
variant="primary"
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="checkingAvailability" />
|
||||
<template v-else>
|
||||
<i class="fa-solid fa-magnifying-glass" />
|
||||
</template>
|
||||
<b-spinner small v-if="saving" />
|
||||
<template v-else>Save</template>
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
variant="link"
|
||||
class="text-danger"
|
||||
:disabled="deleting"
|
||||
@click="confirmDeleteProfile"
|
||||
>
|
||||
<b-spinner small v-if="deleting" />
|
||||
<template v-else>Delete profile</template>
|
||||
</b-button>
|
||||
</footer>
|
||||
</form>
|
||||
|
||||
<form
|
||||
v-else
|
||||
class="field centered"
|
||||
@submit.prevent="checkUserNameAvailability"
|
||||
>
|
||||
<p class="text-muted text-center">Choose a user name to get started!</p>
|
||||
|
||||
<b-input-group class="mb-3">
|
||||
<b-form-input
|
||||
id="userName"
|
||||
autocomplete="off"
|
||||
v-model.trim="userName"
|
||||
size="lg"
|
||||
:minlength="$options.MIN_PROFILE_LENGTH"
|
||||
:maxlength="$options.MAX_PROFILE_LENGTH"
|
||||
required
|
||||
:state="available"
|
||||
@input="formatUserName"
|
||||
/>
|
||||
|
||||
<template #append>
|
||||
<b-button
|
||||
type="submit"
|
||||
>
|
||||
<b-spinner small v-if="checkingAvailability" />
|
||||
<template v-else>
|
||||
<i class="fa-solid fa-magnifying-glass" />
|
||||
</template>
|
||||
</b-button>
|
||||
</template>
|
||||
</b-input-group>
|
||||
|
||||
<template v-if="available">
|
||||
<b-alert
|
||||
class="mt-3"
|
||||
show
|
||||
variant="success"
|
||||
>
|
||||
Great, <strong>{{ userName }}</strong> is available!
|
||||
</b-alert>
|
||||
|
||||
<b-button block variant="success" @click="createProfile">
|
||||
<b-spinner small v-if="saving" />
|
||||
<template v-else>Create profile</template>
|
||||
</b-button>
|
||||
</template>
|
||||
</b-input-group>
|
||||
|
||||
<template v-if="available">
|
||||
<b-alert
|
||||
class="mt-3"
|
||||
show
|
||||
variant="success"
|
||||
>
|
||||
Great, <strong>{{ userName }}</strong> is available!
|
||||
</b-alert>
|
||||
|
||||
<b-button block variant="success" @click="createProfile">
|
||||
<b-spinner small v-if="saving" />
|
||||
<template v-else>Create profile</template>
|
||||
</b-button>
|
||||
</template>
|
||||
|
||||
<div v-else-if="!checkingAvailability && available === false">
|
||||
User name not available
|
||||
</div>
|
||||
</form>
|
||||
</b-container>
|
||||
<div v-else-if="!checkingAvailability && available === false">
|
||||
User name not available
|
||||
</div>
|
||||
</form>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,76 +1,78 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
<section>
|
||||
<b-container>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<div
|
||||
v-else-if="profile"
|
||||
>
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
v-if="isProfileOwner"
|
||||
class="mr-2"
|
||||
:to="{ name: 'profile.settings' }"
|
||||
>
|
||||
Edit
|
||||
</b-button>
|
||||
</portal>
|
||||
<div class="profile field centered text-center">
|
||||
<b-avatar
|
||||
src="https://placekitten.com/300/300"
|
||||
size="6rem"
|
||||
class="mb-2"
|
||||
/>
|
||||
<div
|
||||
v-else-if="profile"
|
||||
>
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
v-if="isProfileOwner"
|
||||
class="mr-2"
|
||||
:to="{ name: 'profile.settings' }"
|
||||
>
|
||||
Edit
|
||||
</b-button>
|
||||
</portal>
|
||||
<div class="profile field centered text-center">
|
||||
<b-avatar
|
||||
src="https://placekitten.com/300/300"
|
||||
size="6rem"
|
||||
class="mb-2"
|
||||
/>
|
||||
|
||||
<!-- <pre>{{ profile }}</pre> -->
|
||||
<h1 class="m-0">{{ profile.userName }}</h1>
|
||||
<p class="text-lead text-muted m-0">{{ profile.name }}</p>
|
||||
<p>{{ profile.bio }}</p>
|
||||
<!-- <pre>{{ profile }}</pre> -->
|
||||
<h1 class="m-0">{{ profile.userName }}</h1>
|
||||
<p class="text-lead text-muted m-0">{{ profile.name }}</p>
|
||||
<p>{{ profile.bio }}</p>
|
||||
|
||||
<p>
|
||||
<i class="fa fa-globe" aria-hidden="true" />
|
||||
{{ profile.location }}
|
||||
</p>
|
||||
<p>
|
||||
<i class="fa fa-globe" aria-hidden="true" />
|
||||
{{ profile.location }}
|
||||
</p>
|
||||
|
||||
<b-button :href="profile.twitter" v-if="profile.twitter" class="mr-2">
|
||||
<i class="fab fa-twitter fa-fw" aria-hidden />
|
||||
{{ profile.twitter }}
|
||||
</b-button>
|
||||
<b-button :href="profile.twitter" v-if="profile.twitter" class="mr-2">
|
||||
<i class="fab fa-twitter fa-fw" aria-hidden />
|
||||
{{ profile.twitter }}
|
||||
</b-button>
|
||||
|
||||
<b-button v-if="profile.website" :href="profile.website">
|
||||
{{ profile.website }}
|
||||
</b-button>
|
||||
<b-button v-if="profile.website" :href="profile.website">
|
||||
{{ profile.website }}
|
||||
</b-button>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <b-button :to="{ name: 'profiles' }">
|
||||
View other profiles
|
||||
</b-button> -->
|
||||
<b-row class="mt-4">
|
||||
<b-col
|
||||
v-for="board in userBoards"
|
||||
:key="board.id"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
class="px-2"
|
||||
>
|
||||
<mini-board
|
||||
:board="board"
|
||||
@click.native="$router.push({ name: 'board', params: { id: board.id } })"
|
||||
class="p-relative mb-3"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<!-- <b-button :to="{ name: 'profiles' }">
|
||||
View other profiles
|
||||
</b-button> -->
|
||||
<b-row class="mt-4">
|
||||
<b-col
|
||||
v-for="board in userBoards"
|
||||
:key="board.id"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
class="px-2"
|
||||
>
|
||||
<mini-board
|
||||
:board="board"
|
||||
@click.native="$router.push({ name: 'board', params: { id: board.id } })"
|
||||
class="p-relative mb-3"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<empty-state
|
||||
v-else
|
||||
title="404 Not Found"
|
||||
illustration="404.png"
|
||||
message="Page not found!"
|
||||
/>
|
||||
</b-container>
|
||||
<empty-state
|
||||
v-else
|
||||
title="404 Not Found"
|
||||
illustration="404.png"
|
||||
message="Page not found!"
|
||||
/>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,23 +1,25 @@
|
|||
<template lang="html">
|
||||
<b-container fluid>
|
||||
<page-title
|
||||
title="Profiles"
|
||||
/>
|
||||
<section>
|
||||
<b-container>
|
||||
<page-title
|
||||
title="Profiles"
|
||||
/>
|
||||
|
||||
<b-button
|
||||
:to="{ name: 'public.profile', params: { userName: profile.userName } }"
|
||||
block
|
||||
class="profile-button p-2"
|
||||
v-for="profile in profiles"
|
||||
:key="profile.userName"
|
||||
>
|
||||
<div>
|
||||
<h1>{{ profile.displayName }}</h1>
|
||||
<small class="text-info">{{ `@${profile.userName}` }}</small>
|
||||
<p v-if="profile.bio">{{ profile.bio }}</p>
|
||||
</div>
|
||||
</b-button>
|
||||
</b-container>
|
||||
<b-button
|
||||
:to="{ name: 'public.profile', params: { userName: profile.userName } }"
|
||||
block
|
||||
class="profile-button p-2"
|
||||
v-for="profile in profiles"
|
||||
:key="profile.userName"
|
||||
>
|
||||
<div>
|
||||
<h1>{{ profile.displayName }}</h1>
|
||||
<small class="text-info">{{ `@${profile.userName}` }}</small>
|
||||
<p v-if="profile.bio">{{ profile.bio }}</p>
|
||||
</div>
|
||||
</b-button>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,41 +1,43 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">Releases</portal>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">Releases</portal>
|
||||
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
url="https://github.com/romancm/gamebrary"
|
||||
variant="light"
|
||||
target="_blank"
|
||||
class="mr-2"
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
url="https://github.com/romancm/gamebrary"
|
||||
variant="light"
|
||||
target="_blank"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fab fa-github fa-fw" aria-hidden />
|
||||
View in GitHub
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-card
|
||||
v-for="release in releases"
|
||||
:key="release.id"
|
||||
hide-footer
|
||||
class="mb-3"
|
||||
>
|
||||
<i class="fab fa-github fa-fw" aria-hidden />
|
||||
View in GitHub
|
||||
</b-button>
|
||||
</portal>
|
||||
<template v-slot:header>
|
||||
<h3 class="mb-0">
|
||||
<b-badge>{{ release.tag_name }}</b-badge>
|
||||
{{ release.name }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<b-card
|
||||
v-for="release in releases"
|
||||
:key="release.id"
|
||||
hide-footer
|
||||
class="mb-3"
|
||||
>
|
||||
<template v-slot:header>
|
||||
<h3 class="mb-0">
|
||||
<b-badge>{{ release.tag_name }}</b-badge>
|
||||
{{ release.name }}
|
||||
</h3>
|
||||
</template>
|
||||
<b-card-text>
|
||||
<small class="text-muted">
|
||||
{{ $t('releases.published') }} {{ formatDate(release.published_at) }}
|
||||
</small>
|
||||
|
||||
<b-card-text>
|
||||
<small class="text-muted">
|
||||
{{ $t('releases.published') }} {{ formatDate(release.published_at) }}
|
||||
</small>
|
||||
|
||||
<div class="w-100 releases" v-html="$options.marked(release.body)" />
|
||||
</b-card-text>
|
||||
</b-card>
|
||||
</b-container>
|
||||
<div class="w-100 releases" v-html="$options.marked(release.body)" />
|
||||
</b-card-text>
|
||||
</b-card>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,92 +1,94 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">Search</portal>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">Search</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<div v-else-if="showEmptyState" class="field centered">
|
||||
<search-box />
|
||||
</div>
|
||||
<div v-else-if="showEmptyState" class="field centered p-2">
|
||||
<search-box />
|
||||
</div>
|
||||
|
||||
<b-row v-else-if="searchResults.length">
|
||||
<portal to="headerActions">
|
||||
<search-box class="mr-2" />
|
||||
</portal>
|
||||
<b-form-row v-else-if="searchResults.length">
|
||||
<portal to="headerActions">
|
||||
<search-box class="mr-2" />
|
||||
</portal>
|
||||
|
||||
<b-col cols="12">
|
||||
<search-box class="field mb-3 d-sm-none" />
|
||||
</b-col>
|
||||
<b-col cols="12">
|
||||
<search-box class="field mb-3 d-sm-none" />
|
||||
</b-col>
|
||||
|
||||
<b-col cols="12" class="bg-light py-2 mb-3" v-if="activeBoard">
|
||||
<div class="d-flex align-items-center">
|
||||
<span class="d-none d-sm-block">
|
||||
Add games to:
|
||||
</span>
|
||||
|
||||
<b-button-group class="ml-sm-2">
|
||||
<b-dropdown
|
||||
split
|
||||
variant="info"
|
||||
:split-to="{ name: 'board', params: { id: boardId } }"
|
||||
:text="activeBoard.name"
|
||||
>
|
||||
<b-dropdown-item
|
||||
v-for="board in boards"
|
||||
:key="board.id"
|
||||
:disabled="!board.lists.length"
|
||||
:to="{ name: 'search', query: { boardId: board.id, listIndex: 0, q: query } }"
|
||||
>
|
||||
{{ board.name }}
|
||||
</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
|
||||
<b-dropdown
|
||||
v-if="activeBoardList"
|
||||
split
|
||||
variant="info"
|
||||
:split-to="{ name: 'board', params: { id: boardId } }"
|
||||
:text="activeBoardList.name"
|
||||
>
|
||||
<b-dropdown-item
|
||||
v-for="(list, listIndex) in activeBoard.lists"
|
||||
:key="list.id"
|
||||
:to="{ name: 'search', query: { boardId: activeBoard.id, listIndex, q: query } }"
|
||||
>
|
||||
{{ list.name }}
|
||||
</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
</b-button-group>
|
||||
|
||||
<b-button :to="{ name: 'search' }" class="ml-auto" variant="light">
|
||||
<i class="fas fa-times fa-fw" aria-hidden />
|
||||
|
||||
<span class="d-none d-sm-inline">
|
||||
Clear
|
||||
<b-col cols="12" class="bg-light py-2 mb-3" v-if="activeBoard">
|
||||
<div class="d-flex align-items-center">
|
||||
<span class="d-none d-sm-block">
|
||||
Add games to:
|
||||
</span>
|
||||
</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
<b-col
|
||||
cols="6"
|
||||
md="4"
|
||||
lg="2"
|
||||
v-for="game in searchResults"
|
||||
:key="game.id"
|
||||
<b-button-group class="ml-sm-2">
|
||||
<b-dropdown
|
||||
split
|
||||
variant="info"
|
||||
:split-to="{ name: 'board', params: { id: boardId } }"
|
||||
:text="activeBoard.name"
|
||||
>
|
||||
<b-dropdown-item
|
||||
v-for="board in boards"
|
||||
:key="board.id"
|
||||
:disabled="!board.lists.length"
|
||||
:to="{ name: 'search', query: { boardId: board.id, listIndex: 0, q: query } }"
|
||||
>
|
||||
{{ board.name }}
|
||||
</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
|
||||
<b-dropdown
|
||||
v-if="activeBoardList"
|
||||
split
|
||||
variant="info"
|
||||
:split-to="{ name: 'board', params: { id: boardId } }"
|
||||
:text="activeBoardList.name"
|
||||
>
|
||||
<b-dropdown-item
|
||||
v-for="(list, listIndex) in activeBoard.lists"
|
||||
:key="list.id"
|
||||
:to="{ name: 'search', query: { boardId: activeBoard.id, listIndex, q: query } }"
|
||||
>
|
||||
{{ list.name }}
|
||||
</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
</b-button-group>
|
||||
|
||||
<b-button :to="{ name: 'search' }" class="ml-auto" variant="light">
|
||||
<i class="fas fa-times fa-fw" aria-hidden />
|
||||
|
||||
<span class="d-none d-sm-inline">
|
||||
Clear
|
||||
</span>
|
||||
</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
<b-col
|
||||
cols="6"
|
||||
md="4"
|
||||
lg="2"
|
||||
v-for="game in searchResults"
|
||||
:key="game.id"
|
||||
>
|
||||
<game-card-search :game="game" />
|
||||
</b-col>
|
||||
</b-form-row>
|
||||
|
||||
<div
|
||||
v-else-if="query.length > 0"
|
||||
class="field centered text-center mt-5"
|
||||
>
|
||||
<game-card-search :game="game" />
|
||||
</b-col>
|
||||
</b-row>
|
||||
<p>No results found</p>
|
||||
|
||||
<div
|
||||
v-else-if="query.length > 0"
|
||||
class="field centered text-center mt-5"
|
||||
>
|
||||
<p>No results found</p>
|
||||
|
||||
<search-box />
|
||||
</div>
|
||||
</b-container>
|
||||
<search-box />
|
||||
</div>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,134 +1,136 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">Settings</portal>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">Settings</portal>
|
||||
|
||||
<b-row>
|
||||
<b-col cols="12">
|
||||
<div class="field centered">
|
||||
<settings-card
|
||||
title="Wallpapers"
|
||||
description="Manage your wallpapers"
|
||||
icon="fa-images"
|
||||
@click.native="$router.push({ name: 'wallpapers' })"
|
||||
/>
|
||||
<b-row>
|
||||
<b-col cols="12">
|
||||
<div class="field centered">
|
||||
<settings-card
|
||||
title="Wallpapers"
|
||||
description="Manage your wallpapers"
|
||||
icon="fa-images"
|
||||
@click.native="$router.push({ name: 'wallpapers' })"
|
||||
/>
|
||||
|
||||
<settings-card
|
||||
title="Profile"
|
||||
description="Public profile"
|
||||
icon="fa-user"
|
||||
@click.native="$router.push({ name: 'profile.settings' })"
|
||||
/>
|
||||
<settings-card
|
||||
title="Profile"
|
||||
description="Public profile"
|
||||
icon="fa-user"
|
||||
@click.native="$router.push({ name: 'profile.settings' })"
|
||||
/>
|
||||
|
||||
<settings-card
|
||||
title="Notes"
|
||||
description="View all your notes"
|
||||
icon="fa-note-sticky"
|
||||
@click.native="$router.push({ name: 'notes' })"
|
||||
/>
|
||||
<settings-card
|
||||
title="Notes"
|
||||
description="View all your notes"
|
||||
icon="fa-note-sticky"
|
||||
@click.native="$router.push({ name: 'notes' })"
|
||||
/>
|
||||
|
||||
<settings-card
|
||||
title="Tags"
|
||||
description="View all your tags"
|
||||
icon="fa-tags"
|
||||
@click.native="$router.push({ name: 'tags' })"
|
||||
/>
|
||||
<settings-card
|
||||
title="Tags"
|
||||
description="View all your tags"
|
||||
icon="fa-tags"
|
||||
@click.native="$router.push({ name: 'tags' })"
|
||||
/>
|
||||
|
||||
<!-- <div
|
||||
data-form-slug="6148881969433360"
|
||||
data-env="production"
|
||||
data-path="contact-us/6148881969433360"
|
||||
class="keap-custom-form"
|
||||
/> -->
|
||||
<!-- <div
|
||||
data-form-slug="6148881969433360"
|
||||
data-env="production"
|
||||
data-path="contact-us/6148881969433360"
|
||||
class="keap-custom-form"
|
||||
/> -->
|
||||
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
v-b-modal.keyboard-shortcuts
|
||||
>
|
||||
Keyboard shortcuts
|
||||
</b-button>
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
v-b-modal.keyboard-shortcuts
|
||||
>
|
||||
Keyboard shortcuts
|
||||
</b-button>
|
||||
|
||||
<!-- <b-button
|
||||
block
|
||||
variant="light"
|
||||
:to="{ name: 'dev.tools' }"
|
||||
>
|
||||
Dev tools
|
||||
</b-button> -->
|
||||
<!-- <b-button
|
||||
block
|
||||
variant="light"
|
||||
:to="{ name: 'dev.tools' }"
|
||||
>
|
||||
Dev tools
|
||||
</b-button> -->
|
||||
|
||||
<delete-account-modal />
|
||||
<delete-account-modal />
|
||||
|
||||
<b-button
|
||||
href="https://github.com/romancm/gamebrary"
|
||||
target="_blank"
|
||||
block
|
||||
variant="light"
|
||||
>
|
||||
<!-- <i class="fab fa-github fa-fw" /> -->
|
||||
GitHub
|
||||
</b-button>
|
||||
<b-button
|
||||
href="https://github.com/romancm/gamebrary"
|
||||
target="_blank"
|
||||
block
|
||||
variant="light"
|
||||
>
|
||||
<!-- <i class="fab fa-github fa-fw" /> -->
|
||||
GitHub
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
href="https://goo.gl/forms/r0juBCsZaUtJ03qb2"
|
||||
target="_blank"
|
||||
>
|
||||
Submit feedback
|
||||
</b-button>
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
href="https://goo.gl/forms/r0juBCsZaUtJ03qb2"
|
||||
target="_blank"
|
||||
>
|
||||
Submit feedback
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
block
|
||||
href="https://www.paypal.me/RomanCervantes/5"
|
||||
target="_blank"
|
||||
>
|
||||
Donate
|
||||
</b-button>
|
||||
<b-button
|
||||
block
|
||||
href="https://www.paypal.me/RomanCervantes/5"
|
||||
target="_blank"
|
||||
>
|
||||
Donate
|
||||
</b-button>
|
||||
|
||||
<hr />
|
||||
<hr />
|
||||
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
@click="session_signOut"
|
||||
>
|
||||
Log out
|
||||
</b-button>
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
@click="session_signOut"
|
||||
>
|
||||
Log out
|
||||
</b-button>
|
||||
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
@click="$bvModal.show('deleteAccount');"
|
||||
>
|
||||
Delete account
|
||||
</b-button>
|
||||
<b-button
|
||||
block
|
||||
variant="light"
|
||||
@click="$bvModal.show('deleteAccount');"
|
||||
>
|
||||
Delete account
|
||||
</b-button>
|
||||
|
||||
<!-- <b-list-group-item exact exact-active-class="bg-primary text-white" :to="{ name: 'steam.settings' }">
|
||||
<i class="mr-2 fab fa-steam fa-fw" aria-hidden></i>
|
||||
<small>Steam</small>
|
||||
</b-list-group-item> -->
|
||||
<!-- <b-list-group-item exact exact-active-class="bg-primary text-white" :to="{ name: 'steam.settings' }">
|
||||
<i class="mr-2 fab fa-steam fa-fw" aria-hidden></i>
|
||||
<small>Steam</small>
|
||||
</b-list-group-item> -->
|
||||
|
||||
<!-- <hr /> -->
|
||||
<!-- <hr /> -->
|
||||
|
||||
<!-- <b-list-group-item :to="{ name: 'profiles' }">
|
||||
<i class="mr-2 fa-solid fa-people-group fa-fw" aria-hidden />
|
||||
<small>Profiles</small>
|
||||
</b-list-group-item> -->
|
||||
<!-- <b-list-group-item :to="{ name: 'profiles' }">
|
||||
<i class="mr-2 fa-solid fa-people-group fa-fw" aria-hidden />
|
||||
<small>Profiles</small>
|
||||
</b-list-group-item> -->
|
||||
|
||||
<small>© 2022 Gamebrary</small>
|
||||
<small>© 2022 Gamebrary</small>
|
||||
|
||||
<b-button
|
||||
:to="{ name: 'releases' }"
|
||||
size="sm"
|
||||
variant="link"
|
||||
>
|
||||
{{ latestRelease }}
|
||||
</b-button>
|
||||
</div>
|
||||
<!-- <language-settings /> -->
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<b-button
|
||||
:to="{ name: 'releases' }"
|
||||
size="sm"
|
||||
variant="link"
|
||||
>
|
||||
{{ latestRelease }}
|
||||
</b-button>
|
||||
</div>
|
||||
<!-- <language-settings /> -->
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,15 +1,17 @@
|
|||
<template lang="html">
|
||||
<b-container fluid>
|
||||
<page-title title="Steam settings" />
|
||||
<section>
|
||||
<b-container>
|
||||
<page-title title="Steam settings" />
|
||||
|
||||
<b-form-group label="Steam ID:">
|
||||
<b-form-input
|
||||
v-model="steamId"
|
||||
style="max-width: 200px"
|
||||
@change="save"
|
||||
/>
|
||||
</b-form-group>
|
||||
</b-container>
|
||||
<b-form-group label="Steam ID:">
|
||||
<b-form-input
|
||||
v-model="steamId"
|
||||
style="max-width: 200px"
|
||||
@change="save"
|
||||
/>
|
||||
</b-form-group>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,57 +1,59 @@
|
|||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
:to="{ name: 'settings' }"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Tags
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<portal v-if="!loading && tags.length > 0" to="headerActions">
|
||||
<b-button
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
:to="{ name: 'settings' }"
|
||||
variant="light"
|
||||
:to="{ name: 'tag.create' }"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
Add tag
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
Tags
|
||||
</div>
|
||||
</portal>
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<portal v-if="!loading && tags.length > 0" to="headerActions">
|
||||
<b-button
|
||||
class="mr-2"
|
||||
variant="light"
|
||||
:to="{ name: 'tag.create' }"
|
||||
>
|
||||
Add tag
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<empty-state
|
||||
v-else-if="tags.length === 0"
|
||||
message="Tags are a great way to organize your collection"
|
||||
>
|
||||
<b-button
|
||||
variant="light"
|
||||
:to="{ name: 'tag.create' }"
|
||||
<empty-state
|
||||
v-else-if="tags.length === 0"
|
||||
message="Tags are a great way to organize your collection"
|
||||
>
|
||||
Create a tag
|
||||
</b-button>
|
||||
</empty-state>
|
||||
<b-button
|
||||
variant="light"
|
||||
:to="{ name: 'tag.create' }"
|
||||
>
|
||||
Create a tag
|
||||
</b-button>
|
||||
</empty-state>
|
||||
|
||||
<div class="field mr-auto ml-auto" v-else>
|
||||
<b-button
|
||||
v-for="({ textColor, bgColor, name, games }, index) in tags"
|
||||
@click="$router.push({ name: 'tag.edit', params: { id: index } })"
|
||||
rounded
|
||||
block
|
||||
variant="transparent"
|
||||
:style="`background-color: ${bgColor}; color: ${textColor}`"
|
||||
:key="name"
|
||||
>
|
||||
{{ name }} {{ games.length ? `(${games.length})` : '' }}
|
||||
</b-button>
|
||||
</div>
|
||||
</b-container>
|
||||
<div class="field mr-auto ml-auto" v-else>
|
||||
<b-button
|
||||
v-for="({ textColor, bgColor, name, games }, index) in tags"
|
||||
@click="$router.push({ name: 'tag.edit', params: { id: index } })"
|
||||
rounded
|
||||
block
|
||||
variant="transparent"
|
||||
:style="`background-color: ${bgColor}; color: ${textColor}`"
|
||||
:key="name"
|
||||
>
|
||||
{{ name }} {{ games.length ? `(${games.length})` : '' }}
|
||||
</b-button>
|
||||
</div>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,37 +1,39 @@
|
|||
<template lang="html">
|
||||
<b-container class="py-2">
|
||||
<h1>Terms of Service</h1>
|
||||
<h2>1. Terms</h2>
|
||||
<p>By accessing the website at <a href="http://gamebrary.com">http://gamebrary.com</a>, you are agreeing to be bound by these terms of service, all applicable laws and regulations, and agree that you are responsible for compliance with any applicable local laws. If you do not agree with any of these terms, you are prohibited from using or accessing this site. The materials contained in this website are protected by applicable copyright and trademark law.</p>
|
||||
<h2>2. Use License</h2>
|
||||
<ol type="a">
|
||||
<li>Permission is granted to temporarily download one copy of the materials (information or software) on Gamebrary's website for personal, non-commercial transitory viewing only. This is the grant of a license, not a transfer of title, and under this license you may not:
|
||||
<ol type="i">
|
||||
<li>modify or copy the materials;</li>
|
||||
<li>use the materials for any commercial purpose, or for any public display (commercial or non-commercial);</li>
|
||||
<li>attempt to decompile or reverse engineer any software contained on Gamebrary's website;</li>
|
||||
<li>remove any copyright or other proprietary notations from the materials; or</li>
|
||||
<li>transfer the materials to another person or "mirror" the materials on any other server.</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>This license shall automatically terminate if you violate any of these restrictions and may be terminated by Gamebrary at any time. Upon terminating your viewing of these materials or upon the termination of this license, you must destroy any downloaded materials in your possession whether in electronic or printed format.</li>
|
||||
</ol>
|
||||
<h2>3. Disclaimer</h2>
|
||||
<ol type="a">
|
||||
<li>The materials on Gamebrary's website are provided on an 'as is' basis. Gamebrary makes no warranties, expressed or implied, and hereby disclaims and negates all other warranties including, without limitation, implied warranties or conditions of merchantability, fitness for a particular purpose, or non-infringement of intellectual property or other violation of rights.</li>
|
||||
<li>Further, Gamebrary does not warrant or make any representations concerning the accuracy, likely results, or reliability of the use of the materials on its website or otherwise relating to such materials or on any sites linked to this site.</li>
|
||||
</ol>
|
||||
<h2>4. Limitations</h2>
|
||||
<p>In no event shall Gamebrary or its suppliers be liable for any damages (including, without limitation, damages for loss of data or profit, or due to business interruption) arising out of the use or inability to use the materials on Gamebrary's website, even if Gamebrary or a Gamebrary authorized representative has been notified orally or in writing of the possibility of such damage. Because some jurisdictions do not allow limitations on implied warranties, or limitations of liability for consequential or incidental damages, these limitations may not apply to you.</p>
|
||||
<h2>5. Accuracy of materials</h2>
|
||||
<p>The materials appearing on Gamebrary's website could include technical, typographical, or photographic errors. Gamebrary does not warrant that any of the materials on its website are accurate, complete or current. Gamebrary may make changes to the materials contained on its website at any time without notice. However Gamebrary does not make any commitment to update the materials.</p>
|
||||
<h2>6. Links</h2>
|
||||
<p>Gamebrary has not reviewed all of the sites linked to its website and is not responsible for the contents of any such linked site. The inclusion of any link does not imply endorsement by Gamebrary of the site. Use of any such linked website is at the user's own risk.</p>
|
||||
<h2>7. Modifications</h2>
|
||||
<p>Gamebrary may revise these terms of service for its website at any time without notice. By using this website you are agreeing to be bound by the then current version of these terms of service.</p>
|
||||
<h2>8. Governing Law</h2>
|
||||
<p>These terms and conditions are governed by and construed in accordance with the laws of Arizona and you irrevocably submit to the exclusive jurisdiction of the courts in that State or location.</p>
|
||||
</b-container>
|
||||
<section>
|
||||
<b-container class="py-2">
|
||||
<h1>Terms of Service</h1>
|
||||
<h2>1. Terms</h2>
|
||||
<p>By accessing the website at <a href="http://gamebrary.com">http://gamebrary.com</a>, you are agreeing to be bound by these terms of service, all applicable laws and regulations, and agree that you are responsible for compliance with any applicable local laws. If you do not agree with any of these terms, you are prohibited from using or accessing this site. The materials contained in this website are protected by applicable copyright and trademark law.</p>
|
||||
<h2>2. Use License</h2>
|
||||
<ol type="a">
|
||||
<li>Permission is granted to temporarily download one copy of the materials (information or software) on Gamebrary's website for personal, non-commercial transitory viewing only. This is the grant of a license, not a transfer of title, and under this license you may not:
|
||||
<ol type="i">
|
||||
<li>modify or copy the materials;</li>
|
||||
<li>use the materials for any commercial purpose, or for any public display (commercial or non-commercial);</li>
|
||||
<li>attempt to decompile or reverse engineer any software contained on Gamebrary's website;</li>
|
||||
<li>remove any copyright or other proprietary notations from the materials; or</li>
|
||||
<li>transfer the materials to another person or "mirror" the materials on any other server.</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>This license shall automatically terminate if you violate any of these restrictions and may be terminated by Gamebrary at any time. Upon terminating your viewing of these materials or upon the termination of this license, you must destroy any downloaded materials in your possession whether in electronic or printed format.</li>
|
||||
</ol>
|
||||
<h2>3. Disclaimer</h2>
|
||||
<ol type="a">
|
||||
<li>The materials on Gamebrary's website are provided on an 'as is' basis. Gamebrary makes no warranties, expressed or implied, and hereby disclaims and negates all other warranties including, without limitation, implied warranties or conditions of merchantability, fitness for a particular purpose, or non-infringement of intellectual property or other violation of rights.</li>
|
||||
<li>Further, Gamebrary does not warrant or make any representations concerning the accuracy, likely results, or reliability of the use of the materials on its website or otherwise relating to such materials or on any sites linked to this site.</li>
|
||||
</ol>
|
||||
<h2>4. Limitations</h2>
|
||||
<p>In no event shall Gamebrary or its suppliers be liable for any damages (including, without limitation, damages for loss of data or profit, or due to business interruption) arising out of the use or inability to use the materials on Gamebrary's website, even if Gamebrary or a Gamebrary authorized representative has been notified orally or in writing of the possibility of such damage. Because some jurisdictions do not allow limitations on implied warranties, or limitations of liability for consequential or incidental damages, these limitations may not apply to you.</p>
|
||||
<h2>5. Accuracy of materials</h2>
|
||||
<p>The materials appearing on Gamebrary's website could include technical, typographical, or photographic errors. Gamebrary does not warrant that any of the materials on its website are accurate, complete or current. Gamebrary may make changes to the materials contained on its website at any time without notice. However Gamebrary does not make any commitment to update the materials.</p>
|
||||
<h2>6. Links</h2>
|
||||
<p>Gamebrary has not reviewed all of the sites linked to its website and is not responsible for the contents of any such linked site. The inclusion of any link does not imply endorsement by Gamebrary of the site. Use of any such linked website is at the user's own risk.</p>
|
||||
<h2>7. Modifications</h2>
|
||||
<p>Gamebrary may revise these terms of service for its website at any time without notice. By using this website you are agreeing to be bound by the then current version of these terms of service.</p>
|
||||
<h2>8. Governing Law</h2>
|
||||
<p>These terms and conditions are governed by and construed in accordance with the laws of Arizona and you irrevocably submit to the exclusive jurisdiction of the courts in that State or location.</p>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,41 +1,26 @@
|
|||
<template lang="html">
|
||||
<b-container class="pb-3">
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'settings' }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
<section>
|
||||
<b-container class="pb-3">
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'settings' }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
Wallpapers
|
||||
</div>
|
||||
</portal>
|
||||
Wallpapers
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<empty-state
|
||||
v-if="showEmptyState"
|
||||
:title="$t('wallpapers.title')"
|
||||
message="Upload a wallpaper to customize your boards"
|
||||
@action="triggerFileUpload"
|
||||
>
|
||||
<b-button
|
||||
:disabled="outOfSpace"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
@click="triggerFileUpload"
|
||||
<empty-state
|
||||
v-if="showEmptyState"
|
||||
:title="$t('wallpapers.title')"
|
||||
message="Upload a wallpaper to customize your boards"
|
||||
@action="triggerFileUpload"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
|
||||
<template v-else>
|
||||
Upload wallpaper
|
||||
</template>
|
||||
</b-button>
|
||||
</empty-state>
|
||||
|
||||
<template v-else>
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
:disabled="outOfSpace"
|
||||
variant="light"
|
||||
|
@ -45,34 +30,51 @@
|
|||
<b-spinner small v-if="saving" />
|
||||
|
||||
<template v-else>
|
||||
<i class="fas fa-upload fa-fw" aria-hidden />
|
||||
<span class="d-none d-sm-inline">Upload</span>
|
||||
Upload wallpaper
|
||||
</template>
|
||||
</b-button>
|
||||
</portal>
|
||||
</empty-state>
|
||||
|
||||
<b-alert
|
||||
v-if="isDuplicate && !saving && file && file.name"
|
||||
show
|
||||
variant="warning"
|
||||
>
|
||||
{{ $t('wallpapers.form.duplicateMessage', { fileName: file.name }) }}
|
||||
</b-alert>
|
||||
<template v-else>
|
||||
<portal to="headerActions">
|
||||
<b-button
|
||||
:disabled="outOfSpace"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
@click="triggerFileUpload"
|
||||
>
|
||||
<b-spinner small v-if="saving" />
|
||||
|
||||
<wallpapers-list />
|
||||
<template v-else>
|
||||
<i class="fas fa-upload fa-fw" aria-hidden />
|
||||
<span class="d-none d-sm-inline">Upload</span>
|
||||
</template>
|
||||
</b-button>
|
||||
</portal>
|
||||
|
||||
<b-alert :show="showEmptyState">You don't have any wallpapers.</b-alert>
|
||||
</template>
|
||||
<b-alert
|
||||
v-if="isDuplicate && !saving && file && file.name"
|
||||
show
|
||||
variant="warning"
|
||||
>
|
||||
{{ $t('wallpapers.form.duplicateMessage', { fileName: file.name }) }}
|
||||
</b-alert>
|
||||
|
||||
<b-form-file
|
||||
class="d-none file-input"
|
||||
v-model="file"
|
||||
accept="image/*"
|
||||
:browse-text="$t('wallpapers.form.upload')"
|
||||
:placeholder="$t('wallpapers.form.placeholder')"
|
||||
@input="uploadWallpaper"
|
||||
/>
|
||||
</b-container>
|
||||
<wallpapers-list />
|
||||
|
||||
<b-alert :show="showEmptyState">You don't have any wallpapers.</b-alert>
|
||||
</template>
|
||||
|
||||
<b-form-file
|
||||
class="d-none file-input"
|
||||
v-model="file"
|
||||
accept="image/*"
|
||||
:browse-text="$t('wallpapers.form.upload')"
|
||||
:placeholder="$t('wallpapers.form.placeholder')"
|
||||
@input="uploadWallpaper"
|
||||
/>
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,56 +1,79 @@
|
|||
<!-- TODO: get inspiration from polygon -->
|
||||
<!-- TODO: restore bbparser -->
|
||||
<template lang="html">
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
<section>
|
||||
<b-container>
|
||||
<portal to="pageTitle">
|
||||
<div>
|
||||
<b-button
|
||||
:to="{ name: 'game', params: { id: game.id, slug: game.slug } }"
|
||||
variant="light"
|
||||
class="mr-2"
|
||||
>
|
||||
<i class="fa-solid fa-chevron-left" />
|
||||
</b-button>
|
||||
|
||||
News
|
||||
News
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
|
||||
<div v-else-if="!articles.length">
|
||||
no news found
|
||||
</div>
|
||||
</portal>
|
||||
|
||||
<b-spinner v-if="loading" class="spinner-centered" />
|
||||
<b-row v-else>
|
||||
<b-col cols="12" sm="4">
|
||||
<router-link :to="{ name: 'game', params: { id: game.id, slug: game.slug }}" class="float-right">
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
|
||||
<div v-else-if="!articles.length">
|
||||
no news found
|
||||
</div>
|
||||
<b-col cols="12" sm="8">
|
||||
<!-- <pre>{{ articles }}</pre> -->
|
||||
<b-card
|
||||
v-for="article in articles"
|
||||
class="mb-3"
|
||||
:key="article.id"
|
||||
>
|
||||
<strong>{{ article.title }}</strong>
|
||||
<p class="text-muted small">By {{ article.author }} | {{ article.date }}</p>
|
||||
|
||||
<b-row class="game-news" v-else>
|
||||
<b-col cols="6">
|
||||
<router-link :to="{ name: 'game', params: { id: game.id, slug: game.slug }}" class="float-right">
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
<div v-html="parseBBCode(article.contents)" />
|
||||
|
||||
<b-col cols="6">
|
||||
<b-alert
|
||||
v-for="article in articles"
|
||||
:key="article.id"
|
||||
show
|
||||
variant="secondary"
|
||||
class="mb-3 small"
|
||||
>
|
||||
<strong>{{ article.title }}</strong>
|
||||
feedlabel
|
||||
<pre>{{ article.feedlabel }}</pre>
|
||||
feedname
|
||||
<pre>{{ article.feedname }}</pre>
|
||||
<!-- <b-badge v-for="tag in article.tags" :key="tag">{{ tag }}</b-badge> -->
|
||||
|
||||
<div class="mb-0 w-100" v-html="$options.marked(article.contents)" />
|
||||
</b-alert>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
<!-- <div class="mb-0 w-100" v-html="$options.marked(article.contents)" /> -->
|
||||
</b-card>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- <b-row class="game-news" v-else>
|
||||
<b-col cols="6">
|
||||
<router-link :to="{ name: 'game', params: { id: game.id, slug: game.slug }}" class="float-right">
|
||||
<b-img :src="gameCoverUrl" fluid rounded />
|
||||
</router-link>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="6">
|
||||
|
||||
</b-col>
|
||||
</b-row> -->
|
||||
</b-container>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import { marked } from 'marked';
|
||||
import { getGameCoverUrl } from '@/utils';
|
||||
// import bbCodeParser from 'js-bbcode-parser';
|
||||
import bbobHTML from '@bbob/html'
|
||||
import presetHTML5 from '@bbob/preset-html5'
|
||||
import bbCodeParser from 'js-bbcode-parser';
|
||||
import BBCodeParser from 'js-bbcode-parser/src/index.js';
|
||||
|
||||
export default {
|
||||
marked,
|
||||
|
@ -82,6 +105,10 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
parseBBCode(contents) {
|
||||
return bbobHTML(contents, presetHTML5())
|
||||
},
|
||||
|
||||
async loadNews() {
|
||||
this.loading = true;
|
||||
|
||||
|
|
|
@ -270,7 +270,6 @@ const routes = [
|
|||
path: '/',
|
||||
component: HomePage,
|
||||
meta: {
|
||||
title: 'Dashboard',
|
||||
public: true,
|
||||
},
|
||||
},
|
||||
|
|
48
yarn.lock
48
yarn.lock
|
@ -980,6 +980,46 @@
|
|||
"@babel/helper-validator-identifier" "^7.16.7"
|
||||
to-fast-properties "^2.0.0"
|
||||
|
||||
"@bbob/core@^2.8.1":
|
||||
version "2.8.1"
|
||||
resolved "https://registry.yarnpkg.com/@bbob/core/-/core-2.8.1.tgz#2952483f11ed6a1137468606984e4a6fa44ac3c3"
|
||||
integrity sha512-1z+sw/hyRyN05NgxFCuFzq5GP1SrLU+Z3KO0ivIkO1E/M+4ae5dURwMICq2bzJEEHNfPwQsnj/Hk6m2qYmnBTQ==
|
||||
dependencies:
|
||||
"@bbob/parser" "^2.8.1"
|
||||
|
||||
"@bbob/html@^2.8.1":
|
||||
version "2.8.1"
|
||||
resolved "https://registry.yarnpkg.com/@bbob/html/-/html-2.8.1.tgz#7bb2e9cff021646d4cfb647de74844e876e76b54"
|
||||
integrity sha512-AmX38Ow45D6VQSWa0msH6CR7iEpbuWt+ZCTs1aiHoRSQxgLwll09Pc9UxoFkvWH1EnOux/nhxJjc8sM8+94PkA==
|
||||
dependencies:
|
||||
"@bbob/core" "^2.8.1"
|
||||
"@bbob/plugin-helper" "^2.8.1"
|
||||
|
||||
"@bbob/parser@^2.8.1":
|
||||
version "2.8.1"
|
||||
resolved "https://registry.yarnpkg.com/@bbob/parser/-/parser-2.8.1.tgz#3ec149ca2cad597269390ab8d68e5eccc119a038"
|
||||
integrity sha512-iRj7dbSLnuPvV46Lo1KeTFMoo4ux1jYmQ3rHYK7iUe8vUFAQvwEfHs/K9/1cE7ktrBpObIyepZD7PvN0QXw6Gw==
|
||||
dependencies:
|
||||
"@bbob/plugin-helper" "^2.8.1"
|
||||
|
||||
"@bbob/plugin-helper@^2.8.1":
|
||||
version "2.8.1"
|
||||
resolved "https://registry.yarnpkg.com/@bbob/plugin-helper/-/plugin-helper-2.8.1.tgz#b63a0ca359fb5810c081d0587e26ca2ca5b994fa"
|
||||
integrity sha512-u7DlTdj1QcbFyKDKlmPXDCvSmDrUM+hBY8NTQ/Y6EhC4y5jvRhau2bsKlMB454uuzkbE44qRsxF6ZpIhpTCLOw==
|
||||
|
||||
"@bbob/preset-html5@^2.8.1":
|
||||
version "2.8.1"
|
||||
resolved "https://registry.yarnpkg.com/@bbob/preset-html5/-/preset-html5-2.8.1.tgz#3bfa0f94a4ea8f5b564ddf2928423b693fea22d0"
|
||||
integrity sha512-ufXUvJqy3v7kwAPUwSr9zeOLSqS5uZ5okN09AhAD8W858u4UasAi5b+ski5RxADOU2Wu2RBPQ7uaJIlUinVbCg==
|
||||
dependencies:
|
||||
"@bbob/plugin-helper" "^2.8.1"
|
||||
"@bbob/preset" "^2.8.1"
|
||||
|
||||
"@bbob/preset@^2.8.1":
|
||||
version "2.8.1"
|
||||
resolved "https://registry.yarnpkg.com/@bbob/preset/-/preset-2.8.1.tgz#f316045749ccb696c5e660f982e211abce67bd33"
|
||||
integrity sha512-h7xRNEZ8gAmoJn0qXSUu6b/csZJ03wB5AbXeFCIZWYkb9miGClF0sU0o93nRvnSo9MhOAsahYLhG62roHPX1Ng==
|
||||
|
||||
"@bcoe/v8-coverage@^0.2.3":
|
||||
version "0.2.3"
|
||||
resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
|
||||
|
@ -6738,10 +6778,10 @@ jose@^2.0.5:
|
|||
dependencies:
|
||||
"@panva/asn1.js" "^1.0.0"
|
||||
|
||||
js-bbcode-parser@^3.0.5:
|
||||
version "3.0.5"
|
||||
resolved "https://registry.yarnpkg.com/js-bbcode-parser/-/js-bbcode-parser-3.0.5.tgz#c8cef49fe41f6a11d5550db482c4bbb1a4de2014"
|
||||
integrity sha512-443YN6jukBNthfiJm3pA9pUAmpiyiK51L0uecsIySb2aNLpF4xz+lQH0CN+E0DyTEy9J0SafX9FAU0JJOQyRyg==
|
||||
js-bbcode-parser@^4.0.0:
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/js-bbcode-parser/-/js-bbcode-parser-4.0.0.tgz#ca4b8de5c1b52f382f525802b6918071653cb869"
|
||||
integrity sha512-3uoQJBMhhaJQhFY+KeR99MNCUxLjTaacHf930Ln6DQd13yD+EXqtHovhlaN5Jb+J058hx1F0l64rF0rLGM7dJA==
|
||||
|
||||
js-beautify@^1.6.12:
|
||||
version "1.14.3"
|
||||
|
|
Loading…
Reference in a new issue