colgora/Mangarr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: simplification du store de lecteur en supprimant les logs de débogage et en optimisant les getters pour une meilleure lisibilité

Browse Source
This commit is contained in:
ext.jeremy.guillot@maxicoffee.domains
2025-03-26 23:08:12 +01:00
parent 5e0fc96cd1
commit d123166dcb
2 changed files with 3 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
assets/vue/app/domain/reader/application/store/readerStore.js
View File

@@ -12,70 +12,39 @@ export const useReaderStore = defineStore('reader', {
isLoading: false, isLoading: false,
error: null, error: null,
pages: [], pages: [],
totalPages: 0, totalPages: 0
_debug: {
lastUpdate: Date.now(),
lastAction: null
}
}), }),
getters: { getters: {
isFirstPage: state => state.currentPage === 0, isFirstPage: state => state.currentPage === 0,
isLastPage: state => state.currentPage === state.totalPages - 1, isLastPage: state => state.currentPage === state.totalPages - 1,
currentPageData: state => { currentPageData: state => state.pages[state.currentPage]
const data = state.pages[state.currentPage];
console.log('Getting currentPageData:', {
currentPage: state.currentPage,
hasData: !!data,
totalPages: state.totalPages,
pagesLength: state.pages.length,
lastUpdate: state._debug.lastUpdate,
lastAction: state._debug.lastAction
});
return data;
}
}, },
actions: { actions: {
async loadChapter(chapterId) { async loadChapter(chapterId) {
console.log('Loading chapter:', chapterId);
this.isLoading = true; this.isLoading = true;
this.error = null; this.error = null;
this._debug.lastAction = 'loadChapter';
try { try {
const repository = new ApiChapterRepository(); const repository = new ApiChapterRepository();
// Charger les informations du chapitre // Charger les informations du chapitre
console.log('Fetching chapter info...');
const chapterData = await repository.getChapter(chapterId); const chapterData = await repository.getChapter(chapterId);
console.log('Chapter data received:', chapterData);
this.currentChapter = Chapter.create(chapterData); this.currentChapter = Chapter.create(chapterData);
// Charger la liste des pages // Charger la liste des pages
console.log('Fetching pages info...');
const pagesData = await repository.getChapterPages(chapterId); const pagesData = await repository.getChapterPages(chapterId);
console.log('Pages data received:', pagesData);
// Initialiser le tableau avec des placeholders // Initialiser le tableau avec des placeholders
this.pages = new Array(pagesData.totalItems).fill(null); this.pages = new Array(pagesData.totalItems).fill(null);
this.totalPages = pagesData.totalItems; this.totalPages = pagesData.totalItems;
this._debug.lastUpdate = Date.now();
console.log('Pages array initialized:', {
length: this.pages.length,
totalPages: this.totalPages
});
// Charger la première page // Charger la première page
if (this.totalPages > 0) { if (this.totalPages > 0) {
console.log('Loading first page...');
this.currentPage = 0; this.currentPage = 0;
await this.loadCurrentPageData(); await this.loadCurrentPageData();
} else {
console.warn('No pages available for this chapter');
} }
} catch (error) { } catch (error) {
console.error('Error loading chapter:', error);
this.error = error.message; this.error = error.message;
} finally { } finally {
this.isLoading = false; this.isLoading = false;
@@ -84,38 +53,24 @@ export const useReaderStore = defineStore('reader', {
async loadCurrentPageData() { async loadCurrentPageData() {
if (!this.currentChapter) { if (!this.currentChapter) {
console.error('No current chapter loaded');
return; return;
} }
if (this.currentPage < 0 || this.currentPage >= this.totalPages) { if (this.currentPage < 0 || this.currentPage >= this.totalPages) {
console.error('Invalid page index:', this.currentPage);
return; return;
} }
const pageNumber = this.currentPage + 1; // Convertir en 1-based pour l'API const pageNumber = this.currentPage + 1; // Convertir en 1-based pour l'API
console.log('Loading page data:', {
pageNumber,
chapterId: this.currentChapter.id
});
if (this.pages[this.currentPage]?.base64Content) { if (this.pages[this.currentPage]?.base64Content) {
console.log('Page already loaded, skipping fetch');
return; return;
} }
this.isLoading = true; this.isLoading = true;
this.error = null; this.error = null;
this._debug.lastAction = 'loadCurrentPageData';
try { try {
const repository = new ApiChapterRepository(); const repository = new ApiChapterRepository();
console.log('Fetching page from API...');
const pageData = await repository.getChapterPage(this.currentChapter.id, pageNumber); const pageData = await repository.getChapterPage(this.currentChapter.id, pageNumber);
console.log('Page data received:', {
hasContent: !!pageData?.base64Content,
mimeType: pageData?.mimeType,
pageNumber: pageData?.pageNumber
});
// Vérifier que les données sont valides // Vérifier que les données sont valides
if (!pageData || !pageData.base64Content) { if (!pageData || !pageData.base64Content) {
@@ -132,14 +87,7 @@ export const useReaderStore = defineStore('reader', {
dimensions: pageData.dimensions dimensions: pageData.dimensions
}; };
this.pages = newPages; this.pages = newPages;
this._debug.lastUpdate = Date.now();
console.log('Page data updated in store:', {
pageIndex: this.currentPage,
hasContent: !!this.pages[this.currentPage]?.base64Content
});
} catch (error) { } catch (error) {
console.error('Error loading page:', error);
this.error = error.message; this.error = error.message;
} finally { } finally {
this.isLoading = false; this.isLoading = false;
@@ -148,40 +96,28 @@ export const useReaderStore = defineStore('reader', {
async nextPage() { async nextPage() {
if (!this.isLastPage) { if (!this.isLastPage) {
console.log('Moving to next page');
this.currentPage++; this.currentPage++;
this._debug.lastAction = 'nextPage';
this._debug.lastUpdate = Date.now();
await this.loadCurrentPageData(); await this.loadCurrentPageData();
} }
}, },
async previousPage() { async previousPage() {
if (!this.isFirstPage) { if (!this.isFirstPage) {
console.log('Moving to previous page');
this.currentPage--; this.currentPage--;
this._debug.lastAction = 'previousPage';
this._debug.lastUpdate = Date.now();
await this.loadCurrentPageData(); await this.loadCurrentPageData();
} }
}, },
setReadingMode(mode) { setReadingMode(mode) {
this.readingMode = mode; this.readingMode = mode;
this._debug.lastAction = 'setReadingMode';
this._debug.lastUpdate = Date.now();
}, },
setReadingDirection(direction) { setReadingDirection(direction) {
this.readingDirection = direction; this.readingDirection = direction;
this._debug.lastAction = 'setReadingDirection';
this._debug.lastUpdate = Date.now();
}, },
setZoom(level) { setZoom(level) {
this.zoom = level; this.zoom = level;
this._debug.lastAction = 'setZoom';
this._debug.lastUpdate = Date.now();
} }
} }
}); });

46
assets/vue/app/domain/reader/presentation/components/ChapterReader.vue
View File

@@ -22,13 +22,7 @@
<div class="page-container" :style="{ transform: `scale(${store.zoom})` }"> <div class="page-container" :style="{ transform: `scale(${store.zoom})` }">
<div v-if="!store.currentPageData" class="error"> Aucune donnée d'image disponible </div> <div v-if="!store.currentPageData" class="error"> Aucune donnée d'image disponible </div>
<div v-else-if="!store.currentPageData.base64Content" class="error"> Contenu de l'image manquant </div> <div v-else-if="!store.currentPageData.base64Content" class="error"> Contenu de l'image manquant </div>
<img <img v-else :src="imageSource" :alt="`Page ${store.currentPage + 1}`" class="page-image" />
v-else
:src="imageSource"
:alt="`Page ${store.currentPage + 1}`"
class="page-image"
@error="handleImageError"
@load="handleImageLoad" />
</div> </div>
<div class="reader-settings"> <div class="reader-settings">
@@ -44,26 +38,6 @@
<button @click="zoomIn">+</button> <button @click="zoomIn">+</button>
</div> </div>
</div> </div>
<div
class="debug-info"
style="
position: fixed;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.8);
color: white;
padding: 10px;
font-size: 12px;
">
currentPage: {{ store.currentPage }}<br />
totalPages: {{ store.totalPages }}<br />
hasCurrentPageData: {{ !!store.currentPageData }}<br />
hasBase64Content: {{ !!store.currentPageData?.base64Content }}<br />
mimeType: {{ store.currentPageData?.mimeType }}<br />
lastAction: {{ store._debug.lastAction }}<br />
lastUpdate: {{ new Date(store._debug.lastUpdate).toLocaleTimeString() }}
</div>
</div> </div>
</div> </div>
</template> </template>
@@ -83,29 +57,12 @@
const store = useReaderStore(); const store = useReaderStore();
const imageSource = computed(() => { const imageSource = computed(() => {
console.log('Computing imageSource:', {
hasCurrentPageData: !!store.currentPageData,
mimeType: store.currentPageData?.mimeType,
hasContent: !!store.currentPageData?.base64Content
});
if (!store.currentPageData?.base64Content || !store.currentPageData?.mimeType) { if (!store.currentPageData?.base64Content || !store.currentPageData?.mimeType) {
console.error("Données d'image invalides:", store.currentPageData);
return ''; return '';
} }
return `data:${store.currentPageData.mimeType};base64,${store.currentPageData.base64Content}`; return `data:${store.currentPageData.mimeType};base64,${store.currentPageData.base64Content}`;
}); });
const handleImageError = e => {
console.error("Erreur de chargement de l'image:", e);
console.log("Source de l'image:", imageSource.value);
console.log('Données de la page:', store.currentPageData);
};
const handleImageLoad = () => {
console.log('Image chargée avec succès');
};
const toggleReadingMode = () => { const toggleReadingMode = () => {
store.setReadingMode(store.readingMode === 'single' ? 'infinite' : 'single'); store.setReadingMode(store.readingMode === 'single' ? 'infinite' : 'single');
}; };
@@ -134,7 +91,6 @@
() => props.chapterId, () => props.chapterId,
newId => { newId => {
if (newId) { if (newId) {
console.log('ChapterId changed, loading new chapter:', newId);
store.loadChapter(newId); store.loadChapter(newId);
} }
}, },