Adaptation aux modifications du service jama : id unique à la place du hash + ... (243b3041) · Commits · certic / Vue Jama

src/components/JamaUploadView.vue

+35 −51

Original line number	Diff line number	Diff line
		@@ -3,16 +3,16 @@
		<div ref="rootView">
		<div v-if="!isUploading">
		<template v-if="Object.keys(uncompletedUploads).length > 0">
		<v-btn
		class="mr-2"
		small
		fab
		color="blue"
		title="Mettre à jour la liste"
		@click="updateUncompleteUploads()"
		>
		<v-icon>mdi-refresh</v-icon>
		</v-btn>
		<!-- <v-btn-->
		<!-- class="mr-2"-->
		<!-- small-->
		<!-- fab-->
		<!-- color="blue"-->
		<!-- title="Mettre à jour la liste"-->
		<!-- @click="updateUncompleteUploads()"-->
		<!-- >-->
		<!-- <v-icon>mdi-refresh</v-icon>-->
		<!-- </v-btn>-->
		<v-btn
		small
		fab
		@@ -47,8 +47,8 @@
		</v-container>
		<v-list v-if="!isUploading">
		<v-list-item
		v-for="(upload, hash) in uncompletedUploads"
		:key="'uncomplete-'+hash"
		v-for="(upload, id) in uncompletedUploads"
		:key="'uncomplete-'+id"
		>
		<v-row>
		<v-col cols="6">
		@@ -58,15 +58,15 @@
		<v-btn
		small
		class="ml-5"
		@click="resumeSelectFile('resume-input-'+hash)"
		@click="resumeSelectFile('resume-input-'+id)"
		>
		Reprendre
		</v-btn>
		<input
		:id="'resume-input-'+hash"
		:id="'resume-input-'+id"
		type="file"
		style="display: none"
		@change="resume('resume-input-'+hash, upload)"
		@change="resume('resume-input-'+id, upload)"
		>
		</v-col>
		</v-row>
		@@ -80,8 +80,9 @@

		import {upload_events} from '../utils/JamaClient';

		const JAMA_LSTORAGE_INCOMPLETED_KEY = 'jama_uncompleted_upload';

		import {mapGetters} from "vuex";
		import Misc from "../utils/Misc";

		export default {
		name: "JamaUploadView",
		@@ -91,7 +92,7 @@ export default {
		return {
		isExpanded: false,
		isUploading: false,
		uncompletedUploads: {},
		//uncompletedUploads: {},
		progressMessage: '',
		progressValue: 0,
		maxProgressValue: 0,
		@@ -102,16 +103,21 @@ export default {
		},

		computed: {
		...mapGetters(["currentProjectId"])
		},
		...mapGetters(["currentProjectId"]),

		beforeMount() {
		window.onbeforeunload = () => {
		localStorage.setItem(JAMA_LSTORAGE_INCOMPLETED_KEY, JSON.stringify(this.uncompletedUploads));
		this.updateUncompleteUploads();
		uncompletedUploads(){
		return this.$store.getters['localStorageStore/uploads']
		}
		},

		// beforeMount() {
		// window.onbeforeunload = () => {
		//
		// //localStorage.setItem(JAMA_LSTORAGE_INCOMPLETED_KEY, JSON.stringify(this.uncompletedUploads));
		// //this.updateUncompleteUploads();
		// }
		// },

		mounted() {
		//listening upload events
		this.$refs.rootView.addEventListener(upload_events.start_upload_event, (e) => this.startUploadEvent(e));
		@@ -122,14 +128,6 @@ export default {
		this.$refs.rootView.addEventListener(upload_events.chunk_uploaded_event, (e) => this.chunkUploadEvent(e));
		this.$jamaClient.addListener(this.$refs.rootView);


		try {
		this.uncompletedUploads = localStorage.getItem(JAMA_LSTORAGE_INCOMPLETED_KEY) ?
		JSON.parse(localStorage.getItem(JAMA_LSTORAGE_INCOMPLETED_KEY)) : {};
		} catch (e) {
		//bad format.
		console.log('bad local storage value for ', JAMA_LSTORAGE_INCOMPLETED_KEY)
		}
		},

		methods: {
		@@ -153,21 +151,18 @@ export default {
		this.maxProgressValue = Number(e.detail.nb_chunks);
		let upload = e.detail;
		upload.available_chunks = [];//unknown here
		this.uncompletedUploads[e.detail.hash] = upload;
		this.$store.commit('localStorageStore/updateUpload', upload);
		},

		endFileUploadEvent(e) {
		this.done ++;
		if(e.detail.ok){
		this.$alertInfo(e.detail.message);
		this.$store.commit('localStorageStore/removeUploadById', e.detail.id);
		}
		else {
		this.$alertError(e.detail.message);
		}
		if(e.detail.status === 'available') {
		delete this.uncompletedUploads[e.detail.hash];
		localStorage.setItem(JAMA_LSTORAGE_INCOMPLETED_KEY, JSON.stringify(this.uncompletedUploads));
		}
		this.progressValue = 0;
		this.progressMessage="";
		this.$forceUpdate();
		@@ -176,7 +171,8 @@ export default {
		chunkUploadEvent(e) {
		this.progressMessage = e.detail.name;
		this.progressValue++;
		this.uncompletedUploads[e.detail.hash]['available_chunks'].push(e.detail.chunk);
		const chunkName = e.detail.nb_chunks + '-' + Misc.lpad(Number(e.detail.chunk) + 1, e.detail.nb_chunks.toString().length) + '.part';
		this.$store.commit('localStorageStore/updateUploadChunks', {id : e.detail.id, chunk :chunkName})
		},

		resumeUploadEvent() {
		@@ -188,28 +184,16 @@ export default {
		},

		resume(inputId, upload) {
		console.log(inputId, upload);
		this.progressValue = upload.available_chunks.length;
		this.maxProgressValue = Number(upload.nb_chunks);
		this.$emit('resume-resource-upload', upload, document.getElementById(inputId).files[0])
		},

		empty() {
		this.uncompletedUploads = {};
		this.$store.commit('localStorageStore/clearUploads');
		},

		async updateUncompleteUploads() {
		let hashes =Object.keys(this.uncompletedUploads);
		for(let i = hashes.length -1 ; i >=0 ;i--){
		let hash = hashes[i];
		let statusInfos = await this.$jamaClient.uploadInfos(hash, this.uncompletedUploads[hash].project);
		if(statusInfos.status === 'available'){
		delete this.uncompletedUploads[hash];
		}
		localStorage.setItem(JAMA_LSTORAGE_INCOMPLETED_KEY, JSON.stringify(this.uncompletedUploads));
		this.$forceUpdate();
		}

		}
		}
		}
		</script>

src/components/VueJama.vue

+18 −19

Original line number	Diff line number	Diff line
		@@ -173,8 +173,8 @@
		>
		<v-row class="ma-0 mt-2 d-flex justify-center align-center">
		<slot
		v-if="$store.getters['preferencesStore/isMosaicView']
		\|\| $store.getters['preferencesStore/isListView'] "
		v-if="$store.getters['localStorageStore/isMosaicView']
		\|\| $store.getters['localStorageStore/isListView'] "
		name="filter"
		>
		<jama-filter @filter-changed="reloadCurrentCollection" />
		@@ -185,7 +185,7 @@


		<jama-items-mosaic
		v-if="$store.getters['preferencesStore/isMosaicView']"
		v-if="$store.getters['localStorageStore/isMosaicView']"
		:dnd="!searchMode"
		@items-moved="reloadCurrentCollection"
		@about-selected="aboutResource"
		@@ -197,7 +197,7 @@
		@resource-dropped="resourceDropped"
		/>
		<jama-items-list
		v-else-if="$store.getters['preferencesStore/isListView']"
		v-else-if="$store.getters['localStorageStore/isListView']"
		@sort-options-changed="reloadCurrentCollection"
		@items-moved="reloadCurrentCollection"
		@collection-selected="loadCollection"
		@@ -533,20 +533,20 @@ export default {
		//mosaic / list / fullscreen
		viewMode: {
		get: function () {
		return this.$store.getters['preferencesStore/view'];
		return this.$store.getters['localStorageStore/view'];
		},
		set: function (val) {
		this.$store.commit('preferencesStore/setView', val);
		this.$store.commit('localStorageStore/setView', val);
		}
		},

		//left side tree nav draw
		treeDrawer: {
		get: function () {
		return this.$store.getters['preferencesStore/treeDrawer'];
		return this.$store.getters['localStorageStore/treeDrawer'];
		},
		set: function (val) {
		this.$store.commit('preferencesStore/setTreeDrawer', val);
		this.$store.commit('localStorageStore/setTreeDrawer', val);
		}
		},

		@@ -562,7 +562,7 @@ export default {
		"currentResource",
		"permissions",
		"projectsUserPermissions",
		// "preferencesStore/view",
		// "localStorageStore/view",
		"isPickerMode"])
		},

		@@ -673,8 +673,8 @@ export default {
		this.loading = true;
		if (!this.trashMode) {
		EventBus.$emit('set-mode', RESOURCES_MODE);
		if (this.$store.getters['preferencesStore/isFullscreenView'])
		await this.$store.dispatch('preferencesStore/resetView');
		if (this.$store.getters['localStorageStore/isFullscreenView'])
		await this.$store.dispatch('localStorageStore/resetView');
		//this.viewMode = MOSAIC;
		}
		this.$store.commit('setCurrentResource', null);
		@@ -750,10 +750,11 @@ export default {
		/add image from input - no drag and drop/
		async uploadSelectedResources(files) {
		await this.manageFilesUpload(files);
		this.reloadCurrentCollection();
		this.$store.dispatch('fetchCollectionTree', this.currentCollection.id);
		},

		async manageFilesUpload(files) {
		console.log("MANAGE FILE UPLOAD START", this.currentCollection);
		this.loading = true;
		await this.$store.dispatch('manageFilesUpload', {
		files: files,
		@@ -761,9 +762,6 @@ export default {
		projectId: this.currentProjectId
		});
		this.loading = false;
		console.log("MANAGE FILE UPLOAD END", this.currentCollection);
		this.reloadCurrentCollection();
		this.$store.dispatch('fetchCollectionTree', this.currentCollection.id);
		},

		reloadCurrentCollection() {
		@@ -812,14 +810,15 @@ export default {
		this.$store.commit('setCurrentResource', resource)
		},

		resourceDropped(e) {
		async resourceDropped(e) {
		let items = e.dataTransfer.items;
		for (let i = 0; i < items.length; i += 1) {
		let ddr = new DirectoryDropReader(this.currentCollection ? ALL_MODE : FOLDERS_ONLY_MODE);
		ddr.traverse(items[i].webkitGetAsEntry()).then(() => {
		this.manageFilesUpload(ddr.getFiles());
		});
		await ddr.traverse(items[i].webkitGetAsEntry());
		await this.manageFilesUpload(ddr.getFiles());
		}
		this.reloadCurrentCollection();
		this.$store.dispatch('fetchCollectionTree', this.currentCollection.id);
		},

src/components/viewers/ImageResourceViewer.vue

+29 −1

Original line number	Diff line number	Diff line
		@@ -39,7 +39,10 @@ export default {
		return {
		viewer: null,
		loading: false,
		tiledSources: []
		tiledSources: [],
		maxFetchTrials : 5,
		currentTrials: 0,
		pollInterval: null,
		}
		},

		@@ -68,6 +71,26 @@ export default {
		this.tiledSources = this.resource.urls.iiif;
		},

		pollImage(){
		this.currentTrials = 0;
		this.pollInterval = setInterval(() => {
		console.info('try to fetch image')
		fetch(this.tiledSources[0]).then((response) => {
		if(response.ok){
		clearInterval(this.pollInterval);
		this.updateImageViewer();
		}
		else {
		if (!response.ok) {
		this.currentTrials++;
		}
		if (this.currentTrials === this.maxFetchTrials)
		clearInterval(this.pollInterval);
		}
		})
		},1000)
		},

		updateImageViewer() {
		this.loading = true;
		if (this.resource.urls.iiif.length > 0) {
		@@ -89,11 +112,16 @@ export default {
		// prefixUrl: "./assets/openseadragon/images/",
		tileSources: this.tiledSources,
		sequenceMode: this.tiledSources.length > 1,
		})
		this.viewer.addHandler('open-failed', () => {
		//image might not be ready
		this.pollImage();
		});
		this.viewer.addHandler('open', () => {
		this.loading = false;
		})


		})

		}

src/store/JamaStore.js

+5 −3

Original line number	Diff line number	Diff line
		@@ -41,7 +41,7 @@ function findItem(id, items = null) {
		}, null);
		}

		import preferencesStore from './preferencesStore';
		import localStorageStore from './localStorageStore';

		export default new Vuex.Store({
		state: {
		@@ -71,7 +71,8 @@ export default new Vuex.Store({
		order: ASC_SORT,
		type: 'title'
		},
		multiSelectActionAddons: []
		multiSelectActionAddons: [],
		uploads : [],

		},

		@@ -100,6 +101,7 @@ export default new Vuex.Store({
		currentStats: state => state.currentStats,
		filter: state => state.filter,
		multiSelectActionAddons: state => state.multiSelectActionAddons,
		uploads : state => state.uploads
		},
		mutations: {

		@@ -530,6 +532,6 @@ export default new Vuex.Store({

		},
		modules: {
		preferencesStore: preferencesStore
		localStorageStore: localStorageStore
		}
		})
		No newline at end of file

src/store/preferencesStore.js→src/store/localStorageStore.js

+40 −5

Original line number	Diff line number	Diff line
		@@ -3,7 +3,7 @@ const FULLSCREEN = 1;
		const LIST = 2;
		const LOCAL_STORAGE_APP_ID = 'vue-jama';

		const preferencesStore = {
		const localStorageStore = {
		namespaced: true,
		state: () => ({
		view: localStorage.getItem(LOCAL_STORAGE_APP_ID + '.view')
		@@ -12,14 +12,19 @@ const preferencesStore = {

		treeDrawer: localStorage.getItem(LOCAL_STORAGE_APP_ID + '.treeDrawer')
		? localStorage.getItem(LOCAL_STORAGE_APP_ID + '.treeDrawer') === 'true'
		: true
		: true,
		uploads: localStorage.getItem(LOCAL_STORAGE_APP_ID + '.uploads')
		? JSON.parse(localStorage.getItem(LOCAL_STORAGE_APP_ID + '.uploads'))
		: {}

		}),
		getters: {
		isFullscreenView: state => state.view === FULLSCREEN,
		isMosaicView: state => state.view === MOSAIC,
		isListView: state => state.view === LIST,
		view: state => state.view,
		treeDrawer : state => state.treeDrawer
		treeDrawer: state => state.treeDrawer,
		uploads: state => state.uploads
		},
		mutations: {
		setView: (state, vm) => {
		@@ -32,12 +37,42 @@ const preferencesStore = {
		localStorage.setItem(LOCAL_STORAGE_APP_ID + '.treeDrawer', b);
		},

		updateUpload: (state, upload) => {
		let uploads = state.uploads;
		uploads[upload.id] = {...uploads[upload.id], ...upload};
		state.uploads = {...uploads};
		localStorage.setItem(LOCAL_STORAGE_APP_ID + '.uploads', JSON.stringify(state.uploads));
		},

		updateUploadChunks: (state, {id, chunk}) => {
		let uploads = state.uploads;
		let upload = uploads[id];
		upload.available_chunks.push(chunk);
		uploads[upload.id] = {...uploads[upload.id], ...upload};
		state.uploads = {...uploads};
		localStorage.setItem(LOCAL_STORAGE_APP_ID + '.uploads', JSON.stringify(state.uploads));
		},

		removeUploadById(state, uploadId) {
		console.log('removing upload because completed ', uploadId)
		delete state.uploads[uploadId];
		// let uploads = state.uploads.filter((u) => u.id !== uploadId);
		// state.uploads = {...uploads};
		localStorage.setItem(LOCAL_STORAGE_APP_ID + '.uploads', JSON.stringify(state.uploads));
		},

		clearUploads(state) {
		state.uploads = {};
		localStorage.setItem(LOCAL_STORAGE_APP_ID + '.uploads', JSON.stringify(state.uploads));
		},

		},
		actions: {
		resetView(context) {
		context.commit('setView', MOSAIC)
		}
		},

		}
		}

		export default preferencesStore
		No newline at end of file
		export default localStorageStore
		No newline at end of file