Add Progress (WIP) (#152)

* Copy GameNotes and use it as boilerplate

* Save and display progress data

* Save and display progress data

* Mobile adjustments and add label

* Mobile adjustments and add label

* save progress as integer

* Add sorting by progress

* Display progress on select GameCards

* Fix `progress()` return

* Reduce amount of props

* Copy change

* remove unnecessary check

* use `input[type=range]`

* remove unnecessary check

* Add progress-pie in the Grid view

Credit goes to @oliviale for her lovely CSS progress pie

* Save and display progress data

* Add progress-pie in the Grid view

Credit goes to @oliviale for her lovely CSS progress pie

* fix rebase conflict

* add translation

* Fixed merge conflict typo

src/App.vue

@@ -97,11 +97,13 @@ export default {
   mounted() {
     // TODO: REMOVE, call action directly
     this.$bus.$on('SAVE_NOTES', this.saveNotes);
+    this.$bus.$on('SAVE_PROGRESSES', this.saveProgresses);
     this.init();
   },
 
   beforeDestroy() {
     this.$bus.$off('SAVE_NOTES');
+    this.$bus.$off('SAVE_PROGRESSES');
   },
 
   methods: {
@@ -167,6 +169,20 @@ export default {
       }
     },
 
+    saveProgresses(progresses, force) {
+      if (progresses) {
+        // TODO: move to actions
+        db.collection('progresses').doc(this.user.uid).set(progresses, { merge: !force })
+          .then(() => {
+            this.$bus.$emit('TOAST', { message: 'Progress updated' });
+          })
+          .catch(() => {
+            this.$bus.$emit('TOAST', { message: 'There was an error saving your progress', type: 'error' });
+            this.$router.push({ name: 'sessionExpired' });
+          });
+      }
+    },
+
     syncData() {
       // TODO: move to actions
       db.collection('lists').doc(this.user.uid)
@@ -207,6 +223,16 @@ export default {
             this.$store.commit('SET_NOTES', notes);
           }
         });
+
+      // TODO: move to actions
+      db.collection('progresses').doc(this.user.uid)
+        .onSnapshot((doc) => {
+          if (doc.exists) {
+            const progresses = doc.data();
+
+            this.$store.commit('SET_PROGRESSES', progresses);
+          }
+        });
     },
 
     initUser(user) {

src/components/GameCards/GameCard.js

@@ -13,7 +13,7 @@ export default {
   },
 
   computed: {
-    ...mapState(['settings', 'games', 'gameLists', 'platform', 'user', 'tags', 'activeList', 'notes']),
+    ...mapState(['settings', 'games', 'gameLists', 'platform', 'user', 'tags', 'activeList', 'notes', 'progresses']),
     ...mapGetters(['hasTags']),
 
     showGameRatings() {
@@ -39,6 +39,10 @@ export default {
       return this.notes && this.notes[this.gameId] && this.notes[this.gameId].text;
     },
 
+    progress() {
+      return this.progresses && this.progresses[this.gameId] && this.progresses[this.gameId].number;
+    },
+
     list() {
       return this.activePlatform[this.listId];
     },

src/components/GameCards/GameCardDefault.vue

@@ -17,12 +17,18 @@
       <i class="fas fa-grip-vertical game-drag-handle" />
 
       <game-rating
-        v-if="showGameRatings && list.view !== 'covers'"
+        v-if="showGameRatings"
         :rating="game.rating"
         small
         @click.native="openDetails"
       />
 
+      <game-progress
+        v-if="progress"
+        small
+        @click.native="openDetails"
+      />
+
       <i
         v-if="note"
         :title="note"
@@ -53,12 +59,14 @@
 
 <script>
 import GameRating from '@/components/GameDetail/GameRating';
+import GameProgress from '@/components/GameDetail/GameProgress';
 import GameCardUtils from '@/components/GameCards/GameCard';
 import Tag from '@/components/Tag';
 
 export default {
   components: {
     GameRating,
+    GameProgress,
     Tag,
   },
 

src/components/GameCards/GameCardGrid.vue

@@ -10,8 +10,38 @@
     >
 
     <div :class="{ 'game-info': showGameInfo }" >
+      <div
+        v-if="showGameInfo && progress"
+        class="title-progress"
+      >
         <a
-        v-if="showGameInfo && list.view !== 'covers'"
+          v-text="game.name"
+          @click="openDetails"
+        />
+
+        <game-rating
+          v-if="showGameRatings"
+          :rating="game.rating"
+          small
+          @click.native="openDetails"
+        />
+
+        <game-progress
+          small
+          pie
+          @click.native="openDetails"
+        />
+
+        <i
+          v-if="note"
+          :title="note"
+          class="fas fa-sticky-note note"
+          @click="openDetails"
+        />
+      </div>
+
+      <a
+        v-if="showGameInfo && !progress"
         v-text="game.name"
         @click="openDetails"
       />
@@ -19,14 +49,14 @@
       <i class="fas fa-grip-vertical game-drag-handle" />
 
       <game-rating
-        v-if="showGameInfo && showGameRatings && list.view !== 'covers'"
+        v-if="showGameInfo && showGameRatings && !progress"
         :rating="game.rating"
         small
         @click.native="openDetails"
       />
 
       <i
-        v-if="showGameInfo && note"
+        v-if="showGameInfo && note && !progress"
         :title="note"
         class="fas fa-sticky-note note"
         @click="openDetails"
@@ -55,12 +85,14 @@
 
 <script>
 import GameRating from '@/components/GameDetail/GameRating';
+import GameProgress from '@/components/GameDetail/GameProgress';
 import GameCardUtils from '@/components/GameCards/GameCard';
 import Tag from '@/components/Tag';
 
 export default {
   components: {
     GameRating,
+    GameProgress,
     Tag,
   },
 
@@ -143,6 +175,26 @@ export default {
       margin-right: $gp / 2;
       color: var(--game-card-text-color);
     }
+
+    .title-progress {
+      display: grid;
+      grid-template: auto auto / auto auto;
+
+      a {
+        grid-column: 1;
+      }
+
+      .game-rating {
+        grid-column: 1;
+        grid-row: 2;
+      }
+
+      .game-progresses {
+        justify-self: end;
+        grid-column: 2;
+        grid-row: span 2;
+      }
+    }
   }
 
   .game-drag-handle {

src/components/GameCards/GameCardText.vue

@@ -11,6 +11,12 @@
         @click.native="openDetails"
       />
 
+      <game-progress
+        v-if="progress"
+        small
+        @click.native="openDetails"
+      />
+
       <i
         v-if="note"
         :title="note"
@@ -43,12 +49,14 @@
 
 <script>
 import GameRating from '@/components/GameDetail/GameRating';
+import GameProgress from '@/components/GameDetail/GameProgress';
 import GameCardUtils from '@/components/GameCards/GameCard';
 import Tag from '@/components/Tag';
 
 export default {
   components: {
     GameRating,
+    GameProgress,
     Tag,
   },
 

src/components/GameCards/GameCardWide.vue

@@ -22,6 +22,12 @@
         @click.native="openDetails"
       />
 
+      <game-progress
+        v-if="progress"
+        small
+        @click.native="openDetails"
+      />
+
       <i
         v-if="note"
         :title="note"
@@ -52,12 +58,14 @@
 
 <script>
 import GameRating from '@/components/GameDetail/GameRating';
+import GameProgress from '@/components/GameDetail/GameProgress';
 import GameCardUtils from '@/components/GameCards/GameCard';
 import Tag from '@/components/Tag';
 
 export default {
   components: {
     GameRating,
+    GameProgress,
     Tag,
   },
 

src/components/GameDetail/GameNotes.vue

@@ -8,6 +8,7 @@
       </div>
 
       <button class="primary" @click="editNote">
+        <i class="fas fa-pen" />
         Edit note
       </button>
     </div>
@@ -37,6 +38,7 @@
         </button>
 
         <button class="danger" @click="deleteNote">
+          <i class="fas fa-trash-alt" />
           Delete note
         </button>
       </footer>

src/components/GameDetail/GameProgress.vue

@@ -0,0 +1,423 @@
+<template lang="html">
+  <div :class="['game-progresses', { small }]">
+    <div v-if="hasProgress && !showProgressField" class="progress">
+      <div
+        class="progress-data"
+        v-if="!pie"
+      >
+        <progress
+          class="progress-bar"
+          max="100"
+          :value="localProgress.number"
+        >
+          <div class="progress-bar-fallback">
+            <span :style="style">
+              Progress: {{localProgress.number}}%
+            </span>
+          </div>
+        </progress>
+        <div
+          v-if="localProgress.number"
+          class="progress-bar-label"
+        >
+          {{localProgress.number}}%
+        </div>
+      </div>
+
+      <div
+        v-else
+        class="progress-pie"
+        :data-value="localProgress.number"
+      >
+      </div>
+
+      <button
+        v-if="!small && !pie"
+        class="primary"
+        @click="editProgress"
+      >
+        Edit progress
+      </button>
+    </div>
+
+    <div
+      class="progress-field"
+      v-if="showProgressField && !small && !pie"
+    >
+      <div class="progress-data">
+        <div
+          v-if="localProgress.number"
+          class="progress-bar-label"
+        >
+          {{localProgress.number}}%
+        </div>
+
+        <input
+          class="progress-range"
+          v-model.number="localProgress.number"
+          placeholder="50"
+          type="range"
+          min="0"
+          max="100"
+          step="5"
+          autofocus
+        >
+      </div>
+
+      <div class="progress-action">
+        <div class="progress-edit">
+          <button class="secondary" @click="reset">
+            {{ $t('global.cancel') }}
+          </button>
+
+          <button class="primary" @click="saveProgress">
+            {{ $t('global.save') }}
+          </button>
+        </div>
+
+        <button class="danger" @click="deleteProgress">
+          Delete progress
+        </button>
+      </div>
+    </div>
+
+    <button
+      v-if="!hasProgress &&
+            !showProgressField &&
+            !small &&
+            !pie"
+      class="primary"
+      @click="addProgress"
+    >
+      <i class="fas fa-clock" />
+      {{ $t('progresses.addProgress') }}
+    </button>
+  </div>
+</template>
+
+<script>
+import { mapState, mapGetters } from 'vuex';
+
+export default {
+  props: {
+    small: {
+      type: Boolean,
+      default: false,
+    },
+    pie: {
+      type: Boolean,
+      default: false,
+    },
+  },
+
+  data() {
+    return {
+      showProgressField: false,
+      localProgress: {
+        number: null,
+      },
+    };
+  },
+
+  computed: {
+    ...mapState(['game', 'progresses']),
+    ...mapGetters(['gameProgress']),
+
+    hasProgress() {
+      return this.gameProgress && this.gameProgress.number;
+    },
+
+    style() {
+      return `width: ${this.localProgress.number}%`;
+    },
+  },
+
+  mounted() {
+    this.reset();
+  },
+
+  methods: {
+    reset() {
+      this.localProgress = this.gameProgress
+        ? JSON.parse(JSON.stringify(this.gameProgress))
+        : { number: null };
+
+      this.showProgressField = false;
+    },
+
+    addProgress() {
+      this.showProgressField = true;
+    },
+
+    editProgress() {
+      this.showProgressField = true;
+    },
+
+    deleteProgress() {
+      const updatedProgresses = {
+        ...this.progresses,
+      };
+
+      this.$delete(updatedProgresses, this.game.id);
+
+      this.$bus.$emit('SAVE_PROGRESSES', updatedProgresses, true);
+      this.showProgressField = false;
+      this.localProgress = {
+        number: null,
+      };
+    },
+
+    saveProgress() {
+      const updatedProgresses = {
+        ...this.progresses,
+      };
+
+      updatedProgresses[this.game.id] = this.localProgress;
+
+      this.$bus.$emit('SAVE_PROGRESSES', updatedProgresses);
+      this.showProgressField = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" rel="stylesheet/scss" scoped>
+  @import "~styles/styles";
+
+  .game-progresses {
+    max-width: calc(100% - #{$gp});
+    margin-top: $gp;
+    margin-bottom: $gp;
+
+    @media($small) {
+      margin: $gp auto;
+    }
+
+    .progress-data {
+      display: flex;
+      align-items: center;
+      margin-top: $gp;
+      margin-bottom: $gp;
+
+      @media($small) {
+        flex-wrap: wrap;
+        margin: $gp auto;
+        justify-content: center;
+
+        .progress-bar-label {
+          order: 1;
+
+          + .progress-range {
+            margin-top: $gp / 3;
+            order: 2;
+          }
+        }
+      }
+    }
+
+    .progress-pie {
+      width: 30px;
+      height: 30px;
+
+      &::after {
+        font: 100 10px/21px Tahoma;
+      }
+    }
+
+    .progress-bar {
+      -webkit-appearance: none;
+      appearance: none;
+      display: block;
+      border-radius: $border-radius;
+      background: var(--list-background);
+      height: 20px;
+      border-color: transparent;
+      overflow: hidden;
+
+      @media($small) {
+        order: 2;
+      }
+
+      &::-moz-progress-bar {
+        background: var(--accent-color);
+      }
+
+      &::-webkit-progress-bar {
+        border-radius: $border-radius;
+      }
+
+      &::-webkit-progress-value {
+        background-image: linear-gradient(var(--accent-color), var(--accent-color));
+      }
+    }
+
+    .progress-bar-label {
+      margin-left: $gp;
+      font-size: 18px;
+      font-weight: bold;
+      color: var(--accent-color);
+      order: 2;
+
+      @media($small) {
+        order: 1;
+        margin-left: 0;
+        margin-bottom: $gp / 3;
+        flex-basis: 100%;
+      }
+    }
+
+    .progress-range {
+      -webkit-appearance: none;
+      appearance: none;
+      width: 100%;
+      height: 36px;
+      border: 0;
+      border-radius: 0;
+      padding: 0;
+      margin-bottom: 0;
+      background: transparent;
+      overflow: hidden;
+      order: 1;
+
+      &:focus {
+        outline: none;
+
+        &::-webkit-slider-runnable-track {
+          background: var(--accent-color);
+        }
+
+        &::-ms-fill-lower {
+          background: var(--accent-color);
+        }
+
+        &::-ms-fill-upper {
+          background: var(--accent-color);
+        }
+      }
+
+      &::-webkit-slider-runnable-track {
+        width: 100%;
+        height: 36px;
+        cursor: pointer;
+        animate: 0.2s;
+        background: var(--accent-color);
+        border-radius: $border-radius;
+        overflow: hidden;
+      }
+
+      &::-webkit-slider-thumb {
+        height: 36px;
+        width: 16px;
+        background: var(--primary-background);
+        cursor: pointer;
+        -webkit-appearance: none;
+        box-shadow: 500px 0 0 500px var(--list-background);
+      }
+
+      &::-moz-range-track {
+        width: 100%;
+        height: 36px;
+        cursor: pointer;
+        animate: 0.2s;
+        overflow: hidden;
+        background: var(--accent-color);
+        border-radius: $border-radius;
+      }
+
+      &::-moz-range-thumb {
+        height: 36px;
+        width: 16px;
+        border: none;
+        border-radius: 0;
+        background: var(--primary-background);
+        box-shadow: 500px 0 0 500px var(--list-background);
+        cursor: pointer;
+      }
+
+      &::-ms-track {
+        width: 100%;
+        height: 36px;
+        cursor: pointer;
+        animate: 0.2s;
+        overflow: hidden;
+        background: transparent;
+        border-color: transparent;
+        border-width: 16px 0;
+        color: transparent;
+      }
+
+      &::-ms-fill-lower {
+        background: var(--accent-color);
+        border-radius: $border-radius;
+      }
+
+      &::-ms-fill-upper {
+        background: var(--accent-color);
+        border-radius: $border-radius;
+      }
+
+      &::-ms-thumb {
+        height: 36px;
+        width: 16px;
+        border-radius: 0;
+        background: var(--primary-background);
+        box-shadow: 500px 0 0 500px var(--list-background);
+        cursor: pointer;
+      }
+
+      @media($small) {
+        margin-top: $gp * 2;
+        margin-right: 0;
+        margin-bottom: $gp;
+      }
+    }
+
+    .progress-action {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin-top: $gp;
+
+      .secondary {
+        margin-right: $gp;
+      }
+
+      @media($small) {
+        flex-wrap: wrap;
+        justify-content: center;
+        margin-top: 0;
+
+        .danger {
+          margin-top: $gp;
+        }
+      }
+
+      .progress-edit {
+        min-width: 300px;
+        max-width: 355px;
+        width: calc(100% - 75px - (#{$gp} * 8));
+      }
+    }
+
+    &.small {
+      max-width: 100%;
+      margin-top: $gp / 4;
+      margin-bottom: $gp / 4;
+
+      .progress-data {
+        margin-top: 0;
+        margin-bottom: 0;
+      }
+
+      .progress-bar {
+        height: 10px;
+        width: 100%;
+      }
+
+      .progress-bar-label {
+        display: none;
+      }
+    }
+  }
+
+</style>

src/components/Lists/List.vue

@@ -114,7 +114,7 @@ export default {
   },
 
   computed: {
-    ...mapState(['user', 'gameLists', 'platform', 'settings', 'games', 'dragging']),
+    ...mapState(['user', 'gameLists', 'platform', 'settings', 'games', 'dragging', 'progresses']),
 
     autoSortEnabled() {
       const list = this.list[this.listIndex];
@@ -129,6 +129,26 @@ export default {
       switch (sortOrder) {
       case 'sortByCustom':
         return gameList;
+      case 'sortByProgress':
+        return gameList.sort((a, b) => {
+          const gameA = this.games[a] &&
+                        this.progresses[this.games[a].id] &&
+                        this.progresses[this.games[a].id].number
+            ? this.progresses[this.games[a].id].number
+            : 0;
+
+          const gameB = this.games[b] &&
+                        this.progresses[this.games[b].id] &&
+                        this.progresses[this.games[b].id].number
+            ? this.progresses[this.games[b].id].number
+            : 0;
+
+          if (gameA > gameB) {
+            return -1;
+          }
+
+          return gameA < gameB ? 1 : 0;
+        });
       case 'sortByRating':
         return gameList.sort((a, b) => {
           const gameA = this.games[a] && this.games[a].rating

src/components/Lists/ListSettingsModal.vue

@@ -187,6 +187,7 @@ export default {
       sortOrders: {
         sortByName: 'fas fa-sort-alpha-down',
         sortByRating: 'fas fa-star',
+        sortByProgress: 'fas fa-clock',
         sortByCustom: 'fas fa-user',
       },
     };

src/i18n/ar.json

@@ -22,7 +22,13 @@
         "donateMessage": "Gamebrary مجاني ومفتوح المصدر ، والنظر في المساعدة في تطويرها",
         "donating": "تبرع",
         "reportBugs": "الإبلاغ عن الأخطاء",
-    "submitFeedback": "تقديم ردود الفعل"
+        "submitFeedback": "تقديم ردود الفعل",
+        "home": "لوحات المفاتيح المنزلية",
+        "handheld": "الأجهزة المحمولة",
+        "computer": "الكمبيوتر المنزلي",
+        "releaseYear": "صدر العام",
+        "name": "أبجديا",
+        "type": "نوع"
     },
     "igdbCredit": {
         "poweredByIgdb": "مدعوم من IGDB"
@@ -45,12 +51,12 @@
         "perspective": "إنطباع",
         "releaseDate": "يوم الاصدار",
         "timeToBeat": "الوقت يداهمك",
-    "gameModes": "نوع اللعبة",
+        "gameModes": "وضع اللعب",
         "genres": "نوع أدبي",
         "gamePlatforms": "متاح أيضًا لـ:",
         "developers": "مطور",
         "publishers": "الناشرون",
-    "removeFromList": "ازله من القائمة",
+        "removeFromList": "إزالة",
         "links": {
             "official": "موقع رسمي",
             "wikia": "فندوم",
@@ -59,7 +65,7 @@
             "twitter": "تغريد",
             "twitch": "نشل",
             "instagram": "إينستاجرام",
-      "youtube": "موقع YouTube",
+            "youtube": "موقع يوتيوب",
             "iphone": "دائرة الرقابة الداخلية",
             "ipad": "اى باد",
             "android": "لعب المتجر",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "تحرير اسم القائمة",
         "type": "نوع القائمة",
+        "settings": "قائمة الإعدادات",
         "placeholder": "اكتب اسم قائمتك هنا",
-    "suggestions": {
-      "owned": "مملوكة",
         "wishlist": "الأماني",
-      "currentlyPlaying": "يلعب حاليا",
-      "completed": "منجز"
-    },
         "input": "أدخل بنفسك",
         "add": "اضف قائمة",
         "duplicateWarning": "لديك بالفعل قائمة بهذا الاسم",
         "getStarted": "البدء!",
         "addFirstTime": "مرحبا ، أضف قائمتك الأولى!",
         "sortByName": "THE",
+        "sortByProgress": "تقدم",
         "sortByRating": "أحرز هدفا",
         "sortByReleaseDate": "تاريخ",
         "sortByCustom": "العادة",
-    "delete": "حذف",
+        "delete": "حذف القائمة",
         "moveLeft": "تحرك يسارا",
         "moveRight": "تحرك يمينا",
         "emptyList": "هذه القائمة فارغة",
         "addGame": "إضافة اللعبة",
         "view": "عرض القائمة",
         "moveList": "نقل القائمة",
-    "sortList": "قائمة الفرز",
+        "sortList": "قائمة الفرز التلقائي",
         "coversSizeTitle": "يغطي عبر",
         "views": {
             "single": "افتراضي",
             "wide": "المدمج",
             "text": "نص فقط",
-      "masonry": "Masonry",
+            "masonry": "ماسونية",
             "grid": "شبكة"
         }
     },
@@ -113,10 +116,10 @@
         "about": "حول",
         "platforms": "منصات",
         "gameBoard": "مجلس لعبة",
+        "public": "عامة",
         "tags": "الكلمات",
         "account": "الحساب",
         "global": "عالمي",
-    "darkTheme": "موضوع الظلام",
         "reloading": "إعادة ...",
         "releases": "إطلاق",
         "newsletter": "تلقي رسائل البريد الإلكتروني المحدثة (قريبًا)",
@@ -140,8 +143,9 @@
         "signOut": "خروج",
         "wallpaper": {
             "title": "تحميل خلفية",
-      "transparency": "السماح بالشفافية",
+            "transparency": "اسمح بالشفافية",
             "currentWallpaper": "خلفية الحالية",
+            "wallpaper": "ورق الجدران",
             "removeWallpaper": "إزالة خلفية"
         },
         "deleteAccount": {
@@ -154,9 +158,10 @@
         "title": "علامات اللعبة",
         "addTag": "إضافة علامة",
         "createTag": "إنشاء علامة",
-    "inputPlaceholder": "اسم اليوم",
+        "inputPlaceholder": "اسم العلامة",
-    "applyTag": "تطبيق العلامة",
+        "editTags": "تحرير علامات اللعبة",
-    "useTags": "استخدم العلامات لتنظيم الألعاب بشكل أفضل"
+        "message": "انقر فوق العلامة لإضافتها إلى <a>{gameName}</a> . انقر فوق <i class=\"fas fa-times close\"></i> لإزالة العلامة.",
+        "settingsMessage": "يمكنك إضافة أو تعديل العلامات الموجودة في الإعدادات."
     },
     "gameSearch": {
         "title": "إضافة ألعاب إلى",
@@ -167,6 +172,11 @@
         "addToIGDB": "إضافته إلى IGDB"
     },
     "notes": {
-    "addNote": "اضف ملاحظة"
+        "addNote": "اضف ملاحظة",
+        "notes": "ملاحظات"
+    },
+    "progresses": {
+        "addProgress": "إضافة التقدم",
+        "progresses": "تقدم"
     }
 }

src/i18n/cs.json

@@ -19,10 +19,16 @@
         "published": "Zveřejněno {date}"
     },
     "platforms": {
-    "donateMessage": "Gamebrary je bezplatný a otevřený zdroj, zvažte pomoc při jeho vývoji",
+        "donateMessage": "Gamebrary je bezplatný a otevřený zdroj, zvažte pomoc při jeho rozvoji",
         "donating": "darování",
         "reportBugs": "hlášení chyb",
-    "submitFeedback": "odeslání zpětné vazby"
+        "submitFeedback": "odeslání zpětné vazby",
+        "home": "Domácí konzole",
+        "handheld": "Kapesní počítače",
+        "computer": "Domácí počítač",
+        "releaseYear": "Rok vydání",
+        "name": "Abecedně",
+        "type": "Typ"
     },
     "igdbCredit": {
         "poweredByIgdb": "Běží na IGDB"
@@ -50,7 +56,7 @@
         "gamePlatforms": "K dispozici také pro:",
         "developers": "Vývojář",
         "publishers": "Vydavatelé",
-    "removeFromList": "Odstranit ze seznamu",
+        "removeFromList": "Odstranit",
         "links": {
             "official": "Oficiální stránka",
             "wikia": "Fandom",
@@ -63,7 +69,7 @@
             "iphone": "iOS",
             "ipad": "iPad",
             "android": "Obchod Play",
-      "steam": "Pára",
+            "steam": "Parní",
             "reddit": "Reddit",
             "discord": "Svár",
             "google_plus": "Google Plus",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "Upravit název seznamu",
         "type": "Typ seznamu",
+        "settings": "Nastavení seznamu",
         "placeholder": "Sem zadejte název seznamu",
-    "suggestions": {
-      "owned": "Vlastní",
         "wishlist": "Seznam přání",
-      "currentlyPlaying": "Právě hraje",
-      "completed": "Dokončeno"
-    },
         "input": "Zadejte svůj vlastní",
         "add": "Přidat seznam",
         "duplicateWarning": "Již máte seznam s tímto názvem",
         "getStarted": "Začít!",
         "addFirstTime": "Vítejte, přidejte svůj první seznam!",
         "sortByName": "",
+        "sortByProgress": "Pokrok",
         "sortByRating": "Skóre",
         "sortByReleaseDate": "datum",
         "sortByCustom": "Zvyk",
-    "delete": "Odstranit",
+        "delete": "Smazat seznam",
         "moveLeft": "Pohyb doleva",
         "moveRight": "Pohyb vpravo",
         "emptyList": "Tento seznam je prázdný",
         "addGame": "Přidat hru",
         "view": "Zobrazení seznamu",
         "moveList": "Přesunout seznam",
-    "sortList": "Seřadit seznam",
+        "sortList": "Seznam automatického třídění",
         "coversSizeTitle": "Přikrývá se",
         "views": {
             "single": "Výchozí",
             "wide": "Kompaktní",
             "text": "Pouze text",
-      "masonry": "Masonry",
+            "masonry": "Zdivo",
             "grid": "Mřížka"
         }
     },
@@ -113,10 +116,10 @@
         "about": "O",
         "platforms": "Platformy",
         "gameBoard": "Hrací deska",
+        "public": "Veřejnost",
         "tags": "Značky",
         "account": "Účet",
         "global": "Globální",
-    "darkTheme": "Tmavé téma",
         "reloading": "Přebíjení...",
         "releases": "Vydání",
         "newsletter": "Dostávat aktualizační e-maily (již brzy)",
@@ -142,6 +145,7 @@
             "title": "Nahrajte tapetu",
             "transparency": "Povolit průhlednost",
             "currentWallpaper": "Aktuální tapeta",
+            "wallpaper": "Tapeta na zeď",
             "removeWallpaper": "Odstraňte tapetu"
         },
         "deleteAccount": {
@@ -154,19 +158,25 @@
         "title": "Herní štítky",
         "addTag": "Přidat značku",
         "createTag": "Vytvořit značku",
-    "inputPlaceholder": "Název dne",
+        "inputPlaceholder": "Název značky",
-    "applyTag": "Použít značku",
+        "editTags": "Úpravy herních značek",
-    "useTags": "Pomocí značek můžete lépe organizovat své hry"
+        "message": "Kliknutím na značku ji přidáte do <a>{gameName}</a> . Klikněte na <i class=\"fas fa-times close\"></i> odebrat značku.",
+        "settingsMessage": "Existující značky můžete přidat nebo upravit v nastavení."
     },
     "gameSearch": {
-    "title": "Přidat hry do",
+        "title": "Přidejte hry do",
-    "inputPlaceholder": "Hledej tady",
+        "inputPlaceholder": "Hledej zde",
         "alreadyInList": "z výsledků vyhledávání již ve vašem seznamu",
         "noResultsFound": "Žádné výsledky",
         "missingGame": "Chybí vám hra? Pomozte komunitě a",
         "addToIGDB": "Přidejte ji do IGDB"
     },
     "notes": {
-    "addNote": "Přidat poznámku"
+        "addNote": "Přidat poznámku",
+        "notes": "Poznámky"
+    },
+    "progresses": {
+        "addProgress": "Přidejte pokrok",
+        "progresses": "Pokrok"
     }
 }

src/i18n/de.json

@@ -1,7 +1,7 @@
 {
     "global": {
         "back": "Zurück",
-    "save": "sparen",
+        "save": "speichern",
         "cancel": "Stornieren",
         "create": "Erstellen",
         "filter": "Filter",
@@ -22,7 +22,13 @@
         "donateMessage": "Gamebrary ist kostenlos und Open Source",
         "donating": "spenden",
         "reportBugs": "Fehler melden",
-    "submitFeedback": "Feedback senden"
+        "submitFeedback": "Feedback senden",
+        "home": "Hauptkonsolen",
+        "handheld": "Handhelds",
+        "computer": "Heimcomputer",
+        "releaseYear": "Jahr veröffentlicht",
+        "name": "Alphabetisch",
+        "type": "Art"
     },
     "igdbCredit": {
         "poweredByIgdb": "Bereitgestellt von IGDB"
@@ -36,7 +42,7 @@
     },
     "sessionExpired": {
         "title": "Sitzung abgelaufen",
-    "login": "Anmeldung",
+        "login": "Einloggen",
         "exit": "Ausgang"
     },
     "gameDetail": {
@@ -50,7 +56,7 @@
         "gamePlatforms": "Auch erhältlich für:",
         "developers": "Entwickler",
         "publishers": "Verlag",
-    "removeFromList": "Aus Liste entfernen",
+        "removeFromList": "Löschen",
         "links": {
             "official": "Offizielle Seite",
             "wikia": "Fangemeinde",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "Listenname bearbeiten",
         "type": "Listentyp",
+        "settings": "Listeneinstellungen",
         "placeholder": "Geben Sie hier Ihren Listennamen ein",
-    "suggestions": {
-      "owned": "Besessen",
         "wishlist": "Wunschzettel",
-      "currentlyPlaying": "Spielt gerade",
-      "completed": "Abgeschlossen"
-    },
         "input": "Geben Sie Ihre eigenen ein",
         "add": "Liste hinzufügen",
         "duplicateWarning": "Sie haben bereits eine Liste mit diesem Namen",
         "getStarted": "Loslegen!",
         "addFirstTime": "Willkommen, füge deine erste Liste hinzu!",
         "sortByName": "DAS",
+        "sortByProgress": "Fortschritt",
         "sortByRating": "Ergebnis",
         "sortByReleaseDate": "Datum",
         "sortByCustom": "Brauch",
-    "delete": "Löschen",
+        "delete": "Liste löschen",
         "moveLeft": "Geh nach links",
         "moveRight": "Nach rechts bewegen",
         "emptyList": "Diese Liste ist leer",
         "addGame": "Spiel hinzufügen",
         "view": "Listenansicht",
         "moveList": "Liste verschieben",
-    "sortList": "Sortierliste",
+        "sortList": "Automatische Sortierliste",
         "coversSizeTitle": "Abdeckungen herüber",
         "views": {
             "single": "Standard",
             "wide": "Kompakt",
             "text": "Nur Text",
-      "masonry": "Masonry",
+            "masonry": "Mauerwerk",
             "grid": "Gitter"
         }
     },
@@ -113,10 +116,10 @@
         "about": "Über",
         "platforms": "Plattformen",
         "gameBoard": "Spielbrett",
+        "public": "Öffentlichkeit",
         "tags": "Stichworte",
         "account": "Konto",
         "global": "Global",
-    "darkTheme": "Dunkles Thema",
         "reloading": "Neuladen...",
         "releases": "Releases",
         "newsletter": "Erhalte Update-E-Mails (in Kürze)",
@@ -142,6 +145,7 @@
             "title": "Hintergrundbild hochladen",
             "transparency": "Transparenz zulassen",
             "currentWallpaper": "Aktuelles Hintergrundbild",
+            "wallpaper": "Tapete",
             "removeWallpaper": "Tapete entfernen"
         },
         "deleteAccount": {
@@ -155,18 +159,24 @@
         "addTag": "Tag hinzufügen",
         "createTag": "Tag erstellen",
         "inputPlaceholder": "Tag name",
-    "applyTag": "Tag anwenden",
+        "editTags": "Spiel-Tags bearbeiten",
-    "useTags": "Verwenden Sie Tags, um Ihre Spiele besser zu organisieren"
+        "message": "Klicken Sie auf das Tag, um es zu <a>{gameName} hinzuzufügen</a> . Klicke auf <i class=\"fas fa-times close\"></i> tag entfernen.",
+        "settingsMessage": "Sie können vorhandene Tags in den Einstellungen hinzufügen oder bearbeiten."
     },
     "gameSearch": {
         "title": "Spiele hinzufügen zu",
         "inputPlaceholder": "Suche hier",
-    "alreadyInList": "von den Suchergebnissen bereits in Ihrer Liste",
+        "alreadyInList": "aus Suchergebnissen, die bereits in Ihrer Liste enthalten sind",
         "noResultsFound": "Keine Ergebnisse",
         "missingGame": "Vermissen Sie ein Spiel? Helfen Sie der Community und",
         "addToIGDB": "Fügen Sie es zu IGDB hinzu"
     },
     "notes": {
-    "addNote": "Notiz hinzufügen"
+        "addNote": "Notiz hinzufügen",
+        "notes": "Anmerkungen"
+    },
+    "progresses": {
+        "addProgress": "Fortschritt hinzufügen",
+        "progresses": "Fortschritt"
     }
 }

src/i18n/en.json

@@ -91,6 +91,7 @@
     "getStarted": "Get started!",
     "addFirstTime": "Welcome, add your first list!",
     "sortByName": "A-Z",
+    "sortByProgress": "Progress",
     "sortByRating": "Score",
     "sortByReleaseDate": "Date",
     "sortByCustom": "Custom",
@@ -173,5 +174,9 @@
   "notes": {
     "addNote": "Add note",
     "notes": "Notes"
+  },
+  "progresses": {
+    "addProgress": "Add progress",
+    "progresses": "Progress"
   }
 }

src/i18n/es.json

@@ -22,7 +22,13 @@
         "donateMessage": "Gamebrary es gratuito y de código abierto, considere ayudar a su desarrollo mediante",
         "donating": "donando",
         "reportBugs": "informar errores",
-    "submitFeedback": "enviando comentarios"
+        "submitFeedback": "enviando comentarios",
+        "home": "Consolas para el hogar",
+        "handheld": "Dispositivos de mano",
+        "computer": "Computador del hogar",
+        "releaseYear": "Año de lanzamiento",
+        "name": "Alfabéticamente",
+        "type": "Tipo"
     },
     "igdbCredit": {
         "poweredByIgdb": "Desarrollado por IGDB"
@@ -50,7 +56,7 @@
         "gamePlatforms": "También disponible para:",
         "developers": "Desarrollador",
         "publishers": "Editores",
-    "removeFromList": "Quitar de la lista",
+        "removeFromList": "retirar",
         "links": {
             "official": "Sitio oficial",
             "wikia": "Fandom",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "Editar nombre de lista",
         "type": "Tipo de lista",
+        "settings": "Configuraciones de lista",
         "placeholder": "Escriba el nombre de su lista aquí",
-    "suggestions": {
-      "owned": "De propiedad",
         "wishlist": "Lista de deseos",
-      "currentlyPlaying": "Reproduciendo",
-      "completed": "Terminado"
-    },
         "input": "Ingrese el suyo",
         "add": "Añadir lista",
         "duplicateWarning": "Ya tienes una lista con este nombre",
         "getStarted": "¡Empezar!",
         "addFirstTime": "Bienvenido, agrega tu primera lista!",
         "sortByName": "LA",
+        "sortByProgress": "Progreso",
         "sortByRating": "Puntuación",
         "sortByReleaseDate": "Fecha",
         "sortByCustom": "Personalizado",
-    "delete": "Borrar",
+        "delete": "Eliminar lista",
         "moveLeft": "Mover hacia la izquierda",
-    "moveRight": "Mover a la derecha",
+        "moveRight": "Moverse a la derecha",
         "emptyList": "Esta lista esta vacia",
         "addGame": "Agregar juego",
         "view": "Vista de la lista",
         "moveList": "Mover lista",
-    "sortList": "Lista Ordenada",
+        "sortList": "Lista de ordenación automática",
         "coversSizeTitle": "Cubre a través de",
         "views": {
             "single": "Defecto",
             "wide": "Compacto",
             "text": "Solo texto",
-      "masonry": "Masonry",
+            "masonry": "Albañilería",
             "grid": "Cuadrícula"
         }
     },
@@ -113,10 +116,10 @@
         "about": "Acerca de",
         "platforms": "Plataformas",
         "gameBoard": "Juego de mesa",
+        "public": "Público",
         "tags": "Etiquetas",
         "account": "Cuenta",
         "global": "Global",
-    "darkTheme": "Tema oscuro",
         "reloading": "Recargando ...",
         "releases": "Lanzamientos",
         "newsletter": "Recibir correos electrónicos de actualización (próximamente)",
@@ -142,6 +145,7 @@
             "title": "Subir fondo de pantalla",
             "transparency": "Permitir transparencia",
             "currentWallpaper": "Fondo de pantalla actual",
+            "wallpaper": "Papel pintado",
             "removeWallpaper": "Eliminar fondo de pantalla"
         },
         "deleteAccount": {
@@ -154,9 +158,10 @@
         "title": "Etiquetas de juego",
         "addTag": "Añadir etiqueta",
         "createTag": "Crear etiqueta",
-    "inputPlaceholder": "Nombre del día",
+        "inputPlaceholder": "Nombre de etiqueta",
-    "applyTag": "Aplicar etiqueta",
+        "editTags": "Editar etiquetas de juego",
-    "useTags": "Usa etiquetas para organizar mejor tus juegos"
+        "message": "Haga clic en la etiqueta para agregarla a <a>{gameName}</a> . Haga clic en <i class=\"fas fa-times close\"></i> para eliminar la etiqueta",
+        "settingsMessage": "Puede agregar o editar etiquetas existentes en la configuración."
     },
     "gameSearch": {
         "title": "Agregar juegos a",
@@ -167,6 +172,11 @@
         "addToIGDB": "Agréguelo a IGDB"
     },
     "notes": {
-    "addNote": "Añadir la nota"
+        "addNote": "Añadir la nota",
+        "notes": "Notas"
+    },
+    "progresses": {
+        "addProgress": "Agregar progreso",
+        "progresses": "Progreso"
     }
 }

src/i18n/eu.json

@@ -22,7 +22,13 @@
         "donateMessage": "Gamebrary iturri librea eta irekia da eta kontuan hartu bere garapenari laguntzen",
         "donating": "eman",
         "reportBugs": "akatsen berri ematea",
-    "submitFeedback": "feedbacka bidaltzea"
+        "submitFeedback": "feedbacka bidaltzea",
+        "home": "Etxeko kontsolak",
+        "handheld": "eskuko gailuek",
+        "computer": "Etxeko ordenagailua",
+        "releaseYear": "Urtea kaleratu du",
+        "name": "alfabetikoki",
+        "type": "Mota"
     },
     "igdbCredit": {
         "poweredByIgdb": "IGDB-k eginda"
@@ -50,7 +56,7 @@
         "gamePlatforms": "Eskuragarri ere:",
         "developers": "Developer",
         "publishers": "Argitaletxeak",
-    "removeFromList": "Kendu zerrendatik",
+        "removeFromList": "Kendu",
         "links": {
             "official": "Gune ofiziala",
             "wikia": "fandom",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "Editatu zerrendaren izena",
         "type": "Zerrenda mota",
+        "settings": "Zerrendako ezarpenak",
         "placeholder": "Idatzi hemen zure zerrenda izena",
-    "suggestions": {
-      "owned": "sozietateak",
         "wishlist": "Gustuko",
-      "currentlyPlaying": "Gaur egun jolasten",
-      "completed": "Osatua"
-    },
         "input": "Sartu zurea",
         "add": "Gehitu zerrenda",
-    "duplicateWarning": "Dagoeneko zerrenda bat duzu izen horrekin",
+        "duplicateWarning": "Izen horrekin zerrenda bat duzu jada",
         "getStarted": "Hasi!",
         "addFirstTime": "Ongi etorri, gehitu zure lehen zerrenda!",
         "sortByName": "THE",
+        "sortByProgress": "Eraikitzen",
         "sortByRating": "Puntuazioa",
         "sortByReleaseDate": "data",
         "sortByCustom": "pertsonalizatua",
-    "delete": "ezabatu",
+        "delete": "Zerrenda ezabatu",
         "moveLeft": "Mugitu ezkerrera",
         "moveRight": "Mugitu eskuinera",
         "emptyList": "Zerrenda hau hutsik dago",
         "addGame": "Gehitu jokoa",
         "view": "Zerrenda ikuspegia",
         "moveList": "Mugitu zerrenda",
-    "sortList": "Sailkapen zerrenda",
+        "sortList": "Auto ordenazioen zerrenda",
         "coversSizeTitle": "Estaldurak zehar",
         "views": {
             "single": "Default",
             "wide": "Compact",
             "text": "Testua soilik",
-      "masonry": "Masonry",
+            "masonry": "Masoneria",
             "grid": "Grid"
         }
     },
@@ -113,10 +116,10 @@
         "about": "About",
         "platforms": "plataformak",
         "gameBoard": "Joko taula",
+        "public": "Publiko",
         "tags": "Tags",
         "account": "Kontu-",
         "global": "Global",
-    "darkTheme": "Gai iluna",
         "reloading": "Berkargatzean ...",
         "releases": "oharrak",
         "newsletter": "Jaso eguneratze mezu elektronikoak (laster etorriko dira)",
@@ -142,6 +145,7 @@
             "title": "Kargatu horma-irudia",
             "transparency": "Gardentasuna eman",
             "currentWallpaper": "Uneko horma-irudia",
+            "wallpaper": "Wallpaper",
             "removeWallpaper": "Kendu papera"
         },
         "deleteAccount": {
@@ -154,9 +158,10 @@
         "title": "Jokoaren etiketak",
         "addTag": "Gehitu etiketa",
         "createTag": "Etiketa sortu",
-    "inputPlaceholder": "Egunaren izena",
+        "inputPlaceholder": "Etiketaren izena",
-    "applyTag": "Aplikatu etiketa",
+        "editTags": "Editatu jokoen etiketak",
-    "useTags": "Erabili etiketak zure jokoak hobeto antolatzeko"
+        "message": "Egin klik etiketan <a>{gameName}</a> (e) n gehitzeko. Egin klik <i class=\"fas fa-times close\"></i> etiketa kentzeko.",
+        "settingsMessage": "Dauden ezarpenetan etiketak gehitu edo editatu ditzakezu."
     },
     "gameSearch": {
         "title": "Gehitu jokoak",
@@ -167,6 +172,11 @@
         "addToIGDB": "Gehitu IGDB-ri"
     },
     "notes": {
-    "addNote": "Oharra gehitu"
+        "addNote": "Oharra gehitu",
+        "notes": "Oharrak"
+    },
+    "progresses": {
+        "addProgress": "Gehitu aurrerapenak",
+        "progresses": "Eraikitzen"
     }
 }

src/i18n/fr.json

@@ -1,7 +1,7 @@
 {
     "global": {
         "back": "Retour",
-    "save": "sauvegarder",
+        "save": "sauver",
         "cancel": "Annuler",
         "create": "Créer",
         "filter": "Filtre",
@@ -19,17 +19,23 @@
         "published": "Date de publication}"
     },
     "platforms": {
-    "donateMessage": "Gamebrary est gratuit et open source, envisagez d’aider son développement en",
+        "donateMessage": "Gamebrary est gratuit et open source, envisagez d'aider à son développement en",
         "donating": "faire un don",
-    "reportBugs": "signaler des bugs",
+        "reportBugs": "signaler des bogues",
-    "submitFeedback": "soumettre des commentaires"
+        "submitFeedback": "soumettre des commentaires",
+        "home": "Consoles de salon",
+        "handheld": "Ordinateurs de poche",
+        "computer": "Ordinateur de famille",
+        "releaseYear": "Année de sortie",
+        "name": "Alphabétiquement",
+        "type": "Type"
     },
     "igdbCredit": {
         "poweredByIgdb": "Propulsé par IGDB"
     },
     "gameBoard": {
         "settings": {
-      "wallpaper": "Papier peint personnalisé",
+            "wallpaper": "Fond d'écran personnalisé",
             "shareLink": "Liens partageables (expérimental)",
             "dangerZone": "Zone dangereuse"
         }
@@ -44,13 +50,13 @@
         "screenshots": "Captures d'écran",
         "perspective": "La perspective",
         "releaseDate": "Date de sortie",
-    "timeToBeat": "Temps à battre",
+        "timeToBeat": "Il est temps de battre",
         "gameModes": "Mode de jeu",
         "genres": "Genre",
         "gamePlatforms": "Aussi disponible pour:",
         "developers": "Développeur",
-    "publishers": "Les éditeurs",
+        "publishers": "Éditeurs",
-    "removeFromList": "Retirer de la liste",
+        "removeFromList": "Retirer",
         "links": {
             "official": "Site officiel",
             "wikia": "Fandom",
@@ -74,52 +80,49 @@
         }
     },
     "list": {
-    "edit": "Editer le nom de la liste",
+        "edit": "Modifier le nom de la liste",
         "type": "Type de liste",
-    "placeholder": "Tapez votre nom de liste ici",
+        "settings": "Liste des paramètres",
-    "suggestions": {
+        "placeholder": "Tapez le nom de votre liste ici",
-      "owned": "Possédé",
         "wishlist": "Liste de souhaits",
-      "currentlyPlaying": "En train de jouer",
+        "input": "Entrez le vôtre",
-      "completed": "Terminé"
-    },
-    "input": "Entrez votre propre",
         "add": "Ajouter la liste",
         "duplicateWarning": "Vous avez déjà une liste avec ce nom",
         "getStarted": "Commencer!",
         "addFirstTime": "Bienvenue, ajoutez votre première liste!",
         "sortByName": "LA",
+        "sortByProgress": "Le progrès",
         "sortByRating": "But",
         "sortByReleaseDate": "Rendez-vous amoureux",
         "sortByCustom": "Douane",
-    "delete": "Effacer",
+        "delete": "Supprimer la liste",
         "moveLeft": "Se déplacer à gauche",
         "moveRight": "Déplacer vers la droite",
         "emptyList": "Cette liste est vide",
         "addGame": "Ajouter un jeu",
-    "view": "Vue liste",
+        "view": "Affichage liste",
         "moveList": "Déplacer la liste",
-    "sortList": "Liste de tri",
+        "sortList": "Liste de tri automatique",
         "coversSizeTitle": "Couvre à travers",
         "views": {
             "single": "Défaut",
             "wide": "Compact",
             "text": "Texte seulement",
-      "masonry": "Masonry",
+            "masonry": "Maçonnerie",
             "grid": "la grille"
         }
     },
     "settings": {
-    "about": "À propos",
+        "about": "Sur",
         "platforms": "Plateformes",
         "gameBoard": "Plateau de jeu",
+        "public": "Publique",
         "tags": "Mots clés",
         "account": "Compte",
         "global": "Global",
-    "darkTheme": "Thème sombre",
         "reloading": "Rechargement ...",
         "releases": "Communiqués",
-    "newsletter": "Recevoir des emails de mise à jour (à venir)",
+        "newsletter": "Recevez des e-mails de mise à jour (à venir bientôt)",
         "branding": "Marque de la plateforme (couleurs, logo, etc ...)",
         "language": "La langue",
         "languages": {
@@ -142,31 +145,38 @@
             "title": "Télécharger un fond d'écran",
             "transparency": "Autoriser la transparence",
             "currentWallpaper": "Fond d'écran actuel",
+            "wallpaper": "Fond d'écran",
             "removeWallpaper": "Supprimer le papier peint"
         },
         "deleteAccount": {
             "button": "Supprimer le compte",
-      "message": "Les données de votre compte seront définitivement supprimées.",
+            "message": "Les données de votre compte seront supprimées pour toujours.",
             "title": "Êtes-vous sûr?"
         }
     },
     "tags": {
-    "title": "Balises de jeu",
+        "title": "Tags du jeu",
         "addTag": "Ajouter une étiquette",
-    "createTag": "Créer un tag",
+        "createTag": "Créer une balise",
-    "inputPlaceholder": "Nom du jour",
+        "inputPlaceholder": "Nom du tag",
-    "applyTag": "Appliquer le tag",
+        "editTags": "Modifier les balises de jeu",
-    "useTags": "Utilisez des tags pour mieux organiser vos jeux"
+        "message": "Cliquez sur le tag pour l'ajouter à <a>{gameName}</a> . Cliquer sur <i class=\"fas fa-times close\"></i> pour supprimer la balise.",
+        "settingsMessage": "Vous pouvez ajouter ou modifier des balises existantes dans les paramètres."
     },
     "gameSearch": {
         "title": "Ajouter des jeux à",
         "inputPlaceholder": "Cherche ici",
-    "alreadyInList": "des résultats de recherche déjà dans votre liste",
+        "alreadyInList": "à partir des résultats de recherche déjà dans votre liste",
         "noResultsFound": "Aucun résultat",
-    "missingGame": "Manquer un jeu? Aidez la communauté et",
+        "missingGame": "Vous manquez un match? Aidez la communauté et",
         "addToIGDB": "Ajoutez-le à IGDB"
     },
     "notes": {
-    "addNote": "Ajouter une note"
+        "addNote": "Ajouter une note",
+        "notes": "Remarques"
+    },
+    "progresses": {
+        "addProgress": "Ajouter des progrès",
+        "progresses": "Le progrès"
     }
 }

src/i18n/it.json

@@ -19,10 +19,16 @@
         "published": "Pubblicato {data}"
     },
     "platforms": {
-    "donateMessage": "Gamebrary è gratuito e open source, considera di aiutarne lo sviluppo",
+        "donateMessage": "Gamebrary è gratuito e open source, considera l'idea di aiutarne lo sviluppo",
         "donating": "la donazione",
         "reportBugs": "segnalazione di bug",
-    "submitFeedback": "invio feedback"
+        "submitFeedback": "invio feedback",
+        "home": "Console domestiche",
+        "handheld": "Palmari",
+        "computer": "Computer domestico",
+        "releaseYear": "Anno rilasciato",
+        "name": "In ordine alfabetico",
+        "type": "genere"
     },
     "igdbCredit": {
         "poweredByIgdb": "Alimentato da IGDB"
@@ -50,7 +56,7 @@
         "gamePlatforms": "Disponibile anche per:",
         "developers": "Sviluppatore",
         "publishers": "editori",
-    "removeFromList": "Rimuovere dalla lista",
+        "removeFromList": "Rimuovere",
         "links": {
             "official": "Sito ufficiale",
             "wikia": "Mondo dei fan",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "Modifica il nome dell'elenco",
         "type": "Tipo di elenco",
+        "settings": "Elenco impostazioni",
         "placeholder": "Digita qui il nome della tua lista",
-    "suggestions": {
-      "owned": "Di proprietà",
         "wishlist": "Lista dei desideri",
-      "currentlyPlaying": "Attualmente in riproduzione",
-      "completed": "Completato"
-    },
         "input": "Inserisci il tuo",
         "add": "Aggiungi elenco",
         "duplicateWarning": "Hai già un elenco con questo nome",
         "getStarted": "Iniziare!",
         "addFirstTime": "Benvenuto, aggiungi il tuo primo elenco!",
         "sortByName": "IL",
+        "sortByProgress": "Progresso",
         "sortByRating": "Punto",
         "sortByReleaseDate": "Data",
         "sortByCustom": "costume",
-    "delete": "Elimina",
+        "delete": "Elimina elenco",
         "moveLeft": "Muovere a sinistra",
         "moveRight": "Vai a destra",
         "emptyList": "Questo elenco è vuoto",
         "addGame": "Aggiungi gioco",
         "view": "Visualizzazione elenco",
         "moveList": "Sposta elenco",
-    "sortList": "Elenco di ordinamento",
+        "sortList": "Elenco di ordinamento automatico",
         "coversSizeTitle": "Copre attraverso",
         "views": {
             "single": "Predefinito",
             "wide": "Compatto",
             "text": "Solo testo",
-      "masonry": "Masonry",
+            "masonry": "Opere murarie",
             "grid": "Griglia"
         }
     },
@@ -113,17 +116,17 @@
         "about": "Di",
         "platforms": "piattaforme",
         "gameBoard": "Tavolo da gioco",
+        "public": "Pubblico",
         "tags": "tag",
         "account": "account",
         "global": "Globale",
-    "darkTheme": "Tema scuro",
         "reloading": "Ricaricamento ...",
         "releases": "Uscite",
         "newsletter": "Ricevi email di aggiornamento (in arrivo)",
         "branding": "Marchio della piattaforma (colori, logo, ecc ...)",
         "language": "linguaggio",
         "languages": {
-      "en": "Inglese",
+            "en": "inglese",
             "es": "spagnolo",
             "pl": "polacco",
             "de": "Tedesco",
@@ -142,6 +145,7 @@
             "title": "Carica sfondo",
             "transparency": "Consenti trasparenza",
             "currentWallpaper": "Sfondo corrente",
+            "wallpaper": "Sfondo",
             "removeWallpaper": "Rimuovi sfondo"
         },
         "deleteAccount": {
@@ -154,9 +158,10 @@
         "title": "Tag di gioco",
         "addTag": "Aggiungi Tag",
         "createTag": "Crea tag",
-    "inputPlaceholder": "Nome del giorno",
+        "inputPlaceholder": "Nome del tag",
-    "applyTag": "Applica tag",
+        "editTags": "Modifica i tag di gioco",
-    "useTags": "Usa i tag per organizzare meglio i tuoi giochi"
+        "message": "Fai clic sul tag per aggiungerlo a <a>{gameName}</a> . Clicca su <i class=\"fas fa-times close\"></i> per rimuovere il tag.",
+        "settingsMessage": "Puoi aggiungere o modificare tag esistenti nelle impostazioni."
     },
     "gameSearch": {
         "title": "Aggiungi giochi a",
@@ -167,6 +172,11 @@
         "addToIGDB": "Aggiungilo a IGDB"
     },
     "notes": {
-    "addNote": "Aggiungi nota"
+        "addNote": "Aggiungi nota",
+        "notes": "Gli appunti"
+    },
+    "progresses": {
+        "addProgress": "Aggiungi progressi",
+        "progresses": "Progresso"
     }
 }

src/i18n/ja.json

@@ -1,7 +1,7 @@
 {
     "global": {
         "back": "バック",
-    "save": "保存する",
+        "save": "セーブ",
         "cancel": "キャンセル",
         "create": "作成する",
         "filter": "フィルタ",
@@ -22,7 +22,13 @@
         "donateMessage": "Gamebraryは無料でオープンソースです。その開発を支援することを検討してください",
         "donating": "寄付",
         "reportBugs": "バグを報告する",
-    "submitFeedback": "フィードバックを送信する"
+        "submitFeedback": "フィードバックを送信する",
+        "home": "ホームコンソール",
+        "handheld": "ハンドヘルド",
+        "computer": "ホームコンピューター",
+        "releaseYear": "リリース年",
+        "name": "アルファベット順",
+        "type": "タイプ"
     },
     "igdbCredit": {
         "poweredByIgdb": "IGDBを搭載"
@@ -50,9 +56,9 @@
         "gamePlatforms": "以下にも利用可能：",
         "developers": "開発者",
         "publishers": "出版社",
-    "removeFromList": "リストから削除する",
+        "removeFromList": "削除する",
         "links": {
-      "official": "オフィシャルサイト",
+            "official": "公式サイト",
             "wikia": "ファンダム",
             "wikipedia": "ウィキペディア",
             "facebook": "フェイスブック",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "リスト名を編集",
         "type": "リストタイプ",
+        "settings": "リスト設定",
         "placeholder": "ここにリスト名を入力してください",
-    "suggestions": {
-      "owned": "所有",
         "wishlist": "ウィッシュリスト",
-      "currentlyPlaying": "現在プレイ中",
-      "completed": "完了しました"
-    },
         "input": "あなた自身を入力してください",
         "add": "リストを追加",
         "duplicateWarning": "この名前のリストは既にあります",
         "getStarted": "始めましょう！",
         "addFirstTime": "ようこそ、最初のリストを追加してください！",
         "sortByName": "THE",
+        "sortByProgress": "進捗",
         "sortByRating": "スコア",
         "sortByReleaseDate": "日付",
         "sortByCustom": "カスタム",
-    "delete": "削除する",
+        "delete": "リストを削除",
         "moveLeft": "左に移動",
         "moveRight": "右に動く",
         "emptyList": "このリストは空です",
         "addGame": "ゲームを追加",
         "view": "リストビュー",
         "moveList": "リストを移動する",
-    "sortList": "ソートリスト",
+        "sortList": "自動ソートリスト",
         "coversSizeTitle": "全体をカバー",
         "views": {
             "single": "デフォルト",
             "wide": "コンパクト",
             "text": "テキストのみ",
-      "masonry": "Masonry",
+            "masonry": "石積み",
             "grid": "グリッド"
         }
     },
@@ -113,10 +116,10 @@
         "about": "約",
         "platforms": "プラットフォーム",
         "gameBoard": "ゲームボード",
+        "public": "パブリック",
         "tags": "タグ",
         "account": "アカウント",
         "global": "グローバル",
-    "darkTheme": "暗いテーマ",
         "reloading": "再読み込みしています...",
         "releases": "リリース",
         "newsletter": "更新メールを受け取る（近日公開予定）",
@@ -129,7 +132,7 @@
             "de": "ドイツ人",
             "ar": "アラビア語",
             "fr": "フランス語",
-      "it": "イタリアの",
+            "it": "イタリア語",
             "eu": "バスク",
             "cs": "チェコ語",
             "ja": "日本人"
@@ -142,6 +145,7 @@
             "title": "壁紙をアップロード",
             "transparency": "透明化を許可する",
             "currentWallpaper": "現在の壁紙",
+            "wallpaper": "壁紙",
             "removeWallpaper": "壁紙を削除"
         },
         "deleteAccount": {
@@ -154,19 +158,25 @@
         "title": "ゲームタグ",
         "addTag": "タグ付けする",
         "createTag": "タグを作成",
-    "inputPlaceholder": "曜日名",
+        "inputPlaceholder": "タグ名",
-    "applyTag": "タグを適用",
+        "editTags": "ゲームタグを編集する",
-    "useTags": "タグを使用してゲームを整理します"
+        "message": "タグをクリックして<a>{gameName}</a>に追加します。クリック<i class=\"fas fa-times close\"></i>タグを削除します。",
+        "settingsMessage": "設定で既存のタグを追加または編集できます。"
     },
     "gameSearch": {
         "title": "にゲームを追加",
         "inputPlaceholder": "検索",
-    "alreadyInList": "すでにリストにある検索結果から",
+        "alreadyInList": "既にリストにある検索結果から",
         "noResultsFound": "結果がありません",
         "missingGame": "ゲームが見つかりませんか？コミュニティを助け、",
         "addToIGDB": "IGDBに追加します"
     },
     "notes": {
-    "addNote": "メモを追加"
+        "addNote": "メモを追加",
+        "notes": "ノート"
+    },
+    "progresses": {
+        "addProgress": "進行状況を追加",
+        "progresses": "進捗"
     }
 }

src/i18n/pl.json

@@ -2,14 +2,14 @@
     "global": {
         "back": "Z powrotem",
         "save": "Zapisać",
-    "cancel": "Anuluj",
+        "cancel": "anulować",
         "create": "Stwórz",
         "filter": "Filtr",
         "by": "przez",
         "no": "Nie",
         "yes": "tak",
         "or": "lub",
-    "returnHome": "Wrócić do domu",
+        "returnHome": "Powrót do domu",
         "pageNotFound": "Strona nie znaleziona"
     },
     "errors": {
@@ -19,10 +19,16 @@
         "published": "Data publikacji}"
     },
     "platforms": {
-    "donateMessage": "Gamebrary jest darmowym i otwartym oprogramowaniem, rozważ pomoc w jego rozwoju",
+        "donateMessage": "Gamebrary jest darmowy i open source, rozważ pomoc w jego rozwoju",
         "donating": "darowizny",
         "reportBugs": "zgłaszanie błędów",
-    "submitFeedback": "przesyłanie opinii"
+        "submitFeedback": "przesyłanie opinii",
+        "home": "Konsole domowe",
+        "handheld": "Podręczne urządzenia",
+        "computer": "Komputer domowy",
+        "releaseYear": "Rok wydania",
+        "name": "Alfabetycznie",
+        "type": "Rodzaj"
     },
     "igdbCredit": {
         "poweredByIgdb": "Obsługiwane przez IGDB"
@@ -50,7 +56,7 @@
         "gamePlatforms": "Dostępne również dla:",
         "developers": "Deweloper",
         "publishers": "Wydawcy",
-    "removeFromList": "Usunąć z listy",
+        "removeFromList": "Usunąć",
         "links": {
             "official": "Oficjalna strona",
             "wikia": "Fandom",
@@ -76,36 +82,33 @@
     "list": {
         "edit": "Edytuj nazwę listy",
         "type": "Rodzaj listy",
+        "settings": "Ustawienia listy",
         "placeholder": "Wpisz tutaj swoją nazwę listy",
-    "suggestions": {
-      "owned": "Posiadane",
         "wishlist": "Lista życzeń",
-      "currentlyPlaying": "Obecnie gra",
-      "completed": "Zakończony"
-    },
         "input": "Wpisz własne",
         "add": "Dodaj listę",
         "duplicateWarning": "Masz już listę o tej nazwie",
         "getStarted": "Zaczynać!",
         "addFirstTime": "Witamy, dodaj swoją pierwszą listę!",
         "sortByName": "",
+        "sortByProgress": "Postęp",
         "sortByRating": "Wynik",
         "sortByReleaseDate": "Data",
         "sortByCustom": "Zwyczaj",
-    "delete": "Kasować",
+        "delete": "Usuń listę",
         "moveLeft": "Przesuń w lewo",
         "moveRight": "Ruch w prawo",
         "emptyList": "Ta lista jest pusta",
         "addGame": "Dodaj grę",
         "view": "Widok listy",
         "moveList": "Przenieś listę",
-    "sortList": "Sortuj listę",
+        "sortList": "Lista automatycznego sortowania",
         "coversSizeTitle": "Obejmuje w poprzek",
         "views": {
             "single": "Domyślna",
             "wide": "Kompaktowy",
             "text": "Tylko tekst",
-      "masonry": "Masonry",
+            "masonry": "Kamieniarstwo",
             "grid": "Krata"
         }
     },
@@ -113,12 +116,12 @@
         "about": "O",
         "platforms": "Platformy",
         "gameBoard": "Gra planszowa",
+        "public": "Publiczny",
         "tags": "Tagi",
         "account": "Konto",
         "global": "Światowy",
-    "darkTheme": "ciemny schemat",
         "reloading": "Ponowne ładowanie ...",
-    "releases": "Wydawnictwa",
+        "releases": "Prasowe",
         "newsletter": "Otrzymuj e-maile z aktualizacją (wkrótce)",
         "branding": "Znakowanie platformy (kolory, logo itp.)",
         "language": "Język",
@@ -142,6 +145,7 @@
             "title": "Prześlij tapetę",
             "transparency": "Zezwól na przezroczystość",
             "currentWallpaper": "Aktualna tapeta",
+            "wallpaper": "Tapeta",
             "removeWallpaper": "Usuń tapetę"
         },
         "deleteAccount": {
@@ -154,9 +158,10 @@
         "title": "Tagi gier",
         "addTag": "Dodaj tag",
         "createTag": "Utwórz tag",
-    "inputPlaceholder": "Nazwa dnia",
+        "inputPlaceholder": "Nazwa znacznika",
-    "applyTag": "Zastosuj tag",
+        "editTags": "Edytuj tagi gier",
-    "useTags": "Użyj tagów, aby lepiej zorganizować swoje gry"
+        "message": "Kliknij znacznik, aby dodać go do <a>{gameName}</a> . Kliknij <i class=\"fas fa-times close\"></i> aby usunąć tag.",
+        "settingsMessage": "Możesz dodawać lub edytować istniejące tagi w ustawieniach."
     },
     "gameSearch": {
         "title": "Dodaj gry do",
@@ -167,6 +172,11 @@
         "addToIGDB": "Dodaj go do IGDB"
     },
     "notes": {
-    "addNote": "Dodaj notatkę"
+        "addNote": "Dodaj notatkę",
+        "notes": "Notatki"
+    },
+    "progresses": {
+        "addProgress": "Dodaj postęp",
+        "progresses": "Postęp"
     }
 }

src/pages/Game.vue

@@ -23,6 +23,7 @@
           {{ platform.name }}
 
           <game-rating v-if="games[id].rating" :rating="games[id].rating" />
+          <game-progress />
           <game-tags />
 
           <div class="actions">
@@ -80,6 +81,7 @@
 import { mapState, mapGetters } from 'vuex';
 import GameScreenshots from '@/components/GameDetail/GameScreenshots';
 import GameNotes from '@/components/GameDetail/GameNotes';
+import GameProgress from '@/components/GameDetail/GameProgress';
 import GameTags from '@/components/GameDetail/GameTags';
 import GameRating from '@/components/GameDetail/GameRating';
 import GameLinks from '@/components/GameDetail/GameLinks';
@@ -99,6 +101,7 @@ export default {
     Placeholder,
     GameScreenshots,
     GameNotes,
+    GameProgress,
     GameTags,
     GameVideos,
     GameDetails,

src/store/getters.js

@@ -97,6 +97,15 @@ export default {
       : '';
   },
 
+  gameProgress: ({ game, progresses }) => {
+    const gameSelected = game && game.id;
+    const hasProgress = gameSelected && progresses[game.id];
+
+    return hasProgress
+      ? progresses[game.id]
+      : '';
+  },
+
   // eslint-disable-next-line
     activeList: ({ gameLists, platform, activeListIndex }) => gameLists[platform.code][activeListIndex],
 

src/store/mutations.js

@@ -57,6 +57,10 @@ export default {
     state.notes = notes;
   },
 
+  SET_PROGRESSES(state, progresses) {
+    state.progresses = progresses;
+  },
+
   ADD_GAME_TAG(state, { tagName, gameId }) {
     state.tags[tagName].games.push(gameId);
   },

src/store/state.js

@@ -3,6 +3,7 @@ export default {
   releases: null,
   tags: {},
   notes: {},
+  progresses: {},
   dragging: false,
   activeListIndex: null,
   gameLists: {},

src/styles/_progress-pie.scss

@@ -0,0 +1,126 @@
+/* CSS Progress Pie by Olivia Ng | MIT License | github.com/oliviale/css-progress-pie*/
+
+.progress-pie {
+    width: 60px; 
+    height: 60px;
+    border-radius: 50%;
+    background: var(--list-background);
+    background-image: linear-gradient(to right, transparent 50%, var(--accent-color) 0);
+    position: relative;
+    display: inline-block;
+}
+
+.progress-pie::before {
+    content: '';
+    display: block;
+    margin-left: 50%;
+    height: 100%;
+    border-radius: 0 100% 100% 0 / 50%;
+    background-color: inherit;
+    transform-origin: left;
+}
+
+.progress-pie::after {
+    content: attr(data-value);
+    position: absolute;
+    width: 70%;
+    height: 70%;
+    margin: auto;
+    border-radius: 50%;
+    background-color: var(--game-card-background);
+    left: 0;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    text-align: center;
+    font: 100 20px/41px Tahoma;
+}
+
+@for $i from 0 through 50 {
+  .progress-pie[data-value="#{$i}"]:before {
+     transform: rotate(#{$i/100}turn);
+  }
+}
+
+@for $i from 51 through 100 {
+  .progress-pie[data-value="#{$i}"]:before {
+    background-color: var(--accent-color);
+    transform: rotate(#{$i/100 - .5}turn);
+  }
+}
+
+
+/* CSS Progress Pie by Olivia Ng | MIT License | github.com/oliviale/css-progress-pie*/
+
+.progress-pie-color {
+    width: 60px; 
+    height: 60px;
+    border-radius: 50%;
+    background: #eee;
+    position: relative;
+    display: inline-block;
+}
+
+.progress-pie-color::before {
+    content: '';
+    display: block;
+    margin-left: 50%;
+    height: 100%;
+    border-radius: 0 100% 100% 0 / 50%;
+    background-color: inherit;
+    transform-origin: left;
+}
+
+.progress-pie-color::after {
+    content: attr(data-value);
+    position: absolute;
+    width: 70%;
+    height: 70%;
+    margin: auto;
+    border-radius: 50%;
+    background-color: #fff;
+    left: 0;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    text-align: center;
+    font: 900 20px/41px Lato;
+}
+
+@for $i from 0 through 40 {
+    .progress-pie-color[data-value="#{$i}"] {
+        background-image: linear-gradient(to right, transparent 50%, #cc0000 0);
+        &:before {
+            transform: rotate(#{$i/100}turn);
+        }
+    }
+}
+
+@for $i from 41 through 50 {
+    .progress-pie-color[data-value="#{$i}"] {
+        background-image: linear-gradient(to right, transparent 50%, #ffcf3a 0);
+        &:before {
+            transform: rotate(#{$i/100}turn);
+        }
+    }
+}
+
+@for $i from 51 through 70 {
+    .progress-pie-color[data-value="#{$i}"] {
+        background-image: linear-gradient(to right, transparent 50%, #ffcf3a 0);
+        &:before {
+            background-color: #ffcf3a;
+            transform: rotate(#{$i/100 - .5}turn);
+        }
+    }
+}
+
+@for $i from 71 through 100 {
+    .progress-pie-color[data-value="#{$i}"] {
+        background-image: linear-gradient(to right, transparent 50%, #09944a 0);
+        &:before {
+            background-color: #09944a;
+            transform: rotate(#{$i/100 - .5}turn);
+        }
+    }
+}

src/styles/styles.scss

@@ -5,4 +5,5 @@
 @import "_buttons";
 @import "_inputs";
 @import "_markdown";
+@import "_progress-pie";
 @import "_settings";