@blueconic/blueconic-react-native 1.2.0 → 2.0.0
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/BlueConicReactNative.podspec +23 -23
- package/CHANGELOG.md +88 -75
- package/LICENSE +3 -3
- package/README.md +484 -511
- package/android/build.gradle +38 -41
- package/android/gradle/wrapper/gradle-wrapper.properties +6 -6
- package/android/gradlew +172 -172
- package/android/local.properties +8 -8
- package/android/src/main/AndroidManifest.xml +5 -5
- package/android/src/main/java/com/blueconic/blueconicreactnative/BlueConicClientModule.java +870 -857
- package/android/src/main/java/com/blueconic/blueconicreactnative/BlueConicClientModuleHelper.java +17 -17
- package/android/src/main/java/com/blueconic/blueconicreactnative/BlueConicClientPackage.java +29 -29
- package/android/src/main/java/com/blueconic/blueconicreactnative/BlueConicInteraction.java +68 -68
- package/index.js +6 -6
- package/ios/BlueConicClient-Bridging-Header.h +6 -6
- package/ios/BlueConicClient.xcodeproj/project.xcworkspace/contents.xcworkspacedata +7 -7
- package/ios/BlueConicClient.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist +8 -8
- package/ios/BlueConicClient.xcodeproj/xcuserdata/youri.xcuserdatad/xcschemes/xcschememanagement.plist +14 -14
- package/ios/BlueConicClientModule.m +74 -72
- package/ios/BlueConicClientModule.swift +516 -506
- package/ios/BlueConicInteraction.swift +63 -63
- package/package.json +18 -18
- package/android/.idea/gradle.xml +0 -17
- package/android/.idea/misc.xml +0 -9
- package/android/.idea/modules/android.iml +0 -18
- package/android/.idea/modules.xml +0 -8
- package/android/.idea/vcs.xml +0 -6
- package/android/.idea/workspace.xml +0 -57
package/README.md
CHANGED
|
@@ -1,511 +1,484 @@
|
|
|
1
|
-
|
|
2
|
-
# BlueConic SDK for React Native
|
|
3
|
-
|
|
4
|
-
## Getting started
|
|
5
|
-
|
|
6
|
-
`$ npm install @blueconic/blueconic-react-native --save`
|
|
7
|
-
|
|
8
|
-
`$ react-native link @blueconic/blueconic-react-native`
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
## Usage
|
|
12
|
-
Before you start implementing the SDK, use the following steps to set up your environment:
|
|
13
|
-
|
|
14
|
-
#### React Native
|
|
15
|
-
Run the following command in your React Native project's root folder
|
|
16
|
-
|
|
17
|
-
`$ npm install @blueconic/blueconic-react-native`
|
|
18
|
-
|
|
19
|
-
Or include it to your React Native project's package.json
|
|
20
|
-
|
|
21
|
-
```
|
|
22
|
-
{
|
|
23
|
-
"react": "16.8.6",
|
|
24
|
-
"react-native": "0.60.4",
|
|
25
|
-
"@blueconic/blueconic-react-native": "^
|
|
26
|
-
}
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
-
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
```
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
```
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
```
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
```
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
<
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
```
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
```
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
```
|
|
209
|
-
|
|
210
|
-
####
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
###
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
```
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
BlueConicClient.
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
```
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
Parameter `
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
```
|
|
392
|
-
BlueConicClient.
|
|
393
|
-
```
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
```
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
Parameter `
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
```
|
|
486
|
-
|
|
487
|
-
Parameter `selector` The selector, which can be used in the listener rules, to listen on
|
|
488
|
-
Parameter `values` context of the click event
|
|
489
|
-
|
|
490
|
-
### registerUpdateValuesEvent(selector: String, values: String[])
|
|
491
|
-
Register a user update values event. For the event, a selector can be passed to trigger BlueConic Listeners, to execute their logic.
|
|
492
|
-
|
|
493
|
-
```
|
|
494
|
-
BlueConicClient.registerUpdateValuesEvent("#updateHobby", ["tennis","soccer"]);
|
|
495
|
-
```
|
|
496
|
-
|
|
497
|
-
Parameter `selector` The selector, which can be used in the listener rules, to listen on
|
|
498
|
-
|
|
499
|
-
Parameter `values` context of the update values event
|
|
500
|
-
|
|
501
|
-
### registerAdvancedEvent(name: String, values: String[])
|
|
502
|
-
Register a user update values event. For the event, a selector can be passed to trigger BlueConic Listeners, to execute their logic.
|
|
503
|
-
|
|
504
|
-
```
|
|
505
|
-
BlueConicClient.registerAdvancedEvent("facebookLike", ["+1"]);
|
|
506
|
-
```
|
|
507
|
-
|
|
508
|
-
Parameter `name` The name of the advanced even, which can be used in the listener rules, to listen on
|
|
509
|
-
|
|
510
|
-
Parameter `values` context of the advanced event
|
|
511
|
-
|
|
1
|
+
|
|
2
|
+
# BlueConic SDK for React Native
|
|
3
|
+
|
|
4
|
+
## Getting started
|
|
5
|
+
|
|
6
|
+
`$ npm install @blueconic/blueconic-react-native --save`
|
|
7
|
+
|
|
8
|
+
`$ react-native link @blueconic/blueconic-react-native`
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
Before you start implementing the SDK, use the following steps to set up your environment:
|
|
13
|
+
|
|
14
|
+
#### React Native
|
|
15
|
+
Run the following command in your React Native project's root folder
|
|
16
|
+
|
|
17
|
+
`$ npm install @blueconic/blueconic-react-native`
|
|
18
|
+
|
|
19
|
+
Or include it to your React Native project's package.json
|
|
20
|
+
|
|
21
|
+
```
|
|
22
|
+
{
|
|
23
|
+
"react": "16.8.6",
|
|
24
|
+
"react-native": "0.60.4",
|
|
25
|
+
"@blueconic/blueconic-react-native": "^2.0.0"
|
|
26
|
+
}
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## iOS implementation of the React Native App
|
|
31
|
+
|
|
32
|
+
#### 1. Add the .xcodeproj file of the BlueConicClient library
|
|
33
|
+
- In Xcode, add the `.xcodeproj` file of the BlueConicClient library to the Libraries group of the project, you can find the `BlueConicClient.xcodeproj` in your app's node_modules in. To do this, drag and drop the `.xcodeproj` file to the Libraries group in Xcode.
|
|
34
|
+
```
|
|
35
|
+
node_modules/@blueconic/blueconic-react-native/ios
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
- The `.xcodeproj` will include a Product folder, make sure the `libBlueConicClient.a` library is added to the Link Binary with Libraries section of the Build Phases of the app's target
|
|
39
|
+
- The package is dependent on react-native. It searches for the react-native headers both in your project’s node `modules/react-native/React` directory, as well as in `./ios/Pods/Headers/Public` in case react-native is used through CocoaPods. If the react-native headers are saved elsewhere, add the correct path to the Header Search Paths Build Setting of the BlueConicClient target.
|
|
40
|
+
|
|
41
|
+
#### 2. Add the configuration key for BlueConic:
|
|
42
|
+
Locate your app's Information Property List file under "Supporting Files".
|
|
43
|
+
Select <project>-Info.plist and add a new row by right clicking the top row and selecting "Add row". Set the following key name:
|
|
44
|
+
```
|
|
45
|
+
bc_server_url
|
|
46
|
+
```
|
|
47
|
+
Double-click the value field and enter the URL for the hostname of your BlueConic server. For example:
|
|
48
|
+
```
|
|
49
|
+
http://example.blueconic.net
|
|
50
|
+
```
|
|
51
|
+
#### 3. Locate your app's Information Property List file under "Supporting Files".
|
|
52
|
+
Select `<project>-Info.plist` and add a new row by right clicking the top row and selecting "Add row". Set the following key name:
|
|
53
|
+
```
|
|
54
|
+
URL types
|
|
55
|
+
```
|
|
56
|
+
This creates an array which contains more property rows. Open "URL types" by clicking the triangle icon in front of the name to display the rows. Right click "Item 0" and select "Add row". You can also add a new item, and add the new row within that item. Set the following key name:
|
|
57
|
+
```
|
|
58
|
+
URL Schemes
|
|
59
|
+
```
|
|
60
|
+
This creates another array. Add a new row to this array's "Item 0" and enter your apps "Bundle Identifier", for example:
|
|
61
|
+
```
|
|
62
|
+
com.blueconic.testApp
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
#### 4. Optionally, add a debug key for BlueConic:
|
|
66
|
+
Locate your app's Information Property List file under "Supporting Files".
|
|
67
|
+
Select <project>-Info.plist and add a new row by right clicking the top row and selecting "Add row". Set the following key name:
|
|
68
|
+
```
|
|
69
|
+
bc_debug
|
|
70
|
+
```
|
|
71
|
+
Click the type and select 'Boolean'. Set the value to "YES" if you want to receive debug logs from the BlueConic SDK. Adding a debug key is optional; if you do not want to receive debug logs from the SDK, you do not need to add it.
|
|
72
|
+
|
|
73
|
+
#### 5. Import BlueConic:
|
|
74
|
+
The BlueConic SDK for iOS enables you to set and retrieve profile property values for a BlueConic profile and enables interactions specific to this BlueConic profile. These methods can be used anywhere in the app. Make sure that you import the framework and get the instance before using the BlueConicClient methods:
|
|
75
|
+
```
|
|
76
|
+
// Swift:
|
|
77
|
+
import BlueConicClient
|
|
78
|
+
|
|
79
|
+
let client = BlueConicClient.getInstance(self)
|
|
80
|
+
|
|
81
|
+
// Objective C:
|
|
82
|
+
#import <BlueConicClient/BlueConicClient-swift.h>
|
|
83
|
+
```
|
|
84
|
+
```
|
|
85
|
+
BlueConicClient *client = [BlueConicClient getInstance:self];
|
|
86
|
+
** Make sure that you provide the current ViewController as argument when invoking getInstance. If no ViewController is available, pass an empty ViewController.
|
|
87
|
+
After you have added the URL Scheme value, select the AppDelegate class and add the following method to enable simulator functionality:
|
|
88
|
+
|
|
89
|
+
// Swift: in the AppDelegate.swift file
|
|
90
|
+
func application(_ application: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] ) -> Bool { BlueConicClient.getInstance(nil).setURL(url)
|
|
91
|
+
return true
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
// Objective-C: in the AppDelegate.m file
|
|
95
|
+
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
|
|
96
|
+
[[BlueConicClient getInstance:nil] setURL:url];
|
|
97
|
+
return YES;
|
|
98
|
+
}
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
## Android implementation of the React Native App
|
|
102
|
+
|
|
103
|
+
#### 1. Add the Android SDK blueconic-lib-<version>.aar to your app project as gradle module
|
|
104
|
+
* Create `blueconic` directory in your projects' in the `android` root directory
|
|
105
|
+
* Add `build.gradle` file with these contents:
|
|
106
|
+
|
|
107
|
+
```
|
|
108
|
+
configurations.maybeCreate("default")
|
|
109
|
+
artifacts.add("default", file('blueconic-lib-<version>.aar'))
|
|
110
|
+
```
|
|
111
|
+
|
|
112
|
+
Add the .aar file to the 'blueconic' directory, alongside the `build.gradle`.
|
|
113
|
+
You now have a gradle module called 'blueconic' which can be used in your app as well as in the BlueConic react-native NPM module.
|
|
114
|
+
|
|
115
|
+
#### 2. Include the React Native project in the settings.gradle
|
|
116
|
+
Append the following lines to the `android/settings.gradle` file.
|
|
117
|
+
|
|
118
|
+
```
|
|
119
|
+
include ':blueconic'
|
|
120
|
+
include ':blueconic_blueconic-react-native'
|
|
121
|
+
project(':blueconic_blueconic-react-native').projectDir = new File(rootProject.projectDir,
|
|
122
|
+
'../node_modules/@blueconic/blueconic-react-native/android')
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
This loads both the BlueConic React Native library as the BlueConic Android SDK.
|
|
126
|
+
|
|
127
|
+
#### 3. (Optionally) Set "allow backup"-option to true in the AndroidManifest.xml
|
|
128
|
+
It could be that the IDE requires to override the "allowBackup" options in order to build
|
|
129
|
+
Add/ change this option in the AndroidManifest.xml
|
|
130
|
+
|
|
131
|
+
```
|
|
132
|
+
android:allowBackup="true"
|
|
133
|
+
```
|
|
134
|
+
|
|
135
|
+
#### 4. Add permissions to the AndroidManifest.xml:
|
|
136
|
+
|
|
137
|
+
```
|
|
138
|
+
<uses-permission android:name="android.permission.INTERNET" />
|
|
139
|
+
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
|
|
140
|
+
```
|
|
141
|
+
|
|
142
|
+
#### 5. Add intent filters to the AndroidManifest.xml for connecting to the simulator:
|
|
143
|
+
Configure your appId at the android:scheme attribute in the code fragment below. For example `"com.test.testapp"`.
|
|
144
|
+
|
|
145
|
+
```
|
|
146
|
+
<activity android:name=".MainActivity" android:label="@string/app_name">
|
|
147
|
+
<intent-filter>
|
|
148
|
+
<action android:name="android.intent.action.MAIN"/>
|
|
149
|
+
<category android:name="android.intent.category.LAUNCHER"/>
|
|
150
|
+
</intent-filter>
|
|
151
|
+
<!-- Filter added for connecting to the simulator through mail .-->
|
|
152
|
+
<intent-filter>
|
|
153
|
+
<action android:name="android.intent.action.SEND"/>
|
|
154
|
+
<category android:name="android.intent.category.DEFAULT"/>
|
|
155
|
+
<data android:mimeType="text/plain"/>
|
|
156
|
+
</intent-filter>
|
|
157
|
+
<!-- Filter added for connecting to the simulator through a QR scan. -->
|
|
158
|
+
<intent-filter>
|
|
159
|
+
<action android:name="android.intent.action.VIEW"/>
|
|
160
|
+
<category android:name="android.intent.category.DEFAULT"/>
|
|
161
|
+
<category android:name="android.intent.category.BROWSABLE"/>
|
|
162
|
+
<data android:scheme="<Your appId>"/>
|
|
163
|
+
</intent-filter>
|
|
164
|
+
</activity>
|
|
165
|
+
```
|
|
166
|
+
|
|
167
|
+
#### 6. Add the configuration file for BlueConic:
|
|
168
|
+
Create a file named `blueconic_configuration.xml` in `/res/values/`:
|
|
169
|
+
```
|
|
170
|
+
<?xml version="1.0" encoding="utf-8"?>
|
|
171
|
+
<resources>
|
|
172
|
+
<string name="bc_server_url">[BlueConic server url]</string>
|
|
173
|
+
</resources>
|
|
174
|
+
```
|
|
175
|
+
Replace `[BlueConic server url]` with the protocol and hostname of the BlueConic server. For example `"http://example.blueconic.net"`:
|
|
176
|
+
```
|
|
177
|
+
<?xml version="1.0" encoding="utf-8"?>
|
|
178
|
+
<resources>
|
|
179
|
+
<string name="bc_server_url">http://example.blueconic.net</string>
|
|
180
|
+
</resources>
|
|
181
|
+
```
|
|
182
|
+
|
|
183
|
+
#### 7. Optionally, enable debug mode:
|
|
184
|
+
Add the following node to the configuration file
|
|
185
|
+
```
|
|
186
|
+
<bool name="bc_debug">true</bool>
|
|
187
|
+
```
|
|
188
|
+
|
|
189
|
+
Example configuration file:
|
|
190
|
+
```
|
|
191
|
+
<?xml version="1.0" encoding="utf-8"?>
|
|
192
|
+
<resources>
|
|
193
|
+
<string name="bc_server_url">http://example.blueconic.net</string>
|
|
194
|
+
<bool name="bc_debug">true</bool>
|
|
195
|
+
</resources>
|
|
196
|
+
```
|
|
197
|
+
|
|
198
|
+
## Using the BlueConicClient SDK in React Native apps:
|
|
199
|
+
#### 1. Import NativeModules in the app
|
|
200
|
+
Import the BlueConicClient module within your app
|
|
201
|
+
```
|
|
202
|
+
// React Native: in the Example.js file
|
|
203
|
+
import {
|
|
204
|
+
NativeModules
|
|
205
|
+
} from "react-native";
|
|
206
|
+
|
|
207
|
+
const {BlueConicClient} = NativeModules;
|
|
208
|
+
```
|
|
209
|
+
|
|
210
|
+
#### 2. Create a page view event each time the user switches screens
|
|
211
|
+
To keep track of every page viewed in the app, you are able to do so by creating a page view event. Make sure that a unique screen name is passed in the call. The screen name can be used in listener rules or to restrict interactions to specific screens.
|
|
212
|
+
```
|
|
213
|
+
// React Native: in the Example.js file
|
|
214
|
+
// Simple screen names, like 'main' pages
|
|
215
|
+
BlueConicClient.registerPageView("main");
|
|
216
|
+
|
|
217
|
+
// Unique screen names, e.g. per article
|
|
218
|
+
BlueConicClient.registerPageView("news/article/" + UID);
|
|
219
|
+
```
|
|
220
|
+
#### 3. Retrieving and storing profile properties:
|
|
221
|
+
The BlueConic SDK for React native enables you to set and retrieve profile property values for a BlueConic profile. These methods can be used anywhere in the app. The following example counts the number of times a page has been opened and stores this number in the BlueConic profile:
|
|
222
|
+
```
|
|
223
|
+
// React native: in the ExampleScreen.js file
|
|
224
|
+
import React, { Component } from 'react';
|
|
225
|
+
import {
|
|
226
|
+
Text,
|
|
227
|
+
View,
|
|
228
|
+
NativeModules
|
|
229
|
+
} from 'react-native';
|
|
230
|
+
const {BlueConicClient} = NativeModules;
|
|
231
|
+
const PROPERTY_ID = "pageCount";
|
|
232
|
+
|
|
233
|
+
export default class ExampleScreen extends Component {
|
|
234
|
+
constructor() {
|
|
235
|
+
super();
|
|
236
|
+
this.state {
|
|
237
|
+
pageCount: 0
|
|
238
|
+
};
|
|
239
|
+
this.updatePageCount();
|
|
240
|
+
}
|
|
241
|
+
updatePageCount = async() => {
|
|
242
|
+
const getProfileValueResult = await BlueConicClient.getProfileValue(PROPERTY_ID);
|
|
243
|
+
let pageCountValue = parseInt(getProfileResult) ?? 0;
|
|
244
|
+
BlueConicClient.setProfileValue(PROPERTY_ID, ++pageCountValue);
|
|
245
|
+
|
|
246
|
+
this.setState({
|
|
247
|
+
pageCount: pageCountValue
|
|
248
|
+
});
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
```
|
|
252
|
+
#### 4. Register events:
|
|
253
|
+
Calls to register an event can be done in the onLoad of a custom developed mobile Plugin. The code fragment shows how to trigger a click event. Possible events are: "VIEW", "CLICK" and "CONVERSION"
|
|
254
|
+
```
|
|
255
|
+
// React native: in the ExamplePlugin.js file
|
|
256
|
+
|
|
257
|
+
// Register Dialogue events
|
|
258
|
+
BlueConicClient.registerDialogueEvent("VIEW", this.interactionId);
|
|
259
|
+
BlueConicClient.registerDialogueEvent("CLICK", this.interactionId);
|
|
260
|
+
BlueConicClient.registerDialogueEvent("CONVERSION", this.interactionId);
|
|
261
|
+
|
|
262
|
+
// Register events through 'createEvent'
|
|
263
|
+
BlueConicClient.createEvent("VIEW", {
|
|
264
|
+
"interactionId": this.interactionId
|
|
265
|
+
}
|
|
266
|
+
```
|
|
267
|
+
|
|
268
|
+
## Configuring BlueConic
|
|
269
|
+
This section describes how to add the channel for your mobile application to your BlueConic universe as well as how to define your custom profile properties so that you can use them in BlueConic segments.
|
|
270
|
+
|
|
271
|
+
### Add the mobile channel to your universe
|
|
272
|
+
Before you can start measuring activity in your mobile applications and maintain values in visitor profile properties, the channel for your mobile application must be added to a domain in your BlueConic universe. The very first time that you start your application, BlueConic will detect it. It must then be added as a channel of the type "Mobile App" in a domain. See Managing channels for complete information.
|
|
273
|
+
|
|
274
|
+
### Custom profile properties
|
|
275
|
+
If you want your mobile application to be able to add custom properties to visitor profiles and use them in BlueConic segments, those custom profile properties must be added to your plugin. For complete information on writing a custom plugin, see Plugin Types. For information about adding custom profile properties, see profile properties.
|
|
276
|
+
|
|
277
|
+
## BlueConicClient Methods
|
|
278
|
+
Implementation of the BlueConic client, handling profile retrieval and storage. This may be from cache, persistent storage on the client or direct requests to the BlueConic server.
|
|
279
|
+
```
|
|
280
|
+
import {
|
|
281
|
+
NativeModules
|
|
282
|
+
} from "react-native";
|
|
283
|
+
const {BlueConicClient} = NativeModules;
|
|
284
|
+
```
|
|
285
|
+
### getProfileId() -> String
|
|
286
|
+
Returns the ID of the BlueConic Profile.
|
|
287
|
+
```
|
|
288
|
+
// with promise:
|
|
289
|
+
const profileId = await BlueConicClient.getProfileId();
|
|
290
|
+
|
|
291
|
+
// with callback:
|
|
292
|
+
BlueConicClient.getProfileIdWithCallback(profileId => {
|
|
293
|
+
|
|
294
|
+
});
|
|
295
|
+
```
|
|
296
|
+
`Return Value` The ID of the BlueConic profile
|
|
297
|
+
|
|
298
|
+
### getProfileValue(property: String) -> String
|
|
299
|
+
|
|
300
|
+
Returns the first value for a given profile property.
|
|
301
|
+
```
|
|
302
|
+
// with promise:
|
|
303
|
+
const hobby = await BlueConicClient.getProfileValue("hobby");
|
|
304
|
+
|
|
305
|
+
// with callback:
|
|
306
|
+
BlueConicClient.getProfileValueWithCallback("hobby", hobby => {
|
|
307
|
+
|
|
308
|
+
});
|
|
309
|
+
```
|
|
310
|
+
Parameter `property` The profile property to get the values for.
|
|
311
|
+
|
|
312
|
+
|
|
313
|
+
`Return Value` The first value
|
|
314
|
+
|
|
315
|
+
|
|
316
|
+
### getProfileValues(property: String) -> String[]
|
|
317
|
+
|
|
318
|
+
Return the values for a given profile property.
|
|
319
|
+
|
|
320
|
+
```
|
|
321
|
+
// with promise:
|
|
322
|
+
const hobbies = await BlueConicClient.getProfileValues("hobbies");
|
|
323
|
+
|
|
324
|
+
// with callback:
|
|
325
|
+
BlueConicClient.getProfileValuesWithCallback("hobbies", hobbies => {
|
|
326
|
+
|
|
327
|
+
});
|
|
328
|
+
```
|
|
329
|
+
Parameter `property` The profile property to get the values for.
|
|
330
|
+
|
|
331
|
+
|
|
332
|
+
`Return Value` A collection containing the values.
|
|
333
|
+
|
|
334
|
+
|
|
335
|
+
|
|
336
|
+
### addProfileValue(property: String, value: String)
|
|
337
|
+
Adds a single property value to the profile. If there are already values for a property the new value will be added. Values for a property need to be unique; passing the same value multiple times will have no effect.
|
|
338
|
+
|
|
339
|
+
```
|
|
340
|
+
BlueConicClient.addProfileValue("hobbies", "tennis");
|
|
341
|
+
```
|
|
342
|
+
Parameter `property` The profile property to add the values for.
|
|
343
|
+
|
|
344
|
+
Parameter `value` The property value to add to the profile.
|
|
345
|
+
|
|
346
|
+
|
|
347
|
+
|
|
348
|
+
### addProfileValues(property: String, values: String[])
|
|
349
|
+
Adds property values to the profile. The values from the collection are added to the profile. If there are already values for a property the new values will be added. Values for a property need to be unique; passing the same values multiple times will have no effect.
|
|
350
|
+
|
|
351
|
+
```
|
|
352
|
+
BlueConicClient.addProfileValues("hobbies", ["tennis", "soccer"]);
|
|
353
|
+
```
|
|
354
|
+
|
|
355
|
+
Parameter `property` The profile property to add the values for.
|
|
356
|
+
|
|
357
|
+
Parameter `values` The property values to add to the profile.
|
|
358
|
+
|
|
359
|
+
|
|
360
|
+
|
|
361
|
+
### setProfileValue(name: String, value: String)
|
|
362
|
+
It sets values on the profile. Passing a property that was already set with values will cause the old values to be removed.
|
|
363
|
+
|
|
364
|
+
```
|
|
365
|
+
BlueConicClient.setProfileValue("hobby", "tennis");
|
|
366
|
+
```
|
|
367
|
+
|
|
368
|
+
Parameter `property` The profile property to add the values for.
|
|
369
|
+
|
|
370
|
+
Parameter `values` The profile values to store.
|
|
371
|
+
|
|
372
|
+
|
|
373
|
+
|
|
374
|
+
### setProfileValues(name: String, values: String[])
|
|
375
|
+
It sets values on the profile. Passing a property that was already set with values will cause the old values to be removed.
|
|
376
|
+
|
|
377
|
+
```
|
|
378
|
+
BlueConicClient.setProfileValues("hobbies", ["tennis", "soccer"]);
|
|
379
|
+
```
|
|
380
|
+
Parameter `property` The profile property to add the values for.
|
|
381
|
+
|
|
382
|
+
Parameter `values` The profile values to store.
|
|
383
|
+
|
|
384
|
+
|
|
385
|
+
|
|
386
|
+
### setLocale(locale: String)
|
|
387
|
+
Setter for the locale to get the parameters for. By default, the default locale configured in BlueConic is used.
|
|
388
|
+
|
|
389
|
+
Note: the only valid locales currently are `'en_US'` and `'nl_NL'`.
|
|
390
|
+
|
|
391
|
+
```
|
|
392
|
+
BlueConicClient.setLocale("en_US");
|
|
393
|
+
```
|
|
394
|
+
Parameter `locale` The locale, e.g.‘en_US’.
|
|
395
|
+
|
|
396
|
+
### createEvent(eventType: String, properties: Object)
|
|
397
|
+
Registers an event of the specified type with the given properties. For a `“PAGEVIEW"` event a screen name can be passed, so interactions can be restricted on the where tab in BlueConic. For a `“VIEW"`, `“CLICK"` or `“CONVERSION"` event an interactionId should be passed to register the event for.
|
|
398
|
+
|
|
399
|
+
```
|
|
400
|
+
BlueConicClient.createEvent("PAGEVIEW", {
|
|
401
|
+
"screenName": "Main/HOMETAB"
|
|
402
|
+
});
|
|
403
|
+
BlueConicCLient.createEvent("VIEW", {
|
|
404
|
+
"interactionId": this.interactionId
|
|
405
|
+
}):
|
|
406
|
+
```
|
|
407
|
+
|
|
408
|
+
Parameter `eventType` The event type. (e.g:`"PAGEVIEW"`,`"VIEW"`,`“CLICK"`,`“CONVERSION"`)
|
|
409
|
+
|
|
410
|
+
|
|
411
|
+
Parameter `properties` A map with properties for the event.
|
|
412
|
+
|
|
413
|
+
|
|
414
|
+
|
|
415
|
+
## Register Methods
|
|
416
|
+
Methods to register events and page views
|
|
417
|
+
|
|
418
|
+
|
|
419
|
+
### registerPageView(screenName: String)
|
|
420
|
+
Registers a page event. For a “PAGEVIEW" event a screen name can be passed, so interactions can be restricted on the where tab in BlueConic.
|
|
421
|
+
|
|
422
|
+
```
|
|
423
|
+
BlueConicClient.registerPageView("Main/HOMETAB");
|
|
424
|
+
```
|
|
425
|
+
Parameter `screenName` The screen name for this page view
|
|
426
|
+
|
|
427
|
+
### registerDialogueEvent(eventType: String, interactionId: String)
|
|
428
|
+
Registers a dialogue event of the specified type with the given properties. For a “VIEW", “CLICK" or “CONVERSION" event an interactionId should be passed to register the event for.
|
|
429
|
+
|
|
430
|
+
```
|
|
431
|
+
BlueConicClient.registerDialogueEvent("VIEW", this.interactionId):
|
|
432
|
+
```
|
|
433
|
+
Parameter `eventType` The event type. (e.g:“VIEW",“CLICK",“CONVERSION")
|
|
434
|
+
|
|
435
|
+
Parameter `properties` A map with properties for the event.
|
|
436
|
+
|
|
437
|
+
|
|
438
|
+
## Register user event Methods
|
|
439
|
+
Methods to register events and page views
|
|
440
|
+
|
|
441
|
+
### registerClickEvent(selector: String)
|
|
442
|
+
|
|
443
|
+
|
|
444
|
+
Register a user click. For the event, a selector can be passed to trigger BlueConic Listeners, to execute their logic.
|
|
445
|
+
|
|
446
|
+
```
|
|
447
|
+
BlueConicClient.registerClickEvent("#homeButton");
|
|
448
|
+
```
|
|
449
|
+
Parameter `selector` The selector, which can be used in the listener rules, to listen on
|
|
450
|
+
|
|
451
|
+
|
|
452
|
+
|
|
453
|
+
### registerClickEventWithContext(selector: String, values: String[])
|
|
454
|
+
Register a user click. For the event, a selector can be passed to trigger BlueConic Listeners, to execute their logic.
|
|
455
|
+
|
|
456
|
+
```
|
|
457
|
+
BlueConicClient.registerClickEventWithContext("#homeButton", ["contextA","contextB"]);
|
|
458
|
+
```
|
|
459
|
+
|
|
460
|
+
Parameter `selector` The selector, which can be used in the listener rules, to listen on
|
|
461
|
+
Parameter `values` context of the click event
|
|
462
|
+
|
|
463
|
+
### registerUpdateValuesEvent(selector: String, values: String[])
|
|
464
|
+
Register a user update values event. For the event, a selector can be passed to trigger BlueConic Listeners, to execute their logic.
|
|
465
|
+
|
|
466
|
+
```
|
|
467
|
+
BlueConicClient.registerUpdateValuesEvent("#updateHobby", ["tennis","soccer"]);
|
|
468
|
+
```
|
|
469
|
+
|
|
470
|
+
Parameter `selector` The selector, which can be used in the listener rules, to listen on
|
|
471
|
+
|
|
472
|
+
Parameter `values` context of the update values event
|
|
473
|
+
|
|
474
|
+
### registerAdvancedEvent(name: String, values: String[])
|
|
475
|
+
Register a user update values event. For the event, a selector can be passed to trigger BlueConic Listeners, to execute their logic.
|
|
476
|
+
|
|
477
|
+
```
|
|
478
|
+
BlueConicClient.registerAdvancedEvent("facebookLike", ["+1"]);
|
|
479
|
+
```
|
|
480
|
+
|
|
481
|
+
Parameter `name` The name of the advanced even, which can be used in the listener rules, to listen on
|
|
482
|
+
|
|
483
|
+
Parameter `values` context of the advanced event
|
|
484
|
+
|