@alexsab-ru/scripts 0.0.4 → 0.1.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/README.md +74 -24
- package/lib/analytics.js +5 -5
- package/package.json +6 -6
package/README.md
CHANGED
|
@@ -1,36 +1,86 @@
|
|
|
1
|
-
# scripts
|
|
2
|
-
common libs for our websites
|
|
1
|
+
# @alexsab-ru/scripts
|
|
3
2
|
|
|
4
|
-
|
|
3
|
+
common libs for websites
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
5
6
|
```bash
|
|
6
|
-
pnpm i
|
|
7
|
+
pnpm i @alexsab-ru/scripts
|
|
8
|
+
```
|
|
9
|
+
|
|
10
|
+
## Analytics module
|
|
11
|
+
|
|
12
|
+
`reachGoal` and `pageView` functions push to `dataLayer` some data with goal name
|
|
13
|
+
```js
|
|
14
|
+
reachGoal("goalName");
|
|
15
|
+
pageView(goalName);
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
In GTM you can use them for send goals to your analytic system
|
|
19
|
+
|
|
20
|
+
```js
|
|
21
|
+
{
|
|
22
|
+
event: "reachGoal-goalName",
|
|
23
|
+
eventAction: "goalName"
|
|
24
|
+
}
|
|
7
25
|
```
|
|
8
26
|
|
|
9
|
-
|
|
27
|
+
Use example:
|
|
10
28
|
|
|
11
29
|
```js
|
|
12
|
-
import '/
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
window.WebsiteAnalytics.dataLayer("form-open");
|
|
22
|
-
window.WebsiteAnalytics.dataLayer("form-submit");
|
|
23
|
-
window.WebsiteAnalytics.dataLayer("form-required");
|
|
24
|
-
window.WebsiteAnalytics.dataLayer("form-submit");
|
|
25
|
-
window.WebsiteAnalytics.dataLayer("form-error");
|
|
30
|
+
import { reachGoal } from '@alexsab-ru/scripts';
|
|
31
|
+
|
|
32
|
+
// automatic assign from module
|
|
33
|
+
reachGoal("phone_click");
|
|
34
|
+
reachGoal("phone_copy");
|
|
35
|
+
reachGoal("phone_contextmenu");
|
|
36
|
+
reachGoal("email_click");
|
|
37
|
+
reachGoal("email_copy");
|
|
38
|
+
reachGoal("email_contextmenu");
|
|
26
39
|
```
|
|
27
40
|
|
|
28
|
-
|
|
41
|
+
For form's analytics you may use these goals
|
|
42
|
+
|
|
29
43
|
```js
|
|
30
|
-
|
|
44
|
+
reachGoal("form_open");
|
|
45
|
+
reachGoal("form_click"); // automatic assign from module
|
|
46
|
+
reachGoal("form_change"); // automatic assign from module
|
|
47
|
+
reachGoal("form_submit");
|
|
48
|
+
reachGoal("form_required");
|
|
49
|
+
reachGoal("form_error");
|
|
50
|
+
reachGoal("form_success");
|
|
31
51
|
```
|
|
32
52
|
|
|
33
|
-
|
|
53
|
+
`getFormDataObject` is needed for Calltouch request tag.
|
|
54
|
+
|
|
34
55
|
```js
|
|
35
|
-
|
|
36
|
-
|
|
56
|
+
import { getFormDataObject } from '@alexsab-ru/scripts';
|
|
57
|
+
|
|
58
|
+
document.querySelectorAll("form").forEach((form) => {
|
|
59
|
+
form.onsubmit = async (event) => {
|
|
60
|
+
|
|
61
|
+
var formData = new FormData(form);
|
|
62
|
+
// ...
|
|
63
|
+
var formDataObj = getFormDataObject(formData, form.id);
|
|
64
|
+
|
|
65
|
+
await fetch("https://example.com/api/lead/", {
|
|
66
|
+
// ...
|
|
67
|
+
})
|
|
68
|
+
.then((res) => res.json())
|
|
69
|
+
.then((data) => {
|
|
70
|
+
if (data.answer == "required") {
|
|
71
|
+
reachGoal("form_required");
|
|
72
|
+
return;
|
|
73
|
+
} else if (data.answer == "error") {
|
|
74
|
+
reachGoal("form_error");
|
|
75
|
+
return;
|
|
76
|
+
} else {
|
|
77
|
+
reachGoal("form_success", formDataObj);
|
|
78
|
+
}
|
|
79
|
+
form.reset();
|
|
80
|
+
})
|
|
81
|
+
.catch((error) => {
|
|
82
|
+
reachGoal("form_error");
|
|
83
|
+
});
|
|
84
|
+
};
|
|
85
|
+
});
|
|
86
|
+
```
|
package/lib/analytics.js
CHANGED
|
@@ -15,7 +15,7 @@ export function pageView(eventAction, t = {}) {
|
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
export function dl(event, t = {}) {
|
|
18
|
-
console.log(event, t);
|
|
18
|
+
// console.log(event, t);
|
|
19
19
|
void 0 !== window.dataLayer && window.dataLayer.push({
|
|
20
20
|
event: event,
|
|
21
21
|
...t
|
|
@@ -86,13 +86,13 @@ export function addEmailGoals(item) {
|
|
|
86
86
|
{
|
|
87
87
|
selector: 'form input',
|
|
88
88
|
action: 'click',
|
|
89
|
-
goal: '
|
|
89
|
+
goal: 'form_click',
|
|
90
90
|
title: 'Клик в поле любой формы',
|
|
91
91
|
},
|
|
92
92
|
{
|
|
93
93
|
selector: 'form input',
|
|
94
94
|
action: 'change',
|
|
95
|
-
goal: '
|
|
95
|
+
goal: 'form_change',
|
|
96
96
|
title: 'Изменения полей любой формы',
|
|
97
97
|
},
|
|
98
98
|
|
|
@@ -101,7 +101,7 @@ export function addEmailGoals(item) {
|
|
|
101
101
|
goals.forEach(function(value, index, array){
|
|
102
102
|
if(value.goal != null) {
|
|
103
103
|
document.querySelectorAll(value.selector).forEach(function(element) {
|
|
104
|
-
console.log("Set \"" + value.goal + "\" goal", element);
|
|
104
|
+
// console.log("Set \"" + value.goal + "\" goal", element);
|
|
105
105
|
element.addEventListener(value.action, function(){
|
|
106
106
|
reachGoal(value.goal, {
|
|
107
107
|
title: value.title,
|
|
@@ -110,7 +110,7 @@ export function addEmailGoals(item) {
|
|
|
110
110
|
});
|
|
111
111
|
} else if(value.hit != null) {
|
|
112
112
|
document.querySelectorAll(value.selector).forEach(function(element) {
|
|
113
|
-
console.log("Set \"" + value.goal + "\" hit", element);
|
|
113
|
+
// console.log("Set \"" + value.goal + "\" hit", element);
|
|
114
114
|
element.addEventListener(value.action, function(){
|
|
115
115
|
pageView(value.hit, {
|
|
116
116
|
title: value.title,
|
package/package.json
CHANGED
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alexsab-ru/scripts",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
4
4
|
"description": "common libs for websites",
|
|
5
5
|
"main": "index.js",
|
|
6
|
-
"scripts": {
|
|
7
|
-
"test": "echo \"Error: no test specified\" && exit 1"
|
|
8
|
-
},
|
|
9
6
|
"repository": {
|
|
10
7
|
"type": "git",
|
|
11
8
|
"url": "git+https://github.com/alexsab-ru/scripts.git"
|
|
@@ -25,5 +22,8 @@
|
|
|
25
22
|
"publishConfig": {
|
|
26
23
|
"access": "public"
|
|
27
24
|
},
|
|
28
|
-
"homepage": "https://github.com/alexsab-ru/scripts#readme"
|
|
29
|
-
|
|
25
|
+
"homepage": "https://github.com/alexsab-ru/scripts#readme",
|
|
26
|
+
"scripts": {
|
|
27
|
+
"test": "echo \"Error: no test specified\" && exit 1"
|
|
28
|
+
}
|
|
29
|
+
}
|