comparison src/DML/MainVisBundle/Resources/assets/marionette/modules/PlayerModule.js @ 0:493bcb69166c

added public content
author Daniel Wolff
date Tue, 09 Feb 2016 20:54:02 +0100
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:493bcb69166c
1 "use strict";
2 App.module("PlayerModule", function(PlayerModule, App, Backbone, Marionette, $, _, Logger) {
3 // Prevent auto start
4 PlayerModule.startWithParent = false;
5
6 // Define options
7 var defaultModuleOptions = {
8 };
9 var moduleOptions;
10
11 // Define private variables
12 var logger = null;
13
14 /**
15 * Initialization checker
16 */
17 var assertModuleIsInitialized = function() {
18 if (!$notifications) {
19 throw "PlayerModule has not been initialized";
20 }
21 };
22
23 /**
24 * Module initializer
25 *
26 */
27 PlayerModule.addInitializer(function(options){
28 moduleOptions = _.extend(defaultModuleOptions, options);
29
30 logger = Logger.get("PlayerModule");
31 //logger.setLevel(Logger.DEBUG);
32
33 logger.debug("Begin init");
34
35 PlayerModule.$player = $(Marionette.TemplateCache.get("#player")());
36 PlayerModule.$playerTimeAfter = PlayerModule.$player.find(".player__time_type_after");
37 PlayerModule.$player.hide().appendTo("body");
38
39 PlayerModule.$jPlayer = $("<div/>").hide().appendTo("body");
40
41 var volume = App.DataModule.Storage.getStrCache(PlayerModule, "volume");
42 if (volume !== undefined) {
43 volume = parseFloat(volume);
44 }
45 if (!_.isNumber(volume) || _.isNaN(volume) || volume < 0 && volume > 1) {
46 volume = undefined;
47 }
48 var muted = App.DataModule.Storage.getStrCache(PlayerModule, "muted") ? true : false;
49
50 // The player itself (jPlayer)
51 PlayerModule.$jPlayer.jPlayer({
52 swfPath: "./$/jquery.jplayer.swf",
53 supplied: "mp3",
54 wmode: "window",
55 cssSelectorAncestor: '.player__body',
56 useStateClassSkin: true,
57 autoBlur: false,
58 smoothPlayBar: false,
59 keyEnabled: false,
60 remainingDuration: true,
61 toggleDuration: false,
62 volume: volume,
63 solution: "html,flash",
64 muted: muted,
65 cssSelector: {
66 play: ".player__command_action_play",
67 pause: ".player__command_action_pause",
68 mute: ".player__command_action_volume-mute",
69 unmute: ".player__command_action_volume-down",
70 volumeMax: ".player__command_action_volume-up",
71 volumeBar: ".player__slider_type_volume",
72 volumeBarValue: ".player__slider-head_type_volume",
73 seekBar: ".player__slider_type_time",
74 playBar: ".player__slider-head_type_time",
75 currentTime: ".player__time_type_before",
76 duration: ".player__time_type_after",
77 }
78 });
79
80 PlayerModule.$jPlayer.on($.jPlayer.event.volumechange, function(event) {
81 var volume = PlayerModule.$jPlayer.jPlayer('option', 'volume');
82 var muted = PlayerModule.$jPlayer.jPlayer('option', 'muted');
83
84 App.DataModule.Storage.setStrCache(PlayerModule, "volume", volume + "");
85 App.DataModule.Storage.setStrCache(PlayerModule, "muted", muted ? "1" : "");
86
87 });
88
89 // A view that sits on top of the player
90 PlayerModule.PlayerView = Backbone.View.extend({
91
92 el: PlayerModule.$player,
93
94 initialize: function() {
95 var _this = this;
96 //var $elHTML = $("#player");
97 _this.$body = _this.$el.find('.player__body');
98 App.TooltipModule.convertTitlesToTooltips(_this.$el);
99
100 // This is needed to initialize the jplayer instance
101 //$elHTML.hide().appendTo("body");
102
103 //_this.$el.html($elHTML);
104 //$elHTML.show();
105 _this.$el.show();
106
107 _this.$commandDownload = _this.$('.player__command_action_download');
108 _this.$commandDownload.click(function(event) {
109 PlayerModule.$jPlayer.jPlayer("pause");
110 });
111 _this.$label1 = _this.$('.player__label_row_1');
112 _this.$label2 = _this.$('.player__label_row_2');
113
114 _this.$cover = _this.$('.player__cover');
115 _this.$messageError = _this.$('.player__message_type_error');
116 _this.$messageLoading = _this.$('.player__message_type_loading');
117 _this.$messageNoRecording = _this.$('.player__message_type_no-recording');
118 _this.$messageNoAudio = _this.$('.player__message_type_no-audio');
119
120 _this._startPlayingAfterRecordingIsLoaded = false;
121
122 _this._config = new App.ContextModule.Config();
123 _this._dynamicDefinitionForRecording = App.dynamicDefinitionProviderForRecordings.get(_this._config);
124
125 _this.listenTo(_this._dynamicDefinitionForRecording, "change", _this.render);
126 _this.listenTo(_this._config, "change", _this.render);
127
128
129
130 this._cachedLabel = "initial";
131 _this.render();
132 },
133
134 render: function() {
135 var _this = this;
136 var recordingAttributes = _this._dynamicDefinitionForRecording.attributes;
137 var label = recordingAttributes.label;
138 var audio = recordingAttributes.audio ? recordingAttributes.audio[0] : undefined;
139
140 // Update layout
141 if (!_.isEqual(_this._cachedRecordingAttributes, recordingAttributes)) {
142 if (!_this._dynamicDefinitionForRecording.attributes.label || !audio) {
143 _this.$body.hide();
144 _this.$cover.show();
145 _this.$cover.children().hide();
146 switch (label) {
147 case false:
148 _this.$messageError.show();
149 break;
150 case null:
151 _this.$messageLoading.show();
152 break;
153 default:
154 if (label === undefined) {
155 _this.$messageNoRecording.show();
156 } else {
157 _this.$messageNoAudio.show();
158 }
159 }
160 PlayerModule.$jPlayer.jPlayer("stop");
161 } else {
162
163 PlayerModule.$jPlayer.jPlayer("setMedia", {
164 mp3: audio,
165 });
166
167 _this.$cover.hide();
168 _this.$body.show();
169 _this.$label1.text(recordingAttributes.label);
170 _this.$label2.text(recordingAttributes.composer);
171 _this.$commandDownload.attr("href", audio);
172
173 if (_this._startPlayingAfterRecordingIsLoaded) {
174 PlayerModule.$jPlayer.jPlayer("play");
175 _this._startPlayingAfterRecordingIsLoaded = false;
176 }
177
178 }
179 }
180
181 if (label) {
182
183 }
184 _this._cachedRecordingAttributes = recordingAttributes;
185 },
186
187 play: function(recordingURI, time) {
188 var _this = this;
189 if (_this._config.getParameterValue("recordingURI") != recordingURI) {
190 _this._startPlayingAfterRecordingIsLoaded = true;
191 _this._config.updateParameter("recordingURI", recordingURI);
192 } else {
193 PlayerModule.$jPlayer.jPlayer("play", time ? time : 0);
194 }
195 },
196
197 stop: function(recordingURI) {
198 var _this = this;
199 PlayerModule.$jPlayer.jPlayer("pause");
200 }
201 });
202
203
204 PlayerModule.playerView = new PlayerModule.PlayerView();
205 });
206
207 PlayerModule.play = function(recordingURI, time) {
208 // try {
209 PlayerModule.playerView.play(recordingURI, time);
210 // } catch (e) {
211 // console.log(e);
212 // }
213 App.NotificationsModule.show({
214 id: "player",
215 content: PlayerModule.playerView.$el,
216 onClose: function() {PlayerModule.playerView.stop();},
217 modifiers: ["ttl_ever", "no-padding"],
218 keepContentInMemoryAfterRemoval: true
219 });
220 };
221
222 }, Logger);