gestion pagination viewer seadragon (f87dec16) · Commits · certic / Vue Jama

src/components/JamaCollectionSeadragon.vue

+117 −96

Original line number	Diff line number	Diff line
		@@ -57,6 +57,7 @@ export default {
		collection: {type: Object, default: null},
		resources: {type: Array, default: null},
		page: {type: Number, default: 0},
		nbPages: {type: Number, default: 1},
		defaultResourceIndex: {
		type: Number,
		default: 0
		@@ -78,11 +79,23 @@ export default {
		collection() {
		this.updateViewerImages();
		},
		page() {

		// page() {
		// this.updateViewerImages();
		// },

		resources(newResources, oldResources){
		if(newResources[0].id !== oldResources[0].id) {
		this.updateViewerImages();
		}
		},

		defaultResourceIndex(newIndex, oldIndex){
		if(newIndex !== oldIndex && newIndex !== this.viewer.currentPage())
		this.viewer.goToPage(this.defaultResourceIndex);
		}
		},

		mounted() {
		let tiledSources = this.resources.map(r => r.urls.iiif);
		this.viewer = OpenSeadragon({
		@@ -126,9 +139,9 @@ export default {
		if (document.querySelector('.v-dialog.v-dialog--active'))
		return;
		if (e.key === 'ArrowRight') {
		this.viewer.goToPage(this.viewer.currentPage() + 1)
		this.nextResource()
		} else if (e.key === 'ArrowLeft') {
		this.viewer.goToPage(this.viewer.currentPage() - 1)
		this.previousResource()
		}
		}

		@@ -145,14 +158,22 @@ export default {
		},
		updateViewerImages() {
		let tiledSources = this.resources.map(r => r.urls.iiif);
		this.viewer.close();
		this.viewer.open(tiledSources);
		},

		previousResource() {
		if (this.viewer.currentPage() - 1 === -1) {
		this.$emit('page-before');
		//this.viewer.goToPage(this.resources.length);
		} else
		this.viewer.goToPage(this.viewer.currentPage() - 1);
		},

		nextResource() {
		if (this.viewer.currentPage() + 1 === this.resources.length) {
		this.$emit('page-after')
		} else
		this.viewer.goToPage(this.viewer.currentPage() + 1);
		}
		}

src/components/VueJama.vue

+518 −497

Original line number	Diff line number	Diff line
		@@ -209,7 +209,10 @@
		:resources="resources"
		:default-resource-index="currentResourceIndex"
		:page="currentPage"
		:nb-pages="nbPages"
		@resource-selected="resourceSelected"
		@page-after="tryNextPage()"
		@page-before="tryPreviousPage()"
		/>

		<v-col
		@@ -450,7 +453,7 @@ export default {
		metaMode: false,
		propertiesMode: false,
		currentPage: 1,
		pageLength: 50,
		pageLength: 5,
		hiddenRightPanel: false,
		rightPaneMaximized: false,
		rootCollectionInfos: null,//usefull for root coll pagination
		@@ -591,8 +594,7 @@ export default {
		this.fetchPermissions().then((r) => {
		if (r) {
		this.fetchUserPermissions().then(() => this.initJamaPermissions())
		}
		else{
		} else {
		alert('Une erreur est survenue. Service indisponible.');
		}
		})
		@@ -638,8 +640,9 @@ export default {
		if (target) {
		try {
		document.querySelector('#jama-resource-tile-' + target.id).click();
		} catch (e) {
		return false
		}
		catch(e){return false}
		}
		}

		@@ -699,8 +702,7 @@ export default {
		).then(() => {
		this.loading = false
		});
		}
		catch(e){
		} catch (e) {
		alert("Une erreur est survenue. Service indisponible.")
		}
		},
		@@ -887,7 +889,7 @@ export default {
		},

		//pagination
		async gotoPage() {
		async gotoPage(selectedIndex = -1) {
		let start = (this.currentPage - 1) * this.pageLength;
		let end = start + this.pageLength;
		this.loading = true;
		@@ -900,10 +902,29 @@ export default {
		limitTo: end
		}
		).then(() => {
		this.loading = false
		this.loading = false;
		if(selectedIndex > -1)
		this.resourceSelected(this.resources[selectedIndex])
		// if(lastItemSelect){
		// this.$store.commit('setCurrentResource', this.resources[this.resources.length - 1])
		// }

		});

		},
		tryNextPage() {
		if(this.currentPage < this.nbPages){
		this.currentPage++;
		this.gotoPage(0);
		}
		},

		tryPreviousPage() {
		if(this.currentPage > 1){
		this.currentPage--;
		this.gotoPage(this.resources.length-1);
		}
		}


		}