pimhwang
/
spreed-webrtc
mirror of https://github.com/strukturag/spreed-webrtc.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Implemented page loader.

pull/12/head
Simon Eisenmann 11 years ago committed by Simon Eisenmann
parent
59efc365fb
commit
943b81b851
6 changed files with 26 additions and 55 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      html/main.html
  2. 2
      src/styles/components/_usability.scss
  3. 13
      src/styles/global/_base.scss
  4. 8
      static/js/directives/directives.js
  5. 11
      static/js/directives/usability.js
  6. 43
      static/partials/usability.html

4
html/main.html
Unescape View File

@ -6,9 +6,7 @@
<body ng-controller="MediastreamController" ng-class="{withBuddylist: showBuddylist, withChat: chatEnabled, withSettings: showSettings, slideright: !showBuddylist}"> <body ng-controller="MediastreamController" ng-class="{withBuddylist: showBuddylist, withChat: chatEnabled, withSettings: showSettings, slideright: !showBuddylist}">
<div id="background"></div> <div id="background"></div>
<div id="loader"><div><i class="fa fa-spinner fa-spin"></i></div></div> <div id="loader"><div><i class="fa fa-spinner fa-spin"></i></div></div>
<div class="ng-cloak" id="help"> <page></page>
<usability/>
</div>
<div id="bar"> <div id="bar">
<div class="left"> <div class="left">
<%template "logo" .%> <%template "logo" .%>

2
src/styles/components/_usability.scss
Unescape View File

@ -20,7 +20,7 @@
*/ */
#help { #help {
position:absolute; position:absolute;
top:120px; top:80px;
bottom:10px; bottom:10px;
left:0px; left:0px;
right:0px; right:0px;

13
src/styles/global/_base.scss
Unescape View File

@ -100,4 +100,17 @@ z-index:0;
} }
#loader.done { #loader.done {
opacity:0; opacity:0;
}
#page {
position:absolute;
top:44px;
bottom:0px;
left:0px;
right:0px;
}
.welcome {
color:#aaa;
text-shadow: 0 0 5px black;
font-size:1.1em;
margin-top:80px;
} }

8
static/js/directives/directives.js
Unescape View File

@ -33,8 +33,9 @@ define([
'directives/fileinfo', 'directives/fileinfo',
'directives/screenshare', 'directives/screenshare',
'directives/roombar', 'directives/roombar',
'directives/socialshare' 'directives/socialshare',
], function(_, onEnter, onEscape, statusMessage, buddyList, settings, chat, audioVideo, usability, audioLevel, fileInfo, screenshare, roomBar, socialShare) { 'directives/page'
], function(_, onEnter, onEscape, statusMessage, buddyList, settings, chat, audioVideo, usability, audioLevel, fileInfo, screenshare, roomBar, socialShare, page) {
var directives = { var directives = {
onEnter: onEnter, onEnter: onEnter,
@ -49,7 +50,8 @@ define([
fileInfo: fileInfo, fileInfo: fileInfo,
screenshare: screenshare, screenshare: screenshare,
roomBar: roomBar, roomBar: roomBar,
socialShare: socialShare socialShare: socialShare,
page: page
}; };
var initialize = function (angModule) { var initialize = function (angModule) {

11
static/js/directives/usability.js
Unescape View File

@ -34,7 +34,7 @@ define(['jquery', 'underscore', 'text!partials/usability.html'], function($, _,
var ctrl = this; var ctrl = this;
ctrl.setInfo = function(info) { ctrl.setInfo = function(info) {
$scope.usabilityInfo = info; $scope.usabilityInfo = info;
} };
ctrl.setInfo("waiting"); ctrl.setInfo("waiting");
$scope.continueConnect = function(status) { $scope.continueConnect = function(status) {
@ -45,14 +45,15 @@ define(['jquery', 'underscore', 'text!partials/usability.html'], function($, _,
$scope.connect() $scope.connect()
ctrl.setInfo("initializing"); ctrl.setInfo("initializing");
initializer = $timeout(function() { initializer = $timeout(function() {
ctrl.setInfo("noroom"); ctrl.setInfo("ok");
$scope.$emit("welcome");
}, 1000); }, 1000);
complete = true; complete = true;
} else { } else {
ctrl.setInfo("denied"); ctrl.setInfo("denied");
} }
// Check if we should show settings per default. // Check if we should show settings per default.
$scope.showSettings = $scope.loadedUser ? 0 : 1; $scope.$parent.showSettings = $scope.loadedUser ? 0 : 1;
}); });
}; };
@ -91,13 +92,13 @@ define(['jquery', 'underscore', 'text!partials/usability.html'], function($, _,
}); });
$scope.$on("room", function(event, room) { $scope.$on("room", function(event, room) {
console.log("roomStatus", room !== null ? true : false); //console.log("roomStatus", room !== null ? true : false);
if (complete) { if (complete) {
if (initializer !== null) { if (initializer !== null) {
$timeout.cancel(initializer); $timeout.cancel(initializer);
initializer = null; initializer = null;
} }
ctrl.setInfo(room !== null ? "room" : "noroom"); ctrl.setInfo("ok");
} }
}); });

43
static/partials/usability.html
Unescape View File

@ -2,49 +2,6 @@
<div class="animate-show" ng-hide="showSettings"> <div class="animate-show" ng-hide="showSettings">
<div class="fadetogglecontainer" ng-switch="usabilityInfo"> <div class="fadetogglecontainer" ng-switch="usabilityInfo">
<div ng-switch-when="checking"><i class="fa fa-refresh fa-spin fa-4x pull-right"></i>{{_("Checking camera and microphone access.")}}</div> <div ng-switch-when="checking"><i class="fa fa-refresh fa-spin fa-4x pull-right"></i>{{_("Checking camera and microphone access.")}}</div>
<div ng-switch-when="room">
<div ng-show="roomlink">
<h3 style="margin-top:0px">{{_("Room")}} {{roomid}}</h3>
<p><i>{{_("Link:")}}</i></p>
<p>
<div class="input-group-lg">
<input type="text" class="form-control" ng-model="roomlink" disabled>
</div>
</p>
<p><i>{{_("You are in this room.")}}</i></p>
<small>
<ul class="fa-ul">
<li><i class="fa-li fa fa-share-square"></i>{{_("Share this URL with the people you want to meet.")}}</li>
<li><i class="fa-li fa fa-repeat"></i>{{_("You can use and re-use this room as many times as you want.")}}</li>
</ul>
</small>
<social-share/>
</div>
<div ng-show="!roomlink">
<p>{{_("You are in the general room.")}}</p>
<p>{{_('Break out into a seperate room at any time by clicking on the icon in the top left corner.')}}</p>
</div>
</div>
<div ng-switch-when="noroom" ng-controller="RoomchangeController">
<h3 style="margin-top:0px">{{_("Create your room")}}</h3>
<p><i>{{_("This is your room link:")}}</i></p>
<p>
<div class="input-group input-group-lg">
<input type="text" class="form-control roomdata-link-input" ng-model="roomdata.link" placeholder="{{_('Creating room link ...')}}" disabled>
<span class="input-group-btn">
<button class="btn btn-primary" type="button" ng-disabled="!roomdata.link" ng-click="changeRoomToId(roomdata.name)">{{_("Start")}}</button>
</span>
</div>
</p>
<p><i>{{_("Just click start")}}</i></p>
<small>
<ul class="fa-ul">
<li><i class="fa-li fa fa-share-square"></i>{{_("Share this URL with the people you want to meet.")}}</li>
<li><i class="fa-li fa fa-repeat"></i>{{_("You can use and re-use this room as many times as you want.")}}</li>
</ul>
</small>
<social-share/>
</div>
<div ng-switch-when="usermedia"><i><i class="fa fa-hand-o-up fa-4x pull-right"></i>{{_("Please allow access to your camera and microphone.")}}</i></div> <div ng-switch-when="usermedia"><i><i class="fa fa-hand-o-up fa-4x pull-right"></i>{{_("Please allow access to your camera and microphone.")}}</i></div>
<div ng-switch-when="denied"><i><i class="fa fa-exclamation-triangle fa-4x pull-right"></i>{{_("Camera / microphone access required.")}}</i></div> <div ng-switch-when="denied"><i><i class="fa fa-exclamation-triangle fa-4x pull-right"></i>{{_("Camera / microphone access required.")}}</i></div>
</div> </div>

Write Preview
Loading…
Cancel
Save