Finished fixing bugs.

Audio urls fixed up. Added explicit ordering since Angular's ng-repeat decided to start ordering things all of a sudden. Also fixed up audio urls and spectrogram urls on annotation library page. Fixed bu on annotationItem page that was causing binding errors... gave an empty configuration.
QutEcoacoustics · Sep 9, 2014 · a9129b7 · a9129b7
1 parent b616459
commit a9129b7
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 38 deletions.
diff --git a/src/app/annotationLibrary/annotationItem.tpl.html b/src/app/annotationLibrary/annotationItem.tpl.html
@@ -1,22 +1,21 @@
-<div id="content" data-ng-controller="AnnotationItemCtrl">
+<div id="content">
     <h3>Annotation {{model.audioEventId}}</h3>
 
     <div class="row">
         <div class="col-md-12">
             <div class="library-single"
-                 data-ng-style="{width:annotation.converters.conversions.enforcedImageWidth + 100}">
+                 ng-style="{width:annotation.converters.conversions.enforcedImageWidth + 100}">
                 <div class="library-spectrogram">
-                    <img data-ng-src="{{annotation.media.availableImageFormats.png.url}}"
-                         data-ng-style="{width: annotation.converters.conversions.enforcedImageWidth, height: annotation.converters.conversions.enforcedImageHeight}">
+                    <img ng-src="{{annotation.media.available.image.png.url}}"
+                         ng-style="{width: annotation.converters.conversions.enforcedImageWidth, height: annotation.converters.conversions.enforcedImageHeight}">
                     <grid-lines configuration="annotation.gridConfig" class="library-spectrogram-grid"></grid-lines>
                     <div class="library-spectrogram-bounds"
-                         data-ng-style="{top: annotation.bounds.top, left: annotation.bounds.left, width: annotation.bounds.width, height: annotation.bounds.height}"></div>
+                         ng-style="{top: annotation.bounds.top, left: annotation.bounds.left, width: annotation.bounds.width, height: annotation.bounds.height}"></div>
                 </div>
                 <audio id="annoSingleAudio{{$index}}" controls
-                       data-ng-style="{width:annotation.converters.conversions.enforcedImageWidth}">
-                    <source data-ng-repeat="resource in annotation.media.availableAudioFormats"
-                            data-ng-src="{{resource.url}}" src=""
-                            type="{{resource.mimeType}}">
+                       ng-style="{width:annotation.converters.conversions.enforcedImageWidth}">
+                    <source ng-repeat="key in annotation.media.available.audioOrder" ng-src="{{annotation.media.available.audio[key].url}}" src=""
+                            type="{{annotation.media.available.audio[key].mimeType}}">
                     Your browser does not support the audio element.
                 </audio>
 
@@ -27,11 +26,11 @@ <h3>Annotation {{model.audioEventId}}</h3>
     <div class="row">
         <div class="col-md-12">
             <ul class="pager">
-                <li class="previous" data-ng-show="annotation.paging.prevEvent.link">
-                    <a data-ng-href="{{annotation.paging.prevEvent.link}}">&larr; Previous</a>
+                <li class="previous" ng-show="annotation.paging.prevEvent.link">
+                    <a ng-href="{{annotation.paging.prevEvent.link}}">&larr; Previous</a>
                 </li>
-                <li class="next" data-ng-show="annotation.paging.nextEvent.link">
-                    <a data-ng-href="{{annotation.paging.nextEvent.link}}">Next &rarr;</a>
+                <li class="next" ng-show="annotation.paging.nextEvent.link">
+                    <a ng-href="{{annotation.paging.nextEvent.link}}">Next &rarr;</a>
                 </li>
             </ul>
         </div>
@@ -45,43 +44,43 @@ <h3 class="panel-title pull-left">Details</h3>
                 </div>
                 <div class="panel-body">
                     <div class="list-group">
-                        <a data-ng-repeat="tag in annotation.tags"
-                           data-ng-href="{{$parent.createFilterUrl({'tagsPartial': tag.text})}}"
+                        <a ng-repeat="tag in annotation.tags"
+                           ng-href="{{$parent.createFilterUrl({'tagsPartial': tag.text})}}"
                            class="list-group-item" title="Tag.">
                             <span class="glyphicon glyphicon-tags"></span>&nbsp;
                             <span class="badge">{{tag.typeOfTag.replace('_',' ')}}</span>
-                            <span class="badge" data-ng-show="tag.retired">retired</span>
-                            <span class="badge" data-ng-show="tag.isTaxanomic">taxonomic</span>
+                            <span class="badge" ng-show="tag.retired">retired</span>
+                            <span class="badge" ng-show="tag.isTaxanomic">taxonomic</span>
                             {{tag.text}} (ID {{tag.id}})
                         </a>
-                        <a data-ng-show="annotation.isReference"
-                           data-ng-href="{{$parent.createFilterUrl({'reference': annotation.isReference})}}"
+                        <a ng-show="annotation.isReference"
+                           ng-href="{{$parent.createFilterUrl({'reference': annotation.isReference})}}"
                            class="list-group-item" title="Reference tag.">
                             <span class="glyphicon glyphicon-book"></span>&nbsp;
                             Reference Tag
                         </a>
-                        <a data-ng-href="{{annotation.urls.listen}}" class="list-group-item" title="Start date.">
+                        <a ng-href="{{annotation.urls.listen}}" class="list-group-item" title="Start date.">
                             <span class="glyphicon glyphicon-record"></span>&nbsp;
                             Created {{annotation.audioEventStartDate | date: 'medium'}}
                         </a>
-                        <a data-ng-href="{{annotation.urls.listen}}" class="list-group-item" title="Duration.">
+                        <a ng-href="{{annotation.urls.listen}}" class="list-group-item" title="Duration.">
                             <span class="glyphicon glyphicon-time"></span>&nbsp;
                             {{annotation.annotationDurationRounded}} seconds duration
                         </a>
-                        <a data-ng-repeat="project in annotation.projects"
-                           data-ng-href="{{$parent.createProjectUrl(project.id)}}" target="_self" class="list-group-item" title="Project name.">
+                        <a ng-repeat="project in annotation.projects"
+                           ng-href="{{$parent.createProjectUrl(project.id)}}" target="_self" class="list-group-item" title="Project name.">
                             <span class="glyphicon glyphicon-home"></span>&nbsp;
                             Project: {{project.name}}
                         </a>
-                        <a data-ng-href="{{annotation.urls.site}}" target="_self" class="list-group-item" title="Site name.">
+                        <a ng-href="{{annotation.urls.site}}" target="_self" class="list-group-item" title="Site name.">
                             <span class="glyphicon glyphicon-map-marker"></span>&nbsp;
                             Site: {{annotation.siteName}}
                         </a>
-                        <a data-ng-href="{{annotation.urls.user}}" target="_self" class="list-group-item" title="User.">
+                        <a ng-href="{{annotation.urls.user}}" target="_self" class="list-group-item" title="User.">
                             <span class="glyphicon glyphicon-user"></span>&nbsp;
                             {{annotation.ownerName }}
                         </a>
-                        <a data-ng-href="{{annotation.urls.similar}}" class="list-group-item"
+                        <a ng-href="{{annotation.urls.similar}}" class="list-group-item"
                            title="Find similar annotations.">
                             <span class="glyphicon glyphicon-search"></span>&nbsp;
                             Find Similar

diff --git a/src/app/annotationLibrary/annotationLibrary.js b/src/app/annotationLibrary/annotationLibrary.js
@@ -12,25 +12,25 @@ baw.annotationLibrary.addCalculatedProperties = function addCalculatedProperties
     audioEvent.urls = {
         site: $url.formatUri(paths.api.links.siteAbsolute, {projectId: audioEvent.projects[0].id, siteId: audioEvent.siteId}),
         user: $url.formatUri(paths.api.links.userAccountsAbsolute, {userId: audioEvent.ownerId}),
-        tagSearch: $url.formatUri(paths.site.ngRoutes.libraryAbsolute, {tagsPartial: audioEvent.priorityTag.text}),
-        similar: $url.formatUri(paths.site.ngRoutes.libraryAbsolute,
+        tagSearch: $url.formatUri(paths.site.ngRoutes.library, {tagsPartial: audioEvent.priorityTag.text}),
+        similar: $url.formatUri(paths.site.ngRoutes.library,
             {
                 annotationDuration: Math.round10(audioEvent.annotationDuration, -3),
                 freqMin: Math.round(audioEvent.lowFrequencyHertz),
                 freqMax: Math.round(audioEvent.highFrequencyHertz)
             }),
-        singleItem: $url.formatUri(paths.site.ngRoutes.libraryItemAbsolute,
+        singleItem: $url.formatUri(paths.site.ngRoutes.libraryItem,
             {
                 recordingId: audioEvent.audioRecordingId,
                 audioEventId:  audioEvent.audioEventId
             }),
-        listen: $url.formatUri(paths.site.ngRoutes.listenAbsolute,
+        listen: $url.formatUri(paths.site.ngRoutes.listen,
             {
                 recordingId: audioEvent.audioRecordingId,
                 start: audioEvent.calcOffsetStart,
                 end: audioEvent.calcOffsetEnd
             }),
-        listenWithoutPadding: $url.formatUri(paths.site.ngRoutes.listenAbsolute,
+        listenWithoutPadding: $url.formatUri(paths.site.ngRoutes.listen,
             {
                 recordingId: audioEvent.audioRecordingId,
                 start: audioEvent.startTimeSeconds,
@@ -290,8 +290,8 @@ angular.module('bawApp.annotationLibrary', ['bawApp.configuration'])
     .controller('AnnotationItemCtrl',
     ['$scope', '$location', '$resource', '$routeParams', '$url',
         'conf.paths', 'conf.constants', 'bawApp.unitConverter',
-        'AudioEvent', 'Tag', 'Media',
-        function ($scope, $location, $resource, $routeParams, $url, paths, constants, unitConverter, AudioEvent, Tag, Media) {
+        'AudioEvent', 'Tag', 'Media', 'baw.models.Media',
+        function ($scope, $location, $resource, $routeParams, $url, paths, constants, unitConverter, AudioEvent, Tag, MediaService, Media) {
 
             var parameters = {
                 audioEventId: $routeParams.audioEventId,
@@ -304,9 +304,11 @@ angular.module('bawApp.annotationLibrary', ['bawApp.configuration'])
                     var annotation = angular.extend({}, audioEventValue);
                     annotation.priorityTag = Tag.selectSinglePriorityTag(annotation.tags);
                     baw.annotationLibrary.addCalculatedProperties(annotation, $url, paths);
-                    baw.annotationLibrary.getBoundSettings(annotation, constants, unitConverter, Media);
+                    baw.annotationLibrary.getBoundSettings(annotation, constants, unitConverter, MediaService, Media);
 
                     $scope.annotation = annotation;
+                    $scope.annotation.gridConfig = {};
+
 
                     // paging
                     if ($scope.annotation.paging.nextEvent.hasOwnProperty('audioEventId')) {

diff --git a/src/app/annotationLibrary/annotationLibrary.tpl.html b/src/app/annotationLibrary/annotationLibrary.tpl.html
@@ -150,8 +150,8 @@ <h3>Annotation Library</h3>
                  ng-style="{'min-width':150, width:item.converters.conversions.enforcedImageWidth}">
                 <audio id="annotationLibraryItemInfoAudio{{$index}}" controls
                        ng-style="{width:item.converters.conversions.enforcedImageWidth}">
-                    <source ng-repeat="resource in item.media.available.audio" ng-src="{{resource.url}}" src=""
-                            type="{{resource.mimeType}}">
+                    <source ng-repeat="key in item.media.available.audioOrder" ng-src="{{item.media.available.audio[key].url}}" src=""
+                            type="{{item.media.available.audio[key].mimeType}}">
                     Your browser does not support the audio element.
                 </audio>
             <span ng-show="item.tags.length > 0">

diff --git a/src/app/listen/listen.tpl.html b/src/app/listen/listen.tpl.html
@@ -114,8 +114,8 @@ <h1 id="chunkInfo" class="row">
 
 
 <audio id="mainAudioElement" ng-audio="model.audioElement" controls class="debug-ui">
-    <source ng-repeat="resource in model.media.available.audio" ng-src="{{resource.url}}" src=""
-            type="{{resource.mimeType}}">
+    <source ng-repeat="key in model.media.available.audioOrder" ng-src="{{model.media.available.audio[key].url}}" src=""
+            type="{{model.media.available.audio[key].mimeType}}">
     Your browser does not support the audio element.
 </audio>
 <div id="listenEditContainer" ng-class="{disabled : singleEditDisabled()}">

diff --git a/src/components/models/media.js b/src/components/models/media.js
@@ -44,10 +44,14 @@ angular.module("baw.models.media", []).factory("baw.models.Media", ["conf.paths"
             mediaItem.available.image[imageKey].url = paths.joinFragments(paths.api.root, imageFormat.url);
             mediaItem.spectrogram = imageFormat;
 
+            // make the order explicit (ng-repeat alphabetizes the order >:-|
+            mediaItem.available.audioOrder = [];
             angular.forEach(mediaItem.available.audio, function (value, key) {
                 // just update the url so it is an absolute uri
                 this[key].url = paths.joinFragments(paths.api.root, value.url);
 
+                mediaItem.available.audioOrder.push(key);
+
             }, mediaItem.available.audio);
         };