Skip to content

Commit 26d291e

Browse files
author
danil-nizamov
committed
updated readme
1 parent d7b47ee commit 26d291e

File tree

1 file changed

+2
-106
lines changed

1 file changed

+2
-106
lines changed

README.md

Lines changed: 2 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -18,28 +18,14 @@ A base HTML template that includes:
1818
- Help modal integration
1919
- Proper CSS and JavaScript loading
2020

21-
### 3. `io.js`
22-
Generic data persistence functions:
23-
- Load/save from local files
24-
- localStorage operations with configurable keys
25-
- Server save operations with configurable endpoints
26-
- Data validation and error handling
27-
28-
### 4. `auto-save.js`
29-
Automatic data persistence system:
30-
- Immediate localStorage saves
31-
- Periodic server synchronization
32-
- Configurable intervals and retry logic
33-
- Status reporting and error handling
34-
35-
### 5. `help-modal.js`
21+
### 3. `help-modal.js`
3622
A dependency-free JavaScript module for the help modal system:
3723
- Consistent modal behavior across all apps
3824
- Keyboard navigation (ESC to close)
3925
- Focus management
4026
- Custom event system
4127

42-
### 6. `help-content-template.html`
28+
### 4. `help-content-template.html`
4329
A template for creating consistent help content:
4430
- Table of contents navigation
4531
- Standardized section structure
@@ -179,56 +165,6 @@ You can override these variables in your app-specific CSS:
179165
}
180166
```
181167

182-
### Auto-Save API
183-
184-
The `AutoSave` class provides several methods:
185-
186-
```javascript
187-
// Initialize
188-
const autoSave = AutoSave.init({
189-
data: appData,
190-
filename: 'solution.json',
191-
localStorageKey: 'myapp:data',
192-
saveInterval: 1000,
193-
onStatusChange: setStatus,
194-
onDataChange: (data) => { /* custom logic */ },
195-
onError: (message, error) => { /* error handling */ }
196-
});
197-
198-
// Mark data as changed
199-
autoSave.markDirty();
200-
201-
// Manual save
202-
autoSave.saveNow();
203-
204-
// Load from localStorage
205-
const data = autoSave.loadFromLocalStorage();
206-
207-
// Destroy the auto-save system
208-
autoSave.destroy();
209-
```
210-
211-
### IO API
212-
213-
The `IO` object provides generic data persistence functions:
214-
215-
```javascript
216-
// Load from file
217-
const data = await IO.loadFromFile('data.json');
218-
219-
// Save to localStorage
220-
IO.saveToLocalStorage(data, 'myapp:data');
221-
222-
// Load from localStorage
223-
const data = IO.loadFromLocalStorage('myapp:data');
224-
225-
// Save to server
226-
await IO.saveToServer(data, 'solution.json', '/api/save');
227-
228-
// Validate data
229-
IO.validateData(data);
230-
```
231-
232168
### Help Modal API
233169

234170
The `HelpModal` class provides several methods:
@@ -248,29 +184,6 @@ modal.updateContent(newHelpContent);
248184
modal.destroy();
249185
```
250186

251-
### Events
252-
253-
The help modal dispatches custom events:
254-
255-
```javascript
256-
document.getElementById('btn-help').addEventListener('helpModal:open', (e) => {
257-
console.log('Help modal opened');
258-
});
259-
260-
document.getElementById('btn-help').addEventListener('helpModal:close', (e) => {
261-
console.log('Help modal closed');
262-
});
263-
```
264-
265-
## Design Principles
266-
267-
1. **Consistency**: All applications share the same visual language
268-
2. **Accessibility**: Proper focus management, keyboard navigation, and ARIA labels
269-
3. **Responsiveness**: Works on desktop and mobile devices
270-
4. **Theme Support**: Automatic light/dark mode detection
271-
5. **Modularity**: Components can be used independently
272-
6. **Zero Dependencies**: No external JavaScript libraries required
273-
274187
## File Structure
275188

276189
```
@@ -281,20 +194,3 @@ generalised/
281194
├── help-content-template.html # Help content template
282195
└── README.md # This file
283196
```
284-
285-
## Browser Support
286-
287-
- Modern browsers (Chrome, Firefox, Safari, Edge)
288-
- ES6+ features (classes, arrow functions, template literals)
289-
- CSS Grid and Flexbox
290-
- CSS Custom Properties
291-
292-
## Contributing
293-
294-
When adding new components or modifying existing ones:
295-
296-
1. Maintain backward compatibility
297-
2. Follow the established naming conventions
298-
3. Test across different themes and screen sizes
299-
4. Update this README with any new features
300-
5. Ensure accessibility standards are met

0 commit comments

Comments
 (0)