@europeana/portal
Version:
Europeana Portal
401 lines (348 loc) • 11.4 kB
JavaScript
exports.ids = [13];
exports.modules = {
/***/ 583:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/components/account/UserButtons.vue?vue&type=template&id=bb734f90&
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"user-buttons",attrs:{"data-qa":"user buttons"}},[_c('b-button',{directives:[{name:"show",rawName:"v-show",value:(_vm.showPins),expression:"showPins"}],staticClass:"pin-button text-uppercase",class:{ 'button-icon-only': !_vm.buttonText },attrs:{"variant":_vm.buttonVariant,"pressed":_vm.pinned,"data-qa":"pin button","aria-label":_vm.$t('entity.actions.pin')},on:{"click":_vm.pinAction}},[_c('span',{staticClass:"icon-push-pin"}),_vm._v("\n "+_vm._s(_vm.pinButtonText)+"\n ")]),_vm._ssrNode(" "),(_vm.showMove)?_c('b-button',{staticClass:"move-button text-uppercase d-inline-flex align-items-center",class:{ 'button-icon-only': !_vm.buttonText },attrs:{"data-qa":"add button","variant":_vm.buttonVariant,"aria-label":_vm.$t('actions.move')}},[_c('span',{staticClass:"icon-ic-move-xy"}),_vm._v("\n "+_vm._s(_vm.buttonText ? _vm.$t('actions.move') : '')+"\n ")]):_vm._e(),_vm._ssrNode(" "),_c('b-button',{staticClass:"add-button text-uppercase d-inline-flex align-items-center",class:{ 'button-icon-only': !_vm.buttonText },attrs:{"data-qa":"add button","variant":_vm.buttonVariant,"aria-label":_vm.$t('set.actions.addTo')},on:{"click":_vm.addToSet}},[_c('span',{staticClass:"icon-ic-add"}),_vm._v("\n "+_vm._s(_vm.buttonText ? _vm.$t('actions.save') : '')+"\n ")]),_vm._ssrNode(" "),_c('b-button',{staticClass:"like-button text-uppercase d-inline-flex align-items-center",class:{ 'button-icon-only': !_vm.buttonText },attrs:{"pressed":_vm.liked,"variant":_vm.buttonVariant,"data-qa":"like button","aria-label":_vm.$t('actions.like')},on:{"click":_vm.toggleLiked}},[_c('span',{staticClass:"icon-heart"}),_vm._v("\n "+_vm._s(_vm.likeButtonText)+"\n ")]),_vm._ssrNode(" "),(_vm.$auth.loggedIn)?[_c('AddItemToSetModal',{attrs:{"data-qa":"add item to set modal","modal-id":_vm.addItemToSetModalId,"item-id":_vm.identifier,"new-set-created":_vm.newSetCreated},on:{"clickCreateSet":_vm.clickCreateSet,"hideModal":_vm.refreshSet}}),_vm._ssrNode(" "),_c('SetFormModal',{attrs:{"modal-id":_vm.setFormModalId,"item-context":_vm.identifier},on:{"response":_vm.setCreatedOrUpdated}}),_vm._ssrNode(" "),_c('b-modal',{attrs:{"id":_vm.likeLimitModalId,"title":_vm.$t('set.notifications.likeLimit.title'),"hide-footer":""}},[_c('p',[_vm._v(_vm._s(_vm.$t('set.notifications.likeLimit.body')))])]),_vm._ssrNode(" "),(_vm.showPins && _vm.entity)?_c('b-modal',{attrs:{"id":_vm.pinnedLimitModalId,"title":_vm.$t('entity.notifications.pinLimit.title'),"hide-footer":"","hide-header-close":""}},[_vm._v("\n "+_vm._s(_vm.$t('entity.notifications.pinLimit.body'))+"\n "),_c('div',{staticClass:"modal-footer"},[_c('b-button',{attrs:{"variant":"outline-primary","data-qa":"cancel button"},on:{"click":function($event){return _vm.$bvModal.hide(_vm.pinnedLimitModalId)}}},[_vm._v("\n "+_vm._s(_vm.$t('actions.close'))+"\n ")]),_vm._v(" "),_c('b-button',{attrs:{"variant":"primary"},on:{"click":_vm.goToPins}},[_vm._v("\n "+_vm._s(_vm.$t('entity.actions.viewPinned'))+"\n ")])],1)]):_vm._e(),_vm._ssrNode(" "),(_vm.showPins && _vm.identifier && _vm.entities.length > 0)?_c('ItemPinModal',{attrs:{"identifier":_vm.identifier,"modal-id":_vm.pinModalId,"entities":_vm.entities,"data-qa":"pin item to entities modal"}}):_vm._e()]:_vm._e()],2)}
var staticRenderFns = []
// CONCATENATED MODULE: ./src/components/account/UserButtons.vue?vue&type=template&id=bb734f90&
// EXTERNAL MODULE: external "vuex"
var external_vuex_ = __webpack_require__(8);
// EXTERNAL MODULE: ./src/mixins/keycloak.js
var keycloak = __webpack_require__(54);
// EXTERNAL MODULE: ./src/mixins/makeToast.js
var makeToast = __webpack_require__(53);
// CONCATENATED MODULE: ./node_modules/babel-loader/lib??ref--2-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/account/UserButtons.vue?vue&type=script&lang=js&
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
/* harmony default export */ var UserButtonsvue_type_script_lang_js_ = ({
name: 'UserButtons',
components: {
AddItemToSetModal: () => __webpack_require__.e(/* import() */ 83).then(__webpack_require__.bind(null, 536)),
SetFormModal: () => __webpack_require__.e(/* import() */ 6).then(__webpack_require__.bind(null, 574)),
ItemPinModal: () => __webpack_require__.e(/* import() */ 96).then(__webpack_require__.bind(null, 593))
},
mixins: [keycloak["a" /* default */], makeToast["a" /* default */]],
props: {
/**
* Identifier of the item
*/
identifier: {
type: String,
required: true
},
// Entities related to the item, used on item page.
entities: {
type: Array,
default: () => []
},
/**
* If `true`, pin button will be rendered
*/
showPins: {
type: Boolean,
default: false
},
/**
* If `true`, move button will be rendered
*/
showMove: {
type: Boolean,
default: false
},
/**
* Button variant to use for styling the buttons
*/
buttonVariant: {
type: String,
default: 'outline-light'
},
/**
* If `true`, button text will be rendered
*/
buttonText: {
type: Boolean,
default: false
}
},
data() {
return {
addItemToSetModalId: `add-item-to-set-modal-${this.identifier}`,
setFormModalId: `set-form-modal-${this.identifier}`,
likeLimitModalId: `like-limit-modal-${this.identifier}`,
pinModalId: `pin-modal-${this.identifier}`,
pinnedLimitModalId: `pinned-limit-modal-${this.identifier}`,
showFormModal: false,
newSetCreated: false
};
},
computed: {
liked() {
return this.$store.getters['set/isLiked'](this.identifier);
},
likesId() {
return this.$store.state.set.likesId;
},
pinned() {
return this.$store.getters['entity/isPinned'](this.identifier);
},
pinButtonText() {
if (this.buttonText) {
return this.pinned ? this.$t('statuses.pinned') : this.$t('actions.pin');
}
return '';
},
likeButtonText() {
if (this.buttonText) {
return this.liked ? this.$t('statuses.liked') : this.$t('actions.like');
}
return '';
},
...Object(external_vuex_["mapGetters"])({
entity: 'entity/id',
featuredSet: 'entity/featuredSetId'
})
},
methods: {
clickCreateSet() {
if (this.showFormModal === false) {
this.showFormModal = true;
this.newSetCreated = false;
this.$bvModal.hide(this.addItemToSetModalId);
this.$bvModal.show(this.setFormModalId);
}
},
setCreatedOrUpdated() {
this.showFormModal = false;
this.newSetCreated = true;
this.$bvModal.show(this.addItemToSetModalId);
},
refreshSet() {
if (!this.showFormModal) {
this.$store.dispatch('set/refreshSet');
}
},
async toggleLiked() {
if (this.$auth.loggedIn) {
await (this.liked ? this.unlike() : this.like());
} else {
this.keycloakLogin();
}
},
goToPins() {
const path = this.$path(`/set/${this.featuredSet}`);
this.$goto(path);
},
async like() {
if (this.likesId === null) {
await this.$store.dispatch('set/createLikes');
}
try {
await this.$store.dispatch('set/like', this.identifier);
/**
* triggers on like button click when not yet liked
* @event like
* @property {string} identifier - identifier of the item to be liked
*/
this.$emit('like', this.identifier);
this.$matomo && this.$matomo.trackEvent('Item_like', 'Click like item button', this.identifier);
} catch (e) {
// TODO: remove when 100 item like limit is removed
if (e.message === '100 likes') {
this.$bvModal.show(this.likeLimitModalId);
} else {
throw e;
}
}
},
async unlike() {
await this.$store.dispatch('set/unlike', this.identifier);
/**
* triggers on like button click when already liked
* @event unlike
* @property {string} identifier - identifier of the item to be unliked
*/
this.$emit('unlike', this.identifier);
},
addToSet() {
if (this.$auth.loggedIn) {
this.$bvModal.show(this.addItemToSetModalId);
/**
* triggers on add to set button click
* @event add
* @property {string} identifier - identifier of the item to be added to the set
*/
this.$emit('add', this.identifier);
this.$matomo && this.$matomo.trackEvent('Item_add', 'Click add item button', this.identifier);
} else {
this.keycloakLogin();
}
},
async pin() {
if (this.featuredSet === null) {
await this.$store.dispatch('entity/createFeaturedSet');
}
try {
await this.$store.dispatch('entity/pin', this.identifier);
this.makeToast(this.$t('entity.notifications.pinned', {
entity: this.$store.getters['entity/englishPrefLabel']
}));
} catch (e) {
if (e.message === 'too many pins') {
this.$bvModal.show(`pinned-limit-modal-${this.identifier}`);
} else {
throw e;
}
}
},
async unpin() {
await this.$store.dispatch('entity/unpin', this.identifier);
this.makeToast(this.$t('entity.notifications.unpinned'));
},
async pinAction() {
if (this.entity || this.featuredSet) {
await this.togglePin(); // On an entity/entity set page all info is in the store.
} else {
await this.$bvModal.show(this.pinModalId); // Open the modal to find which entity to pin to.
}
},
async togglePin() {
if (this.pinned) {
await this.unpin();
} else {
await this.pin();
}
}
}
});
// CONCATENATED MODULE: ./src/components/account/UserButtons.vue?vue&type=script&lang=js&
/* harmony default export */ var account_UserButtonsvue_type_script_lang_js_ = (UserButtonsvue_type_script_lang_js_);
// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(3);
// CONCATENATED MODULE: ./src/components/account/UserButtons.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
account_UserButtonsvue_type_script_lang_js_,
render,
staticRenderFns,
false,
null,
null,
"ad31322a"
)
/* harmony default export */ var UserButtons = __webpack_exports__["default"] = (component.exports);
/***/ })
};;
//# sourceMappingURL=13.js.map