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

fixed coollightbox

This commit is contained in:
Bachir Soussi Chiadmi 2022-02-22 13:43:18 +01:00
parent 96b343b246
commit 99384d32c4
12 changed files with 2679 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
package-lock.json generated
View File

@ -3632,6 +3632,11 @@
"array-find-index": "^1.0.1"
}
},
"custom-event-polyfill": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/custom-event-polyfill/-/custom-event-polyfill-1.0.7.tgz",
"integrity": "sha512-TDDkd5DkaZxZFM8p+1I3yAlvM3rSr1wbrOliG4yJiwinMZN8z/iGL7BTlDkrJcYTmgUSb4ywVCc3ZaUtOtC76w=="
},
"cyclist": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
@ -6912,6 +6917,11 @@
}
}
},
"loadjs": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/loadjs/-/loadjs-4.2.0.tgz",
"integrity": "sha512-AgQGZisAlTPbTEzrHPb6q+NYBMD+DP9uvGSIjSUM5uG+0jG15cb8axWpxuOIqrmQjn6scaaH8JwloiP27b2KXA=="
},
"locate-path": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
@ -8112,6 +8122,25 @@
"semver-compare": "^1.0.0"
}
},
"plyr": {
"version": "3.6.12",
"resolved": "https://registry.npmjs.org/plyr/-/plyr-3.6.12.tgz",
"integrity": "sha512-42WhYpMS/FEyX2unSEvhYtj1RvJgWvOsjZQFDongOQHA4eVzsyr7b06bzVpinMAOVC9e5H7RCbK+6CCAFIl2VQ==",
"requires": {
"core-js": "^3.20.0",
"custom-event-polyfill": "^1.0.7",
"loadjs": "^4.2.0",
"rangetouch": "^2.0.1",
"url-polyfill": "^1.1.12"
},
"dependencies": {
"core-js": {
"version": "3.21.1",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.21.1.tgz",
"integrity": "sha512-FRq5b/VMrWlrmCzwRrpDYNxyHP9BcAZC+xHJaqTgIE5091ZV1NTmyh0sGOg5XqpnHvR0svdy0sv1gWA1zmhxig=="
}
}
},
"posix-character-classes": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@ -8360,6 +8389,11 @@
"safe-buffer": "^5.1.0"
}
},
"rangetouch": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/rangetouch/-/rangetouch-2.0.1.tgz",
"integrity": "sha512-sln+pNSc8NGaHoLzwNBssFSf/rSYkqeBXzX1AtJlkJiUaVSJSbRAWJk+4omsXkN+EJalzkZhWQ3th1m0FpR5xA=="
},
"rc": {
"version": "1.2.8",
"resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
@ -10694,6 +10728,11 @@
"prepend-http": "^1.0.1"
}
},
"url-polyfill": {
"version": "1.1.12",
"resolved": "https://registry.npmjs.org/url-polyfill/-/url-polyfill-1.1.12.tgz",
"integrity": "sha512-mYFmBHCapZjtcNHW0MDq9967t+z4Dmg5CJ0KqysK3+ZbyoNOWQHksGCTWwDhxGXllkWlOc10Xfko6v4a3ucM6A=="
},
"use": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
@ -10753,11 +10792,12 @@
}
},
"vue-cool-lightbox": {
"version": "2.7.1",
"resolved": "https://registry.npmjs.org/vue-cool-lightbox/-/vue-cool-lightbox-2.7.1.tgz",
"integrity": "sha512-LxcUirNblEi2izgmeLqyWBwSz+fhJVAOvrV4jGJ6Wmz3ip80r0kQlMkgoEGI0ZTAPQwRZqGHbU7Wj1vh8nacVg==",
"version": "2.7.4",
"resolved": "https://registry.npmjs.org/vue-cool-lightbox/-/vue-cool-lightbox-2.7.4.tgz",
"integrity": "sha512-5l2nvS7LPGNpf4gp76W+tJ2rL8Yg2HD2S5uVRRkDWxDj62muHImePMQcwkPjpYoUU39TNVsB5fld6+we4LfRnw==",
"requires": {
"body-scroll-lock": "^3.1.5",
"plyr": "^3.6.7",
"vue": "^2.6.10"
}
},

2
package.json
View File

@ -24,7 +24,7 @@
"pretty-bytes": "^5.5.0",
"vue": "^2.6.12",
"vue-autofocus-directive": "^1.0.4",
"vue-cool-lightbox": "^2.6.9",
"vue-cool-lightbox": "^2.7.4",
"vue-infinite-loading": "^2.4.5",
"vue-router": "^3.4.9",
"vue-vimeo-player": "^0.1.0",

2
web/themes/custom/materiotheme/assets/dist/main.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
web/themes/custom/materiotheme/assets/dist/main.css.gz vendored
View File

Binary file not shown.

2560
web/themes/custom/materiotheme/assets/dist/main.js vendored
View File

File diff suppressed because one or more lines are too long

BIN
web/themes/custom/materiotheme/assets/dist/main.js.gz vendored
View File

Binary file not shown.

2
web/themes/custom/materiotheme/assets/dist/vclb.js vendored
View File

File diff suppressed because one or more lines are too long

BIN
web/themes/custom/materiotheme/assets/dist/vclb.js.gz vendored
View File

Binary file not shown.

26
web/themes/custom/materiotheme/assets/scripts/main.js
View File

@ -17,8 +17,9 @@ Vue.use(InfiniteLoading, {
// Vue.use(vueVimeoPlayer)
// import VueYouTubeEmbed from 'vue-youtube-embed'
// Vue.use(VueYouTubeEmbed)
import CoolLightBox from 'vue-cool-lightbox'
Vue.use(CoolLightBox)
// LOADED IN COMPONENT
// import CoolLightBox from 'vue-cool-lightbox'
// Vue.use(CoolLightBox)
import VModal from 'vue-js-modal'
Vue.use(VModal, { dialog: true })
@ -49,10 +50,11 @@ import VMainContent from 'vuejs/components/Content/MainContent'
import VSearchBlock from 'vuejs/components/Block/SearchBlock'
import VLeftContent from 'vuejs/components/Content/LeftContent'
import VHeaderMenu from 'vuejs/components/Content/HeaderMenu'
import GlobCoolLightBox from 'vuejs/components/Content/GlobCoolLightBox'
import { mapState } from 'vuex'
import 'vue-cool-lightbox/dist/vue-cool-lightbox.min.css'
// import 'vue-cool-lightbox/dist/vue-cool-lightbox.min.css'
import 'slim-select/slimselect.min.css'
import 'theme/assets/styles/main.scss'
@ -62,7 +64,8 @@ import MA from 'vuejs/api/ma-axios'
export let _v_sitebranding_block, _v_user_block, _v_header_menu,
_v_pagetitle_block, _v_search_block,
_v_main_content, _v_left_content
_v_main_content, _v_left_content,
_v_glob_coollightbox
(function (Drupal, drupalSettings, drupalDecoupled) {
const MaterioTheme = function () {
@ -121,6 +124,7 @@ export let _v_sitebranding_block, _v_user_block, _v_header_menu,
initVStore()
initVi18n()
initVLeftContent()
initCoolLightBox()
}
initVUserBlock()
}
@ -390,6 +394,20 @@ export let _v_sitebranding_block, _v_user_block, _v_header_menu,
render: h => h(VLeftContent, { props: { id: id } })
}).$mount('#' + id)
}
function initCoolLightBox () {
const id = 'glog-coollightbox'
const $clb_elmt = document.createElement('div')
$clb_elmt.setAttribute('id', id)
const $body = document.querySelector('body')
$body.appendChild($clb_elmt)
_v_glob_coollightbox = new Vue({
store,
i18n,
render: h => h(GlobCoolLightBox, { props: { } })
}).$mount('#' + id)
console.log('_v_glob_coollightbox', _v_glob_coollightbox)
}
init()
} // end MaterioTheme()

51
web/themes/custom/materiotheme/vuejs/components/Content/GlobCoolLightBox.vue Normal file
View File

@ -0,0 +1,51 @@
<template lang="html">
<CoolLightBox
:items="coolLightBoxItems"
:index="coolLightBoxIndex"
srcName="url"
:loop="true"
:fullscreen="true"
@close="setcoolLightBoxIndex(null)">
</CoolLightBox>
</template>
<script>
import { mapState, mapActions } from 'vuex'
// import MA from 'vuejs/api/ma-axios'
import router from 'vuejs/route'
import CoolLightBox from 'vue-cool-lightbox'
import 'vue-cool-lightbox/dist/vue-cool-lightbox.min.css'
export default {
router,
// props:[],
data() {
return {
// isOpened: false
}
},
computed: {
...mapState({
coolLightBoxItems: state => state.Common.coolLightBoxItems,
coolLightBoxIndex: state => state.Common.coolLightBoxIndex,
})
},
beforeMount() {
},
methods: {
...mapActions({
setcoolLightBoxIndex: 'Common/setcoolLightBoxIndex'
}),
},
components: {
CoolLightBox
}
}
</script>
<style lang="scss" scoped>
</style>

20
web/themes/custom/materiotheme/vuejs/components/Content/ModalCard.vue
View File

@ -271,23 +271,27 @@
<img
class="blank"
:src="blanksrc"
@click="lightbox_index = index"
@click="setcoolLightBoxIndex(index)"
>
</figure>
</section>
<CoolLightBox
<!-- <CoolLightBox
:items="material.images"
:index="lightbox_index"
srcName="url"
:loop="true"
:fullScreen="true"
@close="lightbox_index = null">
</CoolLightBox>
</CoolLightBox> -->
</article>
</template>
<script>
import { mapState, mapActions } from 'vuex'
// import CoolLightBox from 'vue-cool-lightbox'
// import 'vue-cool-lightbox/dist/vue-cool-lightbox.min.css'
import {
VsaList,
VsaItem,
@ -317,6 +321,7 @@ export default {
mixins: [cardMixins],
components: {
LinkedMaterialCard,
// CoolLightBox,
VsaList,
VsaItem,
VsaHeading,
@ -365,7 +370,9 @@ export default {
...mapState({
csrf_token: state => state.User.csrf_token,
flagcolls: state => state.User.flagcolls,
showrooms: state => state.Showrooms.showrooms_by_tid
showrooms: state => state.Showrooms.showrooms_by_tid,
coolLightBoxItems: state => state.Common.coolLightBoxItems,
coolLightBoxIndex: state => state.Common.coolLightBoxIndex
}),
collsLength() {
return Object.keys(this.flagcolls).length
@ -397,7 +404,9 @@ export default {
...mapActions({
// refreshItem: 'Search/refreshItem',
createFlagColl: 'User/createFlagColl',
flagUnflag: 'User/flagUnflag'
flagUnflag: 'User/flagUnflag',
setcoolLightBoxItems: 'Common/setcoolLightBoxItems',
setcoolLightBoxIndex: 'Common/setcoolLightBoxIndex'
}),
loadMaterial(){
console.log('loadMaterial', this.item.id)
@ -424,6 +433,7 @@ export default {
// setTimeout(function () {
// this.activateLazyLoad()
// }.bind(this), 5)
this.setcoolLightBoxItems(this.material.images)
})
.catch(error => {
console.warn('Issue with loadMaterial', error)

18
web/themes/custom/materiotheme/vuejs/store/modules/common.js
View File

@ -8,7 +8,9 @@ export default {
// initial state
state: {
pagetitle: null,
hamburgerMenuToggle: document.querySelector('input#header-block-right-toggle')
hamburgerMenuToggle: document.querySelector('input#header-block-right-toggle'),
coolLightBoxItems: null,
coolLightBoxIndex: null
},
// getters
@ -22,6 +24,12 @@ export default {
},
setHamMenuState (state, s) {
state.hamburgerMenuToggle.checked = s
},
setcoolLightBoxItems (state, items) {
state.coolLightBoxItems = items
},
setcoolLightBoxIndex (state, i) {
state.coolLightBoxIndex = i
}
},
@ -30,6 +38,14 @@ export default {
openCloseHamMenu ({ dispatch, commit, state }, s) {
console.log('openCloseHamMenu', s)
commit('setHamMenuState', s)
},
setcoolLightBoxIndex ({ dispatch, commit, state }, i) {
console.log('setcoolLightBoxIndex', i)
commit('setcoolLightBoxIndex', i)
},
setcoolLightBoxItems ({ dispatch, commit, state }, items) {
console.log('setcoolLightBoxItems', items)
commit('setcoolLightBoxItems', items)
}
}