Project Purpose
Relevant source files
The following files were used as context for generating this wiki page:The oldwebsite project is the codebase for the public-facing website of Institute Itech. Its primary purpose is to serve as a multi-lingual platform presenting the institute's mission, structure, research departments, and projects. The institute positions itself as an international organization focused on building a new societal model based on education, technology, and social development. It operates as a multidisciplinary research and development center integrating science, engineering, economics, sustainability, and artificial intelligence.
The website is architected as a classic server-rendered PHP application. It uses a simple file-based routing system, a templating engine for layout consistency, and a JSON-based internationalization (i18n) system to support multiple languages. The frontend is enhanced with vanilla JavaScript for dynamic UI components like navigation, cookie consent, and tabbed interfaces.
Sources: apps/translations.json:170-173, index.php, apps/js/iite_components.js
Core Architecture
The application follows a traditional multi-page application (MPA) pattern where each distinct page is a separate .php file.
Sources: index.php, iite/overview.php, departments/overview.php
Page Rendering Flow
When a user requests a page, the corresponding PHP file is executed. This file is responsible for setting the page title, handling language settings, and including the specific content template (.phtml file). The output is captured into a variable and injected into a global layout file (layout.phtml), which provides the consistent header, navigation, and footer for the entire site.
The following diagram illustrates the server-side rendering process for a typical page request.
Sources: iite/overview.php:2-23, index.php:2-21
Page Structure and Routing
The site's structure is defined by the PHP files in the root directory and its subdirectories (e.g., iite/, departments/, inside/). The apps/pages.php file acts as a manifest, mapping page identifiers to their titles in various languages.
| Page Identifier | English Title | PHP File |
|---|---|---|
index | Welcome to Institute Itech | index.php |
iite_overview | Overview of Institute Itech | iite/overview.php |
iite_company | Our company: Institute Itech | iite/company.php |
iite_relationship | Relationships: Institute Itech | iite/relationship.php |
departments_overview | The departments of Institute Itech | departments/overview.php |
inside_ets | ETS: Institute Itech | inside/overview.php |
Sources: apps/pages.php:3-38, index.php:12, iite/overview.php:13, iite/company.php:13, iite/relationship.php:13, departments/overview.php:13, inside/overview.php:13
Internationalization (i18n)
A core feature of the website is its support for multiple languages (Italian, English, French, Spanish). This is managed through PHP sessions and a translation loading mechanism.
Language Switching
Language selection is handled via a lang GET parameter. When a URL like ?lang=en is accessed, the server-side PHP script updates the $_SESSION['lang'] variable and then performs a redirect to the clean URL without the parameter. Subsequent requests will use the language stored in the session.
The diagram below shows the sequence for changing the site language.
Sources: index.php:4-9, iite/overview.php:4-9
Translation Management
Text content is managed in two key files:
apps/pages.php: Contains page titles for each supported language.apps/translations.json: A comprehensive JSON file containing all other UI strings, from hero quotes to navigation labels and departmental descriptions.
A helper function t($key) is defined in each main PHP page file to retrieve the correct translation string based on the current language ($lang) and the provided key.
Sources: index.php:15-18, apps/pages.php, apps/translations.json
Frontend System
Client-side functionality is handled by vanilla JavaScript and styled with CSS.
Client-Side Navigation
Primary navigation is controlled by apps/js/iite_components.js. It attaches click event listeners to elements with a data-page attribute and redirects the user to the corresponding URL.
data-page Value | Destination URL |
|---|---|
iite | http://localhost |
insideiite | /inside/overview.php |
research | # (Not implemented) |
departments | /departments/overview.php |
news | # (Not implemented) |
inside | # (Not implemented) |
Sources: apps/js/iite_components.js:5-21
Dynamic UI Behavior
The iite_components.js file manages several dynamic UI features:
- Logo Color Change: The
iitelogoelement's color is changed to black on specific pages (e.g.,/iite/company,/departments/overview) to contrast with a white background. - Navbar Hiding: The navbar is hidden on login pages as a client-side fallback to the server-side logic.
- Cookie Consent: A cookie banner's visibility is managed using
localStorage. When a user accepts or declines, the choice is stored, and the banner is hidden on subsequent page loads. - Tabbed Interface: The
interface()function implements a simple tab system where clicking a[menu-interface]button shows the corresponding.w-interfacecontent panel.
Sources: apps/js/iite_components.js:24-33, apps/js/iite_components.js:36-50, apps/js/iite_components.js:53-90, apps/js/iite_components.js:125-142
Site Content and Structure
The website is organized into several key sections, as detailed by the navigation and content strings.
The following diagram shows the high-level structure of the website.
Departments
The "Departments" section showcases the various research and development units within the institute.
| Department | Acronym | Description |
|---|---|---|
| Biotechnological Research | IRCA | Technologies for biotechnology applied to health. |
| Biomedical Development | AEH | Technologies for health and human well-being. |
| Artificial Intelligence | AI | Intelligent systems for data analysis and management. |
| Statistics, Economics and Finance | IFE | Statistical analysis and advanced economic models. |
| Aerospace Development | WWA2 | Technologies for aviation and space. |
| Urban Development | IRQM | Innovation for sustainable urban environments. |
Sources: apps/translations.json:338-397