<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>
</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);
},
},
if (torrentInterval > 0) {
setInterval(() => this.fetchCount(), torrentInterval);
}
-
+
// Fetch the initial values.
this.fetchRates();
this.fetchCount();
// 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">
color: var(--text);
font-size: 0.8em;
}
-</style>
\ No newline at end of file
+</style>