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

Adjustments on slideshow view mode.

This commit is contained in:
Mateus Machado Luna 2018-10-01 14:40:15 -03:00
parent a9c7add5b1
commit 5a31b6442b
6 changed files with 55 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/admin/js/theme-main.js
View File

@ -35,7 +35,7 @@ import ViewModeTable from '../../theme-helper/view-mode-table.vue';
import ViewModeCards from '../../theme-helper/view-mode-cards.vue';
import ViewModeRecords from '../../theme-helper/view-mode-records.vue';
import ViewModeMasonry from '../../theme-helper/view-mode-masonry.vue';
import ViewModeSlide from '../../theme-helper/view-mode-slide.vue';
import ViewModeSlideshow from '../../theme-helper/view-mode-slideshow.vue';
// Remaining imports
import HelpButton from '../components/other/help-button.vue';
@ -90,7 +90,7 @@ 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-slide', ViewModeSlide);
Vue.component('view-mode-slideshow', ViewModeSlideshow);
Vue.use(eventBusSearch, { store: store, router: routerTheme});

20
src/admin/pages/lists/items-page.vue
View File

@ -309,7 +309,7 @@
v-for="(viewModeOption, index) of enabledViewModes"
:key="index"
:value="viewModeOption"
v-if="registeredViewModes[viewModeOption] != undefined">
v-if="registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == false">
<span
class="gray-icon"
v-html="registeredViewModes[viewModeOption].icon"/>
@ -388,6 +388,24 @@
</b-field>
</div>
<!-- Theme Full Screen mode, it's just a special view mode -->
<div
v-if="isOnTheme"
class="search-control-item">
<button
class="button is-white"
@click="onChangeViewMode(viewModeOption)"
v-for="(viewModeOption, index) of enabledViewModes"
:key="index"
:value="viewModeOption"
v-if="registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == true ">
<span
class="gray-icon"
v-html="registeredViewModes[viewModeOption].icon"/>
<span class="is-hidden-touch">{{ registeredViewModes[viewModeOption].label }}</span>
</button>
</div>
<!-- Text simple search (used on mobile, instead of the one from filter list)-->
<div class="is-hidden-tablet search-control-item">
<div class="search-area">

20
src/admin/pages/lists/term-items-page.vue
View File

@ -302,7 +302,7 @@
v-for="(viewModeOption, index) of enabledViewModes"
:key="index"
:value="viewModeOption"
v-if="registeredViewModes[viewModeOption] != undefined">
v-if="registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == false">
<span
class="gray-icon"
v-html="registeredViewModes[viewModeOption].icon"/>
@ -381,6 +381,24 @@
</b-field>
</div>
<!-- Theme Full Screen mode, it's just a special view mode -->
<div
v-if="isOnTheme"
class="search-control-item">
<button
class="button is-white"
@click="onChangeViewMode(viewModeOption)"
v-for="(viewModeOption, index) of enabledViewModes"
:key="index"
:value="viewModeOption"
v-if="registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == true ">
<span
class="gray-icon"
v-html="registeredViewModes[viewModeOption].icon"/>
<span class="is-hidden-touch">{{ registeredViewModes[viewModeOption].label }}</span>
</button>
</div>
<!-- Text simple search (used on mobile, instead of the one from filter list)-->
<div class="is-hidden-tablet search-control-item">
<div class="search-area">

0
src/admin/scss/_view-mode-slide.scss → src/admin/scss/_view-mode-slideshow.scss
View File

6
src/theme-helper/class-tainacan-theme-helper.php
View File

@ -84,10 +84,10 @@ class Theme_Helper {
'icon' => '<span class="icon"><i class="mdi mdi-view-dashboard mdi-24px"></i></span>',
'type' => 'component'
]);
$this->register_view_mode('slide', [
'label' => __('Slide', 'tainacan'),
$this->register_view_mode('slideshow', [
'label' => __('Slideshow', 'tainacan'),
'dynamic_metadata' => false,
'description' => 'A slideshow view, fullscreen.',
'description' => 'A fullscreen slideshow view.',
'icon' => '<span class="icon"><i class="mdi mdi-fullscreen mdi-24px"></i></span>',
'type' => 'component',
'show_pagination' => false,

21
src/theme-helper/view-mode-slide.vue → src/theme-helper/view-mode-slideshow.vue
View File

@ -94,9 +94,11 @@
<div class="table-wrapper">
<!-- SLIDE MAIN VIEW-->
<section class="tainacan-slide-main-view">
<section
@click.prevent.stop="onHideControls()"
class="tainacan-slide-main-view">
<button
@click.prevent="prevSlide()"
@click.stop.prevent="prevSlide()"
:style="{ visibility: (page > 1 && slideIndex <= 0) || slideIndex > 0 ? 'visible' : 'hidden' }"
class="slide-control-arrow arrow-left">
<span class="icon is-large">
@ -104,7 +106,7 @@
</span>
</button>
<div
@click.prevent="onHideControls()"
class="slide-main-content"
v-hammer:swipe.prevent="onSwipeFiltersMenu">
<transition
@ -142,7 +144,7 @@
</transition>
</div>
<button
@click.prevent="nextSlide()"
@click.stop.prevent="nextSlide()"
:style="{ visibility: (slideIndex < slideItems.length - 1) || page < totalPages ? 'visible' : 'hidden' }"
class="slide-control-arrow arrow-right">
<span class="icon is-large has-text-turoquoise5">
@ -151,13 +153,14 @@
</button>
</section>
<section
@click.prevent="onHideControls()"
v-if="slideItems[slideIndex] != undefined"
class="slide-title-area">
<h1>{{ slideItems[slideIndex].title }}</h1>
<button
:disabled="(slideIndex == slideItems.length - 1 && page == totalPages)"
class="play-button"
@click="isPlaying = !isPlaying">
@click.stop.prevent="isPlaying = !isPlaying">
<b-icon
type="is-secondary"
size="is-medium"
@ -236,7 +239,7 @@ import { swiper, swiperSlide } from 'vue-awesome-swiper';
import CircularCounter from '../admin/components/other/circular-counter.vue';
export default {
name: 'ViewModeSlide',
name: 'ViewModeSlideshow',
props: {
collectionId: Number,
displayedMetadata: Array,
@ -431,7 +434,7 @@ export default {
'getItemsPerPage'
]),
onHideControls() {
if (!this.isSwiping)
if (this.isSwiping == undefined || this.isSwiping == false)
this.hideControls = !this.hideControls;
},
onSwipeFiltersMenu($event) {
@ -573,10 +576,10 @@ export default {
$page-small-side-padding: 25px;
$page-side-padding: 4.166666667%;
@import "../../src/admin/scss/_view-mode-slide.scss";
@import "../../src/admin/scss/_view-mode-slideshow.scss";
.table-wrapper {
overflow-x: hidden !important;
overflow: hidden !important;
}
</style>