[vlc-devel] [PATCH 13/15] http: add store & services
David Loiret
loiret.d at gmail.com
Tue Jun 23 14:42:48 CEST 2020
---
share/Makefile.am | 12 +++
share/lua/http/src/services/bus.service.js | 5 -
.../lua/http/src/services/command.service.js | 28 ------
share/lua/http/src/services/music.service.js | 77 +++++++++++++++
.../lua/http/src/services/playlist.service.js | 41 ++++++++
share/lua/http/src/services/status.service.js | 53 ++++++++++
share/lua/http/src/services/video.service.js | 17 ++++
.../lua/http/src/services/vlm_cmd.service.js | 8 ++
share/lua/http/src/store/index.js | 17 ++++
share/lua/http/src/store/modules/layout.js | 40 ++++++++
share/lua/http/src/store/modules/music.js | 97 +++++++++++++++++++
share/lua/http/src/store/modules/playlist.js | 78 +++++++++++++++
share/lua/http/src/store/modules/status.js | 67 +++++++++++++
share/lua/http/src/store/modules/video.js | 33 +++++++
share/lua/http/src/store/modules/vlm_cmd.js | 26 +++++
15 files changed, 566 insertions(+), 33 deletions(-)
delete mode 100644 share/lua/http/src/services/bus.service.js
delete mode 100644 share/lua/http/src/services/command.service.js
create mode 100644 share/lua/http/src/services/music.service.js
create mode 100644 share/lua/http/src/services/playlist.service.js
create mode 100644 share/lua/http/src/services/status.service.js
create mode 100644 share/lua/http/src/services/video.service.js
create mode 100644 share/lua/http/src/services/vlm_cmd.service.js
create mode 100644 share/lua/http/src/store/index.js
create mode 100644 share/lua/http/src/store/modules/layout.js
create mode 100644 share/lua/http/src/store/modules/music.js
create mode 100644 share/lua/http/src/store/modules/playlist.js
create mode 100644 share/lua/http/src/store/modules/status.js
create mode 100644 share/lua/http/src/store/modules/video.js
create mode 100644 share/lua/http/src/store/modules/vlm_cmd.js
diff --git a/share/Makefile.am b/share/Makefile.am
index a7112f330c..d74bb86f19 100644
--- a/share/Makefile.am
+++ b/share/Makefile.am
@@ -8,6 +8,18 @@ JS_TARGETS = --js $(srcdir)/lua/http/src/services/initialize.service.js \
--js $(srcdir)/lua/http/src/utils/media/types.js \
--js $(srcdir)/lua/http/src/utils/time/index.js \
--js $(srcdir)/lua/http/src/utils/filters/duration.js \
+--js $(srcdir)/lua/http/src/services/playlist.service.js \
+--js $(srcdir)/lua/http/src/services/music.service.js \
+--js $(srcdir)/lua/http/src/services/video.service.js \
+--js $(srcdir)/lua/http/src/services/status.service.js \
+--js $(srcdir)/lua/http/src/services/vlm_cmd.service.js \
+--js $(srcdir)/lua/http/src/store/index.js \
+--js $(srcdir)/lua/http/src/store/modules/layout.js \
+--js $(srcdir)/lua/http/src/store/modules/music.js \
+--js $(srcdir)/lua/http/src/store/modules/video.js \
+--js $(srcdir)/lua/http/src/store/modules/playlist.js \
+--js $(srcdir)/lua/http/src/store/modules/status.js \
+--js $(srcdir)/lua/http/src/store/modules/vlm_cmd.js \
--js $(srcdir)/lua/http/src/components/playlist/playlist.component.js \
--js $(srcdir)/lua/http/src/components/playlist/buttons.playlist.component.js \
--js $(srcdir)/lua/http/src/components/vlm/vlm.component.js \
diff --git a/share/lua/http/src/services/bus.service.js b/share/lua/http/src/services/bus.service.js
deleted file mode 100644
index 28f0df8ca8..0000000000
--- a/share/lua/http/src/services/bus.service.js
+++ /dev/null
@@ -1,5 +0,0 @@
-export const bus = new Vue();
-
-export function notifyBus(command, params) {
- bus.$emit(command, params);
-}
diff --git a/share/lua/http/src/services/command.service.js b/share/lua/http/src/services/command.service.js
deleted file mode 100644
index f929662db2..0000000000
--- a/share/lua/http/src/services/command.service.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import { bus } from './bus.service.js';
-
-export function sendCommand(mode, params) {
- if (mode === 0) {
- $.ajax({
- url: 'requests/status.json',
- data: params
- })
- .then((data) => {
- return JSON.parse(data);
- });
- } else if (mode === 1) {
- return $.ajax({
- url: 'requests/playlist.json',
- data: params
- })
- .then((data) => {
- const jsonData = JSON.parse(data);
- bus.$emit('populatePlaylist', jsonData);
- return jsonData;
- });
- } else if (mode === 2) {
- $.ajax({
- url: 'requests/vlm_cmd.xml',
- data: params
- });
- }
-}
diff --git a/share/lua/http/src/services/music.service.js b/share/lua/http/src/services/music.service.js
new file mode 100644
index 0000000000..3f1563f39d
--- /dev/null
+++ b/share/lua/http/src/services/music.service.js
@@ -0,0 +1,77 @@
+export default {
+ fetchTracks(params = {}) {
+ return $.ajax({
+ url: 'medialib/audio',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ const origin = location.origin;
+ jsonData = jsonData.map((d) => {
+ d.src = d.hasThumbnail ? origin + '/medialib/thumbnail?mediaId=' + d.id : '';
+ return d;
+ });
+ return jsonData;
+ });
+ },
+ fetchAlbums(params = {}) {
+ return $.ajax({
+ url: 'medialib/albums',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ const origin = location.origin;
+ jsonData = jsonData.map((d) => {
+ d.src = d.hasThumbnail ? origin + '/medialib/album/thumbnail?albumId=' + d.id : '';
+ return d;
+ });
+ return jsonData;
+ });
+ },
+ fetchAlbumTracks(params = {}) {
+ return $.ajax({
+ url: 'medialib/album/tracks',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ return jsonData;
+ });
+ },
+ fetchArtists(params = {}) {
+ return $.ajax({
+ url: 'medialib/artists',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ const origin = location.origin;
+ jsonData = jsonData.map((d) => {
+ d.src = d.hasThumbnail ? origin + '/medialib/artist/thumbnail?artistId=' + d.id : '';
+ return d;
+ });
+ return jsonData;
+ });
+ },
+ fetchArtistAlbums(params = {}) {
+ return $.ajax({
+ url: 'medialib/artist/albums',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ return jsonData;
+ });
+ },
+ fetchGenres(params = {}) {
+ return $.ajax({
+ url: 'medialib/genres',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ return jsonData;
+ });
+ }
+};
diff --git a/share/lua/http/src/services/playlist.service.js b/share/lua/http/src/services/playlist.service.js
new file mode 100644
index 0000000000..ceb52ca929
--- /dev/null
+++ b/share/lua/http/src/services/playlist.service.js
@@ -0,0 +1,41 @@
+import {
+ guessTypeFromUri
+} from '../utils/media/types.js';
+
+export default {
+ sendPlaylist(params) {
+ return $.ajax({
+ url: 'requests/playlist.json',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ jsonData = jsonData.map((data) => {
+ data.duration = data.duration ? data.duration * 1000 : 0;
+ // @TODO: remove when type fixed on backend side
+ data.type = guessTypeFromUri(data.uri);
+ return data;
+ });
+ return jsonData;
+ });
+ },
+ sendPlaylistStatus(params) {
+ return $.ajax({
+ url: 'requests/status.json',
+ data: params
+ })
+ .then((data) => {
+ const jsonData = JSON.parse(data);
+ return jsonData;
+ });
+ },
+ fetchPlaylist() {
+ return this.sendPlaylist();
+ },
+ addItem(src) {
+ return this.sendPlaylistStatus(`command=in_enqueue&input=${src}`);
+ },
+ removeItem(id) {
+ return this.sendPlaylistStatus(`command=pl_delete&id=${id}`);
+ }
+};
diff --git a/share/lua/http/src/services/status.service.js b/share/lua/http/src/services/status.service.js
new file mode 100644
index 0000000000..a89ab783a8
--- /dev/null
+++ b/share/lua/http/src/services/status.service.js
@@ -0,0 +1,53 @@
+import langUtils from '../utils/lang/index.js';
+
+export default {
+ sendGetStatus(params) {
+ return $.ajax({
+ url: 'requests/status.json',
+ data: params
+ })
+ .then((data) => {
+ return JSON.parse(data);
+ });
+ },
+ fetchStatus() {
+ return this.sendGetStatus();
+ },
+ toggleRandom() {
+ return this.sendGetStatus('command=pl_random');
+ },
+ toggleRepeat() {
+ return this.sendGetStatus('command=pl_repeat');
+ },
+ toggleFullscreen() {
+ return this.sendGetStatus('command=fullscreen');
+ },
+ play(id) {
+ const idParam = `&id=${id}`;
+ return this.sendGetStatus(`command=pl_play${langUtils.isPresent(id) && id !== -1 ? idParam : ''}`);
+ },
+ pause(id) {
+ const idParam = `&id=${id}`;
+ return this.sendGetStatus(`command=pl_pause${langUtils.isPresent(id) && id !== -1 ? idParam : ''}`);
+ },
+ updateVolume(volume) {
+ const cmd = `command=volume&val=${volume}`;
+ return this.sendGetStatus(cmd);
+ },
+ previous() {
+ const cmd = `command=pl_previous`;
+ return this.sendGetStatus(cmd);
+ },
+ next() {
+ const cmd = `command=pl_next`;
+ return this.sendGetStatus(cmd);
+ },
+ stop() {
+ const cmd = `command=pl_stop`;
+ return this.sendGetStatus(cmd);
+ },
+ seek(value) {
+ const cmd = `command=seek&val=${value}`;
+ return this.sendGetStatus(cmd);
+ }
+};
diff --git a/share/lua/http/src/services/video.service.js b/share/lua/http/src/services/video.service.js
new file mode 100644
index 0000000000..bf31844f0a
--- /dev/null
+++ b/share/lua/http/src/services/video.service.js
@@ -0,0 +1,17 @@
+export default {
+ fetchVideos(params = {}) {
+ return $.ajax({
+ url: 'medialib/video',
+ data: params
+ })
+ .then((data) => {
+ let jsonData = JSON.parse(data);
+ const origin = location.origin;
+ jsonData = jsonData.map((d) => {
+ d.src = d.hasThumbnail ? origin + '/medialib/thumbnail?mediaId=' + d.id : '';
+ return d;
+ });
+ return jsonData;
+ });
+ }
+};
diff --git a/share/lua/http/src/services/vlm_cmd.service.js b/share/lua/http/src/services/vlm_cmd.service.js
new file mode 100644
index 0000000000..f16301006a
--- /dev/null
+++ b/share/lua/http/src/services/vlm_cmd.service.js
@@ -0,0 +1,8 @@
+export default {
+ postCmd(cmd) {
+ return $.ajax({
+ url: 'requests/vlm_cmd.xml',
+ data: `command=${cmd}`
+ });
+ }
+};
diff --git a/share/lua/http/src/store/index.js b/share/lua/http/src/store/index.js
new file mode 100644
index 0000000000..cff8dd471c
--- /dev/null
+++ b/share/lua/http/src/store/index.js
@@ -0,0 +1,17 @@
+import playlist from './modules/playlist.js';
+import status from './modules/status.js';
+import layout from './modules/layout.js';
+import music from './modules/music.js';
+import video from './modules/video.js';
+import vlmCmd from './modules/vlm_cmd.js';
+
+export default new Vuex.Store({
+ modules: {
+ playlist,
+ status,
+ layout,
+ music,
+ video,
+ vlmCmd
+ }
+});
diff --git a/share/lua/http/src/store/modules/layout.js b/share/lua/http/src/store/modules/layout.js
new file mode 100644
index 0000000000..eec31aeec0
--- /dev/null
+++ b/share/lua/http/src/store/modules/layout.js
@@ -0,0 +1,40 @@
+// initial state
+const state = {
+ audioPlayerOpened: false,
+ itemLayout: 'grid'
+};
+
+const getters = { };
+
+const actions = {
+ toggleItemLayout({ commit }) {
+ let displayValue = 'grid';
+ if (state.itemLayout === 'grid') {
+ displayValue = 'list'
+ }
+ commit('setItemLayout', displayValue);
+ },
+ openAudioPlayer({ commit }) {
+ commit('setAudioPlayerOpened', true);
+ },
+ closeAudioPlayer({ commit }) {
+ commit('setAudioPlayerOpened', false);
+ }
+};
+
+const mutations = {
+ setAudioPlayerOpened(state, value) {
+ state.audioPlayerOpened = value;
+ },
+ setItemLayout(state, value) {
+ state.itemLayout = value;
+ }
+};
+
+export default {
+ namespaced: true,
+ state,
+ getters,
+ actions,
+ mutations
+};
diff --git a/share/lua/http/src/store/modules/music.js b/share/lua/http/src/store/modules/music.js
new file mode 100644
index 0000000000..a96c57552e
--- /dev/null
+++ b/share/lua/http/src/store/modules/music.js
@@ -0,0 +1,97 @@
+import musicService from '../../services/music.service.js';
+
+// initial state
+const state = {
+ tracks: [],
+ albums: [],
+ artists: [],
+ genres: [],
+ albumTracks: {},
+ artistAlbums: {}
+};
+
+const getters = {
+
+};
+
+const actions = {
+ fetchTracks({ commit }) {
+ musicService.fetchTracks()
+ .then((tracks) => {
+ commit('updateTracks', tracks);
+ });
+ },
+ fetchAlbums({ commit }) {
+ musicService.fetchAlbums()
+ .then((albums) => {
+ commit('updateAlbums', albums);
+ });
+ },
+ fetchAlbumTracks({ commit }, id) {
+ musicService.fetchAlbumTracks({ albumId: id })
+ .then((tracks) => {
+ commit('updateAlbumTracks', {
+ id,
+ tracks
+ });
+ });
+ },
+ fetchArtists({ commit }) {
+ musicService.fetchArtists()
+ .then((artists) => {
+ commit('updateArtists', artists);
+ });
+ },
+ fetchArtistAlbums({ commit }, id) {
+ musicService.fetchArtistAlbums({
+ artistId: id
+ })
+ .then((albums) => {
+ commit('updateArtistAlbums', {
+ albums,
+ id
+ });
+ });
+ },
+ fetchGenres({ commit }) {
+ musicService.fetchGenres()
+ .then((genres) => {
+ commit('updateGenres', genres);
+ });
+ }
+};
+
+const mutations = {
+ updateTracks(state, data) {
+ state.tracks = data;
+ },
+ updateAlbums(state, data) {
+ state.albums = data;
+ },
+ updateAlbumTracks(state, data) {
+ const newTracks = {
+ [data.id]: data.tracks
+ }
+ state.albumTracks = Object.assign({}, state.albumTracks, newTracks);
+ },
+ updateArtists(state, data) {
+ state.artists = data;
+ },
+ updateArtistAlbums(state, data) {
+ const newAlbums = {
+ [data.id]: data.albums
+ };
+ state.artistAlbums = Object.assign({}, state.artistAlbums, newAlbums);
+ },
+ updateGenres(state, data) {
+ state.genres = data;
+ }
+};
+
+export default {
+ namespaced: true,
+ state,
+ getters,
+ actions,
+ mutations
+};
diff --git a/share/lua/http/src/store/modules/playlist.js b/share/lua/http/src/store/modules/playlist.js
new file mode 100644
index 0000000000..841401984b
--- /dev/null
+++ b/share/lua/http/src/store/modules/playlist.js
@@ -0,0 +1,78 @@
+import playlistService from '../../services/playlist.service.js';
+
+// initial state
+const state = {
+ activeItem: {},
+ items: [],
+};
+
+const getters = {
+ getCurrentItem: (state, getters, rootState) => {
+ const currentItem = state.items.filter((state) => {
+ return state.current === 'current';
+ });
+ return currentItem.length ? currentItem[0] : null;
+ }
+};
+
+const actions = {
+ setActiveItem({ commit }, item) {
+ // Some set actuve request
+ commit('setActiveItem', item);
+ },
+ fetchPlaylist({ commit }) {
+ playlistService.fetchPlaylist()
+ .then((playlist) => {
+ commit('setPlaylist', playlist);
+ });
+ },
+ addItem({ commit, dispatch }, src) {
+ playlistService.addItem(src)
+ .then(() => {
+ // Refresh playlist
+ dispatch('fetchPlaylist');
+ });
+ },
+ removeItem({ commit }, id) {
+ playlistService.removeItem(id)
+ .then(() => {
+ commit('removeItem', id);
+ });
+ },
+};
+
+const mutations = {
+ setActiveItem(state, item) {
+ state.activeItem = item;
+ state.items = state.items.map((s) => {
+ s.active = item && item.id === s.id;
+ return s;
+ });
+ },
+ setPlaylist(state, playlist) {
+ const origin = location.origin;
+ let index = 0;
+ playlist = playlist.map((pl) => {
+ index++;
+ pl.nb = index;
+ // @TODO: uncomment when working in the backend side
+ pl.src = '' // origin + '?item=' + pl.id;
+ pl.active = state.activeItem && state.activeItem.id === pl.id;
+ return pl;
+ });
+ state.items = playlist;
+ },
+ removeItem(state, id) {
+ return state.items = state.items.filter((item) => {
+ return item.id !== id;
+ });
+ }
+};
+
+export default {
+ namespaced: true,
+ state,
+ getters,
+ actions,
+ mutations
+};
diff --git a/share/lua/http/src/store/modules/status.js b/share/lua/http/src/store/modules/status.js
new file mode 100644
index 0000000000..f83cb71179
--- /dev/null
+++ b/share/lua/http/src/store/modules/status.js
@@ -0,0 +1,67 @@
+import statusService from '../../services/status.service.js';
+
+// initial state
+const state = {
+ data: {}
+};
+
+const getters = {};
+
+const actions = {
+ fetchStatus({ commit }) {
+ statusService.fetchStatus()
+ .then((status) => {
+ commit('setStatus', status);
+ });
+ },
+ toggleRandom() {
+ state.data.random = !state.data.random;
+ statusService.toggleRandom();
+ },
+ toggleRepeat() {
+ state.data.repeat = !state.data.repeat;
+ statusService.toggleRepeat();
+ },
+ toggleFullscreen() {
+ state.data.fullscreen = !state.data.fullscreen;
+ statusService.toggleFullscreen();
+ },
+ play({ dispatch }, id) {
+ statusService.play(id)
+ .then(() => {
+ dispatch('playlist/fetchPlaylist', {}, {root:true})
+ });
+ },
+ pause({ dispatch }, id) {
+ statusService.pause(id);
+ },
+ stop() {
+ statusService.stop();
+ },
+ updateVolume({}, volume) {
+ statusService.updateVolume(volume);
+ },
+ previous({}) {
+ statusService.previous();
+ },
+ next({}) {
+ statusService.next();
+ },
+ seek({}, value) {
+ statusService.seek(value);
+ }
+};
+
+const mutations = {
+ setStatus(state, status) {
+ state.data = status;
+ }
+};
+
+export default {
+ namespaced: true,
+ state,
+ getters,
+ actions,
+ mutations
+};
diff --git a/share/lua/http/src/store/modules/video.js b/share/lua/http/src/store/modules/video.js
new file mode 100644
index 0000000000..71319204f7
--- /dev/null
+++ b/share/lua/http/src/store/modules/video.js
@@ -0,0 +1,33 @@
+import videoService from '../../services/video.service.js';
+
+// initial state
+const state = {
+ videos: [],
+};
+
+const getters = {
+
+};
+
+const actions = {
+ fetchVideos({ commit }) {
+ videoService.fetchVideos()
+ .then((tracks) => {
+ commit('updateVideos', tracks);
+ });
+ }
+};
+
+const mutations = {
+ updateVideos(state, data) {
+ state.videos = data;
+ }
+};
+
+export default {
+ namespaced: true,
+ state,
+ getters,
+ actions,
+ mutations
+};
diff --git a/share/lua/http/src/store/modules/vlm_cmd.js b/share/lua/http/src/store/modules/vlm_cmd.js
new file mode 100644
index 0000000000..c8933b4c41
--- /dev/null
+++ b/share/lua/http/src/store/modules/vlm_cmd.js
@@ -0,0 +1,26 @@
+import vlmCmdService from '../../services/vlm_cmd.service.js';
+
+// initial state
+const state = {
+ data: {}
+};
+
+const getters = {};
+
+const actions = {
+ postCmd({}, cmd) {
+ vlmCmdService.postCmd(cmd);
+ }
+};
+
+const mutations = {
+
+};
+
+export default {
+ namespaced: true,
+ state,
+ getters,
+ actions,
+ mutations
+};
--
2.18.0
More information about the vlc-devel
mailing list