Browse Source
Allow setting multiple STUN servers
Allow setting multiple STUN servers
Signed-off-by: Joas Schilling <coding@schilljs.com>pull/427/head
Joas Schilling
8 years ago
No known key found for this signature in database
GPG Key ID: E166FD8976B3BAC8
14 changed files with 268 additions and 134 deletions
-
7appinfo/info.xml
-
8css/settings-admin.css
-
19css/settings-admin.scss
-
100js/admin/stun-server.js
-
13js/settings-admin.js
-
11js/settings-personal.js
-
13lib/Config.php
-
40lib/Controller/AppSettingsController.php
-
4lib/Settings/Admin/Section.php
-
70lib/Settings/Admin/StunServer.php
-
7lib/Settings/Admin/TurnServer.php
-
56templates/settings-admin.php
-
14templates/settings/admin/stun-server.php
-
40templates/settings/admin/turn-server.php
@ -1,8 +0,0 @@ |
|||
#spreed_settings_form label { |
|||
min-width: 200px; |
|||
display: inline-block; |
|||
} |
|||
|
|||
#spreed_settings_form input { |
|||
width: 300px; |
|||
} |
|||
@ -0,0 +1,19 @@ |
|||
.videocalls.section { |
|||
input { |
|||
width: 300px; |
|||
} |
|||
|
|||
.icon-delete, |
|||
div.stun-server:last-child .icon-add { |
|||
display: inline-block; |
|||
} |
|||
|
|||
.error { |
|||
border-color: $color-error; |
|||
} |
|||
|
|||
label { |
|||
min-width: 200px; |
|||
display: inline-block; |
|||
} |
|||
} |
|||
@ -0,0 +1,100 @@ |
|||
/* global OC, OCP, OCA, $, _ */ |
|||
|
|||
(function(OC, OCP, OCA, $, _) { |
|||
'use strict'; |
|||
|
|||
OCA.VideoCalls = OCA.VideoCalls || {}; |
|||
OCA.VideoCalls.Admin = OCA.VideoCalls.Admin || {}; |
|||
OCA.VideoCalls.Admin.StunServer = { |
|||
|
|||
TEMPLATE: '<div class="stun-server">' + |
|||
' <input type="text" name="stun_server" placeholder="stunserver:port" value="{{server}}" />' + |
|||
' <a class="icon icon-delete" title="' + t('spreed', 'Delete server') + '"></a>' + |
|||
' <a class="icon icon-add" title="' + t('spreed', 'Add new server') + '"></a>' + |
|||
'</div>', |
|||
$list: undefined, |
|||
template: undefined, |
|||
|
|||
init: function() { |
|||
this.template = Handlebars.compile(this.TEMPLATE); |
|||
this.$list = $('div.stun-servers'); |
|||
this.renderList(); |
|||
}, |
|||
|
|||
renderList: function() { |
|||
var servers = this.$list.data('servers'); |
|||
|
|||
_.each(servers, function(server) { |
|||
this.$list.append( |
|||
this.renderServer(server) |
|||
); |
|||
}.bind(this)); |
|||
|
|||
if (servers.length === 0) { |
|||
this.addNewTemplate('stun.nextcloud.com:443'); |
|||
} |
|||
}, |
|||
|
|||
addNewTemplate: function(server) { |
|||
server = server || ''; |
|||
this.$list.append( |
|||
this.renderServer(server) |
|||
); |
|||
}, |
|||
|
|||
deleteServer: function(e) { |
|||
e.stopPropagation(); |
|||
|
|||
var $server = $(e.currentTarget).parents('div.stun-server').first(); |
|||
$server.remove(); |
|||
|
|||
this.saveServers(); |
|||
|
|||
if (this.$list.find('div.stun-server').length === 0) { |
|||
this.addNewTemplate('stun.nextcloud.com:443'); |
|||
} |
|||
|
|||
}, |
|||
|
|||
saveServers: function() { |
|||
var servers = []; |
|||
|
|||
this.$list.find('input').each(function() { |
|||
var server = this.value, |
|||
parts = server.split(':'); |
|||
if (parts.length !== 2) { |
|||
$(this).addClass('error'); |
|||
} else { |
|||
if (parts[1].match(/^([1-9]\d{0,4})$/) === null || |
|||
parseInt(parts[1]) > Math.pow(2, 16)) { //65536
|
|||
$(this).addClass('error'); |
|||
} else { |
|||
servers.push(this.value); |
|||
$(this).removeClass('error'); |
|||
} |
|||
} |
|||
}); |
|||
|
|||
OCP.AppConfig.setValue('spreed', 'stun_server', JSON.stringify(servers)); |
|||
}, |
|||
|
|||
renderServer: function(server) { |
|||
var $template = $(this.template({ |
|||
server: server |
|||
})); |
|||
|
|||
$template.find('a.icon-add').on('click', this.addNewTemplate.bind(this)); |
|||
$template.find('a.icon-delete').on('click', this.deleteServer.bind(this)); |
|||
$template.find('input').on('change', this.saveServers.bind(this)); |
|||
|
|||
return $template; |
|||
} |
|||
|
|||
}; |
|||
|
|||
|
|||
})(OC, OCP, OCA, $, _); |
|||
|
|||
$(document).ready(function(){ |
|||
OCA.VideoCalls.Admin.StunServer.init(); |
|||
}); |
|||
@ -1,13 +0,0 @@ |
|||
$(document).ready(function(){ |
|||
|
|||
$('#spreed_settings_form').change(function(){ |
|||
OC.msg.startSaving('#spreed_settings_msg'); |
|||
var post = $( "#spreed_settings_form" ).serialize(); |
|||
$.post(OC.generateUrl('/apps/spreed/settings/admin'), post, function(data){ |
|||
OC.msg.finishedSaving('#spreed_settings_msg', data); |
|||
}).fail(function(){ |
|||
OC.msg.finishedError('#spreed_settings_msg', t('spreed', 'Saving failed')); |
|||
}); |
|||
}); |
|||
|
|||
}); |
|||
@ -1,11 +0,0 @@ |
|||
$(document).ready(function(){ |
|||
|
|||
$('#spreed_settings_form').change(function(){ |
|||
OC.msg.startSaving('#spreed_settings_msg'); |
|||
var post = $("#spreed_settings_form").serialize(); |
|||
$.post(OC.generateUrl('/apps/spreed/settings/personal'), post, function(data){ |
|||
OC.msg.finishedSaving('#spreed_settings_msg', data); |
|||
}); |
|||
}); |
|||
|
|||
}); |
|||
@ -0,0 +1,70 @@ |
|||
<?php |
|||
/** |
|||
* @copyright Copyright (c) 2017 Joas Schilling <coding@schilljs.com> |
|||
* |
|||
* @author Joas Schilling <coding@schilljs.com> |
|||
* |
|||
* @license GNU AGPL version 3 or any later version |
|||
* |
|||
* 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/>. |
|||
* |
|||
*/ |
|||
|
|||
|
|||
namespace OCA\Spreed\Settings\Admin; |
|||
|
|||
|
|||
use OCP\AppFramework\Http\TemplateResponse; |
|||
use OCP\IConfig; |
|||
use OCP\Settings\ISettings; |
|||
|
|||
class StunServer implements ISettings { |
|||
|
|||
/** @var IConfig */ |
|||
private $config; |
|||
|
|||
public function __construct(IConfig $config) { |
|||
$this->config = $config; |
|||
} |
|||
|
|||
/** |
|||
* @return TemplateResponse |
|||
*/ |
|||
public function getForm() { |
|||
$parameters = [ |
|||
'stunServer' => $this->config->getAppValue('spreed', 'stun_server', 'stun.nextcloud.com:443'), |
|||
]; |
|||
|
|||
return new TemplateResponse('spreed', 'settings/admin/stun-server', $parameters, ''); |
|||
} |
|||
|
|||
/** |
|||
* @return string the section ID, e.g. 'sharing' |
|||
*/ |
|||
public function getSection() { |
|||
return 'stun_server'; |
|||
} |
|||
|
|||
/** |
|||
* @return int whether the form should be rather on the top or bottom of |
|||
* the admin section. The forms are arranged in ascending order of the |
|||
* priority values. It is required to return a value between 0 and 100. |
|||
* |
|||
* E.g.: 70 |
|||
*/ |
|||
public function getPriority() { |
|||
return 65; |
|||
} |
|||
|
|||
} |
|||
@ -1,56 +0,0 @@ |
|||
<?php |
|||
/** @var array $_ */ |
|||
/** @var \OCP\IL10N $l */ |
|||
script('spreed', ['settings-admin']); |
|||
style('spreed', ['settings-admin']); |
|||
?>
|
|||
|
|||
<div id="spreed" class="section"> |
|||
<form id="spreed_settings_form" class="spreed_settings"> |
|||
<h2 class="app-name"><?php p($l->t('Video calls')) ?></h2>
|
|||
<p class="settings-hint"><?php p($l->t('The STUN server is necessary so participants can connect to calls. The TURN server makes sure connection works even through firewalls.')); ?></p>
|
|||
|
|||
<span id="spreed_settings_msg" class="msg"></span> |
|||
<p> |
|||
<label for="stun_server"><?php p($l->t('STUN server')) ?></label>
|
|||
<input type="text" id="stun_server" |
|||
name="stun_server" placeholder="stunserver:port" |
|||
value="<?php p($_['stunServer']) ?>" /> |
|||
</p> |
|||
<p> |
|||
<em><?php p($l->t('The STUN server is used to determine the public IP address of participants behind a router.')) ?></em>
|
|||
</p> |
|||
<p> |
|||
<label for="turn_server"><?php p($l->t('TURN server')) ?></label>
|
|||
<input type="text" id="turn_server" |
|||
name="turn_server" placeholder="https://turn.example.org" |
|||
value="<?php p($_['turnServer']) ?>" /> |
|||
</p> |
|||
<p> |
|||
<label for="turn_server_secret"><?php p($l->t('TURN server shared secret')) ?></label>
|
|||
<input type="text" id="turn_server_secret" |
|||
name="turn_server_secret" placeholder="shared secret" |
|||
value="<?php p($_['turnServerSecret']) ?>" /> |
|||
</p> |
|||
<p> |
|||
<label for="turn_server_protocols"><?php p($l->t('TURN server protocols')) ?></label>
|
|||
<select id="turn_server_protocols" name="turn_server_protocols"> |
|||
<option value="udp,tcp" |
|||
<?php p($_['turnServerProtocols'] === 'udp,tcp' ? 'selected' : '') ?>>
|
|||
<?php p($l->t('UDP and TCP')) ?>
|
|||
</option> |
|||
<option value="udp" |
|||
<?php p($_['turnServerProtocols'] === 'udp' ? 'selected' : '') ?>>
|
|||
<?php p($l->t('UDP only')) ?>
|
|||
</option> |
|||
<option value="tcp" |
|||
<?php p($_['turnServerProtocols'] === 'tcp' ? 'selected' : '') ?>>
|
|||
<?php p($l->t('TCP only')) ?>
|
|||
</option> |
|||
</select> |
|||
</p> |
|||
<p> |
|||
<em><?php p($l->t('The TURN server is used to proxy the traffic from participants behind a firewall.')) ?></em>
|
|||
</p> |
|||
</form> |
|||
</div> |
|||
@ -0,0 +1,14 @@ |
|||
<?php |
|||
/** @var array $_ */ |
|||
/** @var \OCP\IL10N $l */ |
|||
script('spreed', ['admin/stun-server']); |
|||
style('spreed', ['settings-admin']); |
|||
?>
|
|||
|
|||
<div class="videocalls section"> |
|||
<h3><?php p($l->t('STUN servers')) ?></h3>
|
|||
<p class="settings-hint"><?php p($l->t('A STUN server is used to determine the public IP address of participants behind a router.')); ?></p>
|
|||
|
|||
<div class="stun-servers" data-servers="<?php p($_['stunServer']) ?>"> |
|||
</div> |
|||
</div> |
|||
@ -0,0 +1,40 @@ |
|||
<?php |
|||
/** @var array $_ */ |
|||
/** @var \OCP\IL10N $l */ |
|||
script('spreed', ['settings-admin']); |
|||
style('spreed', ['settings-admin']); |
|||
?>
|
|||
|
|||
<div class="videocalls section"> |
|||
<h3><?php p($l->t('TURN server')) ?></h3>
|
|||
<p class="settings-hint"><?php p($l->t('The TURN server is used to proxy the traffic from participants behind a firewall.')); ?></p>
|
|||
<p> |
|||
<label for="turn_server"><?php p($l->t('TURN server')) ?></label>
|
|||
<input type="text" id="turn_server" |
|||
name="turn_server" placeholder="https://turn.example.org" |
|||
value="<?php p($_['turnServer']) ?>" /> |
|||
</p> |
|||
<p> |
|||
<label for="turn_server_secret"><?php p($l->t('TURN server shared secret')) ?></label>
|
|||
<input type="text" id="turn_server_secret" |
|||
name="turn_server_secret" placeholder="shared secret" |
|||
value="<?php p($_['turnServerSecret']) ?>" /> |
|||
</p> |
|||
<p> |
|||
<label for="turn_server_protocols"><?php p($l->t('TURN server protocols')) ?></label>
|
|||
<select id="turn_server_protocols" name="turn_server_protocols"> |
|||
<option value="udp,tcp" |
|||
<?php p($_['turnServerProtocols'] === 'udp,tcp' ? 'selected' : '') ?>>
|
|||
<?php p($l->t('UDP and TCP')) ?>
|
|||
</option> |
|||
<option value="udp" |
|||
<?php p($_['turnServerProtocols'] === 'udp' ? 'selected' : '') ?>>
|
|||
<?php p($l->t('UDP only')) ?>
|
|||
</option> |
|||
<option value="tcp" |
|||
<?php p($_['turnServerProtocols'] === 'tcp' ? 'selected' : '') ?>>
|
|||
<?php p($l->t('TCP only')) ?>
|
|||
</option> |
|||
</select> |
|||
</p> |
|||
</div> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue