9 changed files with 172 additions and 3 deletions
@ -0,0 +1,47 @@ |
|||||||
|
/*! |
||||||
|
* Spreed WebRTC. |
||||||
|
* Copyright (C) 2013-2014 struktur AG |
||||||
|
* |
||||||
|
* This file is part of Spreed WebRTC. |
||||||
|
* |
||||||
|
* This program is free software: you can redistribute it and/or modify |
||||||
|
* it under the terms of the GNU Affero General Public License as published by |
||||||
|
* the Free Software Foundation, either version 3 of the License, or |
||||||
|
* (at your option) any later version. |
||||||
|
* |
||||||
|
* This program is distributed in the hope that it will be useful, |
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||||
|
* GNU Affero General Public License for more details. |
||||||
|
* |
||||||
|
* You should have received a copy of the GNU Affero General Public License |
||||||
|
* along with this program. If not, see <http://www.gnu.org/licenses/>. |
||||||
|
* |
||||||
|
*/ |
||||||
|
|
||||||
|
#helptour { |
||||||
|
} |
||||||
|
|
||||||
|
.helptour { |
||||||
|
.in { |
||||||
|
display: block; |
||||||
|
} |
||||||
|
.popover { |
||||||
|
opacity: 0.85; |
||||||
|
} |
||||||
|
.meetingRoom { |
||||||
|
top: 84px; |
||||||
|
left: 10px; |
||||||
|
.arrow { |
||||||
|
left: 10%; |
||||||
|
} |
||||||
|
} |
||||||
|
.buddyList { |
||||||
|
left: initial; |
||||||
|
right: 280px; |
||||||
|
top: 70px; |
||||||
|
.arrow { |
||||||
|
top: 20%; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,78 @@ |
|||||||
|
/* |
||||||
|
* Spreed WebRTC. |
||||||
|
* Copyright (C) 2013-2014 struktur AG |
||||||
|
* |
||||||
|
* This file is part of Spreed WebRTC. |
||||||
|
* |
||||||
|
* This program is free software: you can redistribute it and/or modify |
||||||
|
* it under the terms of the GNU Affero General Public License as published by |
||||||
|
* the Free Software Foundation, either version 3 of the License, or |
||||||
|
* (at your option) any later version. |
||||||
|
* |
||||||
|
* This program is distributed in the hope that it will be useful, |
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||||
|
* GNU Affero General Public License for more details. |
||||||
|
* |
||||||
|
* You should have received a copy of the GNU Affero General Public License |
||||||
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
* |
||||||
|
*/ |
||||||
|
|
||||||
|
define(['jquery', 'text!partials/helpoverlay.html', 'text!partials/helptour.html'], function($, template, templatehelptour) { |
||||||
|
|
||||||
|
//helptour
|
||||||
|
return [function() { |
||||||
|
|
||||||
|
var controller = ['$scope', '$rootScope', '$timeout', 'mediaStream', '$modal', function($scope, $rootScope, $timeout, mediaStream, $modal) { |
||||||
|
var displayTime = 500; |
||||||
|
var doStep = function(i, elem) { |
||||||
|
$timeout(function() { |
||||||
|
$(elem).addClass('in'); |
||||||
|
}, displayTime * i, true); |
||||||
|
$timeout(function() { |
||||||
|
$(elem).removeClass('in'); |
||||||
|
}, displayTime * (i + 1), true); |
||||||
|
}; |
||||||
|
var startTour = function() { |
||||||
|
$scope.steps.each(function(i, x) { |
||||||
|
doStep(i, x); |
||||||
|
}); |
||||||
|
}; |
||||||
|
var introTour = function() { |
||||||
|
$scope.layout.settings = false; |
||||||
|
var controller = ['$scope', '$modalInstance', function($scope, $modalInstance) { |
||||||
|
$scope.goTour = function() { |
||||||
|
$modalInstance.dismiss(); |
||||||
|
startTour(); |
||||||
|
}; |
||||||
|
}]; |
||||||
|
$modal.open({ |
||||||
|
template: templatehelptour, |
||||||
|
controller: controller, |
||||||
|
resolve: {}, |
||||||
|
size: 'sm' |
||||||
|
}); |
||||||
|
}; |
||||||
|
introTour(); |
||||||
|
$scope.$on('showHelpTour', function(current, last) { |
||||||
|
if(current) { |
||||||
|
introTour(); |
||||||
|
} |
||||||
|
}); |
||||||
|
}]; |
||||||
|
|
||||||
|
var link = function($scope, $elem, $attrs) { |
||||||
|
$scope.steps = $elem.find('.popover'); |
||||||
|
}; |
||||||
|
|
||||||
|
return { |
||||||
|
restrict: 'E', |
||||||
|
scope: true, |
||||||
|
replace: true, |
||||||
|
template: template, |
||||||
|
controller: controller, |
||||||
|
link: link |
||||||
|
}; |
||||||
|
}]; |
||||||
|
}); |
||||||
@ -0,0 +1,10 @@ |
|||||||
|
<div class="helptour"> |
||||||
|
<div class="popover bottom meetingRoom"> |
||||||
|
<div class="arrow"></div><h3 class="popover-title">{{_('Meeting Room')}}</h3> |
||||||
|
<div class="popover-content">{{_('Change the current meeting room here. Not all rooms names are available and certain characters are automatically removed.')}}</div> |
||||||
|
</div> |
||||||
|
<div class="popover left buddyList"> |
||||||
|
<div class="arrow"></div><h3 class="popover-title">{{_('Buddy List')}}</h3> |
||||||
|
<div class="popover-content">{{_('Every person in a room is listed here.')}}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
<div> |
||||||
|
<div class="modal-header"> |
||||||
|
<button type="button" class="close" ng-click="$close()">×</button> |
||||||
|
<h3 class="modal-title">{{_('Tour')}}</h3> |
||||||
|
</div> |
||||||
|
<div class="modal-body"> |
||||||
|
<p>Congratulations! Anonymous secure peer to peer chat and video calls are a short click away. Quickly get started with the features tour below.</p> |
||||||
|
</div> |
||||||
|
<div class="modal-footer"> |
||||||
|
<div class="pull-right"> |
||||||
|
<button class="btn btn-default" ng-click="$dismiss()">{{_('Cancel')}}</button> |
||||||
|
<button class="btn btn-primary" ng-click="goTour()">{{_('Go')}}</button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
Loading…
Reference in new issue