@formio/offline-plugin 5.4.1 → 5.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +55 -33
- package/lib/index.d.ts +1 -1
- package/offline.full.min.js +1 -1
- package/offlinePlugin.js +1 -1
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -10,10 +10,10 @@ The offline plugin uses IndexedDB to store records so the browser must support i
|
|
|
10
10
|
|
|
11
11
|
Offline mode is using features supported in the following browsers and later:
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
13
|
+
- Chrome v38
|
|
14
|
+
- Safari 7.1
|
|
15
|
+
- IE 11
|
|
16
|
+
- Firefox 13
|
|
17
17
|
|
|
18
18
|
## Installing the plugin
|
|
19
19
|
|
|
@@ -23,10 +23,10 @@ This module is now distributed via NPM and will require a premium license for us
|
|
|
23
23
|
|
|
24
24
|
`yarn add @formio/offline-plugin`
|
|
25
25
|
|
|
26
|
-
For more details please see our [help docs](https://help.form.io/deployments/maintenance-and-migration/premium-libraries).
|
|
27
|
-
|
|
26
|
+
For more details please see our [help docs](https://help.form.io/deployments/maintenance-and-migration/premium-libraries).
|
|
28
27
|
|
|
29
28
|
## Using the offline mode module in your project
|
|
29
|
+
|
|
30
30
|
To use this module, you will use the same process described @ https://help.form.io/developers/modules#using-a-module but for this module. This will
|
|
31
31
|
look like the following in your application.
|
|
32
32
|
|
|
@@ -37,92 +37,115 @@ import { OfflinePlugin } from '@formio/offline-plugin';
|
|
|
37
37
|
// You need to have a valid Library License key to use this package.
|
|
38
38
|
// If you don't have one yet, please contact sales@form.io.
|
|
39
39
|
Formio.license = 'yourLibraryLicenseKey';
|
|
40
|
-
Formio.use(
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
40
|
+
Formio.use(
|
|
41
|
+
OfflinePlugin(
|
|
42
|
+
'myproject-offline', // The name of this offline instance.
|
|
43
|
+
'https://myproject.form.io', // Your project URL
|
|
44
|
+
'path/to/project.json', // OPTIONAL: the exported project.json file.
|
|
45
|
+
),
|
|
46
|
+
);
|
|
45
47
|
```
|
|
46
48
|
|
|
47
|
-
The arguments that you provide to the
|
|
49
|
+
The arguments that you provide to the `OfflinePlugin` method are found below in the SDK section.
|
|
48
50
|
|
|
49
|
-
If you are using any of the Angular or React, wrappers, you may need to import the
|
|
51
|
+
If you are using any of the Angular or React, wrappers, you may need to import the `Formio` instance from those modules instead as follows.
|
|
50
52
|
|
|
51
53
|
```javascript
|
|
52
54
|
import { Formio } from '@formio/angular';
|
|
53
55
|
```
|
|
54
56
|
|
|
55
57
|
## Accessing the module
|
|
56
|
-
|
|
58
|
+
|
|
59
|
+
Once the module has been intialized, you can access the instance of this plugin anywhere in your application using the `getPlugin` API as follows.
|
|
57
60
|
|
|
58
61
|
```javascript
|
|
59
62
|
const OfflinePlugin = Formio.getPlugin('myproject-offline');
|
|
60
63
|
```
|
|
61
64
|
|
|
62
|
-
If you want to use a <script> tag directly in your HTML file instead
|
|
65
|
+
If you want to use a <script> tag directly in your HTML file instead\*:
|
|
63
66
|
|
|
64
67
|
```html
|
|
65
68
|
<script src="node_modules/@formio/offline-plugin/offline.full.min.js"></script>
|
|
66
69
|
```
|
|
67
70
|
|
|
68
|
-
|
|
71
|
+
\*Once you do this, the offline module will introduce a new global called `FormioOfflinePlugin`, which you can now use to register the OfflinePlugin as you did above using the following script.
|
|
69
72
|
|
|
70
73
|
```html
|
|
71
74
|
<script type="application/javascript">
|
|
72
|
-
Formio.use(
|
|
75
|
+
Formio.use(
|
|
76
|
+
FormioOfflinePlugin.OfflinePlugin(
|
|
77
|
+
'myproject-offline',
|
|
78
|
+
'https://myproject.form.io',
|
|
79
|
+
'path/to/project.json',
|
|
80
|
+
),
|
|
81
|
+
);
|
|
73
82
|
</script>
|
|
74
83
|
```
|
|
75
84
|
|
|
76
85
|
You can now embed your form as you normally would and it will use the offline mode system.
|
|
77
86
|
|
|
78
87
|
#### Deployed Servers
|
|
88
|
+
|
|
79
89
|
Deployed installations may also need to provide baseUrl and projectUrl. These tell the renderer the Base URL as well as the project URL being used when embedding the offline script.
|
|
80
90
|
|
|
81
91
|
```html
|
|
82
92
|
<script type="application/javascript">
|
|
83
93
|
Formio.setBaseUrl('https://forms.yourdomain.com');
|
|
84
94
|
Formio.setProjectUrl('https://forms.yourdomain.com/yourproject');
|
|
85
|
-
Formio.use(
|
|
95
|
+
Formio.use(
|
|
96
|
+
FormioOfflinePlugin.OfflinePlugin(
|
|
97
|
+
'myproject-offline',
|
|
98
|
+
'https://forms.yourdomain.com/yourproject',
|
|
99
|
+
'path/to/project.json',
|
|
100
|
+
),
|
|
101
|
+
);
|
|
86
102
|
</script>
|
|
87
103
|
```
|
|
88
104
|
|
|
89
105
|
## SDK
|
|
90
106
|
|
|
91
107
|
### OfflinePlugin(name, projectUrl, [projectJsonPath], [options])
|
|
108
|
+
|
|
92
109
|
Factory method that returns a Form.io Module which contains a new instance of the FormioOfflinePlugin class, which controls the offline mode for this project.
|
|
93
110
|
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
111
|
+
- **name**: This is a name you come up with to contexualize your offline mode for this project.
|
|
112
|
+
- **projectUrl**: This is the URL of the project this offline mode plugin is attached to.
|
|
113
|
+
- **projectJson** (optional): Providing this will provide the default project.json of your project. You can get this by exporting your project. If you do not provide this, then your application will need to request the Form online before it will cache that form to be used offline. By providing the url to this file, the offline mode will use the offline form by default and not have to send a request to the api.
|
|
114
|
+
- **options** (optional): Optional configurations to control how the offline module plugin behaves. The following options are allowed.
|
|
115
|
+
- **dequeueOnReconnect** - Set to true if you wish for the plugin to automatically dequeue the saved offline submissions as soon as an internet connection has been made.
|
|
116
|
+
- **queryFiltersTypes** - Default query arguments to add to the search queries for the submission index for caching purposes.
|
|
117
|
+
- **notToShowDeletedOfflineSubmissions** - Set to true if you do not wish to show deleted offline submissions in the submission index.
|
|
118
|
+
- **deleteErrorSubmissions** - Set to true if you wish to automatically delete submission errors.
|
|
102
119
|
|
|
103
120
|
### new FormioOfflinePlugin(projectUrl, [projectJsonPath])
|
|
121
|
+
|
|
104
122
|
Creates a new offline module instance for a project.
|
|
105
123
|
|
|
106
|
-
|
|
107
|
-
|
|
124
|
+
- **projectUrl**: This is the URL of the project this offline mode plugin is attached to.
|
|
125
|
+
- **projectJson** (optional): Providing this will provide the default project.json of your project. You can get this by exporting your project. If you do not provide this, then your application will need to request the Form online before it will cache that form to be used offline. By providing the url to this file, the offline mode will use the offline form by default and not have to send a request to the api.
|
|
108
126
|
|
|
109
127
|
## Saving forms and submissions offline
|
|
128
|
+
|
|
110
129
|
Once you register a plugin for a particular project, all load requests for forms and submissions in that project will automatically save and update in an offline browser data store.
|
|
111
130
|
|
|
112
131
|
For example, you can have all submissions for a form available offline if you call `formio.loadSubmissions()` at some point in your app while online.
|
|
113
132
|
|
|
114
133
|
## Loading forms and submissions offline
|
|
134
|
+
|
|
115
135
|
When your app goes offline, requests to load a form or submission will automatically return the data cached offline, if available.
|
|
116
136
|
|
|
117
137
|
## Submitting forms offline
|
|
138
|
+
|
|
118
139
|
Form submissions work a little bit differently when this plugin is registered. All form submissions, submission edits, and submission deletions are added to a queue. If the app is online, the queue will be emptied immediately and behave like normal. But when the app is offline, the submissions stay in the queue until the app goes back online. Until then, Formio.js will behave as if the submission was successful.
|
|
119
140
|
|
|
120
141
|
The queue will automatically start to empty when a submission is successfully made online, or you may [manually start](#plugindequeuesubmissions) it.
|
|
121
142
|
|
|
122
143
|
## Deleting submissions offline
|
|
123
|
-
|
|
144
|
+
|
|
145
|
+
When you delete a submission offline, this won't be deleted from the local DB, it will be just marked as '\_deleted'. The submission will be deleted from the local DB only in online, when the 'DELETE' request is sent. You can prevent showing deleted submissions in offline by setting the 'notToShowDeletedOfflineSubmissions' flag in the plugin's config to 'true'.
|
|
124
146
|
|
|
125
147
|
## Handling submission queue errors
|
|
148
|
+
|
|
126
149
|
Some queued submissions may fail when they are sent online (ex: unique validation fails on the server). In the event a queued submission fails, the queue is stopped and events are triggered to allow your app to resolve the bad submission before continuing. It's up to your app to decide how to handle these errors. Your app may decide to prompt the user to [fix the form submission](#pluginsetnextqueuedsubmissionrequest) or simply [ignore the submission](#pluginskipnextqueuedsubmission), and [restart the queue](#plugindequeuesubmissions).
|
|
127
150
|
|
|
128
151
|
## Plugin methods
|
|
@@ -163,7 +186,6 @@ Discards the next request in the submission queue.
|
|
|
163
186
|
|
|
164
187
|
You can use this to ignore a failed submission and then call [`dequeueSubmissions()`](#plugindequeuesubmissions) to continue to the next queued request.
|
|
165
188
|
|
|
166
|
-
|
|
167
189
|
## Events
|
|
168
190
|
|
|
169
191
|
You can listen for these events by adding listeners to the `Formio.events` EventEmitter.
|
|
@@ -201,7 +223,7 @@ Triggered when the queue becomes empty after dequeuing.
|
|
|
201
223
|
You may set `skipQueue` to save a submission immediately, skipping the queue. This will disable offline queuing for that submission. For example:
|
|
202
224
|
|
|
203
225
|
```javascript
|
|
204
|
-
formio.saveSubmission(submission, {skipQueue: true});
|
|
226
|
+
formio.saveSubmission(submission, { skipQueue: true });
|
|
205
227
|
```
|
|
206
228
|
|
|
207
229
|
If you are using the Angular ngFormio library, you can set the skipQueue option with formio-options:
|
|
@@ -212,8 +234,8 @@ If you are using the Angular ngFormio library, you can set the skipQueue option
|
|
|
212
234
|
|
|
213
235
|
## Build Commands
|
|
214
236
|
|
|
215
|
-
|
|
216
|
-
|
|
237
|
+
- `npm run build` - build for production
|
|
238
|
+
- `npm run watch` - automatically recompile during development
|
|
217
239
|
|
|
218
240
|
## FAQs
|
|
219
241
|
|
package/lib/index.d.ts
CHANGED