Modularize code
Split JS into per-class files Cut parts of trweb class out Move init code from event handler to constructor
This commit is contained in:
@@ -20,6 +20,8 @@
|
|||||||
<link rel="stylesheet" href="style/trweb.css" />
|
<link rel="stylesheet" href="style/trweb.css" />
|
||||||
<script type="text/javascript" src="js/helpers.js"></script>
|
<script type="text/javascript" src="js/helpers.js"></script>
|
||||||
<script type="text/javascript" src="js/trserver.js"></script>
|
<script type="text/javascript" src="js/trserver.js"></script>
|
||||||
|
<script type="text/javascript" src="js/trdom_menubar.js"></script>
|
||||||
|
<script type="text/javascript" src="js/trdom_servermanager.js"></script>
|
||||||
<script type="text/javascript" src="js/trweb.js"></script>
|
<script type="text/javascript" src="js/trweb.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
19
js/trdom_menubar.js
Normal file
19
js/trdom_menubar.js
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
"use strict";
|
||||||
|
|
||||||
|
class trdom_menubar {
|
||||||
|
#element = document.createElement('div');
|
||||||
|
getElement() {
|
||||||
|
return this.#element;
|
||||||
|
}
|
||||||
|
|
||||||
|
#menuNodes = {};
|
||||||
|
addMenuNode(name, element, after = null) {
|
||||||
|
//TODO: add ID checks and after support
|
||||||
|
this.#menuNodes[name] = element;
|
||||||
|
this.#element.appendChild(element);
|
||||||
|
}
|
||||||
|
|
||||||
|
constructor () {
|
||||||
|
this.#element.classList.add('trweb_header');
|
||||||
|
}
|
||||||
|
}
|
||||||
60
js/trdom_servermanager.js
Normal file
60
js/trdom_servermanager.js
Normal file
@@ -0,0 +1,60 @@
|
|||||||
|
"use strict";
|
||||||
|
|
||||||
|
class trdom_servermanager {
|
||||||
|
|
||||||
|
#logcb;
|
||||||
|
#log(loglevel, msg) {
|
||||||
|
if (this.#logcb !== null) {
|
||||||
|
this.#logcb('trdom_servermanager', loglevel, msg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#servers = {};
|
||||||
|
getServers() {
|
||||||
|
return this.#servers;
|
||||||
|
}
|
||||||
|
|
||||||
|
#registerServer;
|
||||||
|
|
||||||
|
#loadcb;
|
||||||
|
#loadServers() {
|
||||||
|
let serverjson = this.#loadcb('servers');
|
||||||
|
this.#servers = {};
|
||||||
|
if (serverjson == null) {
|
||||||
|
this.#log(4, 'No saved server data found');
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
let serverdata = JSON.parse(serverjson);
|
||||||
|
for (const [key, value] of Object.entries(serverdata)) {
|
||||||
|
this.#registerServer(key, value);
|
||||||
|
}
|
||||||
|
this.#log(5, `Loaded ${Object.keys(this.#servers).length} servers`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
loadServers() {
|
||||||
|
this.#loadServers();
|
||||||
|
}
|
||||||
|
|
||||||
|
#savecb;
|
||||||
|
#saveServers() {
|
||||||
|
let serverdata = {};
|
||||||
|
for (const [key, value] of Object.entries(this.#servers)) {
|
||||||
|
serverdata[key] = value.getInstanceData();
|
||||||
|
}
|
||||||
|
this.#log(5, `Saving ${Object.keys(serverdata).length} servers`);
|
||||||
|
this.#savecb('servers', JSON.stringify(serverdata));
|
||||||
|
}
|
||||||
|
saveServers() {
|
||||||
|
this.#saveServers();
|
||||||
|
}
|
||||||
|
|
||||||
|
constructor (loadcb = null, savecb = null, logcb = null, registerServer = null) {
|
||||||
|
this.#loadcb = loadcb;
|
||||||
|
this.#savecb = savecb;
|
||||||
|
this.#logcb = logcb
|
||||||
|
|
||||||
|
this.#registerServer = registerServer;
|
||||||
|
|
||||||
|
//this.#servers = this.#loadServers();
|
||||||
|
}
|
||||||
|
}
|
||||||
81
js/trweb.js
81
js/trweb.js
@@ -1,7 +1,6 @@
|
|||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
class trweb {
|
class trweb {
|
||||||
#servers = {};
|
|
||||||
#knownTorrents = {};
|
#knownTorrents = {};
|
||||||
|
|
||||||
#needsSort = false;
|
#needsSort = false;
|
||||||
@@ -14,10 +13,12 @@ class trweb {
|
|||||||
|
|
||||||
|
|
||||||
#container;
|
#container;
|
||||||
#guiHeader;
|
|
||||||
#torrentListView;
|
#torrentListView;
|
||||||
#guiFooter;
|
#guiFooter;
|
||||||
|
|
||||||
|
#dom_menubar = new trdom_menubar();
|
||||||
|
#dom_servermanager;
|
||||||
|
|
||||||
constructor (container, loadcb, savecb, logger) {
|
constructor (container, loadcb, savecb, logger) {
|
||||||
this.#container = container;
|
this.#container = container;
|
||||||
if (loadcb != null) {
|
if (loadcb != null) {
|
||||||
@@ -28,6 +29,14 @@ class trweb {
|
|||||||
this.#logger = logger;
|
this.#logger = logger;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.#dom_servermanager = new trdom_servermanager(this.#loadcb, this.#savecb, function(module, loglevel, msg) {this.#logger(`${module}: ${msg}`)}.bind(this), this.#registerServer.bind(this))
|
||||||
|
|
||||||
|
this.#torrentListView = document.createElement('div');
|
||||||
|
this.#torrentListView.classList.add('trweb_torrentlistview', 'container-fluid');
|
||||||
|
|
||||||
|
this.#guiFooter = document.createElement('div');
|
||||||
|
this.#guiFooter.classList.add('trweb_footer');
|
||||||
|
|
||||||
if (document.readyState === 'complete' || document.readyState === 'interactive') {
|
if (document.readyState === 'complete' || document.readyState === 'interactive') {
|
||||||
this.#logger('Document already loaded, jumpstarting');
|
this.#logger('Document already loaded, jumpstarting');
|
||||||
this.#handler({'type': 'DOMContentLoaded'});
|
this.#handler({'type': 'DOMContentLoaded'});
|
||||||
@@ -50,34 +59,10 @@ class trweb {
|
|||||||
this.#updateTorrentDisplay(mergedTorrentInfo);
|
this.#updateTorrentDisplay(mergedTorrentInfo);
|
||||||
};
|
};
|
||||||
let newserver = new trserver(initdata, function(msg) {this.#logger(`[Server: ${name}]: ${msg}`);}.bind(this), torrentCallback.bind(this));
|
let newserver = new trserver(initdata, function(msg) {this.#logger(`[Server: ${name}]: ${msg}`);}.bind(this), torrentCallback.bind(this));
|
||||||
this.#servers[name] = newserver;
|
this.#dom_servermanager.getServers()[name] = newserver;
|
||||||
newserver.refreshTorrentList();
|
newserver.refreshTorrentList();
|
||||||
}
|
}
|
||||||
|
|
||||||
#loadServers() {
|
|
||||||
let serverjson = this.#loadcb('servers');
|
|
||||||
this.#servers = {};
|
|
||||||
if (serverjson == null) {
|
|
||||||
this.#logger('No saved server data found');
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
let serverdata = JSON.parse(serverjson);
|
|
||||||
for (const [key, value] of Object.entries(serverdata)) {
|
|
||||||
this.#registerServer(key, value);
|
|
||||||
}
|
|
||||||
this.#logger(`Loaded ${Object.keys(this.#servers).length} servers`);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#saveServers() {
|
|
||||||
let serverdata = {};
|
|
||||||
for (const [key, value] of Object.entries(this.#servers)) {
|
|
||||||
serverdata[key] = value.getInstanceData();
|
|
||||||
}
|
|
||||||
this.#logger(`Saving ${Object.keys(serverdata).length} servers`);
|
|
||||||
this.#savecb('servers', JSON.stringify(serverdata));
|
|
||||||
}
|
|
||||||
|
|
||||||
#createTorrentEntry(hash) {
|
#createTorrentEntry(hash) {
|
||||||
let entry = {
|
let entry = {
|
||||||
'element': document.createElement('div'),
|
'element': document.createElement('div'),
|
||||||
@@ -98,7 +83,7 @@ class trweb {
|
|||||||
entry.element_name.classList.add('trweb_torrentlistname', 'col');
|
entry.element_name.classList.add('trweb_torrentlistname', 'col');
|
||||||
entry.element_name.setAttributeNS('trweb', 'fieldid', 'displayname');
|
entry.element_name.setAttributeNS('trweb', 'fieldid', 'displayname');
|
||||||
entry.element.appendChild(entry.element_name);
|
entry.element.appendChild(entry.element_name);
|
||||||
for (const srv of Object.keys(this.#servers)) {
|
for (const srv of Object.keys(this.#dom_servermanager.getServers())) {
|
||||||
this.#createServerEntryForTorrent(hash, srv);
|
this.#createServerEntryForTorrent(hash, srv);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -188,7 +173,7 @@ class trweb {
|
|||||||
nukeChildren(txt_name);
|
nukeChildren(txt_name);
|
||||||
txt_name.appendChild(document.createTextNode(torrent.name));
|
txt_name.appendChild(document.createTextNode(torrent.name));
|
||||||
|
|
||||||
for (const srv of Object.keys(this.#servers)) {
|
for (const srv of Object.keys(this.#dom_servermanager.getServers())) {
|
||||||
let server = torrent.element_server[srv];
|
let server = torrent.element_server[srv];
|
||||||
let status = server.element_status;
|
let status = server.element_status;
|
||||||
|
|
||||||
@@ -208,7 +193,7 @@ class trweb {
|
|||||||
let statustext = 'Nothing to see here';
|
let statustext = 'Nothing to see here';
|
||||||
let statusclass = 'trweb_status_asdf'
|
let statusclass = 'trweb_status_asdf'
|
||||||
let barwidth = 50;
|
let barwidth = 50;
|
||||||
if (!this.#servers[srv].isOnline()) {
|
if (!this.#dom_servermanager.getServers()[srv].isOnline()) {
|
||||||
statustext = "Server offline";
|
statustext = "Server offline";
|
||||||
statusclass = 'trweb_status_offline';
|
statusclass = 'trweb_status_offline';
|
||||||
barwidth = 0;
|
barwidth = 0;
|
||||||
@@ -267,12 +252,12 @@ class trweb {
|
|||||||
break;
|
break;
|
||||||
case 'start':
|
case 'start':
|
||||||
hash = e.currentTarget.getAttributeNS('trweb', 'torrent');
|
hash = e.currentTarget.getAttributeNS('trweb', 'torrent');
|
||||||
this.#servers[e.currentTarget.getAttributeNS('trweb', 'server')].torrent_start(hash);
|
this.#dom_servermanager.getServers()[e.currentTarget.getAttributeNS('trweb', 'server')].torrent_start(hash);
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
break;
|
break;
|
||||||
case 'pause':
|
case 'pause':
|
||||||
hash = e.currentTarget.getAttributeNS('trweb', 'torrent');
|
hash = e.currentTarget.getAttributeNS('trweb', 'torrent');
|
||||||
this.#servers[e.currentTarget.getAttributeNS('trweb', 'server')].torrent_pause(hash);
|
this.#dom_servermanager.getServers()[e.currentTarget.getAttributeNS('trweb', 'server')].torrent_pause(hash);
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
break;
|
break;
|
||||||
case 'magnet':
|
case 'magnet':
|
||||||
@@ -285,7 +270,7 @@ class trweb {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (magneturl != null) {
|
if (magneturl != null) {
|
||||||
this.#servers[e.currentTarget.getAttributeNS('trweb', 'server')].torrent_add_url(magneturl, false, null);
|
this.#dom_servermanager.getServers()[e.currentTarget.getAttributeNS('trweb', 'server')].torrent_add_url(magneturl, false, null);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
this.#logger(`Couldn't find magnet link! ${JSON.stringify(this.#knownTorrents[hash].servers)}`);
|
this.#logger(`Couldn't find magnet link! ${JSON.stringify(this.#knownTorrents[hash].servers)}`);
|
||||||
@@ -300,27 +285,23 @@ class trweb {
|
|||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case 'DOMContentLoaded':
|
case 'DOMContentLoaded':
|
||||||
this.#logger('Starting TRWEB instance');
|
this.#logger('Activating TRWEB instance');
|
||||||
|
|
||||||
this.#container = document.getElementById(this.#container);
|
this.#container = document.getElementById(this.#container);
|
||||||
this.#container.classList.add('trweb_container');
|
this.#container.classList.add('trweb_container');
|
||||||
this.#guiHeader = document.createElement('div');
|
this.#container.appendChild(this.#dom_menubar.getElement());
|
||||||
this.#guiHeader.classList.add('trweb_header');
|
|
||||||
this.#container.appendChild(this.#guiHeader);
|
|
||||||
this.#torrentListView = document.createElement('div');
|
|
||||||
this.#torrentListView.classList.add('trweb_torrentlistview', 'container-fluid');
|
|
||||||
this.#container.appendChild(this.#torrentListView);
|
this.#container.appendChild(this.#torrentListView);
|
||||||
this.#guiFooter = document.createElement('div');
|
|
||||||
this.#guiFooter.classList.add('trweb_footer');
|
|
||||||
this.#container.appendChild(this.#guiFooter);
|
this.#container.appendChild(this.#guiFooter);
|
||||||
this.#loadServers();
|
|
||||||
this.#saveServers();
|
this.#dom_servermanager.loadServers();
|
||||||
|
this.#dom_servermanager.saveServers();
|
||||||
this.setTimer();
|
this.setTimer();
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
refresh() {
|
refresh() {
|
||||||
for (const [key, value] of Object.entries(this.#servers)) {
|
for (const [key, value] of Object.entries(this.#dom_servermanager.getServers())) {
|
||||||
//value.refreshSession();
|
//value.refreshSession();
|
||||||
value.refreshTorrentList();
|
value.refreshTorrentList();
|
||||||
}
|
}
|
||||||
@@ -353,11 +334,11 @@ class trweb {
|
|||||||
}
|
}
|
||||||
|
|
||||||
save() {
|
save() {
|
||||||
this.#saveServers();
|
this.#dom_servermanager.saveServers();
|
||||||
}
|
}
|
||||||
|
|
||||||
rpc(server, method, args) {
|
rpc(server, method, args) {
|
||||||
this.#servers[server].rpccall_debug(method, args);
|
this.#dom_servermanager.getServers()[server].rpccall_debug(method, args);
|
||||||
}
|
}
|
||||||
|
|
||||||
addServer(name, url, user, pass) {
|
addServer(name, url, user, pass) {
|
||||||
@@ -367,10 +348,10 @@ class trweb {
|
|||||||
this.#createServerEntryForTorrent(hash, name);
|
this.#createServerEntryForTorrent(hash, name);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.#saveServers();
|
this.#dom_servermanager.saveServers();
|
||||||
}
|
}
|
||||||
|
|
||||||
removeServer(name) {
|
/*removeServer(name) {
|
||||||
delete this.#servers[name];
|
delete this.#servers[name];
|
||||||
|
|
||||||
for (const [hash, entry] of Object.entries(this.#knownTorrents)) {
|
for (const [hash, entry] of Object.entries(this.#knownTorrents)) {
|
||||||
@@ -379,8 +360,8 @@ class trweb {
|
|||||||
delete entry.element_server[name]
|
delete entry.element_server[name]
|
||||||
}
|
}
|
||||||
|
|
||||||
this.#saveServers();
|
this.#dom_servermanager.saveServers();
|
||||||
}
|
}*/
|
||||||
}
|
}
|
||||||
|
|
||||||
var trinstance = new trweb('trcontainer', null, null, function(msg) {console.info(`TRWEB: ${msg}`)});
|
var trinstance = new trweb('trcontainer', null, null, function(msg) {console.info(`TRWEB: ${msg}`)});
|
||||||
|
|||||||
Reference in New Issue
Block a user