yunkong2.socketio
Version:
This adapter allows to communicate different web applications with yunkong2.
160 lines (140 loc) • 6.86 kB
HTML
<html>
<head>
<link rel="stylesheet" type="text/css" href="../../lib/css/themes/jquery-ui/redmond/jquery-ui.min.css"/>
<link rel="stylesheet" type="text/css" href="../../css/adapter.css"/>
<script type="text/javascript" src="../../lib/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../../socket.io/socket.io.js"></script>
<script type="text/javascript" src="../../lib/js/jquery-ui-1.10.3.full.min.js"></script>
<script type="text/javascript" src="../../js/translate.js"></script>
<script type="text/javascript" src="../../js/adapter-settings.js"></script>
<script type="text/javascript" src="words.js"></script>
<style>
.number {
width: 70px
}
</style>
<script type="text/javascript">
function showHideSettings() {
var $secure = $('#secure');
var $auth = $('#auth');
if ($secure.prop('checked')) {
$('#_certPublic').show();
$('#_certPrivate').show();
$('#_certChained').show();
$('.le-settings').show();
if ($('#leEnabled').prop('checked')) {
$('.le-sub-settings').show();
if ($('#leUpdate').prop('checked')) {
$('.le-sub-settings-update').show();
} else {
$('.le-sub-settings-update').hide();
}
} else {
$('.le-sub-settings').hide();
}
} else {
$('#_certPublic').hide();
$('#_certPrivate').hide();
$('#_certChained').hide();
$auth.prop('checked', false);
$('.le-settings').hide();
}
if ($auth.prop('checked')) {
$secure.prop('checked', true);
$('#defaultUser').val('admin');
$('.defaultUser').hide();
} else {
$('.defaultUser').show();
}
}
// the function loadSettings has to exist ...
function load(settings, onChange) {
if (!settings) return;
getIPs(function(ips) {
for (var i = 0; i < ips.length; i++) {
$('#bind').append('<option value="' + ips[i].address + '">' + ips[i].name + '</option>');
}
$('#bind.value').val(settings.bind);
});
if (!settings.lePort) settings.lePort = 80;
$('.value').each(function () {
var key = $(this).attr('id');
var $value = $('#' + key + '.value');
if ($value.attr('type') === 'checkbox') {
$value.prop('checked', settings[key]).change(function() {
onChange();
});
} else {
$value.val(settings[key]).change(function() {
onChange();
}).keyup(function() {
onChange();
});
}
});
onChange(false);
fillSelectCertificates('#certPublic', 'public', settings.certPublic);
fillSelectCertificates('#certPrivate', 'private', settings.certPrivate);
fillSelectCertificates('#certChained', 'chained', settings.certChained);
fillUsers('#defaultUser', settings.defaultUser);
$('#auth').change(function () {
if ($(this).prop('checked')) {
$('#secure').prop('checked', true);
}
showHideSettings();
});
$('#secure').change(function () {
showHideSettings();
});
showHideSettings();
}
function save(callback) {
var obj = {};
$('.value').each(function () {
var $this = $(this);
if ($this.attr('type') === 'checkbox') {
obj[$this.attr('id')] = $this.prop('checked');
} else {
obj[$this.attr('id')] = $this.val();
}
});
if ($('#secure').prop('checked') && (!$('#certPrivate').val() || !$('#certPublic').val())) {
showMessage(_('Set certificates or load it first in the system settings (right top).'));
return;
}
callback(obj);
}
</script>
</head>
<body>
<!-- you have to put your config page in a div with id adapter-container -->
<div id="adapter-container">
<table><tr><td><img src="socketio.png"></td><td><h3 class="translate">socket.io adapter settings</h3></td></tr></table>
<table>
<tr><td><label class="translate" for="bind">IP:</label></td><td><select class="value" id="bind"></select></td></tr>
<tr><td><label class="translate" for="port">Port:</label></td><td><input class="value" id="port" size="5" maxlength="5"/></td></tr>
<tr><td><label class="translate" for="secure">Secure(HTTPS):</label></td><td><input class="value" id="secure" type="checkbox" /></td></tr>
<tr><td><label class="translate" for="auth">Authentication:</label></td><td><input class="value" id="auth" type="checkbox" /></td></tr>
<tr id="_certPublic">
<td class="translate"><label class="translate" for="certPublic">Public certificate:</label></td>
<td><select id="certPublic" class="value"></select></td>
</tr>
<tr id="_certPrivate">
<td class="translate"><label class="translate" for="certPrivate">Private certificate:</label></td>
<td><select id="certPrivate" class="value"></select></td>
</tr>
<tr id="_certChained">
<td class="translate"><label class="translate" for="certChained">Chained certificate:</label></td>
<td><select id="certChained" class="value"></select></td>
</tr>
<tr class="defaultUser"><td class="translate"><label class="translate" for="defaultUser">Run as:</label></td><td><select class="value" id="defaultUser"></select></td></tr>
<tr class="socketio"><td class="translate"><label class="translate" for="forceWebSockets">Force Web-Sockets:</label></td><td><input type="checkbox" class="value" id="forceWebSockets"/></td></tr>
<tr><td colspan="2"> </td></tr>
<tr class="le-settings"><td colspan="2"><h3 class="translate">Let's Encrypt settings</h3></tr>
<tr class="le-settings"><td><label for="leEnabled" class="translate">Use Lets Encrypt certificates:</label></td><td><input class="value" id="leEnabled" type="checkbox" /></td></tr>
<tr class="le-settings le-sub-settings"><td><label for="leUpdate" class="translate">Use this instance for automatic update:</label></td><td><input class="value" id="leUpdate" type="checkbox" /></td></tr>
<tr class="le-settings le-sub-settings le-sub-settings-update"><td><label for="lePort" class="translate">Port to check the domain:</label></td><td><input class="value number" id="lePort" type="number" size="5" maxlength="5" /></td></tr>
</table>
</div>
</body>
</html>