116 lines
7.5 KiB
Plaintext
116 lines
7.5 KiB
Plaintext
<% const p2pServerList = config.p2pServerList || {}
|
|
const selectedServer = p2pServerList[config.p2pHostSelected]
|
|
%>
|
|
<style>
|
|
.epic-text-filter {
|
|
text-transform: none;
|
|
letter-spacing: 0.5pt;
|
|
font-size: 9pt;
|
|
}
|
|
blockquote {
|
|
background: #073c3e;
|
|
height: 100%;
|
|
border-radius: 15px;
|
|
color: #fff;
|
|
padding: 10px;
|
|
font-style: italic;
|
|
box-shadow: 0 0 5px #19ce11;
|
|
}
|
|
</style>
|
|
<script>
|
|
window.p2pServerList = <%- JSON.stringify(p2pServerList) %>
|
|
window.currentlySelectedP2PServerId = `<%- config.p2pHostSelected %>`
|
|
</script>
|
|
<link rel="stylesheet" href="<%-window.libURL%>libs/css/super.easyRemoteAccess.css">
|
|
<form>
|
|
<div class="row mb-4" style="display:flex">
|
|
<div class="col-md-6">
|
|
<div class="mb-4 btn-group" style="display:flex">
|
|
<a style="flex:12" href="#" class="submit btn btn-success"><i class="fa fa-check"></i> <%- lang.Save %></a>
|
|
</div>
|
|
<div class="form-group">
|
|
<label>
|
|
<div><span><%-lang['Enabled']%></span></div>
|
|
<div><select class="form-control" type="email" name="p2pEnabled">
|
|
<option <% if(config.p2pEnabled === true){ %>selected<% } %> value="1">Yes</option>
|
|
<option <% if(config.p2pEnabled !== true){ %>selected<% } %> value="0">No</option>
|
|
</select></div>
|
|
</label>
|
|
</div>
|
|
<div class="form-group">
|
|
<label>
|
|
<div><span><%-lang['P2P API Key']%></span></div>
|
|
<div><input class="form-control" type="text" name="p2pApiKey" value="<%- config.p2pApiKey %>"></div>
|
|
</label>
|
|
</div>
|
|
<div class="form-group btn-group" style="display:flex">
|
|
<a style="flex:6" target="_blank" href="#" class="btn btn-default remote-dashboard-link-copy"><i class="fa fa-copy"></i> <%- lang['Copy Remote Link'] %></a>
|
|
<a style="flex:6" target="_blank" href="#" class="btn btn-info remote-dashboard-link"><i class="fa fa-external-link"></i> <%- lang['Open Remote Dashboard'] %></a>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 pt-2 pb-4">
|
|
<blockquote class="text-center m-0 pt-4 pb-4">
|
|
<p><b>This feature is for subscribers only.</b> To get an API Key please login to your <a class="btn badge badge-sm badge-default" href="https://licenses.shinobi.video/login" target="_blank">Shinobi<b>Shop</b></a> account and create a key associated to <b>any active Subscription ID</b>.</p>
|
|
<p>If you would like to get access to a private (dedicated) P2P server please create an account at the <a class="btn badge badge-sm badge-default" href="https://licenses.shinobi.video/login" target="_blank">Shinobi<b>Shop</b></a> and contact us via the Live Chat widget.</p>
|
|
<p class="mb-0">Purchase a <a class="btn badge badge-sm badge-success" href="https://licenses.shinobi.video/subscribe?planSubscribe=plan_G31AZ9mknNCa6z" target="_blank">Mobile License Key</a> to get started!</p>
|
|
</blockquote>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<div class="row" id="p2pServerList">
|
|
<% Object.keys(p2pServerList).forEach((key) => {
|
|
const details = p2pServerList[key]
|
|
%>
|
|
<div class="col-md-4 mt-2">
|
|
<div class="card <% if(config.p2pHostSelected === key){ %>active<% } %>" drawn-id="<%- key %>">
|
|
<div class="card-header" style="min-height:auto">
|
|
<!-- <span class="badge badge-sm badge-danger pull-right selected-badge"><%- lang.Selected %></span> -->
|
|
<span class="badge badge-sm badge-info name-badge"><%- details.name %></span>
|
|
</div>
|
|
<div style="min-height:auto">
|
|
<table class="table table-striped mb-0 text-center">
|
|
<tr title="Host Address">
|
|
<td><i class="fa fa-globe"></i></td>
|
|
<td class="text-left epic-text epic-text-filter"><%- lang.Host %></td>
|
|
<td class="text-right"><span class="info-badge badge badge-sm badge-default"><%- details.host %></span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><i class="fa fa-download"></i></td>
|
|
<td class="text-left epic-text epic-text-filter"><%- lang['Download Bandwidth'] %></td>
|
|
<td class="text-right">
|
|
<span class="info-badge badge badge-sm badge-default"><span class="networkUseDown"><i class="fa fa-spinner fa-pulse"></i></span> / <%- details.maxNetworkSpeed.down %></span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><i class="fa fa-upload"></i></td>
|
|
<td class="text-left epic-text epic-text-filter"><%- lang['Upload Bandwidth'] %></td>
|
|
<td class="text-right">
|
|
<span class="info-badge badge badge-sm badge-default"><span class="networkUseUp"><i class="fa fa-spinner fa-pulse"></i></span> / <%- details.maxNetworkSpeed.up %></span>
|
|
</td>
|
|
</tr>
|
|
<tr title="CPU Usage">
|
|
<td><i class="fa fa-cubes"></i></td>
|
|
<td class="text-left epic-text epic-text-filter"><span class="cpuCores"></span> <%- lang.Threads %></td>
|
|
<td class="text-right"><span class="info-badge badge badge-sm badge-default"><span class="cpuUsage"><i class="fa fa-spinner fa-pulse"></i></span>%</span></td>
|
|
</tr>
|
|
<tr title="RAM Usage">
|
|
<td><i class="fa fa-tasks"></i></td>
|
|
<td class="text-left epic-text epic-text-filter"><span class="ramTotal"><i class="fa fa-spinner fa-pulse"></i></span> <%- lang.RAM %></td>
|
|
<td class="text-right"><span class="info-badge badge badge-sm badge-default"><span class="ramPercent"><i class="fa fa-spinner fa-pulse"></i></span>%, <span class="ramUsed"><i class="fa fa-spinner fa-pulse"></i></span> MB</span></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div class="card-footer" style="min-height:auto">
|
|
<a class="btn badge badge-sm badge-default geo-badge" target="_blank" href="<%- `https://www.google.ca/maps/@${details.location.lat},${details.location.lon},15z` %>"><i class="fa fa-map-marker"></i> <%- details.location.lat %>, <%- details.location.lon %></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% }) %>
|
|
</div>
|
|
</div>
|
|
<div class="form-group btn-group" style="display:flex">
|
|
<a style="flex:4" href="#" class="submit btn btn-success"><i class="fa fa-check"></i> <%- lang.Save %></a>
|
|
</div>
|
|
</form>
|
|
<script src="<%-window.libURL%>libs/js/super.easyRemoteAccess.js" type="text/javascript"></script>
|