rainbownapkin/canopy
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

Added improved settings panel.

Browse source
This commit is contained in:
rainbow napkin 2025-09-06 10:34:06 -04:00
parent 306f22aa93
commit 132fdabb29
105 changed files with 3447 additions and 252 deletions
Download patch file Download diff file Expand all files Collapse all files

129
www/doc/client/panels_settingsPanel.js.html
View file

@ -60,8 +60,36 @@ class settingsPanel extends panelObj{
}
docSwitch(){
/**
* Youtube Source Selector
*/
this.youtubeSource = this.panelDocument.querySelector("#settings-panel-youtube-source select");
/**
* Internet Archive CDN Server Input
*/
this.iaCDN = this.panelDocument.querySelector("#settings-panel-ia-server input");
/**
* Syncronization Tolerance Input
*/
this.syncTolerance = this.panelDocument.querySelector("#settings-panel-sync-tolerance input");
/**
* Livestream Syncronization Tolerance Input
*/
this.liveSyncTolerance = this.panelDocument.querySelector("#settings-panel-live-sync-tolerance input");
/**
* Syncronization Tolerance Delta
*/
this.syncDelta = this.panelDocument.querySelector("#settings-panel-sync-delta input");
/**
* Chat Width Minimum while Size-Locked to Media Aspect Ratio
*/
this.chatWidthMinimum = this.panelDocument.querySelector("#settings-panel-min-chat-width input");
this.renderSettings();
this.setupInput();
}
@ -71,6 +99,11 @@ class settingsPanel extends panelObj{
*/
setupInput(){
this.youtubeSource.addEventListener('change', this.updateYoutubeSource.bind(this));
this.iaCDN.addEventListener('keydown', this.updateIACDN.bind(this));
this.syncTolerance.addEventListener('change', this.updateSyncTolerance.bind(this));
this.liveSyncTolerance.addEventListener('change', this.updateLiveSyncTolerance.bind(this));
this.syncDelta.addEventListener('change', this.updateSyncDelta.bind(this));
this.chatWidthMinimum.addEventListener('change', this.updateChatWidthMinimum.bind(this));
}
/**
@ -78,6 +111,11 @@ class settingsPanel extends panelObj{
*/
renderSettings(){
this.youtubeSource.value = localStorage.getItem("ytPlayerType");
this.iaCDN.value = localStorage.getItem("IACDN");
this.syncTolerance.value = localStorage.getItem("syncTolerance");
this.liveSyncTolerance.value = localStorage.getItem("liveSyncTolerance");
this.syncDelta.value = localStorage.getItem("syncDelta");
this.chatWidthMinimum.value = localStorage.getItem("chatWidthMin");
}
/**
@ -87,6 +125,95 @@ class settingsPanel extends panelObj{
localStorage.setItem("ytPlayerType", this.youtubeSource.value);
client.processConfig("ytPlayerType", this.youtubeSource.value);
}
/**
* Event handler for Internet Archive CDN Server input
* @param {Event} event - Event handed down by event listener
*/
updateIACDN(event){
//If we hit enter
if(event.key == "Enter"){
//If we have an invalid server string
if(!(this.iaCDN.value.match(/^ia[0-9]{6}\...$/g) || this.iaCDN.value == "")){
//reset back to what was set before
this.iaCDN.value = localStorage.getItem('IACDN');
//BAIL!
return;
}
localStorage.setItem("IACDN", this.iaCDN.value);
client.processConfig("IACDN", this.iaCDN.value);
}
}
/**
* Handles Sync Tolerance Changes
*/
updateSyncTolerance(){
//If sync tolerance was set to a negative number
if(this.syncTolerance.value < 0){
//Reset setting back to stored value
this.syncTolerance.value = localStorage.getItem('syncTolerance');
//BAIL!
return;
}
localStorage.setItem("syncTolerance", this.syncTolerance.value);
client.processConfig("syncTolerance", this.syncTolerance.value);
}
/**
* Handles Live Sync Tolerance Changes
*/
updateLiveSyncTolerance(){
//If sync tolerance was set to a negative number
if(this.liveSyncTolerance.value < 0){
//Reset setting back to stored value
this.liveSyncTolerance.value = localStorage.getItem('liveSyncTolerance');
//BAIL!
return;
}
localStorage.setItem("liveSyncTolerance", this.liveSyncTolerance.value);
client.processConfig("liveSyncTolerance", this.liveSyncTolerance.value);
}
/**
* Handles Sync Delta Changes
*/
updateSyncDelta(){
//If sync tolerance was set to a negative number
if(this.syncDelta.value < 0){
//Reset setting back to stored value
this.syncDelta.value = localStorage.getItem('syncDelta');
//BAIL!
return;
}
localStorage.setItem("syncDelta", this.syncDelta.value);
client.processConfig("syncDelta", this.syncDelta.value);
}
/**
* Handles Chat Width minimum Changes
*/
updateChatWidthMinimum(){
//If sync tolerance was set to a negative number
if(this.chatWidthMinimum.value < 0 || this.chatWidthMinimum > 100){
//Reset setting back to stored value
this.syncDelta.value = localStorage.getItem('chatWidthMin');
//BAIL!
return;
}
localStorage.setItem("chatWidthMin", this.chatWidthMinimum.value);
client.processConfig("chatWidthMin", this.chatWidthMinimum.value);
}
}</code></pre>
</article>
</section>
@ -103,7 +230,7 @@ class settingsPanel extends panelObj{
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Sat Sep 06 2025 01:36:01 GMT-0400 (Eastern Daylight Time)
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Sat Sep 06 2025 10:33:49 GMT-0400 (Eastern Daylight Time)
</footer>
<script> prettyPrint(); </script>