Merge "Added relations in detail view"
diff --git a/src/app/config/app.config.ts b/src/app/config/app.config.ts
index c8a1b1d..50570d7 100644
--- a/src/app/config/app.config.ts
+++ b/src/app/config/app.config.ts
@@ -1,5 +1,5 @@
 import {IAppConfig} from './interfaces';
 export const AppConfig: IAppConfig = {
-    apiEndpoint: 'http://localhost:4000/api',
-    websocketClient: 'http://localhost:4000'
+    apiEndpoint: 'http://xos.dev:3000/api',
+    websocketClient: 'http://xos.dev:3000'
 };
diff --git a/src/app/core/nav/nav.html b/src/app/core/nav/nav.html
index 37d2f76..a45d3c8 100644
--- a/src/app/core/nav/nav.html
+++ b/src/app/core/nav/nav.html
@@ -8,7 +8,8 @@
       <!--</li>-->
       <li
           ng-repeat="route in vm.routes track by $index"
-          ui-sref-active="active">
+          ui-sref-active="active"
+          ng-class="{'nav-container': route.children.length > 0}">
         <a ng-if="route.state && !route.children" ui-sref="{{route.state}}" ng-click="vm.activateRoute(route)">
           {{route.label}}
         </a>
diff --git a/src/app/core/nav/nav.scss b/src/app/core/nav/nav.scss
index ef3020b..4881b43 100644
--- a/src/app/core/nav/nav.scss
+++ b/src/app/core/nav/nav.scss
@@ -7,6 +7,17 @@
     nav {
       margin-bottom: 200px;
     }
+
+    li {
+      cursor: pointer;
+    }
+
+    // do not activate nav items that are just container
+    li.nav-container.active a {
+      border: none;
+      padding-left: 25px;
+      color: #848c94;
+    }
   }
 
   .nav-info {
diff --git a/src/app/core/nav/nav.ts b/src/app/core/nav/nav.ts
index 43f62b3..2b6cae4 100644
--- a/src/app/core/nav/nav.ts
+++ b/src/app/core/nav/nav.ts
@@ -37,7 +37,7 @@
   }
 
   isSelected(navId: string, navSelected: string) {
-
+    console.log(navId, navSelected);
     // TODO activate only one state
 
     const activeRoute = this.$state.current.name;
diff --git a/src/app/views/crud/crud.html b/src/app/views/crud/crud.html
index 52e9a51..7c80b92 100644
--- a/src/app/views/crud/crud.html
+++ b/src/app/views/crud/crud.html
@@ -20,22 +20,25 @@
                 <hr>
             </div>
         </div>
-        <div ng-if="vm.list">
-            <div class="row" ng-show="vm.related.length > 0">
-                <div class="view-header">
-                    <div class="col-lg-4">
-                        <h4>Related Items: </h4>
-                    </div>
-                    <div class="col-lg-8 text-right">
-                        <div class="btn-group">
-                            <a ng-repeat="r in vm.related" href="#/core/{{r.toLowerCase()}}s/" class="btn btn-default">
-                                {{r}}
-                            </a>
-                        </div>
-                    </div>
-                    <hr>
+        <div class="row" ng-show="vm.related.length > 0">
+            <div class="view-header">
+                <div class="col-lg-4">
+                    <h4>Related Items: </h4>
                 </div>
+                <div class="col-lg-8 text-right">
+                    <div class="btn-group">
+                        <a ng-if="vm.list" ng-repeat="r in vm.related" href="#/core/{{r.toLowerCase()}}s/" class="btn btn-default">
+                            {{r}}
+                        </a>
+                        <a ng-if="!vm.list && vm.getRelatedItem(r, vm.model)" ng-repeat="r in vm.related" href="#/core/{{r.toLowerCase()}}s/{{vm.getRelatedItem(r, vm.model)}}" class="btn btn-default">
+                            {{r}}
+                        </a>
+                    </div>
+                </div>
+                <hr>
             </div>
+        </div>
+        <div ng-if="vm.list">
             <xos-table config="vm.tableCfg" data="vm.tableData"></xos-table>
         </div>
 
diff --git a/src/app/views/crud/crud.ts b/src/app/views/crud/crud.ts
index d19a942..1d4eccd 100644
--- a/src/app/views/crud/crud.ts
+++ b/src/app/views/crud/crud.ts
@@ -74,6 +74,13 @@
       this.list = false;
     }
   }
+
+  public getRelatedItem(relation: string, item: any): number {
+    if (angular.isDefined(item[relation.toLowerCase()])) {
+      return item[relation.toLowerCase()];
+    }
+    return 0;
+  }
 }
 
 export const xosCrud: angular.IComponentOptions = {