alvin/Challenge_15_Magazijn_App_Maken
1
0
Fork 0
mirror of https://github.com/Alvin-Zilverstand/Challenge_15_Magazijn_App_Maken.git synced 2026-03-06 02:56:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

changes

Browse Source
This commit is contained in:
Alvin
2025-11-05 10:39:09 +01:00
parent a91c15d6c1
commit abf76e37b4
7 changed files with 205 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
public/admin.html
View File

@@ -170,6 +170,7 @@
}
});
</script>
<script src="js/debug-helper.js"></script>
<script src="js/translations.js"></script>
<script src="js/admin.js"></script>
</body>

0
public/images/items/item-1762333137057-290874794.jpg → public/images/items/item-1762333952965-217359885.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

64
public/js/admin.js
View File

@@ -77,11 +77,19 @@ function getFilteredItems() {
}
return items.filter(item => {
if (window.translationManager) {
const localizedItem = window.translationManager.getLocalizedItem(item);
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
if (translationManager) {
const localizedItem = translationManager.getLocalizedItem(item);
return localizedItem.name.toLowerCase().includes(searchTerm) ||
(localizedItem.description && localizedItem.description.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 {
// Fallback for when translation manager isn't loaded yet (default to Dutch)
const name = item.name?.nl || item.name?.en || item.name || '';
@@ -110,10 +118,28 @@ function displayGridView() {
const filteredItems = getFilteredItems();
itemsGrid.innerHTML = filteredItems.map(item => {
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
description: item.description?.nl || item.description?.en || item.description || ''
};
// Use multiple fallback strategies
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
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 `
<div class="col-md-4 col-lg-3">
@@ -146,10 +172,28 @@ function displayListView() {
const itemsListBody = document.getElementById('itemsListBody');
const filteredItems = getFilteredItems();
itemsListBody.innerHTML = filteredItems.map(item => {
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
description: item.description?.nl || item.description?.en || item.description || ''
};
// Use multiple fallback strategies
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
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 `
<tr>

50
public/js/debug-helper.js Normal file
View 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');

62
public/js/student.js
View File

@@ -124,10 +124,16 @@ function displayItems() {
// Apply search filter with translation support
if (searchTerm.trim() !== '') {
filteredItems = filteredItems.filter(item => {
if (window.translationManager) {
const localizedItem = window.translationManager.getLocalizedItem(item);
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
if (translationManager) {
const localizedItem = translationManager.getLocalizedItem(item);
return localizedItem.name.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 {
// Fallback for when translation manager isn't loaded yet (default to Dutch)
const name = item.name?.nl || item.name?.en || item.name || '';
@@ -151,10 +157,28 @@ function displayItems() {
// Display items in grid view
const gridContainer = document.getElementById('itemsGrid');
gridContainer.innerHTML = filteredItems.map(item => {
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
description: item.description?.nl || item.description?.en || item.description || ''
};
// Use multiple fallback strategies
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
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 `
<div class="col-md-4 col-lg-3 mb-4">
@@ -180,10 +204,28 @@ function displayItems() {
// Display items in list view
const itemsListBody = document.getElementById('itemsListBody');
itemsListBody.innerHTML = filteredItems.map(item => {
const localizedItem = window.translationManager ? window.translationManager.getLocalizedItem(item) : {
name: item.name?.nl || item.name?.en || item.name || 'Onbekend Artikel',
description: item.description?.nl || item.description?.en || item.description || ''
};
// Use multiple fallback strategies
const translationManager = window.ensureTranslationManager ? window.ensureTranslationManager() : null;
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 `
<tr class="item-row" style="cursor: pointer" onclick="showItemDetails(${JSON.stringify(item).replace(/"/g, '&quot;')})">

50
public/js/translations.js
View File

@@ -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.',
'return-request-success': 'Return requested successfully! An admin will review your request.',
// Item fallbacks
'unknown-item': 'Unknown Item',
'no-description': 'No description available',
// Management
'inventory-management': 'Inventory 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.',
'return-request-success': 'Retour succesvol aangevraagd! Een admin zal je verzoek beoordelen.',
// Item fallbacks
'unknown-item': 'Onbekend Artikel',
'no-description': 'Geen beschrijving beschikbaar',
// Management
'inventory-management': 'Voorraadbeheer',
'reservation-management': 'Reserveringsbeheer'
@@ -281,10 +289,38 @@ class TranslationManager {
// Get translated item data based on current language
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 {
...item,
name: item.name?.[this.currentLanguage] || item.name?.nl || item.name?.en || item.name || 'Unknown Item',
description: item.description?.[this.currentLanguage] || item.description?.nl || item.description?.en || item.description || ''
name: name,
description: description
};
}
@@ -306,8 +342,16 @@ class TranslationManager {
let translationManager;
document.addEventListener('DOMContentLoaded', () => {
translationManager = new TranslationManager();
window.translationManager = translationManager;
});
// Export for use in other files
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;
};

1
public/student.html
View File

@@ -143,6 +143,7 @@
</div>
<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/student.js"></script>
</body>