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

Finishes implementation of EnabledViewModes configuration.

This commit is contained in:
Mateus Machado Luna 2018-05-29 18:14:30 -03:00
parent 79c006c119
commit 7d9557b4a4
7 changed files with 124 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
src/admin/components/edition/collection-edition-form.vue
View File

@ -276,6 +276,38 @@
</b-select>
</b-field>
<!-- Enabled View Modes ------------------------------- -->
<div class="field">
<b-dropdown
ref="enabledViewModesDropdown"
:mobile-modal="false"
:disabled="Object.keys(registeredViewModes).length < 0">
<button
class="button is-white"
slot="trigger"
position="is-top-right"
type="button">
<span>{{ $i18n.get('label_enabled_view_modes') }}</span>
<b-icon icon="menu-down"/>
</button>
<b-dropdown-item
v-for="(viewMode, index) in Object.keys(registeredViewModes)"
:key="index"
class="control"
custom>
<b-checkbox
@input="updateViewModeslist(viewMode)"
:value="checkIfViewModeEnabled(viewMode)">
{{ registeredViewModes[viewMode].label }}
</b-checkbox>
</b-dropdown-item>
</b-dropdown>
<help-button
:title="$i18n.getHelperTitle('collections', 'enabled_view_modes')"
:message="$i18n.getHelperMessage('collections', 'enabled_view_modes')"/>
</div>
</div>
</div>
@ -358,7 +390,9 @@ export default {
collections: [],
isFetchingCollections: true,
thumbnailMediaFrame: undefined,
headerImageMediaFrame: undefined
headerImageMediaFrame: undefined,
registeredViewModes: tainacan_plugin.registered_view_modes,
viewModesList: []
}
},
methods: {
@ -393,7 +427,8 @@ export default {
slug: this.form.slug,
status: this.form.status,
moderators_ids: this.form.moderators_ids,
parent: this.form.parent
parent: this.form.parent,
enabled_view_modes: this.form.enabled_view_modes
};
this.updateCollection(data).then(updatedCollection => {
@ -406,6 +441,7 @@ export default {
this.form.status = this.collection.status;
this.form.cover_page_id = this.collection.cover_page_id;
this.form.enable_cover_page = this.collection.enable_cover_page;
this.form.enabled_view_modes = this.collection.enabled_view_modes;
this.isLoading = false;
this.formErrorMessage = '';
@ -444,8 +480,21 @@ export default {
this.form.cover_page_id = this.collection.cover_page_id;
this.form.slug = this.collection.slug;
this.form.parent = this.collection.parent;
this.form.enabled_view_modes = [];
this.moderators = [];
// Fills or update enabled view modes
// for (let viewMode of Object.keys(this.registeredViewModes)) {
// let indexOfViewMode = this.form.enabled_view_modes.findIndex(aViewMode => aViewMode.viewMode == viewMode);
// if (indexOfViewMode < 0) {
// this.form.enabled_view_modes.push({
// viewMode: viewMode,
// label: this.registeredViewModes[viewMode].label,
// enabled: false
// });
// }
// }
// Pre-fill status with publish to incentivate it
this.form.status = 'publish';
@ -472,6 +521,18 @@ export default {
cancelBack(){
this.$router.push(this.$routerHelper.getCollectionsPath());
},
updateViewModeslist(viewMode) {
let index = this.form.enabled_view_modes.findIndex(aViewMode => aViewMode == viewMode);
if (index > -1)
this.form.enabled_view_modes.splice(index, 1);
else
this.form.enabled_view_modes.push(viewMode);
},
checkIfViewModeEnabled(viewMode) {
let index = this.form.enabled_view_modes.findIndex(aViewMode => aViewMode == viewMode);
return index > -1;
},
fecthCoverPages(search) {
this.isFetchingPages = true;
this.fetchPages(search)
@ -601,9 +662,21 @@ export default {
this.form.enable_cover_page = this.collection.enable_cover_page;
this.form.cover_page_id = this.collection.cover_page_id;
this.form.parent = this.collection.parent;
this.form.enabled_view_modes = JSON.parse(JSON.stringify(this.collection.enabled_view_modes));
this.moderators = JSON.parse(JSON.stringify(this.collection.moderators));
// Fills or update enabled view modes
// for (let viewMode of Object.keys(this.registeredViewModes)) {
// let indexOfViewMode = this.form.enabled_view_modes.findIndex(aViewMode => aViewMode.viewMode == viewMode);
// if (indexOfViewMode < 0) {
// this.form.enabled_view_modes.push({
// viewMode: viewMode,
// label: this.registeredViewModes[viewMode].label,
// enabled: false
// });
// }
// }
// Generates CoverPage from current cover_page_id info
if (this.form.cover_page_id != undefined && this.form.cover_page_id != '') {
@ -639,6 +712,7 @@ export default {
}
},
mounted() {
if (this.$route.fullPath.split("/").pop() != "new") {
document.getElementById('collection-page-container').addEventListener('scroll', ($event) => {
this.$emit('onShrinkHeader', ($event.originalTarget.scrollTop > 53));

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

@ -88,12 +88,20 @@ new Vue({
store,
router: routerTheme,
data: {
collectionId: ''
collectionId: '',
defaultViewMode: '',
enabledViewModes: {}
},
render: h => h(ThemeItemsList),
beforeMount () {
if (this.$el.attributes['collection-id'] != undefined)
this.collectionId = this.$el.attributes['collection-id'].value;
if (this.$el.attributes['default-view-mode'] != undefined)
this.defaultViewMode = this.$el.attributes['default-view-mode'].value;
if (this.$el.attributes['enabled-view-modes'] != undefined)
this.enabledViewModes = this.$el.attributes['enabled-view-modes'].value.split(',');
}
});

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

@ -137,7 +137,9 @@
</div>
<!-- Displayed Fields Dropdown -->
<div class="search-control-item">
<div
v-if="!isOnTheme || registeredViewModes[viewMode].dynamic_metadata"
class="search-control-item">
<b-dropdown
ref="displayedFieldsDropdown"
:mobile-modal="false"
@ -178,24 +180,19 @@
<b-field>
<b-dropdown
@change="onChangeViewMode($event)"
:value="viewMode">
:mobile-modal="false">
<button
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_view_mode') }}</span>
<b-icon icon="menu-down" />
</button>
<b-dropdown-item :value="'table'">
<b-icon icon="table"/>
Table
</b-dropdown-item>
<b-dropdown-item :value="'cards'">
<b-icon icon="view-list"/>
Cards
</b-dropdown-item>
<b-dropdown-item :value="'grid'">
<b-icon icon="view-grid"/>
Grid
<b-dropdown-item
v-for="(viewMode, index) of enabledViewModes"
:key="index"
:value="viewMode">
<span v-html="registeredViewModes[viewMode].icon" />
{{ registeredViewModes[viewMode].label }}
</b-dropdown-item>
</b-dropdown>
</b-field>
@ -309,7 +306,7 @@
</section>
<!-- Pagination -->
<pagination v-if="totalItems > 0"/>
<pagination v-if="totalItems > 0 && (!isOnTheme || registeredViewModes[viewMode].show_pagination)"/>
</div>
</div>
@ -343,7 +340,9 @@
}
},
props: {
collectionId: Number
collectionId: Number,
defaultViewMode: String, // Used only on theme
enabledViewModes: Object // Used only on theme
},
computed: {
items() {
@ -571,8 +570,8 @@
},
mounted() {
this.prepareFieldsAndFilters();
this.prepareFieldsAndFilters();
this.localTableFields = JSON.parse(JSON.stringify(this.tableFields));
// Watch Scroll for shrinking header, only on Admin at collection level

2
src/admin/tainacan-admin-i18n.php
View File

@ -194,6 +194,8 @@ return [
'label_created_by' => __( 'Created by', 'tainacan' ),
'label_apply_changes' => __( 'Apply changes', 'tainacan' ),
'label_view_mode' => __( 'View mode', 'tainacan' ),
'label_default_view_mode' => __( 'Default view mode', 'tainacan' ),
'label_enabled_view_modes' => __( 'Enabled view modes', 'tainacan' ),
// Instructions. More complex sentences to guide user and placeholders
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),

2
src/admin/theme-items-list.vue
View File

@ -1,6 +1,8 @@
<template>
<items-page
class="theme-items-list"
:enabled-view-modes="$root.enabledViewModes"
:default-view-mode="$root.defaultViewMode"
:collection-id="$root.collectionId" />
</template>

2
src/classes/repositories/class-tainacan-collections.php
View File

@ -133,7 +133,7 @@ class Collections extends Repository {
'enabled_view_modes' => [
'map' => 'meta',
'title' => __( 'Enabled view modes', 'tainacan' ),
'type' => 'string',
'type' => 'array',
'description' => __( 'Which visualization modes will be available for the public to choose from', 'tainacan' ),
'default' => [],
//'validation' => v::stringType(),

19
src/js/store/modules/collection/actions.js
View File

@ -127,7 +127,18 @@ export const deleteCollection = ({ commit }, { collectionId, isPermanently }) =>
});
}
export const updateCollection = ({ commit }, { collection_id, name, description, slug, status, enable_cover_page, cover_page_id, moderators_ids, parent }) => {
export const updateCollection = ({ commit }, {
collection_id,
name,
description,
slug,
status,
enable_cover_page,
cover_page_id,
moderators_ids,
parent,
enabled_view_modes
}) => {
return new Promise((resolve, reject) => {
axios.tainacan.patch('/collections/' + collection_id, {
name: name,
@ -137,7 +148,8 @@ export const updateCollection = ({ commit }, { collection_id, name, description,
cover_page_id: "" + cover_page_id,
enable_cover_page: enable_cover_page,
moderators_ids: moderators_ids,
parent: parent
parent: parent,
enabled_view_modes: enabled_view_modes
}).then( res => {
commit('setCollection', {
id: collection_id,
@ -148,7 +160,8 @@ export const updateCollection = ({ commit }, { collection_id, name, description,
enable_cover_page: enable_cover_page,
cover_page_id: cover_page_id,
moderators_ids: moderators_ids,
parent: parent
parent: parent,
enabled_view_modes: enabled_view_modes
});
resolve( res.data );
}).catch( error => {