Initial commit

README.md

@@ -1,3 +1,19 @@
 # anime-backlog-list
 
-Manage your plan to watch list (or plan to read/play/whatever)
+Manage your plan to watch list (or plan to read/play/whatever)
+
+The code is pretty dirty because the initial plan was to make this app as simple as possible, but then kept adding new features and the project bacame messy. But it works fine for my purposes. 
+
+## How to deploy
+- Create a database in mysql/mariadb
+- Create tables using the file `schema.sql`: 
+```
+mysql -u other_user -p some_empty_database < schema.sql
+```
+- Rename php/db_connect.example.php to php/db_connect.php
+- Specify the DB connection details in the php/db_connect.php file
+
+## How to add a new tab (with a new year or whatever):
+- Add a new element in the array `const years` in the `js/main.js` file
+
+I know it's not user-friendly, but since I'm the only user it's fine :) 

js/main.js

@@ -80,7 +80,6 @@ function setupFormSubmission() {
         })
             .then(response => {
                 if (!response.ok) {
-                    // Если сервер вернул ошибку (например, 403)
                     return response.json().then(errorData => {
                         if (response.status === 403) {
                             alert(errorData.message || 'Access denied: You are not authorized to perform this action.');
@@ -91,7 +90,6 @@ function setupFormSubmission() {
                 return response.text();
             })
             .then(() => {
-                // Если запись добавлена успешно
                 loadYearContent(currentYear);
             })
             .catch(error => {
@@ -109,7 +107,6 @@ function setupFormSubmission() {
     });
 }
 
-
 function setupEditButtons() {
     const editButtons = document.querySelectorAll('.edit-button');
     editButtons.forEach(button => {
@@ -127,11 +124,10 @@ function setupDeleteButtons() {
             const recordId = button.dataset.id;
             if (confirm('Are you sure you want to delete this record?')) {
                 fetch(`php/delete_record.php?id=${recordId}`, {
-                    method: 'DELETE' // Используем метод DELETE для удаления
+                    method: 'DELETE' 
                 })
                     .then(response => {
                         if (!response.ok) {
-                            // Если сервер вернул ошибку (например, 403)
                             return response.json().then(errorData => {
                                 if (response.status === 403) {
                                     alert(errorData.message || 'Access denied: You are not authorized to delete this record.');
@@ -142,7 +138,6 @@ function setupDeleteButtons() {
                         return response.text();
                     })
                     .then(() => {
-                        // Если удаление прошло успешно
                         loadYearContent(currentYear);
                     })
                     .catch(error => {
@@ -153,7 +148,6 @@ function setupDeleteButtons() {
     });
 }
 
-
 function openEditModal(id) {
     // Fetch record data
     fetch(`php/fetch_record.php?id=${id}`)
@@ -230,7 +224,6 @@ function setupEditFormSubmission() {
             console.error('Error:', error);
         });
     }
-    
 
     form.addEventListener('submit', handleEditFormSubmit);
 
@@ -319,7 +312,6 @@ function generateEditForm(data) {
     `;
 }
 
-
 function setupSuggestButton() {
     const suggestButton = document.getElementById('suggest-button');
     if (suggestButton) {
@@ -329,7 +321,6 @@ function setupSuggestButton() {
     }
 }
 
-
 function makeSuggestion() {
     // Clear any previous suggestions
     const previousSuggestion = document.getElementById('suggestion-display');
@@ -359,7 +350,6 @@ function makeSuggestion() {
 
     const selectedRows = [rows[indices[0]]]; 
 
-    // Get the names of the selected records
     const names = selectedRows.map(row => row.getAttribute('data-name'));
 
     // Display the names at the top of the content
@@ -485,13 +475,11 @@ document.addEventListener('DOMContentLoaded', () => {
         }
     }
 
-    // Добавляем обработчики событий на родительский элемент
     var contentDiv = document.getElementById('content');
 
     contentDiv.addEventListener('mouseover', function (event) {
         var target = event.target;
 
-        // Проверяем, является ли целевой элемент ссылкой с атрибутом data-url
         if (target.tagName.toLowerCase() === 'a' && target.hasAttribute('data-url')) {
             var url = target.getAttribute('data-url');
             currentHoverTarget = target; // Set the current hover target

php/db_connect.example.php

@@ -3,13 +3,13 @@ session_start();
 
 error_reporting(E_ALL);
 ini_set('display_errors', 0); // Set to 1 for debugging purposes 
-$servername = "localhost";
-$username = "username";
-$password = "definetelysecurepwd123";
-$dbname = "plan_to_watch";
+$db_servername = "localhost";
+$db_username = "username";
+$db_password = "definetelysecurepwd123";
+$db_name = "plan_to_watch";
 
 try {
-    $conn = new PDO("mysql:host=$servername;dbname=$dbname;charset=utf8mb4", $username, $password);
+    $conn = new PDO("mysql:host=$db_servername;dbname=$db_name;charset=utf8mb4", $db_username, $db_password);
     // Set PDO error mode to exception
     $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
 } catch(PDOException $e) {