Reduce wasted space

Should fix #3 for small devices
Hide the mainVideo area on small devices, instead display only bigger previews. Also switch to 2 cols for preview on large displays, not medium ones
This commit is contained in:
Daniel Berteaud 2014-04-04 17:52:41 +02:00
parent 32d6c5b1b9
commit 80a7cb61cf
2 changed files with 4 additions and 4 deletions

View File

@ -104,7 +104,7 @@ function initVroom(room) {
playSound('join.mp3');
// The main div of this new video
// will contain the video plus all other info like displayName, overlay and volume bar
var div = $('<div></div>').addClass('col-md-6 previewContainer').append(video).appendTo("#webRTCVideo");
var div = $('<div></div>').addClass('col-xs-6 col-sm-12 col-lg-6 previewContainer').append(video).appendTo("#webRTCVideo");
// Peer isn't defined ? it's our own local screen
var id;
if (!peer){

View File

@ -87,8 +87,8 @@
</form>
</div>
<div id="view" class="view row-fluid">
<div id="webRTCVideo" class="col-xs-4">
<div class="col-md-6 previewContainer">
<div id="webRTCVideo" class="col-xs-12 col-sm-4">
<div class="col-xs-6 col-sm-12 col-lg-6 previewContainer">
<video id="webRTCVideoLocal" class="webRTCVideo" muted oncontextmenu="return false;">
</video>
<div id="localVolume" class="volumeBar">
@ -97,7 +97,7 @@
</div>
</div>
</div>
<div id="mainVideo" class="col-xs-8">
<div id="mainVideo" class="col-sm-8 hidden-xs">
<div>
</div>
</div>