webalytic · RusovDmitriy · Sep 6, 2020 · Sep 6, 2020 · Sep 6, 2020
diff --git a/README.md b/README.md
@@ -2,14 +2,16 @@
 
 This is open source web analytics platform, tracks and reports website traffic.  
 
-<img src="./docs/dashboard.jpg" width="800">
+<img src="./docs/images/dashboard.jpg" width="800">
 
 ## Features 
 
 - Support [Measurement Protocol](https://developers.google.com/analytics/devguides/collection/protocol/v1?hl=ru) (so far partial)
 - Collect client hits (page views, events, transactions)
 - Processes the client-interaction data with the configuration data 
 - Provides access to all the processed and **RAW** data
+- [Custom definition](./docs/customDefinition.md) with different scope (Hit | Session)
+- Web SDK - [webalytic.js](./docs/webalytic.js.md)
 - GeoNetwork data parsing with [maxmind](https://www.maxmind.com)
 - Produce domain events to [Nats Streaming](https://docs.nats.io/nats-streaming-concepts/intro) (create your custom subscribers module for any goals, example anti-fraud detector)
 - Microservices architecture, with shared [protobuf contracts](https://github.com/webalytic/protorepo)
@@ -22,16 +24,17 @@ The platform seeks to repeat processing logic described by Google Analytics, fol
 - [How a web session is defined in Analytics](https://support.google.com/analytics/answer/2731565?hl=en)
 - [Campaigns and traffic sources](https://support.google.com/analytics/answer/6205762?hl=en)
 
-Microservice architecture, project includes following packages:
+Monorepo includes following packages:
   - [Dashboard](./src/dashboard/README.md), Vue.js SPA
   - [Api-gateway](./src/api-gateway/README.md)
   - [Configuration](./src/configuration/README.md)
-  - [Log-collector & Web SDK](./src/log-collector/README.md)
+  - [Log-collector](./src/log-collector/README.md)
   - [Log-processing](./src/log-processing/README.md)
   - [Geoip](./src/geoip/README.md)
   - [Data-storage](./src/data-storage/README.md) with [Cube.JS](https://cube.dev/) API 
+  - [Web-sdk](./src/web-sdk/README.md)
 
-  <img src="./docs/WebAlyticMicroservices.jpg" width="800">
+  <img src="./docs/images/WebAlyticMicroservices.jpg" width="800">
 
 ## Run with docker-compose
 
@@ -68,17 +71,17 @@ You can find list of all env variables in sample [env file](./deploy/docker-comp
 
 - [x] Collect and provide base custom metrics and dimensions
 
-- [ ] Scope and settings for custom metrics and dimensions
+- [x] Scope and settings for custom metrics and dimensions
+
+- [x] New SDK
 
 - [ ] Conversions service: 
   - Goals, conversions and funnels
   - Grouping channel
   - Attribution (Last Click, Time Decay, Liner, Position Based, First Click)
 
-- [ ] Custom widget builder
-
 - [ ] Identity and access management service
 
-- [ ] Smart SDK
+- [ ] Custom widget builder
 
 - [ ] Kubernetes deploy with Helm
diff --git a/docs/customDefinition.md b/docs/customDefinition.md
@@ -0,0 +1,40 @@
+# Custom definitions
+
+Custom definitions are like default dimensions and metrics, except you create them yourself. You can use them to collect and analyze data that Webalytic doesn't automatically track.
+
+Creating either a custom dimension or metric is a two step process. First, set up the custom dimension or metric in your property. Then, modify your tracking code. You must complete these steps in order.
+
+## About Scopes
+
+Scope determines which hits will be associated with a particular custom-dimension value. There are two levels of scope: hit, session:
+
+- Hit – value is applied to the single hit for which it has been set.
+- Session – value is applied to all hits in a single session.
+
+## Set up custom definition
+
+1. Click `Admin`, and navigate to the custom definition.
+
+2. Click `Add Custom definition`.
+
+3. Select `Type`
+
+4. Add a `Name`. This can be any string, but use something unique so it’s not confused with any other dimension or metric in your reports.
+
+5. Select `Scope`. Choose to track at the Hit or Session level.
+
+7. Click `Save`.
+
+## Modify your tracking code
+
+```html
+<script>
+
+WebAlyticSDK('send', {
+  ...,
+  dimension1: 'male',
+  metric1: 101
+});
+
+</script>
+```
diff --git a/docs/GASchemaForTracker.png → docs/images/GASchemaForTracker.png b/docs/GASchemaForTracker.png → docs/images/GASchemaForTracker.png
diff --git a/docs/GATrafficSourceDetection.jpg → docs/images/GATrafficSourceDetection.jpg b/docs/GATrafficSourceDetection.jpg → docs/images/GATrafficSourceDetection.jpg
diff --git a/docs/SessionTacticalMap.jpg → docs/images/SessionTacticalMap.jpg b/docs/SessionTacticalMap.jpg → docs/images/SessionTacticalMap.jpg
diff --git a/docs/WebAlyticEventStorming.jpg → docs/images/WebAlyticEventStorming.jpg b/docs/WebAlyticEventStorming.jpg → docs/images/WebAlyticEventStorming.jpg
diff --git a/docs/WebAlyticMicroservices.jpg → docs/images/WebAlyticMicroservices.jpg b/docs/WebAlyticMicroservices.jpg → docs/images/WebAlyticMicroservices.jpg
diff --git a/docs/dashboard.jpg → docs/images/dashboard.jpg b/docs/dashboard.jpg → docs/images/dashboard.jpg
diff --git a/docs/webalytic.js.md b/docs/webalytic.js.md
@@ -0,0 +1,58 @@
+# Web SDK (webalytic.js)
+
+The webalytic.js library is a JavaScript library for measuring how users interact with your website. This document explains how to add the Webalytic SDK to your site.
+
+Webalytic SDK should be added to `<HEAD>` tag and before any other script or CSS tags, and add `resourceId` you wish to work with.
+
+```html
+<script>
+
+(function(t,e,c,n,a){t.WebAlyticObject=a,t[a]=t[a]||(t[a]=function(){
+(t[a].q=t[a].q||[]).push(arguments)});var r=document.createElement(c);
+r.type='text/javascript',r.async=!0,r.src=n;var s=document.getElementsByTagName('script')[0];
+s.parentNode.insertBefore(r,s)})(window,document,'script','http://localhost/lc/webalytic.js','WebAlyticSDK');
+
+
+WebAlyticSDK('create', { 
+  apiUrl: 'http://localhost/lc',
+  resourceId: 'XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX'
+});
+WebAlyticSDK('send', { hitType: 'pageview' });
+
+</script>
+```
+
+## The send method
+
+```html
+<script>
+
+// Send pageview
+WebAlyticSDK('send', { hitType: 'pageview' });
+
+// Send event
+WebAlyticSDK('send', {
+  hitType: 'event',
+  category: 'some-category',
+  action: 'purchase',
+  label: '12dawd0',
+  value: '10023'
+});
+
+</script>
+```
+
+## What data does the webalytic.js capture?
+
+When you add either of these script to your website, you send a pageview for each page your users visit. Webalytic processes this data and can infer a great deal of information including:
+
+- The total time a user spends on your site.
+- The time a user spends on each page and in what order those pages were visited.
+- What internal links were clicked (based on the URL of the next pageview).
+
+In addition: The IP address, user agent string, and initial page inspection that webalytic.js performs when creating a new tracker object is used to determine things like:
+
+- The geographic location of the user.
+- What browser and operating system are being used.
+- Screen size and whether Flash or Java is installed.
+- The referring site.