|
@@ -28,7 +28,9 @@ import 'theme/assets/styles/main.scss'
|
|
|
|
|
|
var MaterioTheme = function(){
|
|
|
|
|
|
- var _v_sitebranding_block, _v_pagetitle_block, _v_user_block, _v_main_content, _v_search_block;
|
|
|
+ var _v_sitebranding_block, _v_user_block, _v_header_menu
|
|
|
+ , _v_pagetitle_block, _v_search_block
|
|
|
+ , _v_main_content;
|
|
|
var _is_front = drupalSettings.path.isFront;
|
|
|
|
|
|
console.log('drupalSettings', drupalSettings);
|
|
@@ -43,13 +45,29 @@ import 'theme/assets/styles/main.scss'
|
|
|
}
|
|
|
|
|
|
function initVues(){
|
|
|
+ initVRouter();
|
|
|
initVSiteBrandingBlock()
|
|
|
initVPagetitleBlock()
|
|
|
initVUserBlock()
|
|
|
+ initVHeaderMenu()
|
|
|
initVMainContent()
|
|
|
initVSearchBlock()
|
|
|
}
|
|
|
|
|
|
+ function initVRouter(){
|
|
|
+ // we need this to update the title while using history nav
|
|
|
+ router.beforeEach((to, from, next) => {
|
|
|
+
|
|
|
+ // console.log('router beforeEach');
|
|
|
+ // console.log(to);
|
|
|
+ // console.log(from);
|
|
|
+ // console.log(next);
|
|
|
+
|
|
|
+ store.commit('Common/setPagetitle', to.name)
|
|
|
+ next();
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
function initVSiteBrandingBlock(){
|
|
|
_v_sitebranding_block = new Vue({
|
|
|
store,
|
|
@@ -61,7 +79,8 @@ import 'theme/assets/styles/main.scss'
|
|
|
let href = event.target.getAttribute('href');
|
|
|
// console.log("Clicked on logo href", href);
|
|
|
this.$router.push(href)
|
|
|
- this.$store.commit('Common/setPagetitle', null)
|
|
|
+ // replaced by router.beforeEach
|
|
|
+ // this.$store.commit('Common/setPagetitle', null)
|
|
|
}
|
|
|
}
|
|
|
})
|
|
@@ -127,6 +146,33 @@ import 'theme/assets/styles/main.scss'
|
|
|
// console.log('initVUserBlock', _v_user_block);
|
|
|
}
|
|
|
|
|
|
+ function initVHeaderMenu(){
|
|
|
+ // console.log('initVHeaderMenu');
|
|
|
+ // adding vuejs attributes has it wont work on twig template (see menu--header.html.twig)
|
|
|
+ // not working : String contains an invalid character
|
|
|
+ // document.querySelectorAll(`#block-header a`).forEach(link => {
|
|
|
+ // console.log(link);
|
|
|
+ // link.setAttribute('@click.prevent', 'onclick')
|
|
|
+ // });
|
|
|
+
|
|
|
+ _v_header_menu = new Vue({
|
|
|
+ store,
|
|
|
+ router,
|
|
|
+ el: `#block-header`,
|
|
|
+ methods: {
|
|
|
+ onclick(event){
|
|
|
+ // console.log("Clicked on header menu link", event);
|
|
|
+ let href = event.target.getAttribute('href');
|
|
|
+ let title = event.target.innerText;
|
|
|
+ // console.log("Clicked on header menu link : href", href);
|
|
|
+ this.$router.push(href)
|
|
|
+ // replaced by router.beforeEach
|
|
|
+ // this.$store.commit('Common/setPagetitle', title)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
function initVMainContent(){
|
|
|
let id = "main-content"
|
|
|
let $main_content = document.querySelector('#'+id)
|
|
@@ -136,7 +182,6 @@ import 'theme/assets/styles/main.scss'
|
|
|
store,
|
|
|
render: h => h(VMainContent, {props:{id:id, html:main_html, isfront:drupalSettings.path.isFront}})
|
|
|
}).$mount('#'+id)
|
|
|
- // console.log('initTestVContent', v_test_content);
|
|
|
}
|
|
|
|
|
|
function initVSearchBlock(){
|