Merge pull request #27 from Kunstmaan/feature/default-segments

Feature/default segments
Kunstmaan · Jun 22, 2014 · 1b8f1ff · 1b8f1ff
2 parents 77437f3 + e03ee27
commit 1b8f1ff
Show file tree

Hide file tree

Showing 6 changed files with 87 additions and 7 deletions.
diff --git a/Controller/GoogleAnalyticsController.php b/Controller/GoogleAnalyticsController.php
@@ -145,6 +145,9 @@ public function configAction(Request $request)
         $params['disableGoals'] = $config->getDisableGoals();
         $params['configId'] = $config->getId();
 
+
+        $params['profileSegments'] = $configHelper->getProfileSegments();
+
         return $this->render(
             'KunstmaanDashboardBundle:GoogleAnalytics:setupcontainer.html.twig',
             $params

diff --git a/Helper/Google/Analytics/ConfigHelper.php b/Helper/Google/Analytics/ConfigHelper.php
@@ -333,6 +333,40 @@ public function getActiveProfile() {
             }
         }
 
+    /* =============================== PROFILE SEGMENTS =============================== */
+        /**
+         * get all segments for the saved profile
+         *
+         * @return array
+         */
+        public function getProfileSegments()
+        {
+            $profileSegments = $this
+                    ->serviceHelper
+                    ->getService()
+                    ->management_segments
+                    ->listManagementSegments()
+                    ->items;
+
+            $builtin = array();
+            $own = array();
+            foreach ($profileSegments as $segment) {
+                if ($segment->type == 'BUILT_IN') {
+                    $builtin[] = array(
+                        'name' => $segment->name,
+                        'query' => $segment->segmentId
+                    );
+                } else {
+                    $own[] = array(
+                        'name' => $segment->name,
+                        'query' => $segment->segmentId
+                    );
+                }
+            }
+
+            return array('builtin' => $builtin, 'own' => $own);
+        }
+
     /* =============================== CONFIG =============================== */
 
         /**

diff --git a/Resources/public/js/setup/setup.js b/Resources/public/js/setup/setup.js
@@ -197,14 +197,16 @@ $(function () {
             return false;
         });
 
-        function addSegmentInput() {
+        function addSegmentInput(name, query) {
+            if (!name) { name = ''; }
+            if (!query) { query = ''; }
             // create an id
             var id = $.now();
 
             // create elements
             var segmentDiv = $('<div>', {'id' : 'segmentDiv'+id});
-            var segmentInput = $('<input>', { 'type': 'text', 'id' : 'segment'+id, 'class' : 'segment-query', 'placeholder' : 'query'});
-            var segmentName = $('<input>', { 'type': 'text', 'id' : 'segment_name'+id, 'class' : 'segment-name', 'placeholder' : 'name'});
+            var segmentInput = $('<input>', { 'type': 'text', 'id' : 'segment'+id, 'class' : 'segment-query', 'placeholder' : 'query', 'value' : query});
+            var segmentName = $('<input>', { 'type': 'text', 'id' : 'segment_name'+id, 'class' : 'segment-name', 'placeholder' : 'name', 'value' : name});
             var segmentButton = $('<input>', {'type': 'button', 'data-segment-id' : 'segmentDiv'+id, 'class' : 'segment-button__delete btn', 'value' : 'cancel'})
 
             // add event trigger for the delete button

diff --git a/Resources/public/scss/_dashboard-setup.scss b/Resources/public/scss/_dashboard-setup.scss
@@ -81,7 +81,7 @@
         padding-left:40px;
         padding-bottom:5px;
 
-        ul {
+        & > ul {
             margin-left:0;
 
             &:after {
@@ -90,7 +90,7 @@
                 clear:both;
             }
         }
-        li {
+        & > ul > li {
             border: 1px solid #CCCCCC;
             border-radius:3px;
 
@@ -107,6 +107,11 @@
             }
         }
 
+        .dropdown-menu {
+            height:200px;
+            overflow:auto;
+        }
+
         .segment-list-button__edit,
         .segment-list-button__confirm,
         .segment-button__delete,
@@ -134,6 +139,15 @@
             width:50%;
         }
 
+        .segment-query__selection {
+            color:#30af25;
+            font-weight: bold;
+        }
+
+        #segment-button__add {
+            margin-bottom:20px;
+        }
+
         .display-view,
         .edit-view {
             clear:both;

diff --git a/Resources/translations/messages.en.yml b/Resources/translations/messages.en.yml
@@ -42,8 +42,10 @@ dashboard:
             back: Go to dashboard
             segment:
                 add: Add segment
-                info: 'For documentation on how to create segment queries, click'
+                info: 'To create segments, you can use segment IDs (and also combine them), or write your own queries. Google provides predefined segment IDs (listed below), and you can create your own with the Google Segment Builder tool in Google Analytics. For documentation on how to create your own segment queries, click'
                 here: here
+                own: Own segments
+                builtin: Built-in segments
             segments: Segment setup
             accounts: Account setup
         reset:

diff --git a/Resources/views/GoogleAnalytics/setup.html.twig b/Resources/views/GoogleAnalytics/setup.html.twig
@@ -76,8 +76,33 @@
                     </li>
                 {% endfor %}
             </ul>
+
             <div id="segments-new"></div>
-            <button class="btn btn-small" type="button" id="segment-button__add"><i class="icon-plus"></i> add segment</button>
+
+            <button type="button" class="btn btn-small" id="segment-button__add">
+                <i class="icon-plus"></i> add segment
+            </button>
+
+            <div>
+                {% if profileSegments.own | length > 0 %}
+                    <h4>{{ 'dashboard.ga.setup.segment.own' | trans }}</h4>
+                    <ul>
+                        {% for segment in profileSegments.own %}
+                            <li>
+                                {{segment.name}} (<span class="segment-query__selection">{{segment.query}}</span>)
+                            </li>
+                        {% endfor %}
+                    </ul>
+                {% endif %}
+                    <h4>{{ 'dashboard.ga.setup.segment.builtin' | trans }}</h4>
+                <ul>
+                    {% for segment in profileSegments.builtin %}
+                        <li>
+                            {{segment.name}} (<span class="segment-query__selection">{{segment.query}}</span>)
+                        </li>
+                    {% endfor %}
+                </ul>
+            </div>
         </div>
 
         <div class="setup-group" id="control-group">