Web application for analyzing logs from printed circuit board tests with multilingual support (Czech, English, Chinese).
- Application Description
- Installation
- Usage Guide
- Supported Log Types
- Multilingual Support
- Application Structure
- Technical Details
- Application Flow Diagram
- Code Examples
- Contact
ICT Log Analyzer is a web application for analyzing logs from printed circuit board tests (ICT - In-Circuit Test). The application can process log files generated by the tester and display clear test results including failure details, display of tested components, and other important information.
- Drag & drop log file upload
- Automatic log type detection
- Extraction and display of all important test information
- Clear display of test results
- Display of test failure details
- Filtered display of tested components
- Multilingual support (Czech, English, Chinese)
- Screenshot functionality
- Web server with PHP support (e.g., Apache, XAMPP, WAMP)
- Browser with support for modern JavaScript and CSS
- Clone or extract the application files to a folder accessible by the web server
- Make sure the folder and files have the correct read permissions
- Access the application via a web browser (e.g., http://localhost/ICT/)
There are three ways to upload a log file:
- Drag & drop - Drag a file with .log or .txt extension to the designated area
- Click on the area - Click on the "Drag log file here or click to select" area and select a file
- Manual insertion - Paste the contents of the log file directly into the text field
After uploading the log, click the "View Log" button. The application will automatically:
- Detect the log type (short/long)
- Analyze the log content
- Extract all relevant data
- Display a clear result
The analysis results are divided into the following sections:
- Test Result Summary - Basic information about whether the test passed or failed
- Basic Test Information - Details about the tested board, revision, etc.
- Time Data - Start time, end time, and test duration
- Individual Test Results - Overview of results of all subtests (pretest, component test, etc.)
- Component Failure Details - If the test failed, details about the component that caused the failure are displayed here
- Tested Component Details - Table of all tested components with filtering options
You can change the application language using the dropdown menu in the top left corner. The application supports Czech, English, and Chinese. The language selection is stored in the browser's localStorage and persists between sessions.
You can create a screenshot of the analysis results by clicking the "Save Screenshot" button in the top right corner. The screenshot will be saved as a PNG file.
The application supports two types of logs:
- Short log (.txt files) - Contains basic information about the test and results
- Long log (.log files) - Contains detailed information including test results of individual components
The application automatically detects the log type and processes it accordingly.
The application supports multiple languages. Currently implemented languages are:
- Czech (cs) - Default language
- English (en)
- Chinese (zh)
The application uses a language manager to handle translations. All text in the application is stored in language files and loaded dynamically based on the selected language. The language selection is stored in the browser's localStorage and persists between sessions.
Language files are located in the lang/ directory:
cs.js- Czech translationsen.js- English translationszh.js- Chinese translationslanguage-manager.js- Language management functionality
HTML elements that need to be translated have a data-i18n attribute with a key that corresponds to a translation in the language files. The language manager replaces the content of these elements with the appropriate translation when the language is changed.
Example of an HTML element with translation:
<button data-i18n="analyze_log"></button>Example of a translation in a language file:
// In cs.js
const csTranslations = {
analyze_log: 'Prohlédnout Log',
// other translations...
};| File/Directory | Description |
|---|---|
index.php |
Main application file containing the HTML structure |
css/styles.css |
Cascading style sheets for the application appearance |
js/script.js |
JavaScript functions for log analysis and data display |
js/html2canvas.min.js |
Library for creating screenshots |
lang/cs.js |
Czech language translations |
lang/en.js |
English language translations |
lang/zh.js |
Chinese language translations |
lang/language-manager.js |
Language management functionality |
amelogo.svg |
Application logo |
readme.md |
This documentation file |
- Runtime Environment: The application runs on the client side (in the browser)
- Technologies Used: HTML5, CSS3, JavaScript, PHP
- Data Processing: Data analysis is performed in JavaScript without the need to send data to the server
- Compatibility: The application is optimized for modern browsers (Chrome, Firefox, Safari, Brave)
- Multilingual Support: The application uses a custom language manager to handle translations
- Screenshot Functionality: The application uses the html2canvas library to create screenshots
+---------------------+ +----------------------+ +------------------------+
| | | | | |
| Log Input Methods | | Log Processing | | Results Display |
| | | | | |
+---------------------+ +----------------------+ +------------------------+
| | | | | |
| 1. Drag & Drop | --> | 1. Log Type Detection| --> | 1. Test Result Summary |
| 2. File Selection | | 2. Data Extraction | | 2. Basic Information |
| 3. Manual Paste | | 3. Data Analysis | | 3. Time Data |
| | | 4. Component Parsing | | 4. Test Results Table |
| | | | | 5. Component Details |
| | | | | 6. Failure Details |
+---------------------+ +----------------------+ +------------------------+
^ | |
| | |
| v v
+---------------------+ +----------------------+ +------------------------+
| | | | | |
| User Interactions | | Language System | | Export Options |
| | | | | |
+---------------------+ +----------------------+ +------------------------+
| | | | | |
| 1. Language Change | <-> | 1. Language Files | <-> | 1. Screenshot Creation |
| 2. Component Filter | | 2. Translation Keys | | |
| 3. Clear Input | | 3. Dynamic UI Update | | |
| | | | | |
+---------------------+ +----------------------+ +------------------------+
-
Log Input
- User provides log data through one of three methods: drag & drop, file selection, or manual paste
- The application accept A675 s .log and .txt files
-
Log Processing
- The application automatically detects the log type (short/long)
- Data is extracted from the log according to its format
- Component information is parsed and organized
-
Results Display
- Results are presented in a structured format with multiple sections
- Failed components are highlighted
- Component table allows filtering by type
-
User Interactions
- Language can be changed at any time using the dropdown menu
- Component table can be filtered by category
- Input can be cleared for new analysis
-
Language System
- Translations are loaded from language files
- UI elements are updated dynamically based on selected language
- Language preference is stored in browser's localStorage
-
Export Options
- Analysis results can be saved as a screenshot
The language manager is responsible for loading and applying translations. It provides the following functions:
initLanguageManager()- Initializes the language manager and loads translationschangeLanguage(lang)- Changes the current languageupdateUILanguage()- Updates all UI elements with translations for the current languagegetTranslation(key)- Gets a translation for a specific keygetTestNameTranslation(testName)- Gets a translation for a specific test name
<button onclick="analyzeLog()" data-i18n="analyze_log"></button>// Czech translations (cs.js)
const csTranslations = {
// Basic UI elements
screenshot: 'Uložit screenshot',
analyze_log: 'Prohlédnout Log',
clear_text: 'Vymazat text',
// Test results
test_failed: 'TEST SELHAL',
test_passed: 'TEST ÚSPĚŠNÝ',
// Other translations...
};
// Test name translations
const csTestNameTranslations = {
'Pretest': 'Pretest',
'Discharge': 'Vybití',
'Open': 'Test rozpojených spojů',
// Other test name translations...
};// Change language
changeLanguage('en');
// Get translation
const translatedText = getTranslation('analyze_log');
// Update UI with translations
updateUILanguage();function analyzeLog() {
const logText = document.getElementById('log-input').value.trim();
if (!logText) {
alert(getTranslation('please_insert_log'));
return;
}
// Reset component table
componentData = [];
try {
// Determine log type automatically
let logType;
if (logText.includes('// Component_Data')) {
logType = 'long';
} else {
logType = 'short';
}
// Show detected log type
document.getElementById('log-type-info').style.display = 'block';
// Set the appropriate data-i18n attribute
const logTypeElement = document.getElementById('detected-log-type');
logTypeElement.setAttribute('data-i18n', logType === 'short' ? 'short_log' : 'long_log');
// Update the text content
logTypeElement.textContent = logType === 'short' ?
getTranslation('short_log') :
getTranslation('long_log');
// Parse log based on type
if (logType === 'long') {
analyzeLongLog(logText);
} else {
analyzeShortLog(logText);
}
} catch (error) {
console.error("Error analyzing log:", error);
alert(getTranslation('error_log_analysis') + ": " + error.message);
}
}- Author: Hesse Valentino
- Email: hessevalentino@gmail.com
- Web: https://www.hardwired.dev
- Copyright: © 2025 Hesse Valentino - Inventec Automotive
- License: Apache License 2.0
- SPDX License Identifier: Apache-2.0
- License Terms: You are free to use, modify, and distribute this software under the terms of the Apache License 2.0, which requires preservation of copyright and license notices, and attribution to the original author
- Version: 2.0
Valentino Hesse 2025 - With ❤ to Quality Dept. - Per ardua ad astra