Skip to content

Commit 356ae6e

Browse files
mr21mr21
committed
API+UI: windowResize, better conception on all the resize callbacks
1 parent 38eee16 commit 356ae6e

21 files changed

+104
-79
lines changed

‎api/loadFile.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,11 @@ $.extend( api, {
3636
api.isLoading = false;
3737
api.isLoaded = true;
3838
api.imageRatio = api.videoElement.videoWidth / api.videoElement.videoHeight;
39-
api.screen.resize();
4039
api.video.playbackRate( 1 );
41-
ui.subtitlesResizeUpdate();
40+
ui
41+
.updimVideo()
42+
.updimSubtitles()
43+
;
4244
return api;
4345
}
4446
});

‎api/screen.js

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -8,27 +8,6 @@ var
88
;
99

1010
api.screen = that = {
11-
12-
resize: function() {
13-
var
14-
r = api.imageRatio,
15-
w = that.width = dom.screenVideo.width(),
16-
h = that.height = dom.screenVideo.height(),
17-
rElem = w / h
18-
;
19-
api.video.width = r > rElem ? w : h * r;
20-
api.video.height = r < rElem ? h : w / r;
21-
return that;
22-
},
23-
resizeFilename: function() {
24-
dom.screenFilename.css(
25-
"width", ui.listIsOpen()
26-
? 100 - ui.listWidth() + "%"
27-
: "100%"
28-
);
29-
return that;
30-
},
31-
3211
brightness: function( o ) {
3312
if ( arguments.length === 0 ) {
3413
return brightness;

‎api/visualisations.js

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,11 +28,6 @@ api.visualisations = that = {
2828
;
2929
return that;
3030
},
31-
resize: function() {
32-
canvas.width = api.screen.width;
33-
canvas.height = api.screen.height;
34-
return that;
35-
},
3631
select: function( name ) {
3732
selectedVisu = visu[ name ] || $.noop;
3833
jqOldVisu.removeClass( "selected" );

‎dom.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,8 @@ window.dom = {
2525
screenFilename: $( ".screen .filenameWrapper" ),
2626
screenFilenameText: $( ".screen .filename" ),
2727
screenShortcutText: $( ".screen .shortcutDesc" ),
28-
screenCue: $( ".screen .cues > *" ),
28+
screenCueWrapper: $( ".screen .cues" ),
29+
screenCue: $( ".screen .cues > *" ),
2930
numVersion: $( ".screen .num" ),
3031

3132
// Playlist

‎event/inputFiles.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ dom.body.on({
6767
dragY = y;
6868

6969
// Drag on the player.
70-
if ( !ui.listIsOpen() || x < ( 1 - ui.listWidth() / 100 ) * api.screen.width ) {
70+
if ( !ui.listIsOpen() || x < ( 1 - ui.percListWidth / 100 ) * ui.pxScreenWidth ) {
7171
autoplay = true;
7272
ui.listDragOver( dom.screen );
7373

‎event/listWidth.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ dom.doc
2929
.mousemove( function( e ) {
3030
if ( mousedown ) {
3131
ui.listWidth(
32-
100 - e.originalEvent.pageX / api.screen.width * 100
32+
100 - e.originalEvent.pageX / ui.pxScreenWidth * 100
3333
);
3434
}
3535
})

‎event/fullscreen.js renamed to ‎event/screen.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
(function() {
44

5+
dom.window.resize( ui.windowResize );
6+
57
function fsToggle() {
68
document.toggleFullscreen( document.documentElement );
79
}

‎event/windowResize.js

Lines changed: 0 additions & 10 deletions
This file was deleted.

‎index.html

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -199,6 +199,7 @@
199199
<script src="tools/utils.js"></script>
200200
<script src="dom.js"></script>
201201
<script src="api/main.js"></script>
202+
202203
<script src="api/audio.js"></script>
203204
<script src="api/error.js"></script>
204205
<script src="api/file.js"></script>
@@ -213,6 +214,14 @@
213214
<script src="api/thumbnail/canvas.js"></script>
214215
<script src="api/video.js"></script>
215216
<script src="api/visualisations.js"></script>
217+
218+
<script src="ui/updim/canvas.js"></script>
219+
<script src="ui/updim/filename.js"></script>
220+
<script src="ui/updim/list.js"></script>
221+
<script src="ui/updim/screen.js"></script>
222+
<script src="ui/updim/subtitles.js"></script>
223+
<script src="ui/updim/video.js"></script>
224+
216225
<script src="ui/actionDesc.js"></script>
217226
<script src="ui/brightness.js"></script>
218227
<script src="ui/currentTimeDuration.js"></script>
@@ -235,10 +244,12 @@
235244
<script src="ui/subtitles.js"></script>
236245
<script src="ui/visualisations.js"></script>
237246
<script src="ui/volume.js"></script>
247+
<script src="ui/windowResize.js"></script>
248+
238249
<script src="event/brightness.js"></script>
239250
<script src="event/capture.js"></script>
240251
<script src="event/controls.js"></script>
241-
<script src="event/fullscreen.js"></script>
252+
<script src="event/screen.js"></script>
242253
<script src="event/inputFiles.js"></script>
243254
<script src="event/inputText.js"></script>
244255
<script src="event/listWidth.js"></script>
@@ -252,7 +263,6 @@
252263
<script src="event/video.js"></script>
253264
<script src="event/visualisations.js"></script>
254265
<script src="event/volume.js"></script>
255-
<script src="event/windowResize.js"></script>
256266
<!-- -->
257267

258268
<!-- Initialisation -->

‎init.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ var
2525
brightness = cookies.brightness,
2626
plMode = cookies.playlistmode,
2727
listOpen = cookies.playlistshow === "true",
28-
listWidth = cookies.playlistwidth || ( dom.playlist.width() / api.screen.width * 100 )
28+
listWidth = cookies.playlistwidth || ( dom.playlist.width() / ui.pxScreenWidth * 100 )
2929
;
3030
if ( vol === undefined ) {
3131
vol = 1;

‎main.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎ui/listOpen.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ $.extend( ui, {
1818
open = true;
1919
dom.playlist.addClass( "show" );
2020
dom.ctrlPlaylistBtn[ 0 ].dataset.tooltipContent = "Hide playlist";
21-
api.screen.resizeFilename();
21+
ui.updimFilename();
2222
Cookies.set( "playlistshow", open, { expires: 365 } );
2323
return ui;
2424
},
@@ -27,7 +27,7 @@ $.extend( ui, {
2727
dom.playlist.removeClass( "show" );
2828
dom.playlistInputURL.blur();
2929
dom.ctrlPlaylistBtn[ 0 ].dataset.tooltipContent = "Show playlist";
30-
api.screen.resizeFilename();
30+
ui.updimFilename();
3131
Cookies.set( "playlistshow", open, { expires: 365 } );
3232
return ui;
3333
}

‎ui/listWidth.js

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,13 @@
11
"use strict";
22

3-
(function() {
4-
5-
var width;
6-
73
$.extend( ui, {
84
listWidth: function( w ) {
9-
if ( arguments.length === 0 ) {
10-
return width;
11-
}
12-
width = w;
5+
ui.percListWidth = w;
136
dom.playlist.css( "width", w + "%" );
14-
ui.listResize();
157
if ( ui.listIsOpen() ) {
16-
api.screen.resizeFilename();
8+
ui.updimFilename();
179
}
1810
Cookies.set( "playlistwidth", w, { expires: 365 } );
1911
return ui;
20-
},
21-
listResize: function() {
22-
width = dom.playlist.width() / api.screen.width * 100;
23-
return ui;
2412
}
2513
});
26-
27-
})();

‎ui/subtitles.js

Lines changed: 1 addition & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,25 +3,10 @@
33
(function() {
44

55
var
6-
currentCue,
7-
jqSubtitlesCueParent = dom.screenCue.parent()
6+
currentCue
87
;
98

109
$.extend( ui, {
11-
subtitlesResizeUpdate: function() {
12-
var
13-
imgW = api.video.width,
14-
btm = ( api.screen.height - api.video.height ) / 2
15-
;
16-
jqSubtitlesCueParent
17-
.toggleClass( "isUnderCtrl", btm < 80 ) // 80: dom.ctrl.outerHeight()
18-
.css({
19-
bottom: btm,
20-
fontSize: Math.max( 10, imgW / 100 * 2.5 ) + "px"
21-
})
22-
;
23-
return ui;
24-
},
2510
subtitlesToggle: function( b ) {
2611
ui.subtitlesCue( b
2712
? api.subtitles.findCue()

‎ui/updim/canvas.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
"use strict";
2+
3+
ui.updimCanvas = function() {
4+
var canvas = dom.screenCanvas[ 0 ];
5+
canvas.width = ui.pxScreenWidth;
6+
canvas.height = ui.pxScreenHeight;
7+
return ui;
8+
};

‎ui/updim/filename.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
"use strict";
2+
3+
ui.updimFilename = function() {
4+
dom.screenFilename.css(
5+
"width", ui.listIsOpen()
6+
? 100 - ui.percListWidth + "%"
7+
: "100%"
8+
);
9+
return ui;
10+
};

‎ui/updim/list.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
"use strict";
2+
3+
ui.updimList = function() {
4+
ui.percListWidth = dom.playlist.width() / ui.pxScreenWidth * 100;
5+
return ui;
6+
};

‎ui/updim/screen.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
"use strict";
2+
3+
ui.updimScreen = function() {
4+
var
5+
w = dom.screenVideo.width(),
6+
h = dom.screenVideo.height()
7+
;
8+
ui.pxScreenWidth = w;
9+
ui.pxScreenHeight = h;
10+
ui.screenRatio = w / h;
11+
return ui;
12+
};

‎ui/updim/subtitles.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
"use strict";
2+
3+
ui.updimSubtitles = function() {
4+
var btm = ( ui.pxScreenHeight - ui.pxVideoHeight ) / 2;
5+
dom.screenCueWrapper
6+
.toggleClass( "isUnderCtrl", btm < 80 ) // 80: dom.ctrl.outerHeight()
7+
.css( {
8+
bottom: btm,
9+
fontSize: Math.max( 10, ui.pxVideoWidth / 100 * 2.5 ) + "px"
10+
})
11+
;
12+
return ui;
13+
};

‎ui/updim/video.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
"use strict";
2+
3+
ui.updimVideo = function() {
4+
var
5+
r = api.imageRatio,
6+
w = ui.pxScreenWidth,
7+
h = ui.pxScreenHeight
8+
;
9+
ui.pxVideoWidth = r > ui.screenRatio ? w : h * r;
10+
ui.pxVideoHeight = r < ui.screenRatio ? h : w / r;
11+
return ui;
12+
};

‎ui/windowResize.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
"use strict";
2+
3+
ui.windowResize = function() {
4+
5+
// Be careful with changing this order:
6+
return ui
7+
.updimScreen()
8+
.updimVideo()
9+
.updimList()
10+
.updimFilename()
11+
.updimCanvas()
12+
.updimSubtitles()
13+
;
14+
};

0 commit comments

Comments
 (0)