{"version":3,"sources":["webpack:///./src/components/roulette/roulette.vue","webpack:///src/components/roulette/roulette.vue","webpack:///./src/components/roulette/roulette.vue?aebf","webpack:///./src/components/roulette/roulette.vue?1762","webpack:///./src/components/roulette/roulette.vue?4ba7"],"names":["render","_vm","this","_c","_self","staticClass","ready","_e","attrs","_v","collections","length","post","class","concat","size","image","src","small","medium","large","alt","on","refresh","caption","background","url","_s","heading","description","credit","staticRenderFns","name","components","ahcIcon","props","endpoint","type","String","required","data","mounted","fetchPosts","methods","_this","vm","axios","get","then","response","items","Math","floor","random","isFetching","catch","error","console","log","$nextTick","component"],"mappings":"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","file":"js/roulette-lazy.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"roulette__figure-wrap\"},[(!_vm.ready)?_c('div',{staticClass:\"spinner roulette__loading\",attrs:{\"role\":\"status\",\"aria-label\":\"Loading\"}},[_c('span',{staticClass:\"sr-only\"},[_vm._v(\"Loading...\")])]):_vm._e(),(_vm.ready && _vm.collections.length === 0)?_c('div',{staticClass:\"roulette__no-results\"},[_c('h2',[_vm._v(\"Oops, no collections to display.\")])]):_vm._e(),_c('transition',{attrs:{\"name\":\"fade\"}},[(_vm.ready && _vm.post)?_c('figure',{staticClass:\"roulette__figure\",class:`roulette--${_vm.post.size}`},[_c('div',{staticClass:\"roulette__media\"},[_c('picture',{staticClass:\"roulette__picture\"},[_c('source',{attrs:{\"srcset\":_vm.post.image.src.small,\"media\":\"(max-width: 480px)\"}}),_c('source',{attrs:{\"srcset\":_vm.post.image.src.medium,\"media\":\"(max-width: 768px)\"}}),_c('b-img-lazy',{staticClass:\"roulette__image\",attrs:{\"fluid\":\"\",\"blank-color\":\"#dbe4e7\",\"src\":_vm.post.image.src.large,\"alt\":_vm.post.image.alt}})],1),(_vm.collections.length > 1)?_c('button',{staticClass:\"roulette__button\",attrs:{\"title\":\"Refresh\",\"aria-label\":\"Click to load a new item\"},on:{\"click\":_vm.refresh}},[_c('ahc-icon',{attrs:{\"icon-name\":\"shuffle-outline-mobile\",\"icon-name-hover\":\"shuffle-hover-mobile\",\"colorHover\":\"#fff\",\"focus-parent\":true,\"width\":\"40\",\"height\":\"40\"}},[_c('span',{staticClass:\"sr-only\"},[_vm._v(\"Refresh\")])]),_c('ahc-icon',{attrs:{\"icon-name\":\"shuffle-outline\",\"icon-name-hover\":\"shuffle-hover\",\"colorHover\":\"#fff\",\"focus-parent\":true,\"width\":\"96\",\"height\":\"96\"}},[_c('span',{staticClass:\"sr-only\"},[_vm._v(\"Refresh\")])])],1):_vm._e()]),_c('figcaption',{staticClass:\"roulette__caption\",class:`roulette--${_vm.post.caption.background}`},[_c('h3',{staticClass:\"roulette__heading\"},[(_vm.post.caption.url)?_c('a',{staticClass:\"roulette__heading-link\",attrs:{\"href\":_vm.post.caption.url}},[_vm._v(\" \"+_vm._s(_vm.post.caption.heading)+\" \")]):_c('span',[_vm._v(_vm._s(_vm.post.caption.heading))])]),_c('p',{staticClass:\"roulette__description\"},[_vm._v(_vm._s(_vm.post.caption.description))]),(_vm.post.caption.credit)?_c('p',{staticClass:\"roulette__credit\"},[_vm._v(\" \"+_vm._s(_vm.post.caption.credit)+\" \")]):_vm._e()])]):_vm._e()])],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"roulette__figure-wrap\">\n    <div\n      v-if=\"!ready\"\n      class=\"spinner roulette__loading\"\n      role=\"status\"\n      aria-label=\"Loading\"\n    >\n      <span class=\"sr-only\">Loading...</span>\n    </div>\n\n    <div class=\"roulette__no-results\" v-if=\"ready && collections.length === 0\">\n      <h2>Oops, no collections to display.</h2>\n    </div>\n\n    <transition name=\"fade\">\n      <figure\n        v-if=\"ready && post\"\n        class=\"roulette__figure\"\n        :class=\"`roulette--${post.size}`\"\n      >\n        <div class=\"roulette__media\">\n          <picture class=\"roulette__picture\">\n            <source :srcset=\"post.image.src.small\" media=\"(max-width: 480px)\" />\n            <source\n              :srcset=\"post.image.src.medium\"\n              media=\"(max-width: 768px)\"\n            />\n            <b-img-lazy\n              fluid\n              blank-color=\"#dbe4e7\"\n              :src=\"post.image.src.large\"\n              class=\"roulette__image\"\n              :alt=\"post.image.alt\"\n            />\n          </picture>\n\n          <button\n            v-if=\"collections.length > 1\"\n            class=\"roulette__button\"\n            title=\"Refresh\"\n            aria-label=\"Click to load a new item\"\n            @click=\"refresh\"\n          >\n            <ahc-icon\n              icon-name=\"shuffle-outline-mobile\"\n              icon-name-hover=\"shuffle-hover-mobile\"\n              colorHover=\"#fff\"\n              :focus-parent=\"true\"\n              width=\"40\"\n              height=\"40\"\n            >\n              <span class=\"sr-only\">Refresh</span>\n            </ahc-icon>\n            <ahc-icon\n              icon-name=\"shuffle-outline\"\n              icon-name-hover=\"shuffle-hover\"\n              colorHover=\"#fff\"\n              :focus-parent=\"true\"\n              width=\"96\"\n              height=\"96\"\n            >\n              <span class=\"sr-only\">Refresh</span>\n            </ahc-icon>\n          </button>\n        </div>\n\n        <figcaption\n          class=\"roulette__caption\"\n          :class=\"`roulette--${post.caption.background}`\"\n        >\n          <h3 class=\"roulette__heading\">\n            <a v-if=\"post.caption.url\" :href=\"post.caption.url\" class=\"roulette__heading-link\">\n              {{ post.caption.heading }}\n            </a>\n            <span v-else>{{ post.caption.heading }}</span>\n          </h3>\n          <p class=\"roulette__description\">{{ post.caption.description }}</p>\n          <p v-if=\"post.caption.credit\" class=\"roulette__credit\">\n            {{ post.caption.credit }}\n          </p>\n        </figcaption>\n      </figure>\n    </transition>\n  </div>\n</template>\n\n<script lang=\"js\">\n  import ahcIcon from \"../icon/icon.vue\";\n  import axios from 'axios';\n\n  export default  {\n    name: 'ahc-roulette',\n    components: {\n      ahcIcon,\n    },\n    props: {\n      endpoint: {\n        type: String,\n        required: true\n      }\n    },\n    data() {\n      return {\n        collections: [],\n        ready: false,\n        post: null\n      }\n    },\n    mounted () {\n      this.fetchPosts();\n    },\n    methods: {\n      fetchPosts() {\n        const vm = this;\n\n        axios\n          .get(vm.endpoint)\n          .then(response => {\n\n            this.collections = response.data.items;\n\n            this.post = this.collections[Math.floor(Math.random() * this.collections.length)];\n\n            this.isFetching = false;\n            vm.ready = true;\n          })\n          .catch((error) => {\n            console.log(error);\n          });\n      },\n      refresh() {\n        const vm = this;\n        vm.ready = false;\n\n        this.post = this.collections[Math.floor(Math.random() * this.collections.length)];\n\n        this.$nextTick(() => {\n          vm.ready = true;\n        });\n      }\n    },\n}\n</script>\n\n<style lang=\"scss\">\n@import \"roulette\";\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./roulette.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./roulette.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./roulette.vue?vue&type=template&id=edae6600\"\nimport script from \"./roulette.vue?vue&type=script&lang=js\"\nexport * from \"./roulette.vue?vue&type=script&lang=js\"\nimport style0 from \"./roulette.vue?vue&type=style&index=0&id=edae6600&prod&lang=scss\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/@vue/cli-service/node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./roulette.vue?vue&type=style&index=0&id=edae6600&prod&lang=scss\""],"sourceRoot":""}