Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/aliyilmaz/synchronizer
This library is used to determine the fate of a form or local storage data. It can work with or without internet addiction.
https://github.com/aliyilmaz/synchronizer
localstorage serialization synchronizer vanillajs
Last synced: about 2 months ago
JSON representation
This library is used to determine the fate of a form or local storage data. It can work with or without internet addiction.
- Host: GitHub
- URL: https://github.com/aliyilmaz/synchronizer
- Owner: aliyilmaz
- License: gpl-3.0
- Created: 2024-01-29T11:12:50.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-01-30T17:38:51.000Z (about 1 year ago)
- Last Synced: 2024-01-30T19:10:37.163Z (about 1 year ago)
- Topics: localstorage, serialization, synchronizer, vanillajs
- Language: HTML
- Homepage:
- Size: 26.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# synchronizer
This library is used to determine the fate of a form or local storage data. It can work with or without internet addiction.
## Use
Add the library between the head codes of the page.
```html
```
### form
An example of determining the fate of form data within the specified time.It takes into account the specified form element.
```javascript
new synchronizer({
'online':true,
'delay':'1000', // The frequency of sending the request is 1 seconds
'source':'form', // storage, form
'element':'form#test', // Used when selected source form
'action': function(request) {
// With Axios or another Javascript library
// you can send the Request object
}
});
```
### storage
It is used to determine the fate of the data in Localstorage within a specified period of time. You must specify the `column` key in data type `String` or `Array` and update the `source` key to `storage`.
```javascript
new synchronizer({
'online':true, // When there is no internet connection, `true` is specified to wait
'delay':'1000', // The frequency of sending the request is 1 seconds
'column':['setting', 'user'], // Used when selected source storage
'source':'storage', // storage, form
'action': function(request) {
// With Axios or another Javascript library
// you can send the Request object
}
});
```
### Additional info:
It is not mandatory to specify the `delay` key. If `delay` is not specified, the program is run once. `delay` must be specified in **milliseconds** (For example: 1000 for 1 second). Specifying the `action` button is mandatory. The `online` key does not have to be specified. If the `online` switch is specified as `true`, the program will not run until there is internet.
### Scenarios:
#### form example
```html
Form
Name:
Gender:
Male
Woman
Other
Sport:
Swimming
Hiking
Soccer
Your Message:
Subscribe:
Groups:
User
Editor
Admin
Appointment day:
Monday
Tuesday
Wednesday
Thursday
Friday
Saturday
Sunday
File:
Files:
Send
new synchronizer({
'online':true,
'delay':'4000',
'source':'form',
'element':'form#test',
'action': function(request) {
// With Axios or another Javascript library
// you can send the Request object
/*
axios.post('form.php', request)
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
*/
}
});
```
#### storage example
```html
Storage
localStorage.setItem('setting', JSON.stringify({'coordinate':'39.90973623453719,32.82714843750001'}));
localStorage.setItem('user', JSON.stringify({'username':'ali'}));
new synchronizer({
'online':true,
'delay':'4000',
'column':['setting', 'user'],
'source':'storage',
'action': function(request) {
// With Axios or another Javascript library
// you can send the Request object
// console.log(request);
/*
axios.post('form.php', request)
.then(function (response) {
let data = JSON.parse(response.data);
console.log(data);
})
.catch(function (error) {
console.log(error);
});
*/
}
});
```