{"version":3,"sources":["webpack:///./src/views/avatars/List.vue?b331","webpack:///./src/views/avatars/List.vue","webpack:///src/views/avatars/List.vue","webpack:///./src/views/avatars/List.vue?9476","webpack:///./src/views/avatars/List.vue?4734"],"names":["staticClass","attrs","_c","avatar","on","avatarCustomBreakpoints","staticStyle","_vm","data","windowWidth","activeAvatar","allAvatars","showConsentDialog","window","path","query","step","methods","closeWizard","getAvatars","show","error","selectAvatar","destroyAvatar","color","message","buttonColor","computed","component","staticRenderFns"],"mappings":"yGAAA,W,2GCAkKA,a,IAAoCC,EAAM,K,EAAC,EAAM,MAAK,G,OAAC,EAAK,QAAC,wBAAG,CAACC,EAAG,kBAAiB,sBAACD,YAAM,wB,MAAC,CAA0B,UAA4B,OAAoBA,GAAK,iBAAC,C,MAAC,CAAY,OAAK,eAAC,+BAAmU,GAAOC,EAAG,Q,MAAaC,CAAUF,KAAM,K,GAAC,IAAoC,GAAEC,KAAG,QAAgB,GAAC,4Q,OAAM,EAAC,Q,IAAC,EAASC,G,MAAO,CAA6B,OAAU,0BAAoBC,CAAE,EAAC,kB,MAAC,CAA0B,OAAS,EAAkB,2BAAI,UAAG,oBAAeH,GAAK,CAAE,OAAWI,eAAuB,4BAAcL,MAAwBM,SAAW,C,MAAE,CAAsB,KAAO,EAAC,0BAASF,CAAE,EAAC,O,YAASG,YAAsB,aAAIL,SAAS,WAACI,MAAW,S,GAAkB,CAAiB,QAAY,qB,CAA+B,SAAwD,YAAC,CAACL,MAAM,QAAC,OAAM,QAA0B,aAAU,QAAmB,gBAAK,MAAiB,aAAS,6CAAmB,OAAIC,IAAG,0BAASI,UAAY,mBAAC,oBAAe,OAAO,MAAO,eAAQ,SAAQ,C,YAAoB,CAAa,OAAQ,MAAC,a,MAA2B,CAAW,gBAAIJ,UAAW,aAAEI,OAAa,UAAQ,GAAO,YAAIC,OAAO,KAA8D,CAACA,EAAG,OAAO,CAAkFP,YAAY,CAAqBC,MAAM,U,CAAc,KAAO,eAAU,oB,YAAW,cAAoB,qFAACG,YAAG,qB,MAAC,CAAsB,WAAIG,MAAOA,UAAiGN,UAAM,qBAA6B,GAAC,CAAG,MAAC,eAA+B,gGAAG,MAAI,CAAmBA,KAAM,qBAAuD,GAAC,CAAG,MAAC,wBAAwB,qBAAG,MAAI,CAC/nE,sDAGD,I,iCC8Ee,G,UAAA,CACf,gBACA,mBAEAO,OACA,OACAC,8BACAC,oBACAC,cACAC,uBAGA,sBACAC,sCACA,qCAIA,wBACA,sDACA,mBAAAC,gBAAAC,OAAAC,iCAGA,yEACA,sDAKA,0CACA,0FAEA,uDACA,uDACA,6BAIAC,SACAC,cAEA,kBACA,sDAGA,0CACA,gDAIA,mBAAAJ,kBAFA,wBAKAK,aACA,yCAAAC,UACA,2CACA,KACA,wDACA,wDAEA,yCAAAA,WAEAC,IACA,yCAAAD,UACA,aACAC,wDAIAC,gBACA,yCAAAF,UACA,8CACA,KACA,wDACA,wDACA,yCAAAA,WAEAC,IACA,yCAAAD,UACA,aACAC,wDAIAE,iBACA,uEAIA,yCAAAH,UACA,+CACA,KACA,wDACA,yCAAAA,UACA,SACAI,cACAC,yBACAC,qBAEA,6CAEAL,IACA,yCAAAD,UACA,aACAC,yDAIA,4BAEA,qDACA,iCAEA,4DACA,sDACA,mBAAAP,gBAAAC,OAAAC,uBAGA,4BAEA,0BACA,+DACA,sDACA,0BAIAW,UACAtB,0BACA,6BACA,GACA,sBACA,EAEA,MCxNyZ,I,wBCQrZuB,EAAY,eACd,EACA,EACAC,GACA,EACA,KACA,WACA,MAIa,aAAAD,E","file":"js/Avatars.8a0cba8a.js","sourcesContent":["export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../../../node_modules/@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./List.vue?vue&type=style&index=0&id=356e8549&prod&scoped=true&lang=css&\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('v-container',{staticClass:\"mt-md-12\"},[(_vm.allAvatars.length > 0)?_c('v-row',[_c('v-col',{staticClass:\"d-flex justify-center\",attrs:{\"cols\":\"12\",\"sm\":6}},[_c('c-large-avatar',{attrs:{\"avatar\":_vm.activeAvatar,\"avatarStyle\":\"previewIconT\"}})],1),_c('v-col',{attrs:{\"cols\":\"12\",\"sm\":6}},[_c('h2',[_vm._v(_vm._s(_vm.$t('avatars.list.myAvatars')))]),_c('p',[_vm._v(\" \"+_vm._s(_vm.$t('avatars.list.createAVarietyOfAvatarsDressedForEveryOccasion'))),_c('br'),_vm._v(\" \"+_vm._s(_vm.$t('avatars.list.selectWhichAvatarYouWantToUseOrCreateANewOneBelow'))+\" \")]),_c('v-row',[_vm._l((_vm.allAvatars),function(avatar){return _c('v-col',{key:avatar.id,attrs:{\"cols\":_vm.avatarCustomBreakpoints}},[_c('c-small-avatar',{attrs:{\"avatar\":avatar,\"avatarStyle\":\"previewIconT\",\"data-cy\":\"avatar-thumbnail\"},on:{\"select\":_vm.selectAvatar,\"destroy\":_vm.destroyAvatar}})],1)}),_c('v-col',{attrs:{\"cols\":_vm.avatarCustomBreakpoints}},[_c('div',{staticClass:\"px-2 py-3\",staticStyle:{\"position\":\"relative\",\"width\":\"130px\"},on:{\"click\":_vm.checkAvatarConsent}},[_c('img',{staticStyle:{\"width\":\"115px\",\"height\":\"115px\",\"object-fit\":\"cover\",\"border-radius\":\"50%\",\"box-shadow\":\"0 0.5rem 1rem rgb(0 0 0 / 15%) !important\"},attrs:{\"src\":'/images/avatar-icon.jpg',\"data-cy\":\"avatar-thumbnail\",\"id\":'add-new-avatar',\"height\":\"115\",\"width\":\"115\"}}),_c('v-btn',{staticStyle:{\"bottom\":\"5px\",\"left\":\"51px\"},attrs:{\"color\":\"#807ef0\",\"data-cy\":\"add-avatar\",\"fab\":\"\",\"x-small\":\"\",\"absolute\":\"\",\"bottom\":\"\"}},[_c('v-icon',{staticStyle:{\"color\":\"white\"}},[_vm._v(\"mdi-plus\")])],1)],1)])],2),_c('p',{staticClass:\"pt-3 small\"},[_vm._v(_vm._s(_vm.$t('avatars.list.itCanTakeUpTo_5MinutesToCreateAnAvatar')))]),_c('v-btn',{staticClass:\"update-button-text\",attrs:{\"rounded\":\"\",\"color\":\"primary\",\"data-cy\":\"check-for-updates\"},on:{\"click\":_vm.getAvatars}},[_vm._v(_vm._s(_vm.$t('avatars.list.checkForUpdates')))])],1)],1):_vm._e(),_c('c-avatar-consent-dialog',{attrs:{\"show\":_vm.showConsentDialog},on:{\"close\":_vm.closeConsentDialog}}),_c('c-avatar-wizard',{attrs:{\"show\":this.$store.getters['avatars/showCreateWizard']},on:{\"close\":_vm.closeWizard}})],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <v-container class=\"mt-md-12\">\n    <v-row v-if=\"allAvatars.length > 0\">\n      <v-col cols=\"12\" :sm=\"6\" class=\"d-flex justify-center\">\n        <c-large-avatar :avatar=\"activeAvatar\" avatarStyle=\"previewIconT\" />\n      </v-col>\n\n      <v-col cols=\"12\" :sm=\"6\">\n        <h2>{{ $t('avatars.list.myAvatars') }}</h2>\n        <p>\n          {{ $t('avatars.list.createAVarietyOfAvatarsDressedForEveryOccasion') }}<br />\n          {{ $t('avatars.list.selectWhichAvatarYouWantToUseOrCreateANewOneBelow') }}\n        </p>\n\n        <v-row>\n          <v-col v-for=\"avatar in allAvatars\" :key=\"avatar.id\" :cols=\"avatarCustomBreakpoints\">\n            <c-small-avatar\n              :avatar=\"avatar\"\n              avatarStyle=\"previewIconT\"\n              v-on:select=\"selectAvatar\"\n              v-on:destroy=\"destroyAvatar\"\n              data-cy=\"avatar-thumbnail\"\n            />\n          </v-col>\n\n          <v-col :cols=\"avatarCustomBreakpoints\">\n            <div\n              class=\"px-2 py-3\"\n              @click=\"checkAvatarConsent\"\n              style=\"position: relative; width: 130px\"\n            >\n              <img\n                :src=\"'/images/avatar-icon.jpg'\"\n                data-cy=\"avatar-thumbnail\"\n                :id=\"'add-new-avatar'\"\n                height=\"115\"\n                width=\"115\"\n                style=\"\n                  width: 115px;\n                  height: 115px;\n                  object-fit: cover;\n                  border-radius: 50%;\n                  box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important;\n                \"\n              />\n              <v-btn\n                color=\"#807ef0\"\n                data-cy=\"add-avatar\"\n                fab\n                x-small\n                absolute\n                bottom\n                style=\"bottom: 5px; left: 51px\"\n              >\n                <v-icon style=\"color: white\">mdi-plus</v-icon>\n              </v-btn>\n            </div>\n          </v-col>\n        </v-row>\n\n        <p class=\"pt-3 small\">{{ $t('avatars.list.itCanTakeUpTo_5MinutesToCreateAnAvatar') }}</p>\n\n        <v-btn\n          rounded\n          color=\"primary\"\n          class=\"update-button-text\"\n          @click=\"getAvatars\"\n          data-cy=\"check-for-updates\"\n          >{{ $t('avatars.list.checkForUpdates') }}</v-btn\n        >\n      </v-col>\n    </v-row>\n\n    <c-avatar-consent-dialog :show=\"showConsentDialog\" v-on:close=\"closeConsentDialog\" />\n    <c-avatar-wizard\n      :show=\"this.$store.getters['avatars/showCreateWizard']\"\n      v-on:close=\"closeWizard\"\n    />\n  </v-container>\n</template>\n\n<script>\nexport default {\n  async created() {\n    this.getAvatars()\n  },\n  data() {\n    return {\n      windowWidth: window.innerWidth,\n      activeAvatar: undefined,\n      allAvatars: [],\n      showConsentDialog: false,\n    }\n  },\n  async mounted() {\n    window.addEventListener('resize', () => {\n      this.windowWidth = window.innerWidth\n    })\n\n    // If there is a step in the url, switch the modal on and show the step\n    if (this.$route.query.step) {\n      this.$store.dispatch('avatars/toggleCreateWizard', true)\n      this.$router.push({ path: '/avatars', query: { step: this.$route.query.step } })\n\n      // If there is no step in the url and the store has the modal switched on, switch it off\n    } else if (!this.$route.query.step && this.$store.getters['avatars/showCreateWizard']) {\n      this.$store.dispatch('avatars/toggleCreateWizard', false)\n    }\n\n    // If the user has no avatars, ask them to create their first one by launching the modal\n    if (\n      !this.$store.getters['avatars/hasAvatar'] &&\n      this.$store.getters['avatars/files']?.length === 0\n    ) {\n      await this.$store.dispatch('avatars/toggleCreateWizard', true)\n      if (this.$store.getters['auth/userHasAvatarConsent'] === false) {\n        this.showConsentDialog = true\n      }\n    }\n  },\n  methods: {\n    closeWizard() {\n      // Close the avatar wizard modal and show the avatar list\n      this.getAvatars()\n      this.$store.dispatch('avatars/toggleCreateWizard', false)\n\n      if (\n        !this.$store.getters['avatars/hasAvatar'] &&\n        this.$store.getters['avatars/files'].length === 0\n      ) {\n        this.$router.push('/')\n      } else {\n        this.$router.push({ path: '/avatars' })\n      }\n    },\n    getAvatars() {\n      this.$store.dispatch('ui/toggleLoading', { show: true })\n      this.$store.dispatch('avatars/fetch').then(\n        () => {\n          this.activeAvatar = this.$store.getters['avatars/active']\n          this.allAvatars = [...this.$store.getters['avatars/all']]\n\n          this.$store.dispatch('ui/toggleLoading', { show: false })\n        },\n        error => {\n          this.$store.dispatch('ui/toggleLoading', { show: false })\n          this.message =\n            (error.response && error.response.data) || error.message || error.toString()\n        }\n      )\n    },\n    selectAvatar(avatar) {\n      this.$store.dispatch('ui/toggleLoading', { show: true })\n      this.$store.dispatch('avatars/select', avatar).then(\n        () => {\n          this.activeAvatar = this.$store.getters['avatars/active']\n          this.allAvatars = [...this.$store.getters['avatars/all']]\n          this.$store.dispatch('ui/toggleLoading', { show: false })\n        },\n        error => {\n          this.$store.dispatch('ui/toggleLoading', { show: false })\n          this.message =\n            (error.response && error.response.data) || error.message || error.toString()\n        }\n      )\n    },\n    destroyAvatar(avatar) {\n      if (!confirm(this.$t('avatars.list.areYouSureYouWantToDeleteThisAvatar'))) {\n        return\n      }\n\n      this.$store.dispatch('ui/toggleLoading', { show: true })\n      this.$store.dispatch('avatars/destroy', avatar).then(\n        () => {\n          this.allAvatars = [...this.$store.getters['avatars/all']]\n          this.$store.dispatch('ui/toggleLoading', { show: false })\n          const params = {\n            color: 'green',\n            message: 'Avatar removed',\n            buttonColor: 'white',\n          }\n          this.$store.dispatch('ui/launchSnackbar', params)\n        },\n        error => {\n          this.$store.dispatch('ui/toggleLoading', { show: false })\n          this.message =\n            (error.response && error.response.data) || error.message || error.toString()\n        }\n      )\n    },\n    async checkAvatarConsent() {\n      // if user hasn't given avatar consent, display modal asking them to give consent\n      if (this.$store.getters['auth/userHasAvatarConsent'] === false) {\n        this.showConsentDialog = true\n      } else {\n        await this.$store.dispatch('avatars/toggleCreateWizard', false)\n        await this.$store.dispatch('avatars/toggleCreateWizard', true)\n        this.$router.push({ path: '/avatars', query: { step: 'onboarding' } })\n      }\n    },\n    async closeConsentDialog(response) {\n      // 'confirm' or 'cancel'\n      this.showConsentDialog = false\n      if (!this.$store.getters['avatars/hasAvatar'] && response === 'cancel') {\n        await this.$store.dispatch('avatars/toggleCreateWizard', false)\n        this.$router.push('/')\n      }\n    },\n  },\n  computed: {\n    avatarCustomBreakpoints() {\n      if (this.windowWidth <= 300) {\n        return 12\n      } else if (this.windowWidth <= 750) {\n        return 6\n      } else {\n        return 4\n      }\n    },\n  },\n}\n</script>\n<style scoped>\n.v-btn {\n  font-size: 12px;\n  text-transform: initial !important;\n  font-weight: 400;\n  font-size: 1rem;\n  line-height: 1.5;\n  color: white;\n}\n</style>\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./List.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./List.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./List.vue?vue&type=template&id=356e8549&scoped=true&\"\nimport script from \"./List.vue?vue&type=script&lang=js&\"\nexport * from \"./List.vue?vue&type=script&lang=js&\"\nimport style0 from \"./List.vue?vue&type=style&index=0&id=356e8549&prod&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"356e8549\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}