Fix HuesSettings persistance issues

No one references localStorage any more, as it's annoying to be consistent when dealing with query vars and temporary overrides
Ephemeral settings + query vars are properly ephemeral
fullAuto can be toggled via settings
master
Will Toohey 8 years ago
parent 77cf50e693
commit 29eb38dafc
  1. 14
      src/js/HuesCanvas.js
  2. 116
      src/js/HuesCore.js
  3. 2
      src/js/HuesEditor.js
  4. 6
      src/js/HuesInfo.js
  5. 195
      src/js/HuesSettings.js
  6. 6
      src/js/HuesWindow.js
  7. 6
      src/js/ResourceManager.js
  8. 2
      src/js/SoundManager.js

@ -120,11 +120,11 @@ class HuesCanvas {
} }
settingsUpdated() { settingsUpdated() {
this.setSmartAlign(localStorage["smartAlign"]); this.setSmartAlign(this.core.settings.smartAlign);
this.setBlurAmount(localStorage["blurAmount"]); this.setBlurAmount(this.core.settings.blurAmount);
this.setBlurDecay(localStorage["blurDecay"]); this.setBlurDecay(this.core.settings.blurDecay);
this.setBlurQuality(localStorage["blurQuality"]); this.setBlurQuality(this.core.settings.blurQuality);
this.trippyOn = localStorage["trippyMode"] == "on"; this.trippyOn = this.core.settings.trippyMode == "on";
} }
resetEffects() { resetEffects() {
@ -508,7 +508,7 @@ class HuesCanvas {
} }
this.blackout = true; this.blackout = true;
this.needsRedraw = true; this.needsRedraw = true;
if(localStorage["blackoutUI"] == "on") { if(this.core.settings.blackoutUI == "on") {
this.core.userInterface.hide(); this.core.userInterface.hide();
} }
} }
@ -517,7 +517,7 @@ class HuesCanvas {
this.blackout = false; this.blackout = false;
this.blackoutTimeout = 0; this.blackoutTimeout = 0;
this.needsRedraw = true; this.needsRedraw = true;
if(localStorage["blackoutUI"] == "on") { if(this.core.settings.blackoutUI == "on") {
this.core.userInterface.show(); this.core.userInterface.show();
} }
} }

@ -19,9 +19,6 @@
* THE SOFTWARE. * THE SOFTWARE.
*/ */
/* We don't want localstorage variables 'optimised' to different identifiers*/
/*jshint -W069 */
(function(window, document) { (function(window, document) {
"use strict"; "use strict";
@ -106,7 +103,7 @@ class HuesCore {
/* callback settingsupdated() /* callback settingsupdated()
* *
* Called when settings are updated and should be re-read from localStorage * Called when settings are updated and should be re-read from the settings object
*/ */
settingsupdated : [] settingsupdated : []
}; };
@ -131,25 +128,27 @@ class HuesCore {
this.colourIndex = 0x3f; this.colourIndex = 0x3f;
this.colours = HuesCore.oldColours; this.colours = HuesCore.oldColours;
this.isFullAuto = true;
this.invert = false; this.invert = false;
this.loopCount = 0; this.loopCount = 0;
this.doBuildup = true; this.doBuildup = true;
this.userInterface = null; this.userInterface = null;
this.uiArray = []; this.uiArray = [];
this.settings = new HuesSettings(defaults);
zip.workerScriptsPath = this.settings.workersPath;
// What's our root element? // What's our root element?
this.root = null; this.root = null;
if(!defaults.root) { if(!this.settings.root) {
this.root = document.body; this.root = document.body;
} else if(typeof defaults.root === "string") { } else if(typeof this.settings.root === "string") {
if(defaults.root && document.getElementById(defaults.root)) { if(this.settings.root && document.getElementById(this.settings.root)) {
this.root = document.getElementById(defaults.root); this.root = document.getElementById(this.settings.root);
} else { } else {
this.root = document.body; this.root = document.body;
} }
} else { // been given an element } else { // been given an element
this.root = defaults.root; this.root = this.settings.root;
} }
this.root.classList.add("hues-root"); this.root.classList.add("hues-root");
// Special case for full page Hues // Special case for full page Hues
@ -159,7 +158,7 @@ class HuesCore {
// Yes, we do indeed have Javascript // Yes, we do indeed have Javascript
this.root.innerHTML = ""; this.root.innerHTML = "";
this.makePreloader(this.root, defaults); this.makePreloader(this.root);
window.onerror = (msg, url, line, col, error) => { window.onerror = (msg, url, line, col, error) => {
this.error(msg); this.error(msg);
@ -167,21 +166,16 @@ class HuesCore {
return false; return false;
}; };
this.settings = new HuesSettings(defaults); this.window = new HuesWindow(this.root, this.settings);
// Update with merged defaults
defaults = this.settings.defaults;
zip.workerScriptsPath = defaults.workersPath;
this.window = new HuesWindow(this.root, defaults);
console.log("0x40 Hues v" + this.versionStr + " - start your engines!"); console.log("0x40 Hues v" + this.versionStr + " - start your engines!");
this.resourceManager = new Resources(this, this.window); this.resourceManager = new Resources(this, this.window);
this.editor = new HuesEditor(this, this.window); this.editor = new HuesEditor(this, this.window);
this.settings.initUI(this.window); this.settings.initUI(this.window);
populateHuesInfo(this.versionStr, this.window, defaults); populateHuesInfo(this.versionStr, this.window, this.settings);
this.window.selectTab(defaults.firstWindow, true); this.window.selectTab(this.settings.firstWindow, true);
let ui = document.createElement("div"); let ui = document.createElement("div");
ui.className = "hues-ui"; ui.className = "hues-ui";
@ -189,7 +183,7 @@ class HuesCore {
this.uiArray.push(new RetroUI(ui), new WeedUI(ui), new ModernUI(ui), this.uiArray.push(new RetroUI(ui), new WeedUI(ui), new ModernUI(ui),
new XmasUI(ui), new HalloweenUI(ui), new MinimalUI(ui)); new XmasUI(ui), new HalloweenUI(ui), new MinimalUI(ui));
this.autoSong = localStorage["autoSong"]; this.autoSong = this.settings.autoSong;
this.visualiser = document.createElement("canvas"); this.visualiser = document.createElement("canvas");
this.visualiser.className = "hues-visualiser"; this.visualiser.className = "hues-visualiser";
@ -199,10 +193,10 @@ class HuesCore {
this.soundManager = new SoundManager(this); this.soundManager = new SoundManager(this);
this.soundManager.init().then(() => { this.soundManager.init().then(() => {
if(!this.soundManager.locked && localStorage["skipPreloader"] == "on") { if(!this.soundManager.locked && this.settings.skipPreloader == "on") {
return null; return null;
} else { } else {
return this.resourceManager.getSizes(defaults.respacks); return this.resourceManager.getSizes(this.settings.respacks);
} }
}).then( sizes => { }).then( sizes => {
if(sizes === null) { if(sizes === null) {
@ -238,12 +232,14 @@ class HuesCore {
this.setColour(this.colourIndex); this.setColour(this.colourIndex);
this.animationLoop(); this.animationLoop();
if(defaults.load) { if(this.settings.load) {
return this.resourceManager.addAll(defaults.respacks, progress => { return this.resourceManager.addAll(this.settings.respacks, progress => {
this.preloader.style.backgroundPosition = (100 - progress*100) + "% 0%"; this.preloader.style.backgroundPosition = (100 - progress*100) + "% 0%";
let scale = Math.floor(progress * defaults.preloadMax); let scale = Math.floor(progress * this.settings.preloadMax);
let padding = defaults.preloadMax.toString(defaults.preloadBase).length; let padding = this.settings.preloadMax.toString(this.settings.preloadBase).length;
this.preloadMsg.textContent = defaults.preloadPrefix + (Array(padding).join("0")+scale.toString(defaults.preloadBase)).slice(-padding); this.preloadMsg.textContent = this.settings.preloadPrefix +
(Array(padding).join("0") +
scale.toString(this.settings.preloadBase)).slice(-padding);
}); });
} else { } else {
this.preloader.style.display = "none"; this.preloader.style.display = "none";
@ -252,14 +248,14 @@ class HuesCore {
}).then(() => { }).then(() => {
this.preloader.classList.add("hues-preloader--loaded"); this.preloader.classList.add("hues-preloader--loaded");
this.callEventListeners("loaded"); this.callEventListeners("loaded");
if(defaults.firstImage) { if(this.settings.firstImage) {
this.setImageByName(defaults.firstImage); this.setImageByName(this.settings.firstImage);
} else { } else {
this.setImage(0); this.setImage(0);
} }
if(defaults.autoplay) { if(this.settings.autoplay) {
if(defaults.firstSong) { if(this.settings.firstSong) {
this.setSongByName(defaults.firstSong); this.setSongByName(this.settings.firstSong);
} else { } else {
this.setSong(0); this.setSong(0);
} }
@ -268,7 +264,7 @@ class HuesCore {
this.error(error); this.error(error);
}); });
if(!defaults.disableKeyboard) { if(!this.settings.disableKeyboard) {
document.addEventListener("keydown", e => { document.addEventListener("keydown", e => {
e = e || window.event; e = e || window.event;
if(e.defaultPrevented) { if(e.defaultPrevented) {
@ -316,15 +312,15 @@ class HuesCore {
} }
} }
makePreloader(root, defaults) { makePreloader(root) {
this.preloader = document.createElement("div"); this.preloader = document.createElement("div");
this.preloader.className = "hues-preloader"; this.preloader.className = "hues-preloader";
root.appendChild(this.preloader); root.appendChild(this.preloader);
if(defaults.preloadTitle) { if(this.settings.preloadTitle) {
this.preloadTitle = document.createElement("div"); this.preloadTitle = document.createElement("div");
this.preloadTitle.className = "hues-preloader__title"; this.preloadTitle.className = "hues-preloader__title";
this.preloadTitle.textContent = defaults.preloadTitle; this.preloadTitle.textContent = this.settings.preloadTitle;
this.preloader.appendChild(this.preloadTitle); this.preloader.appendChild(this.preloadTitle);
} }
@ -343,7 +339,7 @@ class HuesCore {
} }
updateVisualiser() { updateVisualiser() {
if(localStorage["visualiser"] != "on") { if(this.settings.visualiser != "on") {
return; return;
} }
@ -509,7 +505,7 @@ class HuesCore {
this.callEventListeners("newsong", this.currentSong); this.callEventListeners("newsong", this.currentSong);
this.loopCount = 0; this.loopCount = 0;
if (this.currentSong.buildup) { if (this.currentSong.buildup) {
switch (localStorage["playBuildups"]) { switch (this.settings.playBuildups) {
case "off": case "off":
this.currentSong.buildupPlayed = true; this.currentSong.buildupPlayed = true;
this.doBuildup = false; this.doBuildup = false;
@ -606,16 +602,16 @@ class HuesCore {
onLoop() { onLoop() {
this.loopCount++; this.loopCount++;
switch (localStorage["autoSong"]) { switch (this.settings.autoSong) {
case "loop": case "loop":
console.log("Checking loops"); console.log("Checking loops");
if (this.loopCount >= localStorage["autoSongDelay"]) { if (this.loopCount >= this.settings.autoSongDelay) {
this.doAutoSong(); this.doAutoSong();
} }
break; break;
case "time": case "time":
console.log("Checking times"); console.log("Checking times");
if (this.soundManager.loopLength * this.loopCount >= localStorage["autoSongDelay"] * 60) { if (this.soundManager.loopLength * this.loopCount >= this.settings.autoSongDelay * 60) {
this.doAutoSong(); this.doAutoSong();
} }
break; break;
@ -627,12 +623,12 @@ class HuesCore {
if(this.resourceManager.enabledSongs.length < 2) { if(this.resourceManager.enabledSongs.length < 2) {
return; // don't move if there's nothing to move to return; // don't move if there's nothing to move to
} }
if(localStorage["autoSongShuffle"] == "on") { if(this.settings.autoSongShuffle == "on") {
func = this.randomSong; func = this.randomSong;
} else { } else {
func = this.nextSong; func = this.nextSong;
} }
if(localStorage["autoSongFadeout"] == "on") { if(this.settings.autoSongFadeout == "on") {
this.soundManager.fadeOut(() => { this.soundManager.fadeOut(() => {
func.call(this); func.call(this);
}); });
@ -651,13 +647,13 @@ class HuesCore {
resetAudio() { resetAudio() {
this.beatIndex = 0; this.beatIndex = 0;
this.songDataUpdated(); this.songDataUpdated();
if(localStorage["visualiser"] == "on") { if(this.settings.visualiser == "on") {
this.soundManager.initVisualiser(this.visualiser.width/2); this.soundManager.initVisualiser(this.visualiser.width/2);
} }
} }
randomImage() { randomImage() {
if(localStorage["shuffleImages"] == "on") { if(this.settings.shuffleImages == "on") {
let len = this.resourceManager.enabledImages.length; let len = this.resourceManager.enabledImages.length;
let index = Math.floor(Math.random() * len); let index = Math.floor(Math.random() * len);
if ((index == this.imageIndex || this.lastImageArray.indexOf(index) != -1) && len > 1) { if ((index == this.imageIndex || this.lastImageArray.indexOf(index) != -1) && len > 1) {
@ -780,12 +776,12 @@ class HuesCore {
this.randomColour(); this.randomColour();
break; break;
case '*': case '*':
if(this.isFullAuto) { if(this.settings.fullAuto) {
this.randomImage(); this.randomImage();
} }
break; break;
case '=': case '=':
if(this.isFullAuto) { if(this.settings.fullAuto) {
this.randomImage(); this.randomImage();
} }
/* falls through */ /* falls through */
@ -806,7 +802,7 @@ class HuesCore {
this.renderer.doSlice(this.getBeatLength(), this.charsToNextBeat(), true, true); this.renderer.doSlice(this.getBeatLength(), this.charsToNextBeat(), true, true);
break; break;
case 'I': case 'I':
if (this.isFullAuto) { if (this.settings.fullAuto) {
this.randomImage(); this.randomImage();
} }
/* falls through */ /* falls through */
@ -819,7 +815,7 @@ class HuesCore {
} }
if([".", "+", "¤", ":", "*", "X", "O", "~", "=", "i", "I", "s", "v", "#"].indexOf(beat) == -1) { if([".", "+", "¤", ":", "*", "X", "O", "~", "=", "i", "I", "s", "v", "#"].indexOf(beat) == -1) {
this.randomColour(); this.randomColour();
if (this.isFullAuto) { if (this.settings.fullAuto) {
this.randomImage(); this.randomImage();
} }
} }
@ -866,14 +862,14 @@ class HuesCore {
} }
setIsFullAuto(auto) { setIsFullAuto(auto) {
this.isFullAuto = auto; this.settings.fullAuto = auto;
if (this.userInterface) { if (this.userInterface) {
this.callEventListeners("newmode", this.isFullAuto); this.callEventListeners("newmode", this.settings.fullAuto);
} }
} }
toggleFullAuto() { toggleFullAuto() {
this.setIsFullAuto(!this.isFullAuto); this.setIsFullAuto(!this.settings.fullAuto);
} }
setInvert(invert) { setInvert(invert) {
@ -897,7 +893,7 @@ class HuesCore {
} }
this.userInterface = this.uiArray[index]; this.userInterface = this.uiArray[index];
this.userInterface.connectCore(this); this.userInterface.connectCore(this);
this.callEventListeners("newmode", this.isFullAuto); this.callEventListeners("newmode", this.settings.fullAuto);
this.callEventListeners("newsong", this.currentSong); this.callEventListeners("newsong", this.currentSong);
this.callEventListeners("newimage", this.currentImage); this.callEventListeners("newimage", this.currentImage);
this.callEventListeners("newcolour", this.colours[this.colourIndex], false); this.callEventListeners("newcolour", this.colours[this.colourIndex], false);
@ -908,7 +904,7 @@ class HuesCore {
settingsUpdated() { settingsUpdated() {
this.callEventListeners("settingsupdated"); this.callEventListeners("settingsupdated");
switch (localStorage["currentUI"]) { switch (this.settings.currentUI) {
case "retro": case "retro":
this.changeUI(0); this.changeUI(0);
break; break;
@ -928,7 +924,7 @@ class HuesCore {
this.changeUI(5); this.changeUI(5);
break; break;
} }
switch (localStorage["colourSet"]) { switch (this.settings.colourSet) {
case "normal": case "normal":
this.colours = HuesCore.oldColours; this.colours = HuesCore.oldColours;
break; break;
@ -939,7 +935,7 @@ class HuesCore {
this.colours = HuesCore.weedColours; this.colours = HuesCore.weedColours;
break; break;
} }
switch (localStorage["blackoutUI"]) { switch (this.settings.blackoutUI) {
case "off": case "off":
this.userInterface.show(); this.userInterface.show();
break; break;
@ -949,7 +945,7 @@ class HuesCore {
} }
break; break;
} }
switch (localStorage["visualiser"]) { switch (this.settings.visualiser) {
case "off": case "off":
this.visualiser.classList.add("hidden"); this.visualiser.classList.add("hidden");
break; break;
@ -960,11 +956,11 @@ class HuesCore {
} }
break; break;
} }
if (this.autoSong == "off" && localStorage["autoSong"] != "off") { if (this.autoSong == "off" && this.settings.autoSong != "off") {
console.log("Resetting loopCount since AutoSong was enabled"); console.log("Resetting loopCount since AutoSong was enabled");
this.loopCount = 0; this.loopCount = 0;
} }
this.autoSong = localStorage["autoSong"]; this.autoSong = this.settings.autoSong;
} }
enabledChanged() { enabledChanged() {
@ -1012,7 +1008,7 @@ class HuesCore {
this.previousSong(); this.previousSong();
break; break;
case 70: // F case 70: // F
this.setIsFullAuto(!this.isFullAuto); this.toggleFullAuto();
break; break;
case 109: // NUMPAD_SUBTRACT case 109: // NUMPAD_SUBTRACT
case 189: // MINUS case 189: // MINUS

@ -55,7 +55,7 @@ class HuesEditor {
this.linked = false; this.linked = false;
this.core = core; this.core = core;
if(core.settings.defaults.enableWindow) { if(core.settings.enableWindow) {
this.initUI(); this.initUI();
core.addEventListener("beat", this.onBeat.bind(this)); core.addEventListener("beat", this.onBeat.bind(this));
core.addEventListener("newsong", this.onNewSong.bind(this)); core.addEventListener("newsong", this.onNewSong.bind(this));

@ -69,8 +69,8 @@ const shortcuts = [
"[1-5] Change UI" "[1-5] Change UI"
]; ];
function populateHuesInfo(version, huesWin, defaults) { function populateHuesInfo(version, huesWin, settings) {
if(!defaults.enableWindow) { if(!settings.enableWindow) {
return; return;
} }
let verString = (parseInt(version)/10).toFixed(1); let verString = (parseInt(version)/10).toFixed(1);
@ -78,7 +78,7 @@ function populateHuesInfo(version, huesWin, defaults) {
let info = document.createElement("div"); let info = document.createElement("div");
info.className = "hues-ref"; info.className = "hues-ref";
let huesName = defaults.huesName.replace("%VERSION%", version); let huesName = settings.huesName.replace("%VERSION%", version);
let about = document.createElement("div"); let about = document.createElement("div");
about.className = "hues-about"; about.className = "hues-about";
about.innerHTML = "<h1>" + huesName + "</h1>" + about.innerHTML = "<h1>" + huesName + "</h1>" +

@ -30,6 +30,8 @@ const defaultSettings = {
// Location relative to root - where do the audio/zip workers live // Location relative to root - where do the audio/zip workers live
// This is required because Web Workers need an absolute path // This is required because Web Workers need an absolute path
workersPath : "lib/workers/", workersPath : "lib/workers/",
// List of respacks to load
respacks : [],
// ONLY USED FOR QUERY STRINGS this will be prepended to any respacks // ONLY USED FOR QUERY STRINGS this will be prepended to any respacks
// passed in as a ?packs=query // passed in as a ?packs=query
respackPath : "respacks/", respackPath : "respacks/",
@ -43,6 +45,8 @@ const defaultSettings = {
firstSong: null, firstSong: null,
// If set, will attempt to set the named image first // If set, will attempt to set the named image first
firstImage: null, firstImage: null,
// set to false to never change images
fullAuto: true,
// If set, will disable the remote resources menu. For custom pages. // If set, will disable the remote resources menu. For custom pages.
disableRemoteResources: false, disableRemoteResources: false,
// You will rarely want to change this. Enables/disables the Hues Window. // You will rarely want to change this. Enables/disables the Hues Window.
@ -83,27 +87,6 @@ const defaultSettings = {
skipPreloader: "off" skipPreloader: "off"
}; };
// Don't get saved to localStorage
const ephemeralSettings = [
"load",
"autoplay",
"overwriteLocal",
"respacks",
"respackPath",
"firstSong",
"firstImage",
"disableRemoteResources",
"preloadPrefix",
"preloadBase",
"preloadMax",
"enableWindow",
"firstWindow",
"workersPath",
"huesName",
"root",
"disableKeyboard"
];
// To dynamically build the UI like the cool guy I am // To dynamically build the UI like the cool guy I am
const settingsCategories = { const settingsCategories = {
"Functionality" : [ "Functionality" : [
@ -173,16 +156,16 @@ const settingsOptions = {
options : ["off", "loop", "time", options : ["off", "loop", "time",
{type:"varText", text:function() { {type:"varText", text:function() {
// only display if autosong is on // only display if autosong is on
return localStorage["autoSong"] == "off" ? "" : "after"; return this.autoSong == "off" ? "" : "after";
}}, }},
{type:"input", variable:"autoSongDelay", inputType:"int", {type:"input", variable:"autoSongDelay", inputType:"int",
visiblity:function() { visiblity:function() {
return localStorage["autoSong"] != "off"; return this.autoSong != "off";
} }
}, },
{type:"varText", text:function() { {type:"varText", text:function() {
let ret = ""; let ret = "";
switch(localStorage["autoSong"]) { switch(this.autoSong) {
case "loop": case "loop":
ret = "loop"; ret = "loop";
break; break;
@ -194,7 +177,7 @@ const settingsOptions = {
default: default:
return ""; return "";
} }
if(localStorage["autoSongDelay"] > 1) { if(this.autoSongDelay > 1) {
ret += "s"; ret += "s";
} }
return ret; return ret;
@ -233,48 +216,48 @@ class HuesSettings {
updated : [] updated : []
}; };
let settingsVersion = "1";
if(localStorage.settingsVersion != settingsVersion) {
localStorage.clear();
localStorage.settingsVersion = settingsVersion;
}
this.hasUI = false; this.hasUI = false;
this.settingCheckboxes = {}; this.settingCheckboxes = {};
this.textCallbacks = []; this.textCallbacks = [];
this.visCallbacks = []; this.visCallbacks = [];
this.ephemerals = {};
for(let attr in defaultSettings) { for(let attr in defaultSettings) {
if(defaultSettings.hasOwnProperty(attr)) { if(!defaultSettings.hasOwnProperty(attr)) {
if(defaults[attr] === undefined) { continue;
defaults[attr] = defaultSettings[attr]; }
} Object.defineProperty(this, attr, {
// don't write to local if it's a temp settings set: this.makeSetter(attr), get: this.makeGetter(attr)
if(ephemeralSettings.indexOf(attr) != -1) { });
continue;
} if(defaults[attr] !== undefined) {
if(defaults.overwriteLocal) { if(defaults.overwriteLocal) {
localStorage[attr] = defaults[attr]; this[attr] = defaults[attr];
} } else {
// populate defaults, ignoring current this.ephemerals[attr] = defaults[attr];
if(localStorage[attr] === undefined) { }
localStorage[attr] = defaults[attr]; }
}
}
} }
this.defaults = defaults;
// Override with our query string
let querySettings = this.getQuerySettings(); let querySettings = this.getQuerySettings();
this.defaults.respacks = this.defaults.respacks.concat(querySettings.respacks);
for(let attr in querySettings) { for(let attr in defaultSettings) {
if(querySettings.hasOwnProperty(attr) && attr != "respacks") { // query string overrides, finally
this.defaults[attr] = querySettings[attr]; if(querySettings[attr] !== undefined && attr != 'respacks') {
this.ephemerals[attr] = querySettings[attr];
if(ephemeralSettings.indexOf(attr) == -1) { }
// TODO: Everything that checks localStorage for settings should
// change to get() to preserve local changes
localStorage[attr] = querySettings[attr];
}
}
} }
this.respacks = this.respacks.concat(querySettings.respacks);
} }
getQuerySettings() { getQuerySettings() {
@ -287,12 +270,16 @@ class HuesSettings {
if(pair[0] == "packs" || pair[0] == "respacks"){ if(pair[0] == "packs" || pair[0] == "respacks"){
let packs = pair[1].split(","); let packs = pair[1].split(",");
for(let j = 0; j < packs.length; j++) { for(let j = 0; j < packs.length; j++) {
results.respacks.push(this.defaults.respackPath + packs[j]); results.respacks.push(this.respackPath + packs[j]);
} }
} else if(pair[0] == "song") { // alias for firstSong } else if(pair[0] == "song") { // alias for firstSong
results.firstSong = pair[1]; results.firstSong = pair[1];
} else { } else {
results[pair[0]] = pair[1]; let val = pair[1];
// since we can set ephemeral variables this way
if(val === "true" || val === "false")
val = val == "true";
results[pair[0]] = val;
} }
} }
return results; return results;
@ -309,14 +296,14 @@ class HuesSettings {
this.value = ""; this.value = "";
return; return;
} }
localStorage[variable] = this.value; self[variable] = this.value;
self.updateConditionals(); self.updateConditionals();
self.callEventListeners("updated"); self.callEventListeners("updated");
}; };
// To order things nicely // To order things nicely
for(let cat in settingsCategories) { for(let cat in settingsCategories) {
if(settingsCategories.hasOwnProperty(cat)) { if(settingsCategories.hasOwnProperty(cat)) {
let catContainer = document.createElement("div"); let catContainer = document.createElement("div");
catContainer.textContent = cat; catContainer.textContent = cat;
catContainer.className = "settings-category"; catContainer.className = "settings-category";
@ -347,11 +334,11 @@ class HuesSettings {
} }
checkbox.name = setName + "-" + unique; checkbox.name = setName + "-" + unique;
checkbox.id = id + unique; checkbox.id = id + unique;
if(localStorage[setName] == option) { if(this[setName] == option) {
checkbox.checked = true; checkbox.checked = true;
} }
checkbox.onclick = function(self) { checkbox.onclick = function(self) {
self.set(setName, this.value); self[setName] = this.value;
}.bind(checkbox, this); }.bind(checkbox, this);
buttonContainer.appendChild(checkbox); buttonContainer.appendChild(checkbox);
// So we can style this nicely // So we can style this nicely
@ -363,14 +350,14 @@ class HuesSettings {
} else { // special option } else { // special option
if(option.type == "varText") { if(option.type == "varText") {
let text = document.createElement("span"); let text = document.createElement("span");
text.textContent = option.text(); text.textContent = option.text.bind(this)();
buttonContainer.appendChild(text); buttonContainer.appendChild(text);
this.textCallbacks.push({func:option.text, element:text}); this.textCallbacks.push({func:option.text.bind(this), element:text});
} else if(option.type == "input") { } else if(option.type == "input") {
let input = document.createElement("input"); let input = document.createElement("input");
input.setAttribute("type", "text"); input.setAttribute("type", "text");
input.className = "settings-input"; input.className = "settings-input";
input.value = localStorage[option.variable]; input.value = this[option.variable];
// TODO: support more than just positive ints when the need arises // TODO: support more than just positive ints when the need arises
if(option.inputType == "int") { if(option.inputType == "int") {
input.oninput = intValidator.bind(input, this, option.variable); input.oninput = intValidator.bind(input, this, option.variable);
@ -378,8 +365,8 @@ class HuesSettings {
input.autofocus = false; input.autofocus = false;
buttonContainer.appendChild(input); buttonContainer.appendChild(input);
if(option.visiblity) { if(option.visiblity) {
this.visCallbacks.push({func:option.visiblity, element:input}); this.visCallbacks.push({func:option.visiblity.bind(this), element:input});
input.style.visibility = option.visiblity() ? "visible" : "hidden"; input.style.visibility = option.visiblity.bind(this)() ? "visible" : "hidden";
} }
} }
} }
@ -395,35 +382,48 @@ class HuesSettings {
this.hasUI = true; this.hasUI = true;
} }
get(setting) { makeGetter(setting) {
if(this.defaults.hasOwnProperty(setting)) { return () => {
if(ephemeralSettings.indexOf(setting) != -1) { if(defaultSettings.hasOwnProperty(setting)) {
return this.defaults[setting]; if(this.ephemerals[setting] !== undefined)
return this.ephemerals[setting];
else if(localStorage[setting] !== undefined)
return localStorage[setting];
else
return defaultSettings[setting];
} else { } else {
return localStorage[setting]; console.log("WARNING: Attempted to fetch invalid setting:", setting);
return null;
} }
} else { };
console.log("WARNING: Attempted to fetch invalid setting:", setting);
return null;
}
} }
// Set a named index to its named value, returns false if name doesn't exist // Set a named index to its named value, returns false if name doesn't exist
set(setting, value) { makeSetter(setting) {
value = value.toLowerCase(); return value => {
let opt = settingsOptions[setting]; if(this.isEphemeral(setting)) {
if(!opt || opt.options.indexOf(value) == -1) { this.ephemerals[setting] = value;
console.log(value, "is not a valid value for", setting); } else {
return false; let opt = settingsOptions[setting];
} if(!opt || opt.options.indexOf(value) == -1) {
// for updating the UI selection console.log(value, "is not a valid value for", setting);
try { return false;
this.settingCheckboxes[setting + "-" + value].checked = true; }
} catch(e) {} // for updating the UI selection
localStorage[setting] = value; try {
this.updateConditionals(); this.settingCheckboxes[setting + "-" + value].checked = true;
this.callEventListeners("updated"); } catch(e) {}
return true; localStorage[setting] = value;
this.ephemerals[setting] = undefined;
}
this.updateConditionals();
this.callEventListeners("updated");
return true;
};
}
isEphemeral(setting) {
return settingsOptions[setting] === undefined;
} }
updateConditionals() { updateConditionals() {
@ -438,19 +438,6 @@ class HuesSettings {
} }
} }
// Note: This is not defaults as per defaultSettings, but those merged with
// the defaults given in the initialiser
setDefaults() {
for(let attr in this.defaults) {
if(this.defaults.hasOwnProperty(attr)) {
if(ephemeralSettings.indexOf(attr) != -1) {
continue;
}
localStorage[attr] = this.defaults[attr];
}
}
}
callEventListeners(ev) { callEventListeners(ev) {
let args = Array.prototype.slice.call(arguments, 1); let args = Array.prototype.slice.call(arguments, 1);
this.eventListeners[ev].forEach(function(callback) { this.eventListeners[ev].forEach(function(callback) {

@ -23,7 +23,7 @@
"use strict"; "use strict";
class HuesWindow { class HuesWindow {
constructor(root, defaults) { constructor(root, settings) {
this.eventListeners = { this.eventListeners = {
/* callback windowshown(shown) /* callback windowshown(shown)
* *
@ -38,7 +38,7 @@ class HuesWindow {
tabselected : [] tabselected : []
}; };
this.hasUI = defaults.enableWindow; this.hasUI = settings.enableWindow;
if(!this.hasUI) if(!this.hasUI)
return; return;
@ -69,7 +69,7 @@ class HuesWindow {
this.tabNames = []; this.tabNames = [];
if(defaults.showWindow) { if(settings.showWindow) {
this.show(); this.show();
} else { } else {
this.hide(); this.hide();

@ -82,7 +82,7 @@ class Resources {
this.remotes = null; this.remotes = null;
this.fileInput = null; this.fileInput = null;
this.fileParseQueue = []; this.fileParseQueue = [];
if(core.settings.defaults.enableWindow) { if(core.settings.enableWindow) {
this.initUI(); this.initUI();
huesWin.addTab("RESOURCES", this.root); huesWin.addTab("RESOURCES", this.root);
} }
@ -323,7 +323,7 @@ class Resources {
// so we don't use it out of scope in the next if // so we don't use it out of scope in the next if
let remoteHeader = null; let remoteHeader = null;
let remoteList = null; let remoteList = null;
if(!this.core.settings.defaults.disableRemoteResources) { if(!this.core.settings.disableRemoteResources) {
remoteHeader = document.createElement("div"); remoteHeader = document.createElement("div");
remoteHeader.textContent = "Remote respacks"; remoteHeader.textContent = "Remote respacks";
remoteHeader.className = "respacks__header"; remoteHeader.className = "respacks__header";
@ -388,7 +388,7 @@ class Resources {
packsContainer.appendChild(packHeader); packsContainer.appendChild(packHeader);
packsContainer.appendChild(packList); packsContainer.appendChild(packList);
if(!this.core.settings.defaults.disableRemoteResources) { if(!this.core.settings.disableRemoteResources) {
packsContainer.appendChild(remoteHeader); packsContainer.appendChild(remoteHeader);
packsContainer.appendChild(remoteList); packsContainer.appendChild(remoteList);
} }

@ -427,7 +427,7 @@ class SoundManager {
} }
createWorker() { createWorker() {
return new Worker(this.core.settings.defaults.workersPath + 'audio-worker.js'); return new Worker(this.core.settings.workersPath + 'audio-worker.js');
} }
initVisualiser(bars) { initVisualiser(bars) {

Loading…
Cancel
Save