Skip to content

Commit 65e57d2

Browse files
committed
Merge pull request #28 from dominikmatt/develop
v0.4.2
2 parents 56331a4 + 1b9badc commit 65e57d2

File tree

8 files changed

+280
-1
lines changed

8 files changed

+280
-1
lines changed

README.md

+13
Original file line numberDiff line numberDiff line change
@@ -165,6 +165,19 @@ trackingJS.updateEvents();
165165
ecTracking.send();
166166
```
167167

168+
### Bundles
169+
Include `eventBundle/bundleName.js` script:
170+
```html
171+
<script src="/scripts/eventBundle/authBundle.js"></script>
172+
```
173+
174+
Add the option with all bundles on the Construct
175+
```
176+
eventBundles: ['auth', 'link', 'video']
177+
´´´
178+
179+
-> use the bundle
180+
168181
### multiTracking
169182
Include `multiTrack.js` script:
170183
```html

bower.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "trackingJS",
3-
"version": "0.4.1",
3+
"version": "0.4.2",
44
"homepage": "https://github.com/dominikmatt/trackingJS",
55
"authors": [
66
"Dominik Matt <[email protected]>"

example/bundles/link.html

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head lang="en">
4+
<meta charset="UTF-8">
5+
<title></title>
6+
</head>
7+
<body>
8+
<a href="http://www.test.at">external link to same tab</a><br />
9+
<a href="http://www.test.at" target="_blank">external link to new tab</a><br />
10+
<a href="tel:0043664123456">Phone</a><br />
11+
<a href="mailto:[email protected]">Mailto</a>
12+
13+
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
14+
<script src="/scripts/adapter/ua.js"></script>
15+
<script src="/scripts/tracking.js"></script>
16+
<script src="/scripts/eventBundle/linkBundle.js"></script>
17+
18+
<script type="text/javascript">
19+
var tracking = new trackingJS({
20+
namespace: 'linkBundle',
21+
type: 'ua',
22+
analyticsCode: 'UA-57009541-1',
23+
url: 'auto',
24+
pageview: false,
25+
anonymizeIp: true,
26+
debug: true,
27+
eventBundles: ['link']
28+
});
29+
30+
</script>
31+
</body>
32+
</html>

example/bundles/video.html

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head lang="en">
4+
<meta charset="UTF-8">
5+
<title></title>
6+
</head>
7+
<body>
8+
<video width="320" height="240" controls>
9+
<source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4">
10+
<source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv" type="video/ogg">
11+
Your browser does not support the video tag.
12+
</video>
13+
14+
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
15+
<script src="/scripts/adapter/ua.js"></script>
16+
<script src="/scripts/tracking.js"></script>
17+
<script src="/scripts/eventBundle/videoBundle.js"></script>
18+
19+
<script type="text/javascript">
20+
var tracking = new trackingJS({
21+
namespace: 'linkBundle',
22+
type: 'ua',
23+
analyticsCode: 'UA-57009541-1',
24+
url: 'auto',
25+
pageview: false,
26+
anonymizeIp: true,
27+
debug: true,
28+
eventBundles: ['video']
29+
});
30+
31+
setTimeout(function() {
32+
$('body').append('<video width="320" height="240" controls id="video-id">' +
33+
'<source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4">' +
34+
'<source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv" type="video/ogg"> ' +
35+
'</video>')
36+
tracking.bundles.video.registerVideo('video-id');
37+
}, 6000);
38+
39+
</script>
40+
</body>
41+
</html>

scripts/eventBundle/linkBundle.js

+78
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
/**
2+
* link Bundle
3+
*
4+
* @author Dominik Matt <[email protected]>
5+
*/
6+
trackingJS.prototype.eventBundles.link = function() {
7+
this.bundleName = 'link';
8+
9+
/**
10+
* @mehtod init
11+
*
12+
* @param tracking
13+
*/
14+
this.init = function init(tracking) {
15+
this.tracking = tracking;
16+
bindDomEvents();
17+
};
18+
19+
/**
20+
* @method bindDomEvents
21+
*
22+
* @type {function(this:trackingJS.prototype.eventBundles)}
23+
*/
24+
var bindDomEvents = function() {
25+
$('body').on('click', 'a', linkHandler.bind(this));
26+
}.bind(this);
27+
28+
/**
29+
* @method linkHandler
30+
*
31+
* @param event
32+
* @returns {boolean}
33+
*/
34+
var linkHandler = function(event) {
35+
var $el = $(event.currentTarget),
36+
href = $el.attr('href'),
37+
target = $el.attr('target'),
38+
external = new RegExp('^((f|ht)tps?:)?//(?!' + location.host + ')');
39+
40+
// phone
41+
if(/tel:/.test(href)) {
42+
this.tracking.event(
43+
'Phone',
44+
'Phone - Click',
45+
'Phone: ' + $el.text() + ' - Number: ' + href.replace('tel:', '')
46+
);
47+
//mailto
48+
} else if(/mailto:/.test(href)) {
49+
this.tracking.event(
50+
'Mail',
51+
'Mail - Click',
52+
'Mail: ' + $el.text() + ' - Mail: ' + href.replace('mailto:', '')
53+
);
54+
//external link
55+
} else if(external.test(href)){
56+
//if the link is open in the same tab we wait for the event
57+
if(target != '_blank') {
58+
this.tracking.event(
59+
'External Link',
60+
'External Link - Click',
61+
'External Link: ' + $el.text() + ' - Link: ' + href,
62+
null,
63+
function() {
64+
location.href = href;
65+
});
66+
67+
event.preventDefault();
68+
return false;
69+
} else {
70+
this.tracking.event(
71+
'External Link',
72+
'External Link - Click',
73+
'External Link: ' + $el.text() + ' - Link: ' + href
74+
);
75+
}
76+
}
77+
}
78+
};

scripts/eventBundle/linkBundle.md

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
#link-Bundle
2+
- external link (Event on Click)
3+
External Link // External Link - Click // External Link: name* - Link: url*
4+
- mailto: (Event on Click)
5+
Mail // Mail - Click // Mail: name* - Mail: address*
6+
- tel: (Event on Click)
7+
Phone // Phone - Click // Phone: name* // Phone: name* - Number: phonenumber*

scripts/eventBundle/videoBundle.js

+97
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
/**
2+
* video Bundle
3+
*
4+
* @author Dominik Matt <[email protected]>
5+
*/
6+
trackingJS.prototype.eventBundles.video = function() {
7+
this.bundleName = 'video';
8+
this.videoEl = document.getElementsByTagName('video');
9+
10+
//on stop video the video api trigger onpause and onstop
11+
var pauseTimeout,
12+
tracking;
13+
14+
/**
15+
* @method init
16+
*
17+
* @param tracking
18+
*/
19+
this.init = function init(t) {
20+
tracking = t;
21+
bindEvents();
22+
};
23+
24+
/**
25+
* @method bindEvents
26+
*/
27+
var bindEvents = function() {
28+
for(var key = 0; key < this.videoEl.length; key++) {
29+
videoHandler.call(this.videoEl[key]);
30+
}
31+
}.bind(this);
32+
33+
var videoHandler = function() {
34+
this.onplay = playHandler;
35+
this.onended = endHandler;
36+
this.onpause = pauseHandler;
37+
};
38+
39+
/**
40+
* @method playHandler
41+
*/
42+
var playHandler = function() {
43+
console.log(tracking);
44+
tracking.event(
45+
'Video',
46+
'Video - Play',
47+
'Video: ' + getSource.call(this), this.currentTime
48+
);
49+
};
50+
51+
/**
52+
* @method pauseHandler
53+
*/
54+
var pauseHandler = function() {
55+
pauseTimeout = setTimeout(function() {
56+
tracking.event(
57+
'Video',
58+
'Video - Pause',
59+
'Video: ' + getSource.call(this), this.currentTime
60+
);
61+
}.bind(this), 50);
62+
};
63+
64+
/**
65+
* @method endHandler
66+
*/
67+
var endHandler = function() {
68+
clearTimeout(pauseTimeout);
69+
tracking.event(
70+
'Video',
71+
'Video - Stop',
72+
'Video: ' + getSource.call(this), this.currentTime
73+
);
74+
};
75+
76+
/**
77+
* @method getSource
78+
*
79+
* @returns {string}
80+
*/
81+
var getSource = function() {
82+
var source = this.currentSrc.split('/');
83+
84+
return source[source.length - 1];
85+
};
86+
87+
/**
88+
* @method registerVideo
89+
*
90+
* @param id
91+
*/
92+
this.registerVideo = function(id) {
93+
var video = document.getElementById(id);
94+
videoHandler.call(video);
95+
}
96+
97+
};

scripts/eventBundle/videoBundle.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
#video-Bundle
2+
- play (Event on video play)
3+
Video // Video - Play // Video: filename* // videotime*
4+
- pause (Event on video pause)
5+
Video // Video - Pause // Video: filename* // videotime*
6+
- end (Event on video end)
7+
Video // Video - Stop // Video: filename* // videotime*
8+
9+
###Mehtods
10+
#####registerVideo
11+
id: id of the video tag (example: video-container)

0 commit comments

Comments
 (0)