bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fixed modalCard after graphql refactoring

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2020-12-23 19:11:46 +01:00
parent 53dcc8b854
commit 609d4f5fde
12 changed files with 232 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
web/themes/custom/materiotheme/vuejs/components/cardMixins.js
View File

@@ -4,6 +4,7 @@ export default {
lazy: {
bind(img,binding){
// console.log('lazy bind', img, binding);
// show only the first image
if(binding.value === 0){
img.setAttribute('src', img.getAttribute('data-src'))
img.removeAttribute('data-src')
@@ -41,18 +42,35 @@ export default {
},
mounted() {
// lazy load images on mouseover
this.$el.addEventListener('mouseover', function(event) {
let imgs = this.querySelectorAll('.images figure img.lazy')
// console.log('mouseover', this, imgs);
imgs.forEach((img) => {
// console.log('forEach img',img);
img.setAttribute('src', img.getAttribute('data-src'))
img.removeAttribute('data-src')
img.classList.remove('lazy')
})
}, {once : true})
console.log('card mounted', this.$options.name);
// if (this.$options.name ==! 'ModalCard') {
this.$el.addEventListener('mouseover', function(event) {
let imgs = this.querySelectorAll('.images figure img.lazy')
console.log('mousemove', this, imgs);
imgs.forEach((img) => {
// console.log('forEach img',img);
img.setAttribute('src', img.getAttribute('data-src'))
img.removeAttribute('data-src')
img.classList.remove('lazy')
})
}, {once : true})
// }
},
methods: {
activateLazyLoad () {
console.log('card activateLazyLoad', this.$options.name);
this.$el.addEventListener('mousemove', function(event) {
let imgs = this.querySelectorAll('.images figure img.lazy')
console.log('mousemove', this, imgs);
imgs.forEach((img) => {
// console.log('forEach img',img);
img.setAttribute('src', img.getAttribute('data-src'))
img.removeAttribute('data-src')
img.classList.remove('lazy')
})
}, {once : true})
}
// deg2rad (deg) {
// return deg * (Math.PI / 180)
// },