File History: src/main/resources/static/js/notifications.js

File Content at Commit f0438c2

      
      // Notification System - Replaces alerts and confirms
    
      /**
    
       * Show a notification message
    
       * @param {string} message - The message to display
    
       * @param {string} type - 'success', 'error', 'warning', 'info'
    
       * @param {number} duration - Auto-close duration in ms (0 = don't auto-close)
    
       */
    
      function showNotification(message, type = 'info', duration = 5000) {
    
        const container = document.getElementById('notificationContainer');
    
        if (!container) {
    
          console.warn('Notification container not found');
    
          return;
    
        }
    
        const notification = document.createElement('div');
    
        notification.className = `notification ${type}`;
    
        const titles = {
    
          success: 'Success',
    
          error: 'Error',
    
          warning: 'Warning',
    
          info: 'Info'
    
        };
    
        notification.innerHTML = `
    
          <div class="notification-content">
    
            <div class="notification-title">${titles[type] || 'Notification'}</div>
    
            <div class="notification-message">${escapeHtml(message)}</div>
    
          </div>
    
          <button class="notification-close" onclick="this.parentElement.remove()" aria-label="Close">&times;</button>
    
        `;
    
        container.appendChild(notification);
    
        // Auto-remove after duration
    
        if (duration > 0) {
    
          setTimeout(() => {
    
            if (notification.parentElement) {
    
              notification.style.animation = 'slideInRight 0.3s ease-out reverse';
    
              setTimeout(() => notification.remove(), 300);
    
            }
    
          }, duration);
    
        }
    
        return notification;
    
      }
    
      /**
    
       * Show a confirmation dialog
    
       * @param {string} message - The message to display
    
       * @param {string} title - The dialog title
    
       * @returns {Promise<boolean>} - Resolves to true if confirmed, false if cancelled
    
       */
    
      function showConfirm(message, title = 'Confirm') {
    
        return new Promise((resolve) => {
    
          const overlay = document.createElement('div');
    
          overlay.className = 'confirm-dialog-overlay';
    
          overlay.innerHTML = `
    
            <div class="confirm-dialog">
    
              <div class="confirm-dialog-title">${escapeHtml(title)}</div>
    
              <div class="confirm-dialog-message">${escapeHtml(message)}</div>
    
              <div class="confirm-dialog-actions">
    
                <button class="btn-cancel" onclick="this.closest('.confirm-dialog-overlay').remove(); window.__confirmResolve__(false);">Cancel</button>
    
                <button class="btn-confirm" onclick="this.closest('.confirm-dialog-overlay').remove(); window.__confirmResolve__(true);">Confirm</button>
    
              </div>
    
            </div>
    
          `;
    
          document.body.appendChild(overlay);
    
          // Store resolve function globally temporarily
    
          window.__confirmResolve__ = resolve;
    
          // Close on overlay click (outside dialog)
    
          overlay.addEventListener('click', (e) => {
    
            if (e.target === overlay) {
    
              overlay.remove();
    
              resolve(false);
    
            }
    
          });
    
        });
    
      }
    
      function escapeHtml(text) {
    
        const div = document.createElement('div');
    
        div.textContent = text;
    
        return div.innerHTML;
    
      }
    
      /**
    
       * Show a prompt dialog with input field
    
       * @param {string} message - The message to display
    
       * @param {string} title - The dialog title
    
       * @param {string} defaultValue - Default input value
    
       * @param {string} placeholder - Input placeholder
    
       * @returns {Promise<string|null>} - Resolves to input value if confirmed, null if cancelled
    
       */
    
      function showPrompt(message, title = 'Input', defaultValue = '', placeholder = '') {
    
        return new Promise((resolve) => {
    
          const overlay = document.createElement('div');
    
          overlay.className = 'confirm-dialog-overlay';
    
          overlay.innerHTML = `
    
            <div class="confirm-dialog" style="max-width: 500px;">
    
              <div class="confirm-dialog-title">${escapeHtml(title)}</div>
    
              <div class="confirm-dialog-message">${escapeHtml(message)}</div>
    
              <div style="margin-bottom: 1.5rem;">
    
                <input type="text" id="promptInput" class="form-group input" style="width: 100%; padding: 0.875rem; border: 2px solid var(--border-color); border-radius: 10px; font-size: 1rem;" value="${escapeHtml(defaultValue)}" placeholder="${escapeHtml(placeholder)}" autofocus>
    
              </div>
    
              <div class="confirm-dialog-actions">
    
                <button class="btn-cancel" onclick="this.closest('.confirm-dialog-overlay').remove(); window.__promptResolve__(null);">Cancel</button>
    
                <button class="btn-confirm" onclick="const input = document.getElementById('promptInput'); this.closest('.confirm-dialog-overlay').remove(); window.__promptResolve__(input.value);">Confirm</button>
    
              </div>
    
            </div>
    
          `;
    
          document.body.appendChild(overlay);
    
          // Store resolve function globally temporarily
    
          window.__promptResolve__ = resolve;
    
          // Focus input
    
          setTimeout(() => {
    
            const input = document.getElementById('promptInput');
    
            if (input) {
    
              input.focus();
    
              input.select();
    
            }
    
          }, 100);
    
          // Handle Enter key
    
          const input = document.getElementById('promptInput');
    
          if (input) {
    
            input.addEventListener('keypress', (e) => {
    
              if (e.key === 'Enter') {
    
                overlay.remove();
    
                resolve(input.value);
    
              }
    
            });
    
          }
    
          // Close on overlay click (outside dialog)
    
          overlay.addEventListener('click', (e) => {
    
            if (e.target === overlay) {
    
              overlay.remove();
    
              resolve(null);
    
            }
    
          });
    
          // Handle Escape key
    
          const handleEscape = (e) => {
    
            if (e.key === 'Escape') {
    
              overlay.remove();
    
              resolve(null);
    
              document.removeEventListener('keydown', handleEscape);
    
            }
    
          };
    
          document.addEventListener('keydown', handleEscape);
    
        });
    
      }
    
      // Make functions globally available
    
      window.showNotification = showNotification;
    
      window.showConfirm = showConfirm;
    
      window.showPrompt = showPrompt;

Commits

Commit	Author	Date	Message	File SHA	Actions
`f0438c2`	<f69e50@finnacloud.com> 1766443042 +0300	12/22/2025, 10:37:22 PM	increment once more	`6f6f26b`	Hide
`188fc92`	<f69e50@finnacloud.com> 1766442998 +0300	12/22/2025, 10:36:38 PM	increment	`6f6f26b`	View
`4617f76`	<f69e50@finnacloud.com> 1766442953 +0300	12/22/2025, 10:35:53 PM	rename branch from main to master oops	`6f6f26b`	View
`e6d1548`	<f69e50@finnacloud.com> 1766442769 +0300	12/22/2025, 10:32:49 PM	add initial test workflow file	`6f6f26b`	View
`9c24ca4`	<f69e50@finnacloud.com> 1766442705 +0300	12/22/2025, 10:31:45 PM	add CI configuration and test script for Jenkins build	`6f6f26b`	View
`690c1f6`	<f69e50@finnacloud.com> 1766368110 +0300	12/22/2025, 1:48:30 AM	initialize backend structure with controllers, DTOs, and configuration files	`6f6f26b`	View

1	// Notification System - Replaces alerts and confirms
2
3	/**
4	* Show a notification message
5	* @param {string} message - The message to display
6	* @param {string} type - 'success', 'error', 'warning', 'info'
7	* @param {number} duration - Auto-close duration in ms (0 = don't auto-close)
8	*/
9	function showNotification(message, type = 'info', duration = 5000) {
10	const container = document.getElementById('notificationContainer');
11	if (!container) {
12	console.warn('Notification container not found');
13	return;
14	}
15
16	const notification = document.createElement('div');
17	notification.className = `notification ${type}`;
18
19	const titles = {
20	success: 'Success',
21	error: 'Error',
22	warning: 'Warning',
23	info: 'Info'
24	};
25
26	notification.innerHTML = `
27	<div class="notification-content">
28	<div class="notification-title">${titles[type] \|\| 'Notification'}</div>
29	<div class="notification-message">${escapeHtml(message)}</div>
30	</div>
31	<button class="notification-close" onclick="this.parentElement.remove()" aria-label="Close">×</button>
32	`;
33
34	container.appendChild(notification);
35
36	// Auto-remove after duration
37	if (duration > 0) {
38	setTimeout(() => {
39	if (notification.parentElement) {
40	notification.style.animation = 'slideInRight 0.3s ease-out reverse';
41	setTimeout(() => notification.remove(), 300);
42	}
43	}, duration);
44	}
45
46	return notification;
47	}
48
49	/**
50	* Show a confirmation dialog
51	* @param {string} message - The message to display
52	* @param {string} title - The dialog title
53	* @returns {Promise<boolean>} - Resolves to true if confirmed, false if cancelled
54	*/
55	function showConfirm(message, title = 'Confirm') {
56	return new Promise((resolve) => {
57	const overlay = document.createElement('div');
58	overlay.className = 'confirm-dialog-overlay';
59
60	overlay.innerHTML = `
61	<div class="confirm-dialog">
62	<div class="confirm-dialog-title">${escapeHtml(title)}</div>
63	<div class="confirm-dialog-message">${escapeHtml(message)}</div>
64	<div class="confirm-dialog-actions">
65	<button class="btn-cancel" onclick="this.closest('.confirm-dialog-overlay').remove(); window.__confirmResolve__(false);">Cancel</button>
66	<button class="btn-confirm" onclick="this.closest('.confirm-dialog-overlay').remove(); window.__confirmResolve__(true);">Confirm</button>
67	</div>
68	</div>
69	`;
70
71	document.body.appendChild(overlay);
72
73	// Store resolve function globally temporarily
74	window.__confirmResolve__ = resolve;
75
76	// Close on overlay click (outside dialog)
77	overlay.addEventListener('click', (e) => {
78	if (e.target === overlay) {
79	overlay.remove();
80	resolve(false);
81	}
82	});
83	});
84	}
85
86	function escapeHtml(text) {
87	const div = document.createElement('div');
88	div.textContent = text;
89	return div.innerHTML;
90	}
91
92	/**
93	* Show a prompt dialog with input field
94	* @param {string} message - The message to display
95	* @param {string} title - The dialog title
96	* @param {string} defaultValue - Default input value
97	* @param {string} placeholder - Input placeholder
98	* @returns {Promise<string\|null>} - Resolves to input value if confirmed, null if cancelled
99	*/
100	function showPrompt(message, title = 'Input', defaultValue = '', placeholder = '') {
101	return new Promise((resolve) => {
102	const overlay = document.createElement('div');
103	overlay.className = 'confirm-dialog-overlay';
104
105	overlay.innerHTML = `
106	<div class="confirm-dialog" style="max-width: 500px;">
107	<div class="confirm-dialog-title">${escapeHtml(title)}</div>
108	<div class="confirm-dialog-message">${escapeHtml(message)}</div>
109	<div style="margin-bottom: 1.5rem;">
110	<input type="text" id="promptInput" class="form-group input" style="width: 100%; padding: 0.875rem; border: 2px solid var(--border-color); border-radius: 10px; font-size: 1rem;" value="${escapeHtml(defaultValue)}" placeholder="${escapeHtml(placeholder)}" autofocus>
111	</div>
112	<div class="confirm-dialog-actions">
113	<button class="btn-cancel" onclick="this.closest('.confirm-dialog-overlay').remove(); window.__promptResolve__(null);">Cancel</button>
114	<button class="btn-confirm" onclick="const input = document.getElementById('promptInput'); this.closest('.confirm-dialog-overlay').remove(); window.__promptResolve__(input.value);">Confirm</button>
115	</div>
116	</div>
117	`;
118
119	document.body.appendChild(overlay);
120
121	// Store resolve function globally temporarily
122	window.__promptResolve__ = resolve;
123
124	// Focus input
125	setTimeout(() => {
126	const input = document.getElementById('promptInput');
127	if (input) {
128	input.focus();
129	input.select();
130	}
131	}, 100);
132
133	// Handle Enter key
134	const input = document.getElementById('promptInput');
135	if (input) {
136	input.addEventListener('keypress', (e) => {
137	if (e.key === 'Enter') {
138	overlay.remove();
139	resolve(input.value);
140	}
141	});
142	}
143
144	// Close on overlay click (outside dialog)
145	overlay.addEventListener('click', (e) => {
146	if (e.target === overlay) {
147	overlay.remove();
148	resolve(null);
149	}
150	});
151
152	// Handle Escape key
153	const handleEscape = (e) => {
154	if (e.key === 'Escape') {
155	overlay.remove();
156	resolve(null);
157	document.removeEventListener('keydown', handleEscape);
158	}
159	};
160	document.addEventListener('keydown', handleEscape);
161	});
162	}
163
164	// Make functions globally available
165	window.showNotification = showNotification;
166	window.showConfirm = showConfirm;
167	window.showPrompt = showPrompt;
168

backend

File History: src/main/resources/static/js/notifications.js

File Content at Commit f0438c2

Commits