forked from extern/homer
Apply lint fixes
This commit is contained in:
parent
51ba5ff503
commit
bdad8933ff
@ -8,14 +8,13 @@
|
||||
<span class="down">
|
||||
<i class="fas fa-download"></i> {{ downRate }}
|
||||
</span>
|
||||
<span class="up">
|
||||
<i class="fas fa-upload"></i> {{ upRate }}
|
||||
</span>
|
||||
<span class="up"> <i class="fas fa-upload"></i> {{ upRate }} </span>
|
||||
</template>
|
||||
</p>
|
||||
</template>
|
||||
<template #indicator>
|
||||
<span v-if="!error" class="count">{{ count }}
|
||||
<span v-if="!error" class="count"
|
||||
>{{ count }}
|
||||
<template v-if="count === 1">torrent</template>
|
||||
<template v-else>torrents</template>
|
||||
</span>
|
||||
@ -24,38 +23,41 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Generic from './Generic.vue';
|
||||
import Generic from "./Generic.vue";
|
||||
|
||||
// Units to add to download and upload rates.
|
||||
const units = ['B', 'kiB', 'MiB', 'GiB'];
|
||||
const units = ["B", "kiB", "MiB", "GiB"];
|
||||
|
||||
// Take the rate in bytes and keep dividing it by 1k until the lowest
|
||||
// value for which we have a unit is determined. Return the value with
|
||||
// up to two decimals as a string and unit/s appended.
|
||||
const displayRate = (rate) => {
|
||||
let i = 0;
|
||||
|
||||
|
||||
while (rate > 1000 && i < units.length) {
|
||||
rate /= 1000;
|
||||
i++;
|
||||
}
|
||||
|
||||
return Intl.NumberFormat(undefined, {maximumFractionDigits: 2})
|
||||
.format(rate || 0) + ` ${units[i]}/s`;
|
||||
}
|
||||
return (
|
||||
Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format(
|
||||
rate || 0
|
||||
) + ` ${units[i]}/s`
|
||||
);
|
||||
};
|
||||
|
||||
export default {
|
||||
name: 'rTorrent',
|
||||
props: {item: Object},
|
||||
components: {Generic},
|
||||
name: "rTorrent",
|
||||
props: { item: Object },
|
||||
components: { Generic },
|
||||
// Properties for download, upload, torrent count and errors.
|
||||
data: () => ({dl: null, ul: null, count: null, error: null}),
|
||||
data: () => ({ dl: null, ul: null, count: null, error: null }),
|
||||
// Computed properties for the rate labels.
|
||||
computed: {
|
||||
downRate: function() {
|
||||
downRate: function () {
|
||||
return displayRate(this.dl);
|
||||
},
|
||||
upRate: function() {
|
||||
upRate: function () {
|
||||
return displayRate(this.ul);
|
||||
},
|
||||
},
|
||||
@ -72,7 +74,7 @@ export default {
|
||||
if (torrentInterval > 0) {
|
||||
setInterval(() => this.fetchCount(), torrentInterval);
|
||||
}
|
||||
|
||||
|
||||
// Fetch the initial values.
|
||||
this.fetchRates();
|
||||
this.fetchCount();
|
||||
@ -81,62 +83,71 @@ export default {
|
||||
// Perform two calls to the XML-RPC service and fetch download
|
||||
// and upload rates. Values are saved to the `ul` and `dl`
|
||||
// properties.
|
||||
fetchRates: async function() {
|
||||
this.getRate('throttle.global_up.rate')
|
||||
.then((ul) => this.ul = ul)
|
||||
.catch(() => this.error = true);
|
||||
fetchRates: async function () {
|
||||
this.getRate("throttle.global_up.rate")
|
||||
.then((ul) => (this.ul = ul))
|
||||
.catch(() => (this.error = true));
|
||||
|
||||
this.getRate('throttle.global_down.rate')
|
||||
.then((dl) => this.dl = dl)
|
||||
.catch(() => this.error = true);
|
||||
this.getRate("throttle.global_down.rate")
|
||||
.then((dl) => (this.dl = dl))
|
||||
.catch(() => (this.error = true));
|
||||
},
|
||||
// Perform a call to the XML-RPC service to fetch the number of
|
||||
// torrents.
|
||||
fetchCount: async function() {
|
||||
this.getCount().catch(() => this.error = true);
|
||||
fetchCount: async function () {
|
||||
this.getCount().catch(() => (this.error = true));
|
||||
},
|
||||
// Fetch a numeric value from the XML-RPC service by requesting
|
||||
// the specified method name and parsing the XML. The response
|
||||
// is expected to adhere to the structure of a single numeric
|
||||
// value.
|
||||
getRate: async function(methodName) {
|
||||
return this.getXml(methodName)
|
||||
.then((xml) => parseInt(xml.getElementsByTagName('value')[0].firstChild.textContent, 10));
|
||||
getRate: async function (methodName) {
|
||||
return this.getXml(methodName).then((xml) =>
|
||||
parseInt(
|
||||
xml.getElementsByTagName("value")[0].firstChild.textContent,
|
||||
10
|
||||
)
|
||||
);
|
||||
},
|
||||
// Fetch the numer of torrents by requesting the download list
|
||||
// and counting the number of entries therein.
|
||||
getCount: async function() {
|
||||
return this.getXml('download_list')
|
||||
.then((xml) => {
|
||||
const arrayEl = xml.getElementsByTagName('array');
|
||||
this.count = arrayEl ? arrayEl[0].getElementsByTagName('value').length : 0;
|
||||
});
|
||||
getCount: async function () {
|
||||
return this.getXml("download_list").then((xml) => {
|
||||
const arrayEl = xml.getElementsByTagName("array");
|
||||
this.count = arrayEl
|
||||
? arrayEl[0].getElementsByTagName("value").length
|
||||
: 0;
|
||||
});
|
||||
},
|
||||
// Perform a call to the XML-RPC service and parse the response
|
||||
// as XML, which is then returned.
|
||||
getXml: async function(methodName) {
|
||||
const headers = {'Content-Type': 'text/xml'};
|
||||
getXml: async function (methodName) {
|
||||
const headers = { "Content-Type": "text/xml" };
|
||||
|
||||
if (this.item.username && this.item.password) {
|
||||
headers['Authorization'] = `${this.item.username}:${this.item.password}`;
|
||||
headers[
|
||||
"Authorization"
|
||||
] = `${this.item.username}:${this.item.password}`;
|
||||
}
|
||||
|
||||
return fetch(`${this.item.xmlrpc.replace(/\/$/, '')}/RPC2`, {
|
||||
method: 'POST',
|
||||
return fetch(`${this.item.xmlrpc.replace(/\/$/, "")}/RPC2`, {
|
||||
method: "POST",
|
||||
headers,
|
||||
body: `<methodCall><methodName>${methodName}</methodName></methodCall>`
|
||||
body: `<methodCall><methodName>${methodName}</methodName></methodCall>`,
|
||||
})
|
||||
.then((response) => {
|
||||
if (!response.ok) {
|
||||
throw Error(response.statusText);
|
||||
}
|
||||
.then((response) => {
|
||||
if (!response.ok) {
|
||||
throw Error(response.statusText);
|
||||
}
|
||||
|
||||
return response.text();
|
||||
})
|
||||
.then((text) => Promise.resolve(new DOMParser().parseFromString(text, 'text/xml')));
|
||||
}
|
||||
}
|
||||
}
|
||||
return response.text();
|
||||
})
|
||||
.then((text) =>
|
||||
Promise.resolve(new DOMParser().parseFromString(text, "text/xml"))
|
||||
);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@ -150,4 +161,4 @@ export default {
|
||||
color: var(--text);
|
||||
font-size: 0.8em;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
@ -1,120 +1,122 @@
|
||||
<template>
|
||||
<Generic :item="item">
|
||||
<template #content>
|
||||
<p class="title is-4">{{ item.name }}</p>
|
||||
<p class="subtitle is-6">
|
||||
<span v-if="error" class="error">An error has occurred.</span>
|
||||
<template v-else>
|
||||
<span class="down monospace">
|
||||
<p class="fas fa-download "></p> {{ downRate }}
|
||||
</span>
|
||||
<span class="up monospace">
|
||||
<p class="fas fa-upload"></p> {{ upRate }}
|
||||
</span>
|
||||
</template>
|
||||
</p>
|
||||
</template>
|
||||
<template #indicator>
|
||||
<span v-if="!error" class="count">{{ count }}
|
||||
<template v-if="count === 1">torrent</template>
|
||||
<template v-else>torrents</template>
|
||||
</span>
|
||||
</template>
|
||||
</Generic>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import service from "@/mixins/service.js";
|
||||
import Generic from "./Generic.vue";
|
||||
const units = ["B", "KB", "MB", "GB"];
|
||||
|
||||
// Take the rate in bytes and keep dividing it by 1k until the lowest
|
||||
// value for which we have a unit is determined. Return the value with
|
||||
// up to two decimals as a string and unit/s appended.
|
||||
const displayRate = (rate) => {
|
||||
let i = 0;
|
||||
|
||||
while (rate > 1000 && i < units.length) {
|
||||
rate /= 1000;
|
||||
i++;
|
||||
}
|
||||
return (
|
||||
Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format(
|
||||
rate || 0
|
||||
) + ` ${units[i]}/s`
|
||||
);
|
||||
};
|
||||
|
||||
export default {
|
||||
name: "qBittorrent",
|
||||
mixins: [service],
|
||||
props: { item: Object },
|
||||
components: { Generic },
|
||||
data: () => ({ dl: null, ul: null, count: null, error: null }),
|
||||
computed: {
|
||||
downRate: function () {
|
||||
return displayRate(this.dl);
|
||||
},
|
||||
upRate: function () {
|
||||
return displayRate(this.ul);
|
||||
},
|
||||
},
|
||||
created() {
|
||||
const rateInterval = parseInt(this.item.rateInterval, 10) || 0;
|
||||
const torrentInterval = parseInt(this.item.torrentInterval, 10) || 0;
|
||||
if (rateInterval > 0) {
|
||||
setInterval(() => this.getRate(), rateInterval);
|
||||
}
|
||||
if (torrentInterval > 0) {
|
||||
setInterval(() => this.fetchCount(), torrentInterval);
|
||||
}
|
||||
|
||||
this.getRate();
|
||||
this.fetchCount();
|
||||
},
|
||||
methods: {
|
||||
fetchCount: async function () {
|
||||
try {
|
||||
const body = await this.fetch('/api/v2/torrents/info');
|
||||
this.error = false;
|
||||
this.count = body.length;
|
||||
} catch (e) {
|
||||
this.error = true;
|
||||
console.error(e);
|
||||
}
|
||||
},
|
||||
getRate: async function () {
|
||||
try {
|
||||
const body = await this.fetch('/api/v2/transfer/info');
|
||||
this.error = false;
|
||||
this.dl = body.dl_info_speed;
|
||||
this.ul = body.up_info_speed;
|
||||
} catch (e) {
|
||||
this.error = true;
|
||||
console.error(e);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.error {
|
||||
color: #e51111 !important;
|
||||
}
|
||||
|
||||
.down {
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.count {
|
||||
color: var(--text);
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.monospace {
|
||||
font-weight: 300;
|
||||
font-family: monospace;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<Generic :item="item">
|
||||
<template #content>
|
||||
<p class="title is-4">{{ item.name }}</p>
|
||||
<p class="subtitle is-6">
|
||||
<span v-if="error" class="error">An error has occurred.</span>
|
||||
<template v-else>
|
||||
<span class="down monospace">
|
||||
<p class="fas fa-download"></p>
|
||||
{{ downRate }}
|
||||
</span>
|
||||
<span class="up monospace">
|
||||
<p class="fas fa-upload"></p>
|
||||
{{ upRate }}
|
||||
</span>
|
||||
</template>
|
||||
</p>
|
||||
</template>
|
||||
<template #indicator>
|
||||
<span v-if="!error" class="count"
|
||||
>{{ count }}
|
||||
<template v-if="count === 1">torrent</template>
|
||||
<template v-else>torrents</template>
|
||||
</span>
|
||||
</template>
|
||||
</Generic>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import service from "@/mixins/service.js";
|
||||
import Generic from "./Generic.vue";
|
||||
const units = ["B", "KB", "MB", "GB"];
|
||||
|
||||
// Take the rate in bytes and keep dividing it by 1k until the lowest
|
||||
// value for which we have a unit is determined. Return the value with
|
||||
// up to two decimals as a string and unit/s appended.
|
||||
const displayRate = (rate) => {
|
||||
let i = 0;
|
||||
|
||||
while (rate > 1000 && i < units.length) {
|
||||
rate /= 1000;
|
||||
i++;
|
||||
}
|
||||
return (
|
||||
Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format(
|
||||
rate || 0
|
||||
) + ` ${units[i]}/s`
|
||||
);
|
||||
};
|
||||
|
||||
export default {
|
||||
name: "qBittorrent",
|
||||
mixins: [service],
|
||||
props: { item: Object },
|
||||
components: { Generic },
|
||||
data: () => ({ dl: null, ul: null, count: null, error: null }),
|
||||
computed: {
|
||||
downRate: function () {
|
||||
return displayRate(this.dl);
|
||||
},
|
||||
upRate: function () {
|
||||
return displayRate(this.ul);
|
||||
},
|
||||
},
|
||||
created() {
|
||||
const rateInterval = parseInt(this.item.rateInterval, 10) || 0;
|
||||
const torrentInterval = parseInt(this.item.torrentInterval, 10) || 0;
|
||||
if (rateInterval > 0) {
|
||||
setInterval(() => this.getRate(), rateInterval);
|
||||
}
|
||||
if (torrentInterval > 0) {
|
||||
setInterval(() => this.fetchCount(), torrentInterval);
|
||||
}
|
||||
|
||||
this.getRate();
|
||||
this.fetchCount();
|
||||
},
|
||||
methods: {
|
||||
fetchCount: async function () {
|
||||
try {
|
||||
const body = await this.fetch("/api/v2/torrents/info");
|
||||
this.error = false;
|
||||
this.count = body.length;
|
||||
} catch (e) {
|
||||
this.error = true;
|
||||
console.error(e);
|
||||
}
|
||||
},
|
||||
getRate: async function () {
|
||||
try {
|
||||
const body = await this.fetch("/api/v2/transfer/info");
|
||||
this.error = false;
|
||||
this.dl = body.dl_info_speed;
|
||||
this.ul = body.up_info_speed;
|
||||
} catch (e) {
|
||||
this.error = true;
|
||||
console.error(e);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.error {
|
||||
color: #e51111 !important;
|
||||
}
|
||||
|
||||
.down {
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.count {
|
||||
color: var(--text);
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.monospace {
|
||||
font-weight: 300;
|
||||
font-family: monospace;
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user