mirror of
https://github.com/Alvin-Zilverstand/Challenge_15_Magazijn_App_Maken.git
synced 2026-03-06 13:22:35 +01:00
changes
This commit is contained in:
@@ -170,6 +170,7 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
<script src="js/debug-helper.js"></script>
|
||||||
<script src="js/translations.js"></script>
|
<script src="js/translations.js"></script>
|
||||||
<script src="js/admin.js"></script>
|
<script src="js/admin.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
@@ -77,11 +77,19 @@ function getFilteredItems() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return items.filter(item => {
|
return items.filter(item => {
|
||||||
if (window.translationManager) {
|
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
|
||||||
const localizedItem = window.translationManager.getLocalizedItem(item);
|
if (translationManager) {
|
||||||
|
const localizedItem = translationManager.getLocalizedItem(item);
|
||||||
return localizedItem.name.toLowerCase().includes(searchTerm) ||
|
return localizedItem.name.toLowerCase().includes(searchTerm) ||
|
||||||
(localizedItem.description && localizedItem.description.toLowerCase().includes(searchTerm)) ||
|
(localizedItem.description && localizedItem.description.toLowerCase().includes(searchTerm)) ||
|
||||||
item.location.toLowerCase().includes(searchTerm);
|
item.location.toLowerCase().includes(searchTerm);
|
||||||
|
} else if (window.getItemDisplayText) {
|
||||||
|
const currentLang = localStorage.getItem('language') || 'nl';
|
||||||
|
const name = window.getItemDisplayText(item, 'name', currentLang);
|
||||||
|
const description = window.getItemDisplayText(item, 'description', currentLang);
|
||||||
|
return name.toLowerCase().includes(searchTerm) ||
|
||||||
|
description.toLowerCase().includes(searchTerm) ||
|
||||||
|
item.location.toLowerCase().includes(searchTerm);
|
||||||
} else {
|
} else {
|
||||||
// Fallback for when translation manager isn't loaded yet (default to Dutch)
|
// Fallback for when translation manager isn't loaded yet (default to Dutch)
|
||||||
const name = item.name?.nl || item.name?.en || item.name || '';
|
const name = item.name?.nl || item.name?.en || item.name || '';
|
||||||
@@ -110,10 +118,28 @@ function displayGridView() {
|
|||||||
|
|
||||||
const filteredItems = getFilteredItems();
|
const filteredItems = getFilteredItems();
|
||||||
itemsGrid.innerHTML = filteredItems.map(item => {
|
itemsGrid.innerHTML = filteredItems.map(item => {
|
||||||
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
|
// Use multiple fallback strategies
|
||||||
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
|
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
|
||||||
description: item.description?.nl || item.description?.en || item.description || ''
|
let localizedItem;
|
||||||
};
|
|
||||||
|
if (translationManager) {
|
||||||
|
localizedItem = translationManager.getLocalizedItem(item);
|
||||||
|
} else if (window.getItemDisplayText) {
|
||||||
|
// Use debug helper fallback
|
||||||
|
const currentLang = localStorage.getItem('language') || 'nl';
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: window.getItemDisplayText(item, 'name', currentLang),
|
||||||
|
description: window.getItemDisplayText(item, 'description', currentLang)
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
// Final fallback
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: (typeof item.name === 'object') ? (item.name?.nl || item.name?.en || 'Onbekend Artikel') : (item.name || 'Onbekend Artikel'),
|
||||||
|
description: (typeof item.description === 'object') ? (item.description?.nl || item.description?.en || 'Geen beschrijving beschikbaar') : (item.description || 'Geen beschrijving beschikbaar')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<div class="col-md-4 col-lg-3">
|
<div class="col-md-4 col-lg-3">
|
||||||
@@ -146,10 +172,28 @@ function displayListView() {
|
|||||||
const itemsListBody = document.getElementById('itemsListBody');
|
const itemsListBody = document.getElementById('itemsListBody');
|
||||||
const filteredItems = getFilteredItems();
|
const filteredItems = getFilteredItems();
|
||||||
itemsListBody.innerHTML = filteredItems.map(item => {
|
itemsListBody.innerHTML = filteredItems.map(item => {
|
||||||
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
|
// Use multiple fallback strategies
|
||||||
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
|
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
|
||||||
description: item.description?.nl || item.description?.en || item.description || ''
|
let localizedItem;
|
||||||
};
|
|
||||||
|
if (translationManager) {
|
||||||
|
localizedItem = translationManager.getLocalizedItem(item);
|
||||||
|
} else if (window.getItemDisplayText) {
|
||||||
|
// Use debug helper fallback
|
||||||
|
const currentLang = localStorage.getItem('language') || 'nl';
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: window.getItemDisplayText(item, 'name', currentLang),
|
||||||
|
description: window.getItemDisplayText(item, 'description', currentLang)
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
// Final fallback
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: (typeof item.name === 'object') ? (item.name?.nl || item.name?.en || 'Onbekend Artikel') : (item.name || 'Onbekend Artikel'),
|
||||||
|
description: (typeof item.description === 'object') ? (item.description?.nl || item.description?.en || 'Geen beschrijving beschikbaar') : (item.description || 'Geen beschrijving beschikbaar')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<tr>
|
<tr>
|
||||||
|
|||||||
50
public/js/debug-helper.js
Normal file
50
public/js/debug-helper.js
Normal file
@@ -0,0 +1,50 @@
|
|||||||
|
// Debug helper for translation issues
|
||||||
|
console.log('Debug helper loaded');
|
||||||
|
|
||||||
|
// Function to check item structure
|
||||||
|
window.debugItem = function(item) {
|
||||||
|
console.log('Item structure:', item);
|
||||||
|
console.log('Item name type:', typeof item.name);
|
||||||
|
console.log('Item name value:', item.name);
|
||||||
|
console.log('Item description type:', typeof item.description);
|
||||||
|
console.log('Item description value:', item.description);
|
||||||
|
|
||||||
|
if (window.translationManager) {
|
||||||
|
console.log('Translation manager exists');
|
||||||
|
const localized = window.translationManager.getLocalizedItem(item);
|
||||||
|
console.log('Localized item:', localized);
|
||||||
|
} else {
|
||||||
|
console.log('Translation manager not available');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Function to ensure translation manager
|
||||||
|
window.ensureTranslationManager = function() {
|
||||||
|
if (!window.translationManager) {
|
||||||
|
console.log('Creating new translation manager instance');
|
||||||
|
if (window.TranslationManager) {
|
||||||
|
window.translationManager = new window.TranslationManager();
|
||||||
|
} else {
|
||||||
|
console.error('TranslationManager class not available');
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return window.translationManager;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Enhanced fallback function for items
|
||||||
|
window.getItemDisplayText = function(item, field, language = 'nl') {
|
||||||
|
if (!item) return field === 'name' ? 'Onbekend Artikel' : 'Geen beschrijving beschikbaar';
|
||||||
|
|
||||||
|
const value = item[field];
|
||||||
|
|
||||||
|
if (typeof value === 'object' && value !== null) {
|
||||||
|
return value[language] || value.nl || value.en || (field === 'name' ? 'Onbekend Artikel' : 'Geen beschrijving beschikbaar');
|
||||||
|
} else if (typeof value === 'string') {
|
||||||
|
return value;
|
||||||
|
} else {
|
||||||
|
return field === 'name' ? 'Onbekend Artikel' : 'Geen beschrijving beschikbaar';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log('Debug helper functions loaded');
|
||||||
@@ -124,10 +124,16 @@ function displayItems() {
|
|||||||
// Apply search filter with translation support
|
// Apply search filter with translation support
|
||||||
if (searchTerm.trim() !== '') {
|
if (searchTerm.trim() !== '') {
|
||||||
filteredItems = filteredItems.filter(item => {
|
filteredItems = filteredItems.filter(item => {
|
||||||
if (window.translationManager) {
|
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
|
||||||
const localizedItem = window.translationManager.getLocalizedItem(item);
|
if (translationManager) {
|
||||||
|
const localizedItem = translationManager.getLocalizedItem(item);
|
||||||
return localizedItem.name.toLowerCase().includes(searchTerm) ||
|
return localizedItem.name.toLowerCase().includes(searchTerm) ||
|
||||||
(localizedItem.description && localizedItem.description.toLowerCase().includes(searchTerm));
|
(localizedItem.description && localizedItem.description.toLowerCase().includes(searchTerm));
|
||||||
|
} else if (window.getItemDisplayText) {
|
||||||
|
const currentLang = localStorage.getItem('language') || 'nl';
|
||||||
|
const name = window.getItemDisplayText(item, 'name', currentLang);
|
||||||
|
const description = window.getItemDisplayText(item, 'description', currentLang);
|
||||||
|
return name.toLowerCase().includes(searchTerm) || description.toLowerCase().includes(searchTerm);
|
||||||
} else {
|
} else {
|
||||||
// Fallback for when translation manager isn't loaded yet (default to Dutch)
|
// Fallback for when translation manager isn't loaded yet (default to Dutch)
|
||||||
const name = item.name?.nl || item.name?.en || item.name || '';
|
const name = item.name?.nl || item.name?.en || item.name || '';
|
||||||
@@ -151,10 +157,28 @@ function displayItems() {
|
|||||||
// Display items in grid view
|
// Display items in grid view
|
||||||
const gridContainer = document.getElementById('itemsGrid');
|
const gridContainer = document.getElementById('itemsGrid');
|
||||||
gridContainer.innerHTML = filteredItems.map(item => {
|
gridContainer.innerHTML = filteredItems.map(item => {
|
||||||
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
|
// Use multiple fallback strategies
|
||||||
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
|
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
|
||||||
description: item.description?.nl || item.description?.en || item.description || ''
|
let localizedItem;
|
||||||
};
|
|
||||||
|
if (translationManager) {
|
||||||
|
localizedItem = translationManager.getLocalizedItem(item);
|
||||||
|
} else if (window.getItemDisplayText) {
|
||||||
|
// Use debug helper fallback
|
||||||
|
const currentLang = localStorage.getItem('language') || 'nl';
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: window.getItemDisplayText(item, 'name', currentLang),
|
||||||
|
description: window.getItemDisplayText(item, 'description', currentLang)
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
// Final fallback
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: (typeof item.name === 'object') ? (item.name?.nl || item.name?.en || 'Onbekend Artikel') : (item.name || 'Onbekend Artikel'),
|
||||||
|
description: (typeof item.description === 'object') ? (item.description?.nl || item.description?.en || 'Geen beschrijving beschikbaar') : (item.description || 'Geen beschrijving beschikbaar')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<div class="col-md-4 col-lg-3 mb-4">
|
<div class="col-md-4 col-lg-3 mb-4">
|
||||||
@@ -180,10 +204,28 @@ function displayItems() {
|
|||||||
// Display items in list view
|
// Display items in list view
|
||||||
const itemsListBody = document.getElementById('itemsListBody');
|
const itemsListBody = document.getElementById('itemsListBody');
|
||||||
itemsListBody.innerHTML = filteredItems.map(item => {
|
itemsListBody.innerHTML = filteredItems.map(item => {
|
||||||
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
|
// Use multiple fallback strategies
|
||||||
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
|
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
|
||||||
description: item.description?.nl || item.description?.en || item.description || ''
|
let localizedItem;
|
||||||
};
|
|
||||||
|
if (translationManager) {
|
||||||
|
localizedItem = translationManager.getLocalizedItem(item);
|
||||||
|
} else if (window.getItemDisplayText) {
|
||||||
|
// Use debug helper fallback
|
||||||
|
const currentLang = localStorage.getItem('language') || 'nl';
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: window.getItemDisplayText(item, 'name', currentLang),
|
||||||
|
description: window.getItemDisplayText(item, 'description', currentLang)
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
// Final fallback
|
||||||
|
localizedItem = {
|
||||||
|
...item,
|
||||||
|
name: (typeof item.name === 'object') ? (item.name?.nl || item.name?.en || 'Onbekend Artikel') : (item.name || 'Onbekend Artikel'),
|
||||||
|
description: (typeof item.description === 'object') ? (item.description?.nl || item.description?.en || 'Geen beschrijving beschikbaar') : (item.description || 'Geen beschrijving beschikbaar')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<tr class="item-row" style="cursor: pointer" onclick="showItemDetails(${JSON.stringify(item).replace(/"/g, '"')})">
|
<tr class="item-row" style="cursor: pointer" onclick="showItemDetails(${JSON.stringify(item).replace(/"/g, '"')})">
|
||||||
|
|||||||
@@ -80,6 +80,10 @@ const translations = {
|
|||||||
'confirm-return-request': 'Are you sure you want to request return for this item? An admin will need to approve the return.',
|
'confirm-return-request': 'Are you sure you want to request return for this item? An admin will need to approve the return.',
|
||||||
'return-request-success': 'Return requested successfully! An admin will review your request.',
|
'return-request-success': 'Return requested successfully! An admin will review your request.',
|
||||||
|
|
||||||
|
// Item fallbacks
|
||||||
|
'unknown-item': 'Unknown Item',
|
||||||
|
'no-description': 'No description available',
|
||||||
|
|
||||||
// Management
|
// Management
|
||||||
'inventory-management': 'Inventory Management',
|
'inventory-management': 'Inventory Management',
|
||||||
'reservation-management': 'Reservation Management'
|
'reservation-management': 'Reservation Management'
|
||||||
@@ -163,6 +167,10 @@ const translations = {
|
|||||||
'confirm-return-request': 'Weet je zeker dat je retour wilt aanvragen voor dit artikel? Een admin moet de retour goedkeuren.',
|
'confirm-return-request': 'Weet je zeker dat je retour wilt aanvragen voor dit artikel? Een admin moet de retour goedkeuren.',
|
||||||
'return-request-success': 'Retour succesvol aangevraagd! Een admin zal je verzoek beoordelen.',
|
'return-request-success': 'Retour succesvol aangevraagd! Een admin zal je verzoek beoordelen.',
|
||||||
|
|
||||||
|
// Item fallbacks
|
||||||
|
'unknown-item': 'Onbekend Artikel',
|
||||||
|
'no-description': 'Geen beschrijving beschikbaar',
|
||||||
|
|
||||||
// Management
|
// Management
|
||||||
'inventory-management': 'Voorraadbeheer',
|
'inventory-management': 'Voorraadbeheer',
|
||||||
'reservation-management': 'Reserveringsbeheer'
|
'reservation-management': 'Reserveringsbeheer'
|
||||||
@@ -281,10 +289,38 @@ class TranslationManager {
|
|||||||
|
|
||||||
// Get translated item data based on current language
|
// Get translated item data based on current language
|
||||||
getLocalizedItem(item) {
|
getLocalizedItem(item) {
|
||||||
|
// Handle the case where item might be null or undefined
|
||||||
|
if (!item) {
|
||||||
|
return {
|
||||||
|
name: this.translate('unknown-item'),
|
||||||
|
description: this.translate('no-description')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
let name, description;
|
||||||
|
|
||||||
|
// Handle multilingual name
|
||||||
|
if (typeof item.name === 'object' && item.name !== null) {
|
||||||
|
name = item.name[this.currentLanguage] || item.name.nl || item.name.en || this.translate('unknown-item');
|
||||||
|
} else if (typeof item.name === 'string') {
|
||||||
|
name = item.name;
|
||||||
|
} else {
|
||||||
|
name = this.translate('unknown-item');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle multilingual description
|
||||||
|
if (typeof item.description === 'object' && item.description !== null) {
|
||||||
|
description = item.description[this.currentLanguage] || item.description.nl || item.description.en || this.translate('no-description');
|
||||||
|
} else if (typeof item.description === 'string') {
|
||||||
|
description = item.description || this.translate('no-description');
|
||||||
|
} else {
|
||||||
|
description = this.translate('no-description');
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...item,
|
...item,
|
||||||
name: item.name?.[this.currentLanguage] || item.name?.nl || item.name?.en || item.name || 'Unknown Item',
|
name: name,
|
||||||
description: item.description?.[this.currentLanguage] || item.description?.nl || item.description?.en || item.description || ''
|
description: description
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -306,8 +342,16 @@ class TranslationManager {
|
|||||||
let translationManager;
|
let translationManager;
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
translationManager = new TranslationManager();
|
translationManager = new TranslationManager();
|
||||||
|
window.translationManager = translationManager;
|
||||||
});
|
});
|
||||||
|
|
||||||
// Export for use in other files
|
// Export for use in other files
|
||||||
window.TranslationManager = TranslationManager;
|
window.TranslationManager = TranslationManager;
|
||||||
window.translationManager = translationManager;
|
|
||||||
|
// Function to ensure translation manager is available
|
||||||
|
window.getTranslationManager = function() {
|
||||||
|
if (!window.translationManager) {
|
||||||
|
window.translationManager = new TranslationManager();
|
||||||
|
}
|
||||||
|
return window.translationManager;
|
||||||
|
};
|
||||||
@@ -143,6 +143,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
|
<script src="js/debug-helper.js"></script>
|
||||||
<script src="js/translations.js"></script>
|
<script src="js/translations.js"></script>
|
||||||
<script src="js/student.js"></script>
|
<script src="js/student.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
Reference in New Issue
Block a user