# 📝 sld-blocknotes - Modern Block-based Notes & Command Management System

> **🌐 Languages**: [🇬🇧 English](README.md) | [🇮🇹 Italiano](README.it.md) | [🇪🇸 Español](README.es.md) | [🇫🇷 Français](README.fr.md)

![PHP](https://img.shields.io/badge/PHP-7.4%20%7C%208.x-777BB4?style=for-the-badge&logo=php&logoColor=white)
![Database](https://img.shields.io/badge/Database-MySQL%20%2F%20MariaDB-4479A1?style=for-the-badge&logo=mysql&logoColor=white)
![Frontend](https://img.shields.io/badge/Frontend-Vanilla%20CSS%20%26%20JS-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
![Framework](https://img.shields.io/badge/Framework-Zero%20Dependencies-22c55e?style=for-the-badge)

A powerful, modern, zero-dependency Web application for organizing structured block notes, technical commands, code snippets, and instructions. Built with **Pure PHP**, **Vanilla CSS**, **Vanilla JS**, and **MySQL/MariaDB**.

Repository URL: [https://gitea.sld-server.org/sld-admin/sld-blocknotes](https://gitea.sld-server.org/sld-admin/sld-blocknotes)

---

## ✨ Key Features

- 📑 **Structured Block Notes & Subnotes**:
  - Organize notes into customizable blocknotes.
  - Notes contain titles, descriptions, and multiple subnotes.
  - **Collapsible Notes**: Collapsed by default to maximize vertical screen space, with global **Expand All / Collapse All** buttons.

- ⚡ **Terminal Command Subnotes**:
  - Separate rendering for generic text subnotes vs terminal command subnotes.
  - **1-Click Clipboard Copy**: Copy command snippets instantly with visual feedback (`✓ Copied!`).
  - High-contrast dark IDE code box with max-height vertical scrolling.

- 🔍 **Real-Time Live Search**:
  - Filter note titles, descriptions, subnote titles, and terminal command contents instantly inside the active blocknote view.
  - Automatically expands matched note blocks during search.

- 📥 / 💾 **JSON Import & Export**:
  - Download blocknote JSON files with one click (`export_blocknote.php`).
  - Interactive JSON importer supporting both standard and legacy JSON formats.

- 🌐 **Multilingual Interface (IT, EN, ES, FR)**:
  - Full interface localization in **Italian 🇮🇹, English 🇬🇧, Spanish 🇪🇸, and French 🇫🇷**.
  - Quick navbar language selector for guests and logged-in users.
  - Each user's language choice is saved to their database profile for future logins.

- 🏠 **Customizable User Landing Page**:
  - Choose between launching directly into the **Main Dashboard (All Blocknotes)** or opening a **Specific Default Blocknote** upon login.

- 👑 **Single Owner Role & Advanced Hierarchy (`owner` > `admin` > `user`)**:
  - **Immune Owner Account**: The initial Owner account (`owner`) cannot be deleted by any admin or by themselves.
  - Owners cannot be demoted or altered by standard administrators.

- ⚙️ **Site Customization (Owner Exclusive)**:
  - Change the **Global Application / Site Title**.
  - Upload & validate a **High-Resolution Favicon** (min 64x64px) with real-time preview.

- 🚀 **First Start Setup Installer Wizard (`first_start.php`)**:
  - Automated first-time setup wizard for configuring MySQL database credentials, creating database tables, and setting up the initial `owner` and `admin` accounts.
  - Fully localized in all 4 languages.

---

## 🚀 Quickstart & Installation

### Requirements
- Web Server (Apache, Nginx, or PHP built-in CLI server)
- PHP 7.4 or 8.x (with `mysqli` extension enabled)
- MySQL 5.7+ or MariaDB 10.x+

### Step-by-Step Installation

1. **Clone the Repository**:
   ```bash
   git clone https://gitea.sld-server.org/sld-admin/sld-blocknotes.git
   cd sld-blocknotes
   ```

2. **Start Web Server**:
   You can serve the directory with your local Web server or use PHP's built-in server:
   ```bash
   php -S localhost:8000
   ```

3. **Run Automated Setup Wizard**:
   Navigate to `http://localhost:8000/` in your browser.
   The system will automatically detect first-time run and launch `first_start.php`:
   - Enter your **MySQL Database Credentials** (Host, Database Name, User, Password).
   - Configure credentials for the **Owner Account**.
   - Configure credentials for the **First Admin Account**.
   - Click **⚡ Complete Installation & Configure System**.

4. **Login & Enjoy**:
   After setup completes, you will be redirected to `index.php?page=login` to sign in.

---

## 📁 Directory Structure

```text
sld-blocknotes/
├── assets/
│   ├── css/
│   │   └── style.css            # Vanilla CSS design system & HSL variables
│   └── js/
│       └── main.js              # Vanilla JS modals, collapsible notes, search & copy
├── blocknotes/                  # Blocknotes JSON storage directory
│   └── .gitkeep
├── config/
│   ├── constants.php            # Path constants definition
│   ├── db.php                   # MySQL connection, auto-migration & installer redirect
│   ├── functions_init.php       # Router & page sanitization
│   ├── init.php                 # System initialization
│   └── settings.php             # Database credentials configuration template
├── functions/
│   ├── auth.php                 # Authentication, role permissions & owner protections
│   ├── blocknotes.php           # Blocknote JSON CRUD engine & JSON importer
│   ├── functions.php            # Function module autoloader
│   ├── lang.php                 # Multilingual translation dictionary (IT, EN, ES, FR)
│   └── site_settings.php        # Site title & high-resolution favicon manager
├── includes/
│   ├── head_links.php           # Global CSS & favicon head includes
│   └── js_footer.php            # Global footer script includes
├── pages/
│   ├── 404.php                  # Not found page
│   ├── admin_users.php          # Admin user management & Owner site settings
│   ├── db-error.php             # Database error template
│   ├── export_blocknote.php     # Blocknote JSON download endpoint
│   ├── home.php                 # Main blocknotes dashboard
│   ├── login.php                # Multilingual login page
│   ├── logout.php               # Session logout
│   ├── profile.php              # User profile, password, theme colors, language & landing page
│   └── view_blocknote.php       # Detail view for blocknotes, collapsible notes & search
├── templates/
│   ├── footer.php               # Page footer template
│   └── header.php               # Navbar header, logo, user badges & quick language selector
├── .gitignore
├── first_start.php              # Automated First Start Installation Wizard
├── index.php                    # Application entry point & router
├── README.md                    # Main English Documentation
├── README.it.md                 # Italian Documentation
├── README.es.md                 # Spanish Documentation
└── README.fr.md                 # French Documentation
```

---

## 📄 License

This project is open-source software available under the [MIT License](LICENSE).