diff --git a/common/lkt.js b/common/lkt.js
index 09b3ba557ab4e67577817315898bed752ad4d5d3..2b0eb9006a3a87f02add9335e4395610c839cb87 100644
--- a/common/lkt.js
+++ b/common/lkt.js
@@ -109,6 +109,31 @@ class LktClient {
return __getResult(client);
}
+ static commandPlaylistList() {
+ var client = new this();
+ var once = false;
+ var result = {};
+ var dataObj;
+ function __getResult(client) {
+ return new Promise(resolv => {
+ client.m_socket.setTimeout(0);
+ client.m_socket.on('data', data => {
+ if (!once) {
+ client.m_socket.write('listplaylists\n');
+ once = true;
+ return null;
+ } else {
+ client.close();
+ dataObj = __mpdToObject(data);
+ result = dataObj.name.split(" ");
+ resolv(result);
+ }
+ });
+ });
+ }
+ return __getResult(client);
+ }
+
/* Arguments:
* - command: The command to execute
* Result:
@@ -141,9 +166,14 @@ class LktClient {
function __getResult(client) {
return new Promise((resolve, reject) => {
client.m_socket.on('data', data => {
- if (String(data).includes('playlist')) {
+ if (String(data).includes(' playlist')) {
+ logger.info("queue","cc");
LktClient.setQueueUpdated(true);
}
+ if(String(data).includes(' stored_playlist')) {
+ logger.info("playlist", "cc2");
+ LktClient.setPlaylistsUpdated(true);
+ }
client.m_socket.write(`idle\n`);
return null;
});
@@ -229,7 +259,7 @@ class LktClient {
static commandQueueDelId(id) {
return LktClient.__execSimple(`deleteid ${id}`);
}
-
+
static errorStatus(error) {
logger.error('Unable to access lektor status:' + error);
}
@@ -244,6 +274,16 @@ class LktClient {
return this.queue_updated;
}
+ static playlists_updated = false;
+
+ static setPlaylistsUpdated(state) {
+ this.playlists_updated = state;
+ }
+
+ static isPlaulistsUpdated() {
+ return this.playlists_updated;
+ }
+
static timeData = { elapsed: 0, total: 100, state: 'stop', song: 0 };
static setPlayState(state) {
@@ -268,7 +308,12 @@ function __mpdToObject(string) {
string.split('\n').forEach(line => {
if (line.length <= 1) return;
var couple = line.split(/: (.+)/).slice(0, 2);
- ret[couple[0]] = couple[1];
+ if(!ret[couple[0]]) {
+ ret[couple[0]] = couple[1];
+ }
+ else {
+ ret[couple[0]] += " " + couple[1];
+ }
});
return ret;
}
diff --git a/instance/index.html b/instance/index.html
index 06cde3f7f5042e212a6e7593cade05f36d504743..4df238530db9f5e46a911e408f6491a5b1b30c56 100644
--- a/instance/index.html
+++ b/instance/index.html
@@ -6,7 +6,7 @@
<script>
window.$ = window.jQuery = require('../style/jquery/jquery-3.5.1.js');
</script>
- <script src="../style/bootstrap-4.5.2-dist/js/bootstrap.min.js"></script>
+ <script src="../style/bootstrap-4.6.0-dist/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="../style/bootstrap-4.5.2-dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="../style/css/instance.css" />
<link rel="stylesheet" href="../style/fontawesome-free-5.15.1-web/css/all.min.css" />
@@ -139,16 +139,16 @@
<div id="panelWrapper" class="row">
<ul id="panelLeft" class="col panel d-flex flex-column bd-highlight mb-3"></ul>
<div id="panelRight" class="col panel d-flex flex-column bd-highlight mb-3">
- <ul class="nav nav-tabs mb-3" id="myTab" role="tablist">
+ <ul class="nav nav-tabs mb-1" id="myTab" role="tablist">
<li class="nav-item" role="presentation">
- <button class="nav-link active" id="queue-tab" data-bs-toggle="tab" data-bs-target="#queue" type="button" role="tab" aria-controls="queue" aria-selected="true">Queue</button>
+ <button class="nav-link active" id="queue-tab" data-toggle="tab" data-bs-target="#queue" type="button" role="tab" aria-controls="queue" aria-selected="true">Queue</button>
</li>
<li class="nav-item" role="presentation">
- <button class="nav-link active" id="playlist-tab" data-bs-toggle="tab" data-bs-target="#playlist" type="button" role="tab" aria-controls="playlist" aria-selected="false">Playlist</button>
+ <button class="nav-link active" id="playlist-tab" data-toggle="tab" data-bs-target="#playlist" type="button" role="tab" aria-controls="playlist" aria-selected="false">Playlist</button>
</li>
- <li class="playlistChoice">
- <select class="form-select mb-3 bd-highligh" aria-label="Default select example">
- <option selected>Open this select menu</option>
+ <li class="playlistChoice ml-4 mt-1">
+ <select class="form-control bd-highlight" id="playlist-selector" aria-label="Default select example">
+ <option selected>Select a playlist</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
@@ -156,10 +156,10 @@
</li>
</ul>
<div class="tab-content">
- <div id="queue" class="tab-pane fade show active" role="tabpanel" aria-labelledby="queue-tab"">
- <ul id="queueList"></ul>
+ <div id="queue-panel" class="tab-pane fade show active pl-0" role="tabpanel" aria-labelledby="queue-tab"">
+ <ul class="panel bd-highlight mb-3 pl-0" id="queueList"></ul>
</div>
- <div id="playlist" class="tab-pane fade" role="tabpanel" aria-labelledby="playlist-tab">
+ <div id="playlist-panel" class="tab-pane fade" role="tabpanel" aria-labelledby="playlist-tab">
<ul id="playlistList"> <head> Bonjour</head></ul>
</div>
</div>
diff --git a/instance/main.js b/instance/main.js
index 255f0cc77747476a0632395c92ccb2548dd53e29..f6dd48e45dc569a69a523c2ff6418c2ada7fa26b 100644
--- a/instance/main.js
+++ b/instance/main.js
@@ -84,7 +84,9 @@ window.onload = () => {
addIpcToButton('reloadQueue', ['reload-queue-request']);
setTimeout(() => ipcRenderer.send('reload-queue-request'), 1000);
+ //setTimeout(() => ipcRenderer.send('reload-playlist-request'),1000);
setInterval(() => ipcRenderer.send('verify-queue-reloaded-request'), 50);
+ //setInterval(() => ipcRenderer.send('verify-playlist-reloaded-request'),50);
setInterval(() => ipcRenderer.send('get-song-time-data'), 50);
logger.debug('instance', 'Window loaded');
@@ -162,6 +164,42 @@ function createButtonList(list) {
var btn = document.getElementById('btn-settings');
var span = document.getElementsByClassName('modal-close')[0];
+ /* Setup queue/playlist tabls*/
+ var tabQueue = document.getElementById("queue-tab");
+ var tabPlaylist = document.getElementById("playlist-tab");
+ var queuePanel = document.getElementById("queue-panel");
+ var playlistPanel = document.getElementById("playlist-panel");
+ tabQueue.style.outline = "none";
+ tabQueue.style.boxShadow = "none";
+ tabPlaylist.style.outline = "none";
+ tabPlaylist.style.boxShadow = "none";
+
+ tabQueue.onclick = () => {
+ tabQueue.style.background = "#4e5d6c";
+ tabPlaylist.style.background = "#2b3e50";
+ queuePanel.classList.add("show","active");
+ playlistPanel.classList.remove("show","active");
+ };
+
+ tabPlaylist.onclick = () => {
+ tabPlaylist.style.background = "#4e5d6c";
+ tabQueue.style.background = "#2b3e50";
+ playlistPanel.classList.add("show","active");
+ queuePanel.classList.remove("show","active");
+ }
+ var playlistSelect = document.getElementById("playlist-select");
+ if(playlistSelect) {
+ logger.info("cc","cc");
+ }
+ /*playlistSelect.onclick = ()=> {logger.info("cc");};
+ playlistSelect.on("changed.bs.select", (e,clickedIndex, newValue, oldValue) => {
+ logger.info("cc","cc");
+ });*/
+ playlistSelect.on('changed.bs.select', (e, clickedIndex, newValue, oldValue) => {
+ logger.info("cc","cc");
+ logger.info("cc",newValue);
+ logger.info("cc",oldValue);
+ });
btn.onclick = function () {
modal.style.display = 'block';
};
diff --git a/main.js b/main.js
index 68b997f9a5c77aea2ccbfce9b74c74e2b0cd6aed..86115a67648a6bbd8f235fe6d8eb7f5516469713 100644
--- a/main.js
+++ b/main.js
@@ -121,6 +121,9 @@ app.on('ready', () => {
setTimeout(() => {
lkt.statusActualisation();
}, 1500);
+ setTimeout(() => {
+ lkt.commandPlaylistList();
+ }, 1500);
lektor.on('close', code => {
logger.warn('main', `Lektor exited with code ${code}`);
lektor_closed = true;
@@ -191,6 +194,12 @@ ipcMain.on('verify-queue-reloaded-request', (event, arg) => {
}
});
+ipcMain.on('reload-playlists-request', (event,arg) => {
+ lkt.commandPlaylistList().then(playlists => {
+ event.reply('playlists')
+ });
+});
+
ipcMain.on('queue-moved-kara', (event, movement) => {
if (movement.to != movement.from) {
lkt.commandMove(movement.from, movement.to);
diff --git a/style/css/instance.css b/style/css/instance.css
index ebd9d81b58b023bf5135c3d0abc00590b1343230..0d364945d91b4cc77c6c3ef0d50c7ad9d888067e 100644
--- a/style/css/instance.css
+++ b/style/css/instance.css
@@ -54,6 +54,7 @@ input[type="color"]:focus,
.form-control {
background-color: #2b3e50 !important;
color: white !important;
+ border: 1px solid gray !important;
}
#mainFrame {
@@ -182,3 +183,11 @@ input[type="color"]:focus,
background: none !important;
color: white;
}
+
+.form-select {
+ background: none;
+ color: gray;
+ min-height: 1em;
+ display: table-cell;
+ vertical-align: middle
+}
\ No newline at end of file