From c10f125f88fbe7a5be69cef9af321e0a210afaf6 Mon Sep 17 00:00:00 2001 From: Phil Date: Mon, 9 Dec 2013 15:05:16 +1000 Subject: [PATCH] closes #8 - Rearranged the annotation panel (tags/bounds fields) so it is smaller. Annotation panel is only active when a box is selected. - used bootstrap for alignment of bounds fields --- src/app/listen/_listen.scss | 63 ++++- src/app/listen/listen.js | 2 +- src/app/listen/listen.tpl.html | 404 +++++++++++++++++---------------- 3 files changed, 273 insertions(+), 196 deletions(-) diff --git a/src/app/listen/_listen.scss b/src/app/listen/_listen.scss index f504c25a..c7196eff 100644 --- a/src/app/listen/_listen.scss +++ b/src/app/listen/_listen.scss @@ -1,25 +1,80 @@ +fieldset.tags-fs { + + width: 55%; +float: left; +} +fieldset.bounds-fs { + width: 40%; + float: right; +} + +fieldset.options-fs { + width: 45%; + float: left; +} +fieldset.bounds-fs label { + width: 220px; +} +fieldset.bounds-fs input { + width: 100px; +} + +label.reference { + margin:10px 10px 0px 10px; +} + + +.position span { + margin-left: 10px; + margin-right: 10px; +} + #listenEditContainer { > div { clear: both; width: 100%; + margin-top: 10px; } + + } +#listenEditContainer.disabled { + + & * { + color: rgba(0,0,0,0.2); + + } + +} + + #chunkTimeStamps { width: 100%; text-align: center; + position:relative; & .position { display: inline-block; + float: left; } & .left { - float: left; + position:absolute; + left: 0px; + top: 0px; } & .right { - float: right; + position:absolute; + right: 0px; + top: 0px; + } + + & .btn-toolbar { + margin-left:38%; + } } @@ -103,4 +158,6 @@ &:before { @extend .glyphicon-remove:before; } -} \ No newline at end of file +} + + diff --git a/src/app/listen/listen.js b/src/app/listen/listen.js index bb3a06e1..29901110 100644 --- a/src/app/listen/listen.js +++ b/src/app/listen/listen.js @@ -317,7 +317,7 @@ angular.module('bawApp.listen', ['decipher.tags', 'ui.bootstrap.typeahead']) }; $scope.singleEditDisabled = function () { - return !$scope.model.selectedAudioEvent; + return (typeof($scope.model.selectedAudioEvent.id) === 'undefined'); }; diff --git a/src/app/listen/listen.tpl.html b/src/app/listen/listen.tpl.html index 5eb1dcba..0077cae3 100644 --- a/src/app/listen/listen.tpl.html +++ b/src/app/listen/listen.tpl.html @@ -1,211 +1,231 @@
-
- Something has gone wrong - can't load this page. -
-
- - -

Site: {{model.audioRecording.siteId}}, {{absoluteDateChunkStart() | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}} -

- -
- {{startOffsetChunk()}} - - - - {{currentOffsetRecording()}} - - {{endOffsetChunk()}} +
+ Something has gone wrong - can't load this page.
-
+
-
- - - -
-
- - - - - - -
-
- - - -
-
- -
-
-
-

Annotation edit

+ +

Site: {{model.audioRecording.siteId}}, {{absoluteDateChunkStart() | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}} +

+ + +
+ + {{startOffsetChunk()}} + +
+ + + +
+ + + +
+
+ + + + +
+
+ + + +
+ + + + {{currentOffsetRecording()}} + + +
+ {{endOffsetChunk()}} -
-
- Tags - - - - - -
-
- - Annotation Bounds - - -
- - -
-
- Options - -
-
-
-

Annotations

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SelectedSavedJump toAnnotation IDAudio RecordingCreated AtCreated ByDeleted AtDeleted ByUpdated AtUpdated ByTagsTime RangeFrequency Range
- - - {{ae.selected && '✓' || '✗'}} - - {{ae.isDirty && '✗' || '✓'}} - - - - {{ae.id}} - - new annotation - - {{ae.audioRecording.uuid}}{{ae.createdAt}}{{ae.creatorId}}{{ae.deletedAt}}{{ae.deleterId}}{{ae.updatedAt}}{{ae.updaterId}}{{t.tagId | tagName}}{{!$last && ',' || ''}} - {{ae.startTimeSeconds | number:3}} - {{ae.endTimeSeconds | number:3}}{{ae.lowFrequencyHertz | number:3}} - {{ae.highFrequencyHertz | number:3}}
-
-
-

Timeline

-
-
-
-
before
-
current
-
after
+ + +
+
+ +
+
+ Tags + + + + + + + + +
+
+ + Bounds + +
+
+ +
+
+ +
+
+
+ +
+ + +
+
+ +
+ +
+
+ +
-
-
pli
-
-
segment
+
+

Annotations

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SelectedSavedJump toAnnotation IDAudio RecordingCreated AtCreated ByDeleted AtDeleted ByUpdated AtUpdated ByTagsTime RangeFrequency Range
+ + + {{ae.selected && '✓' || '✗'}} + + {{ae.isDirty && '✗' || '✓'}} + + + + {{ae.id}} + + new annotation + + {{ae.audioRecording.uuid}}{{ae.createdAt}}{{ae.creatorId}}{{ae.deletedAt}}{{ae.deleterId}}{{ae.updatedAt}}{{ae.updaterId}}{{t.tagId | tagName}}{{!$last && ',' || ''}} + {{ae.startTimeSeconds | number:3}} - {{ae.endTimeSeconds | number:3}}{{ae.lowFrequencyHertz | number:3}} - {{ae.highFrequencyHertz | number:3}}
+
+
+ +

Timeline

+ +
+
+
+
before
+
current
+
after
+
+
+
pli
-
chunk
+
segment
- You are here +
chunk
+
+ You are here +
+
chunk
-
chunk
+
segment
-
segment
+
pli
-
pli
+

Stats

+
    +
  • + Audio recording: {{model.audioRecording.recordedDate | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}}, + Duration of recording: {{model.audioRecording.durationSeconds | formatTimeSpan}} +
    • +
  • + Segment: --TODO--, Duration of segment: --TODO-- +
    • +
  • + On screen: {{absoluteDateChunkStart() | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}} + , Duration of chunk: {{durationChunk()}} +
    • +
+ +
-

Stats

-
    -
  • - Audio recording: {{model.audioRecording.recordedDate | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}}, - Duration of recording: {{model.audioRecording.durationSeconds | formatTimeSpan}} -
    • -
  • - Segment: --TODO--, Duration of segment: --TODO-- -
    • -
  • - On screen: {{absoluteDateChunkStart() | moment:"format":"dddd, MMMM Do YYYY, HH:mm:ss ZZ"}} - , Duration of chunk: {{durationChunk()}} -
    • -
- - -
\ No newline at end of file