diff options
Diffstat (limited to 'src/components/services')
-rw-r--r-- | src/components/services/Emby.vue | 121 |
1 files changed, 121 insertions, 0 deletions
diff --git a/src/components/services/Emby.vue b/src/components/services/Emby.vue new file mode 100644 index 0000000..da8a020 --- /dev/null +++ b/src/components/services/Emby.vue | |||
@@ -0,0 +1,121 @@ | |||
1 | <template> | ||
2 | <Generic :item="item"> | ||
3 | <template #content> | ||
4 | <p class="title is-4">{{ item.name }}</p> | ||
5 | <p class="subtitle is-6"> | ||
6 | <template v-if="item.subtitle"> | ||
7 | {{ item.subtitle }} | ||
8 | </template> | ||
9 | <template v-else> | ||
10 | {{ embyCount }} | ||
11 | </template> | ||
12 | </p> | ||
13 | </template> | ||
14 | <template #indicator> | ||
15 | <div v-if="status" class="status" :class="status"> | ||
16 | {{ status }} | ||
17 | </div> | ||
18 | </template> | ||
19 | </Generic> | ||
20 | </template> | ||
21 | |||
22 | <script> | ||
23 | import service from "@/mixins/service.js"; | ||
24 | import Generic from "./Generic.vue"; | ||
25 | |||
26 | export default { | ||
27 | name: "Emby", | ||
28 | mixins: [service], | ||
29 | props: { | ||
30 | item: Object, | ||
31 | }, | ||
32 | components: { | ||
33 | Generic, | ||
34 | }, | ||
35 | data: () => ({ | ||
36 | status: "", | ||
37 | albumCount: 0, | ||
38 | songCount: 0, | ||
39 | movieCount: 0, | ||
40 | seriesCount: 0, | ||
41 | episodeCount: 0, | ||
42 | }), | ||
43 | computed: { | ||
44 | embyCount: function () { | ||
45 | if(this.item.libraryType === 'music') | ||
46 | return `${this.songCount} songs, ${this.albumCount} albums` | ||
47 | if(this.item.libraryType === 'movies') | ||
48 | return `${this.movieCount} movies` | ||
49 | if(this.item.libraryType === 'series') | ||
50 | return `${this.episodeCount} eps, ${this.seriesCount} series` | ||
51 | }, | ||
52 | }, | ||
53 | created() { | ||
54 | this.fetchServerStatus(); | ||
55 | |||
56 | if(!this.item.subtitle && this.status !== "dead") | ||
57 | this.fetchServerMediaStats(); | ||
58 | }, | ||
59 | methods: { | ||
60 | fetchServerStatus: async function () { | ||
61 | const headers = { | ||
62 | "X-Emby-Token": this.item.apikey, | ||
63 | }; | ||
64 | |||
65 | await this.fetch("/System/info/public", { headers }) | ||
66 | .then(response => { | ||
67 | if(response.Id) | ||
68 | this.status = "running"; | ||
69 | else | ||
70 | this.status = "dead"; | ||
71 | }) | ||
72 | .catch((e) => { | ||
73 | console.log(e); | ||
74 | this.status = "dead"; | ||
75 | }); | ||
76 | }, | ||
77 | fetchServerMediaStats: async function () { | ||
78 | const headers = { | ||
79 | "X-Emby-Token": this.item.apikey, | ||
80 | }; | ||
81 | |||
82 | var data = await this.fetch("/items/counts", { headers }).catch((e) => { console.log(e); }); | ||
83 | |||
84 | this.albumCount = data.AlbumCount; | ||
85 | this.songCount = data.SongCount; | ||
86 | this.movieCount = data.MovieCount; | ||
87 | this.seriesCount = data.SeriesCount; | ||
88 | this.episodeCount = data.EpisodeCount; | ||
89 | }, | ||
90 | }, | ||
91 | }; | ||
92 | </script> | ||
93 | |||
94 | <style scoped lang="scss"> | ||
95 | .status { | ||
96 | font-size: 0.8rem; | ||
97 | color: var(--text-title); | ||
98 | |||
99 | &.running:before { | ||
100 | background-color: #94e185; | ||
101 | border-color: #78d965; | ||
102 | box-shadow: 0 0 5px 1px #94e185; | ||
103 | } | ||
104 | |||
105 | &.dead:before { | ||
106 | background-color: #c9404d; | ||
107 | border-color: #c42c3b; | ||
108 | box-shadow: 0 0 5px 1px #c9404d; | ||
109 | } | ||
110 | |||
111 | &:before { | ||
112 | content: " "; | ||
113 | display: inline-block; | ||
114 | width: 7px; | ||
115 | height: 7px; | ||
116 | margin-right: 10px; | ||
117 | border: 1px solid #000; | ||
118 | border-radius: 7px; | ||
119 | } | ||
120 | } | ||
121 | </style> | ||