diff --git a/www/css/panel/pm.css b/www/css/panel/pm.css
index 09b3c56..df2db42 100644
--- a/www/css/panel/pm.css
+++ b/www/css/panel/pm.css
@@ -22,6 +22,8 @@ along with this program. If not, see .*/
#pm-panel-sesh-list-container{
flex: 1;
max-width: 10em;
+ width: calc(100% - 1.25em);
+ margin-left: 0.25em;
}
#pm-panel-sesh-container{
@@ -33,11 +35,11 @@ along with this program. If not, see .*/
}
#pm-panel-start-sesh{
- width: calc(100% - 1.25em);
- margin-left: 0.25em;
padding: 0 0.5em;
text-wrap: nowrap;
display: flex;
+ font-size: 1.2em;
+ font-weight: bold;
}
#pm-panel-start-sesh span{
@@ -51,4 +53,16 @@ along with this program. If not, see .*/
#pm-panel-sesh-control-div{
margin: 0.5em;
+}
+
+div.pm-panel-sesh-list-entry{
+ padding: 0 0.5em;
+ display: flex;
+ flex-direction: row;
+}
+
+div.pm-panel-sesh-list-entry, div.pm-panel-sesh-list-entry p{
+ margin: 0;
+ text-wrap: nowrap;
+ text-align: center;
}
\ No newline at end of file
diff --git a/www/css/theme/movie-night.css b/www/css/theme/movie-night.css
index 1cfda84..96e5793 100644
--- a/www/css/theme/movie-night.css
+++ b/www/css/theme/movie-night.css
@@ -627,6 +627,11 @@ div.archived p{
border-bottom: 1px solid var(--accent0);
}
+
+div.pm-panel-sesh-list-entry{
+ border-bottom: 1px solid var(--accent0);
+}
+
/* altcha theming*/
div.altcha{
box-shadow: 4px 4px 1px var(--bg1-alt0) inset;
diff --git a/www/js/channel/panels/pmPanel.js b/www/js/channel/panels/pmPanel.js
index 761c2d8..e502f4f 100644
--- a/www/js/channel/panels/pmPanel.js
+++ b/www/js/channel/panels/pmPanel.js
@@ -26,13 +26,26 @@ class pmPanel extends panelObj{
*/
constructor(client, panelDocument){
super(client, "Private Messaging", "/panel/pm", panelDocument);
+
+ this.defineListeners();
}
closer(){
}
docSwitch(){
+ this.seshList = this.panelDocument.querySelector('#pm-panel-sesh-list');
+
this.setupInput();
+
+ this.renderSeshList();
+ }
+
+ /**
+ * Defines network related event listeners
+ */
+ defineListeners(){
+
}
/**
@@ -40,4 +53,36 @@ class pmPanel extends panelObj{
*/
setupInput(){
}
+
+ /**
+ * Render out current sesh array to sesh list UI
+ */
+ renderSeshList(){
+ //For each session tracked by the pmHandler
+ for(const sesh of this.client.pmHandler.seshList){
+ this.renderSeshListEntry(sesh);
+ }
+ }
+
+ /**
+ * Renders out a given messaging sesh to the sesh list UI
+ */
+ renderSeshListEntry(sesh){
+ //Create container div
+ const entryDiv = document.createElement('div');
+ //Set conatiner div classes
+ entryDiv.classList.add('pm-panel-sesh-list-entry','interactive');
+
+
+ //Create sesh label
+ const seshLabel = document.createElement('p');
+ //Create human-readable label out of members array
+ seshLabel.textContent = utils.unescapeEntities(sesh.recipients.sort().join(', '));
+
+ //append sesh label to entry div
+ entryDiv.appendChild(seshLabel);
+
+ //Append entry div to sesh list
+ this.seshList.appendChild(entryDiv);
+ }
}
\ No newline at end of file