entcore 4.6.0 → 4.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/bundle/ng-app.js +21 -21
  2. package/bundle/ng-app.js.map +1 -1
  3. package/dist/ng-app.js +21 -21
  4. package/dist/ng-app.js.map +1 -1
  5. package/dist/template/media-library/record.html +1 -1
  6. package/dist/template/recorder-audio.html +84 -0
  7. package/dist/template/recorder.html +123 -76
  8. package/dist/template/video/main.html +1 -1
  9. package/dist/template/video/record.html +22 -18
  10. package/gulpfile.js +12 -31
  11. package/package.json +1 -1
  12. package/types/src/ts/ui.d.ts +2 -0
  13. package/types/src/ts/video/VideoRecorder.d.ts +1 -0
package/dist/template/media-library/record.html CHANGED
@@ -1 +1 @@
1
- <recorder ng-model="record" on-upload="insertRecord" protected></recorder>
1
+ <recorder ng-model="record" on-upload="insertRecord" template-url="/assets/js/entcore/template/recorder-audio.html" protected></recorder>
package/dist/template/recorder-audio.html ADDED
@@ -0,0 +1,84 @@
1
+ <div class="recorder--audio" ng-if="recorder.isCompatible()">
2
+ <h1><i18n>embed.audio.title</i18n></h1>
3
+ <div class="no-1d recorder--starting">
4
+ <p><i18n>embed.audio.tagline</i18n></p>
5
+ <img skin-src="/img/illustrations/recorder-audio.svg" ng-if="!showActionButtons()"/>
6
+ <button type="button"
7
+ ng-click="switchRecord()"
8
+ ng-if="isIdle() || isStopped()">
9
+ <i18n>embed.start</i18n>
10
+ </button>
11
+ </div>
12
+
13
+ <div class="recorder--controls no-2d" style="justify-content: center">
14
+ <button type="button"
15
+ class="recorder--control"
16
+ ng-click="switchRecord()"
17
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
18
+ ng-disabled="isEncoding() || isUploading()">
19
+ <i class="record-audio"
20
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"></i>
21
+ <span ng-if="isIdle() || isStopped()"><i18n>embed.start.mini</i18n></span>
22
+ <span ng-if="isSuspended()"><i18n>embed.resume</i18n></span>
23
+ <span ng-if="isRecording()"><i18n>embed.suspend</i18n></span>
24
+ </button>
25
+ </div>
26
+
27
+ <div class="recorder--timer"
28
+ ng-if="showActionButtons()"
29
+ ng-class="{'recording': isRecording()}">
30
+ <i class="record-audio no-1d"></i>
31
+ [[time()]]
32
+ </div>
33
+ <input ng-if="showActionButtons()"
34
+ type="text"
35
+ i18n-placeholder="title"
36
+ ng-model="recorder.title" />
37
+
38
+ <div class="recorder--controls" ng-if="showActionButtons()">
39
+ <button type="button"
40
+ class="recorder--control no-1d"
41
+ ng-if="showActionButtons()"
42
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
43
+ ng-click="switchRecord()"
44
+ ng-disabled="isEncoding() || isUploading()">
45
+ <i class="record-audio" ng-class="{'start': !isRecording(), 'suspend': isRecording()}"></i>
46
+ <span ng-if="isIdle() || isStopped()"><i18n>embed.start.mini</i18n></span>
47
+ <span ng-if="!isIdle() && !isStopped() && !isRecording()"><i18n>embed.resume</i18n></span>
48
+ <span ng-if="isRecording()"><i18n>embed.suspend</i18n></span>
49
+ </button>
50
+
51
+ <button type="button"
52
+ class="recorder--control play"
53
+ ng-click="switchPlay()"
54
+ ng-if="showActionButtons()"
55
+ ng-class="{'play': showActionButtons(), 'pause': isPlaying()}"
56
+ ng-disabled="isRecording() || isEncoding() || isUploading()">
57
+ <i ng-class="{'play': showActionButtons(), 'pause': isPlaying()}"></i>
58
+ <span ng-if="!isPlaying()"><i18n>embed.play</i18n></span>
59
+ <span ng-if="isPlaying()"><i18n>embed.pause</i18n></span>
60
+ </button>
61
+
62
+ <button type="button"
63
+ class="recorder--control redo"
64
+ ng-click="recorder.flush()"
65
+ ng-if="showActionButtons()"
66
+ ng-disabled="isRecording() || isEncoding() || isUploading()">
67
+ <i class="redo"></i>
68
+ <span><i18n>embed.redo</i18n></span>
69
+ </button>
70
+
71
+ <button type="button"
72
+ class="recorder--control save"
73
+ ng-click="saveRecord()"
74
+ ng-if="showActionButtons()"
75
+ ng-disabled="isRecording() || isEncoding() || isUploading()">
76
+ <i ng-class="{'save': !isEncoding() && !isUploading(), 'loading': isEncoding() || isUploading()}"></i>
77
+ <span><i18n>embed.save</i18n></span>
78
+ </button>
79
+ </div>
80
+ </div>
81
+
82
+ <div ng-if="!recorder.isCompatible()">
83
+ <p><i18n>recorder.not.supported</i18n></p>
84
+ </div>
package/dist/template/recorder.html CHANGED
@@ -1,84 +1,131 @@
1
- <div class="recorder--audio" ng-if="recorder.isCompatible()">
2
- <h1><i18n>embed.audio.title</i18n></h1>
3
- <div class="no-1d recorder--starting">
4
- <p><i18n>embed.audio.tagline</i18n></p>
5
- <img skin-src="/img/illustrations/recorder-audio.svg" ng-if="!showActionButtons()"/>
6
- <button type="button"
7
- ng-click="switchRecord()"
8
- ng-if="isIdle() || isStopped()">
9
- <i18n>embed.start</i18n>
10
- </button>
11
- </div>
1
+ <div
2
+ class="recorder--audio"
3
+ ng-if="recorder.isCompatible() || isVideoCompatible()"
4
+ >
5
+ <h1><i18n>record-me</i18n></h1>
12
6
 
13
- <div class="recorder--controls no-2d" style="justify-content: center">
14
- <button type="button"
15
- class="recorder--control"
16
- ng-click="switchRecord()"
17
- ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
18
- ng-disabled="isEncoding() || isUploading()">
19
- <i class="record-audio"
20
- ng-class="{'start': !isRecording(), 'suspend': isRecording()}"></i>
21
- <span ng-if="isIdle() || isStopped()"><i18n>embed.start.mini</i18n></span>
22
- <span ng-if="isSuspended()"><i18n>embed.resume</i18n></span>
23
- <span ng-if="isRecording()"><i18n>embed.suspend</i18n></span>
24
- </button>
25
- </div>
7
+ <div class="recorder--controls global" style="justify-content: center">
8
+ <button
9
+ type="button"
10
+ class="recorder--control"
11
+ ng-if="recorder.isCompatible()"
12
+ ng-hide="showCamera || showActionButtons()"
13
+ ng-click="switchRecord()"
14
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
15
+ ng-disabled="isEncoding() || isUploading()"
16
+ >
17
+ <i
18
+ class="record-audio"
19
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
20
+ ></i>
21
+ <span ng-if="isIdle() || isStopped()"
22
+ ><i18n>record.start.audio</i18n></span
23
+ >
24
+ <span ng-if="isSuspended()"><i18n>embed.resume</i18n></span>
25
+ <span ng-if="isRecording()"><i18n>embed.suspend</i18n></span>
26
+ </button>
26
27
 
27
- <div class="recorder--timer"
28
- ng-if="showActionButtons()"
29
- ng-class="{'recording': isRecording()}">
30
- <i class="record-audio no-1d"></i>
31
- [[time()]]
32
- </div>
33
- <input ng-if="showActionButtons()"
34
- type="text"
35
- i18n-placeholder="title"
36
- ng-model="recorder.title" />
37
-
38
- <div class="recorder--controls" ng-if="showActionButtons()">
39
- <button type="button"
40
- class="recorder--control no-1d"
41
- ng-if="showActionButtons()"
42
- ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
43
- ng-click="switchRecord()"
44
- ng-disabled="isEncoding() || isUploading()">
45
- <i class="record-audio" ng-class="{'start': !isRecording(), 'suspend': isRecording()}"></i>
46
- <span ng-if="isIdle() || isStopped()"><i18n>embed.start.mini</i18n></span>
47
- <span ng-if="!isIdle() && !isStopped() && !isRecording()"><i18n>embed.resume</i18n></span>
48
- <span ng-if="isRecording()"><i18n>embed.suspend</i18n></span>
49
- </button>
28
+ <button
29
+ type="button"
30
+ class="recorder--control start"
31
+ ng-if="isVideoCompatible()"
32
+ ng-hide="showCamera || showActionButtons()"
33
+ ng-click="onShowCamera()"
34
+ >
35
+ <i class="record-video start"></i>
36
+ <span ng-if="isIdle() || isStopped()"
37
+ ><i18n>record.start.video</i18n></span
38
+ >
39
+ </button>
40
+ </div>
50
41
 
51
- <button type="button"
52
- class="recorder--control play"
53
- ng-click="switchPlay()"
54
- ng-if="showActionButtons()"
55
- ng-class="{'play': showActionButtons(), 'pause': isPlaying()}"
56
- ng-disabled="isRecording() || isEncoding() || isUploading()">
57
- <i ng-class="{'play': showActionButtons(), 'pause': isPlaying()}"></i>
58
- <span ng-if="!isPlaying()"><i18n>embed.play</i18n></span>
59
- <span ng-if="isPlaying()"><i18n>embed.pause</i18n></span>
60
- </button>
42
+ <!-- video capture -->
43
+ <div ng-if="showCamera">
44
+ <container
45
+ template="entcore/video/record"
46
+ class="record-widget"
47
+ ></container>
48
+ </div>
61
49
 
62
- <button type="button"
63
- class="recorder--control redo"
64
- ng-click="recorder.flush()"
65
- ng-if="showActionButtons()"
66
- ng-disabled="isRecording() || isEncoding() || isUploading()">
67
- <i class="redo"></i>
68
- <span><i18n>embed.redo</i18n></span>
69
- </button>
50
+ <!-- audio capture -->
51
+ <div
52
+ class="recorder--timer"
53
+ ng-if="showActionButtons()"
54
+ ng-class="{'recording': isRecording()}"
55
+ >
56
+ <i class="record-audio no-1d"></i>
57
+ [[time()]]
58
+ </div>
59
+ <input
60
+ ng-if="showActionButtons()"
61
+ type="text"
62
+ i18n-placeholder="title"
63
+ ng-model="recorder.title"
64
+ />
70
65
 
71
- <button type="button"
72
- class="recorder--control save"
73
- ng-click="saveRecord()"
74
- ng-if="showActionButtons()"
75
- ng-disabled="isRecording() || isEncoding() || isUploading()">
76
- <i ng-class="{'save': !isEncoding() && !isUploading(), 'loading': isEncoding() || isUploading()}"></i>
77
- <span><i18n>embed.save</i18n></span>
78
- </button>
79
- </div>
66
+ <div class="recorder--controls" ng-if="showActionButtons()">
67
+ <button
68
+ type="button"
69
+ class="recorder--control"
70
+ ng-if="showActionButtons()"
71
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
72
+ ng-click="switchRecord()"
73
+ ng-disabled="isEncoding() || isUploading()"
74
+ >
75
+ <i
76
+ class="record-audio"
77
+ ng-class="{'start': !isRecording(), 'suspend': isRecording()}"
78
+ ></i>
79
+ <span ng-if="isIdle() || isStopped()"><i18n>embed.start.mini</i18n></span>
80
+ <span ng-if="!isIdle() && !isStopped() && !isRecording()"
81
+ ><i18n>embed.resume</i18n></span
82
+ >
83
+ <span ng-if="isRecording()"><i18n>embed.suspend</i18n></span>
84
+ </button>
85
+
86
+ <button
87
+ type="button"
88
+ class="recorder--control play"
89
+ ng-click="switchPlay()"
90
+ ng-if="showActionButtons()"
91
+ ng-class="{'play': showActionButtons(), 'pause': isPlaying()}"
92
+ ng-disabled="isRecording() || isEncoding() || isUploading()"
93
+ >
94
+ <i ng-class="{'play': showActionButtons(), 'pause': isPlaying()}"></i>
95
+ <span ng-if="!isPlaying()"><i18n>embed.play</i18n></span>
96
+ <span ng-if="isPlaying()"><i18n>embed.pause</i18n></span>
97
+ </button>
98
+
99
+ <button
100
+ type="button"
101
+ class="recorder--control save"
102
+ ng-click="saveRecord()"
103
+ ng-if="showActionButtons()"
104
+ ng-disabled="isRecording() || isEncoding() || isUploading()"
105
+ >
106
+ <i
107
+ ng-class="{'save': !isEncoding() && !isUploading(), 'loading': isEncoding() || isUploading()}"
108
+ ></i>
109
+ <span><i18n>embed.save</i18n></span>
110
+ </button>
111
+
112
+ <button
113
+ type="button"
114
+ class="recorder--control redo"
115
+ ng-click="recorder.flush()"
116
+ ng-if="showActionButtons()"
117
+ ng-disabled="isRecording() || isEncoding() || isUploading()"
118
+ >
119
+ <i class="redo"></i>
120
+ <span><i18n>embed.redo</i18n></span>
121
+ </button>
122
+ </div>
80
123
  </div>
81
124
 
82
- <div ng-if="!recorder.isCompatible()">
83
- <p><i18n>recorder.not.supported</i18n></p>
125
+ <div
126
+ class="recorder-notSupported"
127
+ ng-if="!recorder.isCompatible() && !isVideoCompatible()"
128
+ >
129
+ <h1><i18n>record-me</i18n></h1>
130
+ <p><i18n>recorder.not.supported</i18n></p>
84
131
  </div>
package/dist/template/video/main.html CHANGED
@@ -43,7 +43,7 @@
43
43
  </header>
44
44
  </section>
45
45
  <section class="medium-text">
46
- <container template="entcore/video/main" guard-ignore-template></container>
46
+ <container template="entcore/video/main" class="record-modal" guard-ignore-template></container>
47
47
  <container template="entcore/video/cache" guard-ignore-template style="display:none"></container>
48
48
  </section>
49
49
  </section>
package/dist/template/video/record.html CHANGED
@@ -29,46 +29,50 @@
29
29
  </div>
30
30
  </div>
31
31
  <div class="recorder--controls" ng-if="isReady()">
32
- <button type="button" ng-click="startRecord()">
33
- <i class=record-video></i>
34
- <span><i18n>embed.start</i18n></span>
35
- </button>
36
32
  <select class="two cell" style="margin-top: 10px"
37
33
  ng-if="videoInputDevices.length > 1"
38
34
  ng-options="vid as vid.label for vid in videoInputDevices"
39
35
  ng-model="selectedVid" ng-change="switchCamera( selectedVid )" >
40
36
  </select>
41
37
  </div>
42
- <div class="recorder--controls controls" ng-if="showActions()">
43
- <button type="button" class="recorder--control stop" ng-click="switchRecording()" ng-disabled="!isRecording()">
44
- <i class=stop></i>
45
- <span><i18n>embed.stop</i18n></span>
38
+ <div class="timer timer-widget" ng-if="isReady() || showActions()">
39
+ <i class="record-video"></i>
40
+ <span>[[recordTime]] / [[pad(recordMaxTime)]]:00</span>
41
+ </div>
42
+ <div class="recorder--controls vidéo controls" ng-if="isReady() || showActions()">
43
+ <button type="button" class="recorder--control stop" ng-click="stopRecord()" ng-hide="!isRecording()">
44
+ <i class="stop"></i>
45
+ <span ng-if="isRecording()"><i18n>embed.stop</i18n></span>
46
46
  </button>
47
- <button type="button" class="recorder--control play" ng-click="play()" ng-disabled="!isRecorded() || !isReplayAllowed()">
47
+
48
+ <button type="button" class="recorder--control play" ng-click="startRecord()" ng-disabled="isRecorded() || isUploading()" ng-hide="isRecording()">
49
+ <i class="record-video"></i>
50
+ <span ng-if="!isRecording()"><i18n>embed.record</i18n></span>
51
+ </button>
52
+
53
+ <button type="button" class="recorder--control play" ng-click="play()" ng-disabled="!isRecorded()">
48
54
  <i ng-class="{'play': !isPlaying(), 'pause': isPlaying()}"></i>
49
55
  <span ng-if="!isPlaying()"><i18n>embed.play</i18n></span>
50
56
  <span ng-if="isPlaying()"><i18n>embed.pause</i18n></span>
51
57
  </button>
52
- <button type="button" class="recorder--control redo" ng-click="redo()" ng-disabled="!isRecorded()">
53
- <i class=redo></i>
54
- <span><i18n>embed.redo</i18n></span>
55
- </button>
56
58
  <button type="button" class="recorder--control save" ng-click="upload()" ng-disabled="!isRecorded()">
57
59
  <i ng-class="{'save': !isUploading(), 'loading': isUploading(), 'block': isUploading()}"></i>
58
60
  <span><i18n>embed.save</i18n></span>
59
61
  </button>
62
+ <button type="button" class="recorder--control redo" ng-click="redo()" ng-disabled="isRecording()">
63
+ <i class="redo"></i>
64
+ <span><i18n>embed.redo</i18n></span>
65
+ </button>
60
66
  </div>
61
- <div ng-if="!isIncompatible()">
62
- <div class="recorder--viewer" ng-if="isUploading()"><p><i18n>video.upload.msg</i18n></p></div>
63
- <div class="recorder--viewer" ng-if="isReady() || isRecording()">
64
- <p><i18n>video.msg</i18n></p>
67
+ <div ng-if="!isIncompatible()" class="video">
68
+ <div class="recorder--viewer timer-modal" ng-if="isReady() || isRecording()">
65
69
  <div class="recorder--timer">
66
70
  <i class="rec" ng-if="isRecording()"></i>
67
71
  <span>[[recordTime]] / [[pad(recordMaxTime)]]:00</span>
68
72
  </div>
69
73
  </div>
70
74
  <div class="recorder--viewer" ng-show="isCameraVisible()">
71
- <video id="gum" playsinline="true" autoplay muted ng-hide="isRecorded() && !isReplayAllowed()"></video>
75
+ <video id="gum" playsinline="true" autoplay muted></video>
72
76
  </div>
73
77
  </div>
74
78
  </div>
package/gulpfile.js CHANGED
@@ -44,41 +44,15 @@ function buildDev() {
44
44
  }
45
45
 
46
46
  function update(cb) {
47
- GlobManager.js().then(f => {
48
- f.forEach((file) => {
49
- const split = file.split('/');
50
- const fileName = split[split.length - 1];
51
- console.log('Copying js to ' + split.slice(0, split.length - 1).join('/'));
52
- gulp.src('./bundle/ng-app.js')
53
- .pipe(rename(fileName))
54
- .pipe(gulp.dest(split.slice(0, split.length - 1).join('/')));
55
- });
56
- });
57
- GlobManager.jsMap().then(f => {
58
- f.forEach((file) => {
59
- const split = file.split('/');
60
- const fileName = split[split.length - 1];
61
- gulp.src('./bundle/ng-app.js.map')
62
- .pipe(rename(fileName))
63
- .pipe(gulp.dest(split.slice(0, split.length - 1).join('/')));
64
- });
65
- });
47
+ console.log('Copying js to ' + springboardPath + '/assets/js/entcore/ng-app.js');
48
+ gulp.src('./bundle/ng-app.js').pipe(gulp.dest(springboardPath + '/assets/js/entcore/'));
49
+ //gulp.src('./bundle/ng-app.js.map').pipe(gulp.dest(springboardPath + '/assets/js/entcore/'));
66
50
  cb();
67
51
  }
68
52
 
69
53
  function copyHtml(cb) {
70
- const apps = [];
71
- GlobManager.html().then(f => {
72
- f.forEach((file) => {
73
- const app = file.split('/public/template/entcore')[0];
74
- if (apps.indexOf(app) === -1) {
75
- apps.push(app);
76
- console.log('copy to ' + app + '/public/template/entcore')
77
- gulp.src('./src/template/**/*')
78
- .pipe(gulp.dest(app + '/public/template/entcore'));
79
- }
80
- });
81
- })
54
+ console.log('copy to ' + springboardPath + '/assets/js/entcore/template')
55
+ gulp.src('./src/template/**/*').pipe(gulp.dest(springboardPath + '/assets/js/entcore/template'));
82
56
  cb();
83
57
  }
84
58
 
@@ -104,6 +78,7 @@ const GlobManager = {
104
78
  _js: null,
105
79
  _jsMap: null,
106
80
  _html: null,
81
+ _templates: null,
107
82
  _buildPromise: (path) => {
108
83
  return new Promise((resolve, reject) => {
109
84
  console.log("init glob for: ",path)
@@ -133,6 +108,12 @@ const GlobManager = {
133
108
  GlobManager._html = GlobManager._buildPromise(springboardPath + '/mods/**/public/template/entcore/*.html')
134
109
  }
135
110
  return GlobManager._html;
111
+ },
112
+ templates: () => {
113
+ if (!GlobManager._templates) {
114
+ GlobManager._templates = GlobManager._buildPromise('./src/template/**/*.html')
115
+ }
116
+ return GlobManager._templates;
136
117
  }
137
118
  }
138
119
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "entcore",
3
- "version": "4.6.0",
3
+ "version": "4.7.0",
4
4
  "description": "",
5
5
  "scripts": {
6
6
  "dev:watch": "npx gulp watch --springboard=../${SPRINGBOARD} 2>/dev/null",
package/types/src/ts/ui.d.ts CHANGED
@@ -24,6 +24,8 @@ export declare const ui: {
24
24
  resizable: (element: any, params: ResizeParams) => void;
25
25
  draggable: (element: any, params: {
26
26
  lock?: any;
27
+ delay?: number;
28
+ delayOnTouchOnly?: number;
27
29
  restrict?: any;
28
30
  tick?: any;
29
31
  dragOver?: any;
package/types/src/ts/video/VideoRecorder.d.ts CHANGED
@@ -2,6 +2,7 @@ import { Subject } from "rxjs";
2
2
  export declare class VideoRecorder {
3
3
  private videoFactory;
4
4
  private handleDuration;
5
+ static isCompatible(): boolean;
5
6
  private stream;
6
7
  private gumVideo;
7
8
  private mediaRecorder;