More work on bird walk stuff. Fixed some problems with host/port and …

…paths to assets.
QutEcoacoustics · Nov 20, 2013 · c20a283 · c20a283
1 parent 7638848
commit c20a283
Show file tree

Hide file tree

Showing 8 changed files with 68 additions and 24 deletions.
diff --git a/build.config.js b/build.config.js
@@ -13,10 +13,13 @@ module.exports = {
     compile_dir: 'bin',
 
     build_configs: {
+        keys:{
+            googleMaps: ""
+        },
         configFile: appConfigFile,
         development: {
             apiRoot: "http://staging.ecosounds.org",
-            siteRoot: "localhost:8080",
+            siteRoot: "http://localhost:8080",
             siteDir: "/"
         },
         staging: {
@@ -25,9 +28,9 @@ module.exports = {
             siteDir: "/system/listen_to/"
         },
         production: {
-            apiRoot: "http://ecosounds.org",
-            siteRoot: "http://ecosounds.org/????",
-            siteDir: "????"
+            apiRoot: "http://awb.ecosounds.org",
+            siteRoot: "http://awb.ecosounds.org/system/listen_to",
+            siteDir: "/system/listen_to/"
         },
 
         current: {}

diff --git a/src/app/birdWalks/_birdWalks.scss b/src/app/birdWalks/_birdWalks.scss
@@ -0,0 +1,4 @@
+#locationMap {
+  width: 100%;
+  height: 300px;
+}
diff --git a/src/app/birdWalks/birdWalk.tpl.html b/src/app/birdWalks/birdWalk.tpl.html
@@ -1,8 +1,11 @@
 <div class="row" data-ng-controller="BirdWalkCtrl">
-{{params}}
-    <div class="col-sm-6 col-md-3" data-ng-repeat="(name, walkSpec) in spec.birdWalkSpec.walks">
 
-    </div>
+    <h1>{{details.name}}</h1>
 
-{{spec.walks}}
+    <p class="lead">{{details.description}}</p>
+    <img data-ng-src="{{imagesPath + spec.birdWalkSpec.locations[details.locationName].smallImageName}}"
+         alt="{{details.name}}" class="img-responsive"
+         title="{{spec.birdWalkSpec.locations[details.locationName].name}}">
+    {{$parent.spec.birdWalkSpec.walks[params.birdWalkId]}}
+    <div id="locationMap"></div>
 </div>
diff --git a/src/app/birdWalks/birdWalks.js b/src/app/birdWalks/birdWalks.js
@@ -9,16 +9,46 @@ angular.module('bawApp.birdWalks', [])
                 pageHit: (new Date()).toISOString()
             };
 
-            $scope.imagesPath = paths.site.files.birdWalk.images;
+            $scope.imagesPath = paths.site.files.birdWalk.imagesAbsolute;
 
             // download bird walk specification
-            BirdWalkService.getUrl(paths.site.files.birdWalk.spec, 'birdWalkSpec', $scope);
+            BirdWalkService.getUrl(paths.site.files.birdWalk.specAbsolute, 'birdWalkSpec', $scope, null);
+            BirdWalkService.getUrl(paths.site.files.birdWalk.statsAbsolute, 'birdWalkStats', $scope, null);
         }])
     .controller('BirdWalkCtrl', ['$scope', '$resource', '$routeParams', '$route', '$http', 'BirdWalkService', 'conf.paths',
         function BirdWalkCtrl($scope, $resource, $routeParams, $route, $http, BirdWalkService, paths) {
-            $scope.imagesPath = paths.site.files.birdWalk.images;
-            BirdWalkService.getUrl(paths.site.files.birdWalk.spec, 'birdWalkSpec', $scope);
+
+            // constants
+            var CURRENT_LOCATION_ZOOM = 4;
+
+            // initialise
+            $scope.imagesPath = paths.site.files.birdWalk.imagesAbsolute;
             $scope.params = $routeParams;
+            BirdWalkService.getUrl(paths.site.files.birdWalk.statsAbsolute, 'birdWalkStats', $scope, null);
+            BirdWalkService.getUrl(paths.site.files.birdWalk.specAbsolute, 'birdWalkSpec', $scope, function () {
+                // set up page display
+                $scope.details = $scope.spec.birdWalkSpec.walks[$scope.params.birdWalkId];
+                var overviewLocation = new google.maps.LatLng(
+                    $scope.details.overviewLocation.latitude,
+                    $scope.details.overviewLocation.longitude);
+
+                $scope.locationMap = $scope.createMap('locationMap', overviewLocation, CURRENT_LOCATION_ZOOM);
+                google.maps.event.trigger($scope.locationMap, 'resize');
+            });
+
 
             //$scope.spec.birdWalkSpec.walks
+
+            $scope.createMap = function (elementId, LatLng, zoom) {
+                return new google.maps.Map(
+                    document.getElementById(elementId),
+                    {
+                        center: LatLng,
+                        zoom: zoom,
+                        mapTypeId: google.maps.MapTypeId.HYBRID
+                    }
+                );
+            };
+
+
         }]);
diff --git a/src/app/birdWalks/birdWalks.tpl.html b/src/app/birdWalks/birdWalks.tpl.html
@@ -1,12 +1,12 @@
 <div class="row" data-ng-controller="BirdWalksCtrl">
 
-    <div class="col-sm-6 col-md-3" data-ng-repeat="(name, walkSpec) in spec.birdWalkSpec.walks">
+    <div class="col-sm-6 col-md-3" data-ng-repeat="(id, walkSpec) in spec.birdWalkSpec.walks">
         <div class="thumbnail">
             <img data-ng-src="{{$parent.imagesPath + $parent.spec.birdWalkSpec.locations[walkSpec.locationName].smallImageName}}"
-                 alt="{{name}}" class="img-responsive">
+                 alt="{{walkSpec.name}}" class="img-responsive" title="{{$parent.spec.birdWalkSpec.locations[walkSpec.locationName].name}}">
 
             <div class="caption">
-                <h3>{{name}}
+                <h3>{{walkSpec.name}}
                     <small>{{walkSpec.waypoints.length}} waypoint(s)</small>
                 </h3>
                 <p>{{walkSpec.description}}</p>

diff --git a/src/baw.configuration.tpl.js b/src/baw.configuration.tpl.js
@@ -56,8 +56,9 @@ angular.module('bawApp.configuration', [])
                     birdWalk : {
                         list: 'birdWalks/birdWalks.tpl.html',
                         detail: 'birdWalks/birdWalk.tpl.html',
-                        spec: '/assets/bird_walk/bird_walk_spec.json',
-                        images: '/assets/bird_walk/images/'
+                        spec: 'assets/bird_walk/bird_walk_spec.json',
+                        stats: 'assets/bird_walk/bird_walk_stats.json',
+                        images: 'assets/bird_walk/images/'
                     }
                 },
                 // routes used by angular

diff --git a/src/components/services/services.js b/src/components/services/services.js
@@ -165,7 +165,7 @@
 
         var birdWalkService = {};
 
-        var getUrl = function getUrl(downloadUrl, storeProperty, theScope) {
+        var getUrl = function getUrl(downloadUrl, storeProperty, theScope, onSuccess) {
             $http.get(downloadUrl, {
                 cache: true
             })
@@ -176,10 +176,13 @@
                     }
                     theScope.spec[storeProperty] = data;
 
-                    if (data.additionalResources) {
-                        angular.forEach(data.additionalResources, function (value, key) {
-                            getUrl(value, key);
-                        });
+//                    if (data.additionalResources) {
+//                        angular.forEach(data.additionalResources, function (value, key) {
+//                            getUrl(value, key);
+//                        });
+//                    }
+                    if (onSuccess) {
+                        onSuccess();
                     }
 
                 }).error(function (data, status, headers, config) {

diff --git a/src/index.html b/src/index.html
@@ -16,9 +16,9 @@
     <script type="text/javascript" src="<%= build_configs.current.siteDir %><%= file %>"></script>
     <% }); %>
 
+    <!-- Google Maps -->
+    <!--<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=<%= build_configs.keys.googleMaps %>&sensor=false"></script>-->
     <!--<script src="https://login.persona.org/include.js"></script>-->
-    <!--<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAWT_qg_GDQVSlQB9O_1CEQf8l4bErP5Ek&sensor=false"></script>-->
-
 
     <!-- fot sticky footer -->
     <!--[if !IE 7]>