Merge branch 'MDL-69044' of https://github.com/stronk7/moodle
[moodle.git] / lib / editor / atto / plugins / recordrtc / yui / build / moodle-atto_recordrtc-button / moodle-atto_recordrtc-button-debug.js
1 YUI.add('moodle-atto_recordrtc-button', function (Y, NAME) {
3 // This file is part of Moodle - http://moodle.org/
4 //
5 // Moodle is free software: you can redistribute it and/or modify
6 // it under the terms of the GNU General Public License as published by
7 // the Free Software Foundation, either version 3 of the License, or
8 // (at your option) any later version.
9 //
10 // Moodle is distributed in the hope that it will be useful,
11 // but WITHOUT ANY WARRANTY; without even the implied warranty of
12 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
13 // GNU General Public License for more details.
14 //
15 // You should have received a copy of the GNU General Public License
16 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
17 //
19 /**
20  * Atto recordrtc library functions
21  *
22  * @package    atto_recordrtc
23  * @author     Jesus Federico (jesus [at] blindsidenetworks [dt] com)
24  * @author     Jacob Prud'homme (jacob [dt] prudhomme [at] blindsidenetworks [dt] com)
25  * @copyright  2017 Blindside Networks Inc.
26  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
27  */
29 /**
30  * @module moodle-atto_recordrtc-button
31  */
33 /**
34  * Atto text editor recordrtc plugin.
35  *
36  * @namespace M.atto_recordrtc
37  * @class button
38  * @extends M.editor_atto.EditorPlugin
39  */
41 // ESLint directives.
42 /* eslint-disable camelcase, spaced-comment */
44 // JSHint directives.
45 /*global M */
46 /*jshint onevar: false */
48 // Scrutinizer CI directives.
49 /** global: Y */
50 /** global: M */
52 var PLUGINNAME = 'atto_recordrtc',
53     TEMPLATE = '' +
54     '<div class="{{PLUGINNAME}} container-fluid">' +
55       '<div class="{{bs_row}} hide">' +
56         '<div class="{{bs_col}}12">' +
57           '<div id="alert-danger" class="alert {{bs_al_dang}}">' +
58             '<strong>{{insecurealert_title}}</strong> {{insecurealert}}' +
59           '</div>' +
60         '</div>' +
61       '</div>' +
62       '<div class="{{bs_row}} hide">' +
63         '{{#if isAudio}}' +
64           '<div class="{{bs_col}}1"></div>' +
65           '<div class="{{bs_col}}10">' +
66             '<audio id="player"></audio>' +
67           '</div>' +
68           '<div class="{{bs_col}}1"></div>' +
69         '{{else}}' +
70           '<div class="{{bs_col}}12">' +
71             '<video id="player"></video>' +
72           '</div>' +
73         '{{/if}}' +
74       '</div>' +
75       '<div class="{{bs_row}}">' +
76         '<div class="{{bs_col}}1"></div>' +
77         '<div class="{{bs_col}}10">' +
78           '<button id="start-stop" class="{{bs_ss_btn}}">{{startrecording}}</button>' +
79         '</div>' +
80         '<div class="{{bs_col}}1"></div>' +
81       '</div>' +
82       '<div class="{{bs_row}} hide">' +
83         '<div class="{{bs_col}}3"></div>' +
84         '<div class="{{bs_col}}6">' +
85           '<button id="upload" class="btn btn-primary btn-block">{{attachrecording}}</button>' +
86         '</div>' +
87         '<div class="{{bs_col}}3"></div>' +
88       '</div>' +
89     '</div>';
91 Y.namespace('M.atto_recordrtc').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], {
92     /**
93      * The current language by default.
94      */
95     _lang: 'en',
97     initializer: function() {
98         if (this.get('host').canShowFilepicker('media')) {
99             // Add audio and/or video buttons depending on the settings.
100             var allowedtypes = this.get('allowedtypes'),
101                 buttonadded = false;
102             if (allowedtypes === 'both' || allowedtypes === 'audio') {
103                 this._addButton('audio', this._audio);
104                 buttonadded = true;
105             }
106             if (allowedtypes === 'both' || allowedtypes === 'video') {
107                 this._addButton('video', this._video);
108                 buttonadded = true;
109             }
110             if (!buttonadded) {
111                 // Plugin not available here.
112                 return;
113             }
115             // Initialize the dialogue box.
116             var dialogue = this.getDialogue({
117                 width: 1000,
118                 focusAfterHide: null
119             });
121             // If dialogue is closed during recording, do the following.
122             dialogue.after('visibleChange', function() {
123                 var closed = !dialogue.get('visible'),
124                     m = M.atto_recordrtc.commonmodule;
126                 if (closed) {
127                     window.clearInterval(m.countdownTicker);
129                     if (m.mediaRecorder && m.mediaRecorder.state !== 'inactive') {
130                         m.mediaRecorder.stop();
131                     }
133                     if (m.stream) {
134                         m.stream.getTracks().forEach(function(track) {
135                             if (track.readyState !== 'ended') {
136                                 track.stop();
137                             }
138                         });
139                     }
140                 }
142             });
144             dialogue.on('click', function() {
145                 this.centered();
146             });
148             // Require adapter.js library.
149             window.require(['core/adapter'], function(adapter) {
150                 window.adapter = adapter;
151             });
152         }
153     },
155     /**
156      * Add the buttons to the Atto toolbar.
157      *
158      * @method _addButton
159      * @param {string} type
160      * @param {callback} callback
161      * @private
162      */
163     _addButton: function(type, callback) {
164         this.addButton({
165             buttonName: type,
166             icon: this.get(type + 'rtcicon'),
167             iconComponent: PLUGINNAME,
168             callback: callback,
169             title: type + 'rtc',
170             tags: type + 'rtc',
171             tagMatchRequiresAll: false
172         });
173     },
175     /**
176      * Toggle audiortc and normal display mode
177      *
178      * @method _audio
179      * @private
180      */
181     _audio: function() {
182         var dialogue = this.getDialogue();
184         dialogue.set('headerContent', M.util.get_string('audiortc', 'atto_recordrtc'));
185         dialogue.set('bodyContent', this._createContent('audio'));
187         dialogue.show();
189         M.atto_recordrtc.audiomodule.init(this);
190     },
192     /**
193      * Toggle videortc and normal display mode
194      *
195      * @method _video
196      * @private
197      */
198     _video: function() {
199         var dialogue = this.getDialogue();
201         dialogue.set('headerContent', M.util.get_string('videortc', 'atto_recordrtc'));
202         dialogue.set('bodyContent', this._createContent('video'));
204         dialogue.show();
206         M.atto_recordrtc.videomodule.init(this);
207     },
209     /**
210      * Create the HTML to be displayed in the dialogue box
211      *
212      * @method _createContent
213      * @param {string} type
214      * @returns {Object}
215      * @private
216      */
217     _createContent: function(type) {
218         var isAudio = (type === 'audio'),
219             bsRow = 'row',
220             bsCol = 'col-',
221             bsAlDang = 'alert-danger',
222             bsSsBtn = 'btn btn-lg btn-outline-danger btn-block';
224         var bodyContent = Y.Handlebars.compile(TEMPLATE)({
225             PLUGINNAME: PLUGINNAME,
226             isAudio: isAudio,
227             bs_row: bsRow,
228             bs_col: bsCol,
229             bs_al_dang: bsAlDang,
230             bs_ss_btn: bsSsBtn,
231             insecurealert_title: M.util.get_string('insecurealert_title', 'atto_recordrtc'),
232             insecurealert: M.util.get_string('insecurealert', 'atto_recordrtc'),
233             startrecording: M.util.get_string('startrecording', 'atto_recordrtc'),
234             attachrecording: M.util.get_string('attachrecording', 'atto_recordrtc')
235         });
237         return bodyContent;
238     },
240     /**
241      * Close the dialogue without further action.
242      *
243      * @method closeDialogue
244      * @param {Object} scope The "this" context of the editor.
245      */
246     closeDialogue: function(scope) {
247         scope.getDialogue().hide();
249         scope.editor.focus();
250     },
252     /**
253      * Insert the annotation link in the editor.
254      *
255      * @method setLink
256      * @param {Object} scope The "this" context of the editor.
257      * @param {string} annotation The HTML link to the recording.
258      */
259     setLink: function(scope, annotation) {
260         scope.getDialogue().hide();
262         scope.editor.focus();
263         scope.get('host').insertContentAtFocusPoint(annotation);
264         scope.markUpdated();
265     }
266 }, {
267     ATTRS: {
268         /**
269          * The contextid to use when generating this recordrtc.
270          *
271          * @attribute contextid
272          * @type String
273          */
274         contextid: {
275             value: null
276         },
278         /**
279          * The sesskey to use when generating this recordrtc.
280          *
281          * @attribute sesskey
282          * @type String
283          */
284         sesskey: {
285             value: null
286         },
288         /**
289          * The allowedtypes to use when generating this recordrtc.
290          *
291          * @attribute allowedtypes
292          * @type String
293          */
294         allowedtypes: {
295             value: null
296         },
298         /**
299          * The audiobitrate to use when generating this recordrtc.
300          *
301          * @attribute audiobitrate
302          * @type String
303          */
304         audiobitrate: {
305             value: null
306         },
308         /**
309          * The videobitrate to use when generating this recordrtc.
310          *
311          * @attribute videobitrate
312          * @type String
313          */
314         videobitrate: {
315             value: null
316         },
318         /**
319          * The timelimit to use when generating this recordrtc.
320          *
321          * @attribute timelimit
322          * @type String
323          */
324         timelimit: {
325             value: null
326         },
328         /**
329          * The audiortcicon to use when generating this recordrtc.
330          *
331          * @attribute audiortcicon
332          * @type String
333          */
334         audiortcicon: {
335             value: null
336         },
338         /**
339          * The videortcicon to use when generating this recordrtc.
340          *
341          * @attribute videortcicon
342          * @type String
343          */
344         videortcicon: {
345             value: null
346         },
348         /**
349          * Maximum upload size set on server, in bytes.
350          *
351          * @attribute maxrecsize
352          * @type String
353          */
354         maxrecsize: {
355             value: null
356         }
357     }
358 });
361 }, '@VERSION@', {"requires": ["moodle-editor_atto-plugin", "moodle-atto_recordrtc-recording"]});