diff --git a/src/app/annotationLibrary/annotationItem.tpl.html b/src/app/annotationLibrary/annotationItem.tpl.html index 2bd2fc5a..5de6d6c6 100644 --- a/src/app/annotationLibrary/annotationItem.tpl.html +++ b/src/app/annotationLibrary/annotationItem.tpl.html @@ -22,6 +22,7 @@ + \ No newline at end of file diff --git a/src/app/audioControls/_downloadLinks.scss b/src/app/audioControls/_downloadLinks.scss new file mode 100644 index 00000000..5e182e6b --- /dev/null +++ b/src/app/audioControls/_downloadLinks.scss @@ -0,0 +1,66 @@ +//noinspection CssInvalidHtmlTagReference +download { + + .download-links-wrapper { + + position: relative; + display: inline-block; + + .download-links { + + position: absolute; + bottom: 30px; + left:0px; + background: #ffffff; + z-index: 10000; + padding: 10px; + text-align: center; + white-space: nowrap; + border: solid #dddddd 1px; + border-radius: 3px; + + &.show-links { + + transition-duration: 0.3s; + transition-timing-function: ease-in; + max-height: 1000px; + padding-top: 10px; + padding-bottom: 10px; + overflow: hidden; + + } + + &.hide-links { + + overflow: hidden; + max-height: 0; + padding-top: 0; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; + border-top-width: 0px; + border-bottom-width: 0px; + transition-duration: 0.3s; + transition-timing-function: cubic-bezier(0, 1, 0.5, 1); + + } + + a { + display: block; + } + + + } + + + } + + + +} + +.btn-toolbar .download-links-wrapper { + + float: left; + +} \ No newline at end of file diff --git a/src/app/audioControls/audioControls.js b/src/app/audioControls/audioControls.js index b06b0df5..74efc580 100644 --- a/src/app/audioControls/audioControls.js +++ b/src/app/audioControls/audioControls.js @@ -1,5 +1,6 @@ angular.module("bawApp.audioControls",[ "bawApp.audioControls.volumeSlider", "bawApp.audioControls.previousPlayNext", - "bawApp.audioControls.autoplayButton" + "bawApp.audioControls.autoplayButton", + "bawApp.audioControls.download" ]); \ No newline at end of file diff --git a/src/app/audioControls/download.js b/src/app/audioControls/download.js new file mode 100644 index 00000000..04dafa4e --- /dev/null +++ b/src/app/audioControls/download.js @@ -0,0 +1,24 @@ +angular.module("bawApp.audioControls.download", []) + .component("download", { + templateUrl: "audioControls/download.tpl.html", + controller: [ + "$scope", + function ($scope) { + + $scope.downloadLinksShowing = false; + + $scope.toggleShowDownloadLinks = function () { + $scope.downloadLinksShowing = !$scope.downloadLinksShowing; + }; + + $scope.hideDownloadLinks = function () { + $scope.downloadLinksShowing = false; + }; + + }], + bindings: { + media: "=", + otherLinks: "=" + } + }); + diff --git a/src/app/audioControls/download.tpl.html b/src/app/audioControls/download.tpl.html new file mode 100644 index 00000000..0111b2b2 --- /dev/null +++ b/src/app/audioControls/download.tpl.html @@ -0,0 +1,34 @@ +
+ + +
+ +
Download:
+ + Spectrogram + Audio (WAV) + Audio (MP3) + {{link.text}} +
+ +
\ No newline at end of file diff --git a/src/app/listen/listen.js b/src/app/listen/listen.js index baa17952..e0b1e9b7 100644 --- a/src/app/listen/listen.js +++ b/src/app/listen/listen.js @@ -159,12 +159,20 @@ angular $scope.startOffsetAbsolute = absoluteStartChunk.format("HH:mm:ss"); $scope.endOffsetAbsolute = absoluteEndChunk.format("HH:mm:ss"); - $scope.downloadAnnotationsLink = AudioEvent.csvLink( + + // any other download links besides spectrogram and audio files + $scope.downloadLinks = [ { - recordingId: $scope.model.media.recording.id, - startOffset: $scope.model.media.commonParameters.startOffset, - endOffset: $scope.model.media.commonParameters.endOffset - }); + text: "Annotations (CSV)", + title: "Download annotations seen on this screen", + url: AudioEvent.csvLink( + { + recordingId: $scope.model.media.recording.id, + startOffset: $scope.model.media.commonParameters.startOffset, + endOffset: $scope.model.media.commonParameters.endOffset + }) + } + ]; }, function mediaGetFailure() { diff --git a/src/app/listen/listen.tpl.html b/src/app/listen/listen.tpl.html index de005691..43285d86 100644 --- a/src/app/listen/listen.tpl.html +++ b/src/app/listen/listen.tpl.html @@ -75,6 +75,9 @@

+ + {{endOffsetAbsolute}} @@ -182,29 +185,7 @@

-
- - Download: - Spectrogram |  - Audio (WAV) |  - Audio (MP3) |  - Annotations (CSV) - -
+
diff --git a/src/components/directives/clickOutside.js b/src/components/directives/clickOutside.js new file mode 100644 index 00000000..2a5c1a34 --- /dev/null +++ b/src/components/directives/clickOutside.js @@ -0,0 +1,20 @@ +angular + .module("bawApp.directives.clickOutside", []) + .directive("clickOutside", ["$document", function ($document) { + return { + link: function postLink(scope, element, attrs) { + var onClick = function (event) { + var isChild = element[0].contains(event.target); + var isSelf = element[0] === event.target; + var isInside = isChild || isSelf; + if (!isInside) { + console.log("is outside !!!!!!!"); + scope.$apply(attrs.clickOutside); + } + }; + + $document.bind("click", onClick); + + } + }; + }]); diff --git a/src/components/directives/directives.js b/src/components/directives/directives.js index 89a95564..6da5bb64 100644 --- a/src/components/directives/directives.js +++ b/src/components/directives/directives.js @@ -11,6 +11,7 @@ angular.module("bawApp.directives", "bawApp.directives.ngAudio", "bawApp.directives.inputRange", "bawApp.directives.toggleSwitch", - "bawApp.directives.ngForm" + "bawApp.directives.ngForm", + "bawApp.directives.clickOutside" ]);