Files
goTorrent/templates/home.tmpl

151 lines
5.6 KiB
Cheetah

{{define "base"}}
<!DOCTYPE html>
<html lang="en">
<head>
<title>torrent-project</title>
<link rel="stylesheet" href="/static/css/gridbase.css" type="text/css" />
<script type="text/javascript" src="/static/js/websocket.js"></script>
<script type="text/javascript" src="/static/js/tabControl.js"></script>
</head>
<body onload="javascript:myWebsocketStart()">
<!-- The addlink Modal -->
<div id="addTorrentModal" class="addTorrentModal">
<!-- Modal content -->
<div class="addTorrentModalContent">
<span class="addTorrentModalClose">&times;</span>
<form id="torrentLinkForm" action="#" method="post">
Input Magnet Link: <input type="text" id="magnetLink">
<button id="torrentLinkSubmit">Submit</button>
</form>
</div>
</div>
<!-- The addTorrent Modal -->
<div id="addTorrentFileModal" class="addTorrentModal">
<!-- Modal content -->
<div class="addTorrentModalContent">
<span class="addTorrentFileModalClose">&times;</span>
Input Torrent File: <input type="file" name="torrentFile">
<button id="torrentFileSubmit">Submit</button>
</div>
</div>
<div class="wrapper">
<div class="box navcolumn">
<hr>
<ul class="none">
<li class="liNavcolumn" id="allTorrents"><img class="navcolumnImage" src="/static/images/iconTorrent.png" alt="All Torrents">All Torrents</li>
<li class="liNavcolumn" id="downloading"><img class="navcolumnImage" src="/static/images/iconDownload.png" alt="Downloading Torrents">Downloading</li>
<li class="liNavcolumn" id="uploading"><img class="navcolumnImage" src="/static/images/iconUpload.png" alt="Uploading Torrents">Uploading</li>
<li class="liNavcolumn" id="active"><img class="navcolumnImage" src="/static/images/iconActiveTorrents.png" alt="Active Torrents">Active</li>
<li class="liNavcolumn" id="inactive"><img class="navcolumnImage" src="/static/images/iconInactiveTorrents.png" alt="Inactive Torrents">Inactive</li>
</ul>
<hr>
</div>
<div class="box navsettings">
<ul class="navsettingsUl">
<li class="top" id="addTorrentFile"><img class="imagezoom" src="/static/images/iconAddTorrent.png" alt="Upload Torrent File"></li>
<li class="top" id="addTorrentLink"><img class="imagezoom" src="/static/images/iconAddTorrentLink.png" alt="Add Magnet Links"></li>
<li class="top verticalLine" id="deleteTorrent"><img class="imagezoom" src="/static/images/iconDelete.png" alt="Delete Torrent"></li>
<li class="top verticalLine" id="startTorrent"><img class="imagezoom" src="/static/images/iconStart.png" alt="Start Torrent"></li>
<li class="top" id="pauseTorrent"><img class="imagezoom" src="/static/images/iconPause.png" alt="Pause Torrent"></li>
<li class="top" id="stopTorrent"><img class="imagezoom" src="/static/images/iconStop.png" alt="Stop Torrent"></li>
<li class="top verticalLine" id="upTorrent"><img class="imagezoom" src="/static/images/iconScrollUp.png" alt="Move Torrent Up"></li>
<li class="top" id="downTorrent"><img class="imagezoom" src="/static/images/iconScrollDown.png" alt="Down Torrent"></li>
<li class="top verticalLine" id="rssTorrent"><img class="imagezoom" src="/static/images/iconRss.png" alt="RSS Torrent"></li>
<li class="top verticalLine" id="settingsIcon"><img class="imagezoom" src="/static/images/iconSettings.png" alt="Settings"></li>
</ul>
</div>
<div id="torrentlist" class="box torrentlist">
<div class="ui container">
<vuetable ref="vuetable"
api-url="http://192.168.1.141:8000/api"
:fields="fields"
data-path="data"
pagination-path=""
>
</vuetable>
</div>
<div class="box torrentdetails">
<div>
<button class="tablink activeButton" onclick="openTab(event, 'General')">General</button>
<button class="tablink" onclick="openTab(event, 'Peers')">Peers</button>
<button class="tablink" onclick="openTab(event, 'Files')">Files</button>
<button class="tablink" onclick="openTab(event, 'Speed')">Speed</button>
<button class="tablink" onclick="openTab(event, 'Logger')">Logger</button>
</div>
<div id="General" class="tab defaultTab">
<h2>General</h2>
<p id="hash"></p>
<p>General Information</p>
</div>
<div id="Peers" class="tab">
<h2>Peers</h2>
<table>
<tr>
<th>IP</th>
<th>Client</th>
<th>Flags</th>
<th>Percent</th>
<th>Down Speed</th>
<th>Up Speed</th>
<th>Reqs</th>
<th>Uploaded</th>
<th>Downloaded</th>
<th>Peer dl.</th>
</tr>
</table>
</div>
<div id="Files" class="tab">
<h2>Files</h2>
<table>
<tr>
<th>Name</th>
<th>Size</th>
<th>Done</th>
<th>Percent</th>
<th>Priority</th>
</tr>
</table>
</div>
<div id="Speed" class="tab">
<h2>Speed</h2>
<p>Speed Graph Here</p>
</div>
<div id="Logger" class="tab">
<h2>Logger</h2>
<p id="loggerData">Logger lines here</p>
</div>
</div>
</div>
<script src="https://unpkg.com/vuetable-2@1.6.0"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.16.1/axios.min.js"></script>
<script src="https://unpkg.com/vue@latest/dist/vue.js"></script>
<script type="text/javascript" src="/static/js/addTorrents.js"></script>
<script type="text/javascript" src="/static/js/grid.js"></script>
<footer>Icons by <a href="https://icons8.com">icons8</a></footer>
</body>
</html>
{{end}}