tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

History mode for theme router. Loads vue instance of theme main items list only when div exists.

This commit is contained in:
mateuswetah 2020-04-01 09:20:29 -03:00
parent 8c67b65790
commit 2bb949ca40
2 changed files with 156 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
src/views/theme-search/js/theme-main.js
View File

@ -35,61 +35,82 @@ import routerTheme from './theme-router.js';
import eventBusSearch from '../../admin/js/event-bus-search';
import { I18NPlugin, UserPrefsPlugin, ConsolePlugin } from '../../admin/js/utilities';
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
if (typeof window.tainacan_extra_plugins != "undefined") {
document.addEventListener("DOMContentLoaded", () => {
// Mount only if the div exists
if (document.getElementById('tainacan-items-page')) {
// Display Icons only once everything is loaded
function listen(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt,func,false);
else if (elem.attachEvent) { // IE DOM
var r = elem.attachEvent("on"+evnt, func);
return r;
} else if (document.head) {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconHideStyle);
} else {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
}
}
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
if (typeof window.tainacan_extra_plugins != "undefined") {
for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins)) {
Vue.component(extraVuePluginName, extraVuePluginObject);
}
}
}
// Configure and Register Plugins
Vue.use(Buefy, {
// Configure and Register Plugins
Vue.use(Buefy, {
defaultTooltipAnimated: true
});
Vue.use(VTooltip);
Vue.use(VueMasonry);
Vue.use(I18NPlugin);
Vue.use(UserPrefsPlugin);
Vue.use(ConsolePlugin, {visual: false});
});
Vue.use(VTooltip);
Vue.use(VueMasonry);
Vue.use(I18NPlugin);
Vue.use(UserPrefsPlugin);
Vue.use(ConsolePlugin, {visual: false});
/* Registers Extra Vue Components passed to the window.tainacan_extra_components */
if (typeof window.tainacan_extra_components != "undefined") {
/* Registers Extra Vue Components passed to the window.tainacan_extra_components */
if (typeof window.tainacan_extra_components != "undefined") {
for (let [extraVueComponentName, extraVueComponentObject] of Object.entries(window.tainacan_extra_components)) {
Vue.component(extraVueComponentName, extraVueComponentObject);
}
}
}
Vue.component('tainacan-filter-item', TaincanFiltersList);
Vue.component('tainacan-filter-item', TaincanFiltersList);
/* Filters */
Vue.component('tainacan-filter-numeric', FilterNumeric);
Vue.component('tainacan-filter-date', FilterDate);
Vue.component('tainacan-filter-selectbox', FilterSelectbox);
Vue.component('tainacan-filter-autocomplete', FilterAutocomplete);
Vue.component('tainacan-filter-checkbox', FilterCheckbox);
Vue.component('tainacan-filter-taginput', FilterTaginput);
Vue.component('tainacan-filter-taxonomy-checkbox', FilterTaxonomyCheckbox);
Vue.component('tainacan-filter-taxonomy-taginput', FilterTaxonomyTaginput);
Vue.component('tainacan-filter-date-interval', FilterDateInterval);
Vue.component('tainacan-filter-numeric-interval', FilterNumericInterval);
Vue.component('tainacan-filter-numeric-list-interval', FilterNumericListInterval);
/* Filters */
Vue.component('tainacan-filter-numeric', FilterNumeric);
Vue.component('tainacan-filter-date', FilterDate);
Vue.component('tainacan-filter-selectbox', FilterSelectbox);
Vue.component('tainacan-filter-autocomplete', FilterAutocomplete);
Vue.component('tainacan-filter-checkbox', FilterCheckbox);
Vue.component('tainacan-filter-taginput', FilterTaginput);
Vue.component('tainacan-filter-taxonomy-checkbox', FilterTaxonomyCheckbox);
Vue.component('tainacan-filter-taxonomy-taginput', FilterTaxonomyTaginput);
Vue.component('tainacan-filter-date-interval', FilterDateInterval);
Vue.component('tainacan-filter-numeric-interval', FilterNumericInterval);
Vue.component('tainacan-filter-numeric-list-interval', FilterNumericListInterval);
/* Main page component */
Vue.component('theme-items-page', ThemeItemsPage);
Vue.component('theme-search', ThemeSearch);
/* Main page component */
Vue.component('theme-items-page', ThemeItemsPage);
Vue.component('theme-search', ThemeSearch);
// Oficial view modes
Vue.component('view-mode-table', ViewModeTable);
Vue.component('view-mode-cards', ViewModeCards);
Vue.component('view-mode-records', ViewModeRecords);
Vue.component('view-mode-masonry', ViewModeMasonry);
Vue.component('view-mode-slideshow', ViewModeSlideshow);
// Oficial view modes
Vue.component('view-mode-table', ViewModeTable);
Vue.component('view-mode-cards', ViewModeCards);
Vue.component('view-mode-records', ViewModeRecords);
Vue.component('view-mode-masonry', ViewModeMasonry);
Vue.component('view-mode-slideshow', ViewModeSlideshow);
Vue.use(eventBusSearch, { store: store, router: routerTheme});
Vue.use(eventBusSearch, { store: store, router: routerTheme});
document.addEventListener("DOMContentLoaded", () => {
new Vue({
el: '#tainacan-items-page',
const VueItemsList = new Vue({
store,
router: routerTheme,
data: {
@ -112,6 +133,7 @@ document.addEventListener("DOMContentLoaded", () => {
showFullscreenWithViewModes: false
},
beforeMount () {
console.log('antes de montar')
// Collection or Term source settings
if (this.$el.attributes['collection-id'] != undefined)
this.collectionId = this.$el.attributes['collection-id'].value;
@ -161,33 +183,19 @@ document.addEventListener("DOMContentLoaded", () => {
},
render: h => h(ThemeSearch)
});
});
// Initialize Ponyfill for Custom CSS properties
cssVars({
// Options...
});
VueItemsList.$mount('#tainacan-items-page');
// Display Icons only once everything is loaded
function listen(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt,func,false);
else if (elem.attachEvent) { // IE DOM
var r = elem.attachEvent("on"+evnt, func);
return r;
} else if (document.head) {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconHideStyle);
} else {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
}
}
listen("load", window, function() {
listen("load", window, function() {
var iconsStyle = document.createElement("style");
iconsStyle.setAttribute('type', 'text/css');
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconsStyle);
});
// Initialize Ponyfill for Custom CSS properties
cssVars({
// Options...
});
}
});

1
src/views/theme-search/js/theme-router.js
View File

@ -7,6 +7,7 @@ Vue.use(VueRouter);
const themeRoutes = [];
export default new VueRouter ({
mode: 'history',
themeRoutes,
// set custom query resolver
parseQuery(query) {