cynic
/
0x40-web
mirror of https://github.com/kurisufriend/0x40-web
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Use 'let' throughout the codebase

Browse Source
master
William Toohey 10 years ago
parent d7b97ea9ce
commit 86ca1330da
9 changed files with 473 additions and 478 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 64
      src/js/HuesCanvas.js
  2. 98
      src/js/HuesCore.js
  3. 240
      src/js/HuesEditor.js
  4. 22
      src/js/HuesInfo.js
  5. 48
      src/js/HuesSettings.js
  6. 134
      src/js/HuesUI.js
  7. 174
      src/js/ResourceManager.js
  8. 93
      src/js/ResourcePack.js
  9. 78
      src/js/SoundManager.js

64
src/js/HuesCanvas.js
Unescape View File

@ -108,7 +108,7 @@ HuesCanvas.prototype.settingsUpdated = function() {
HuesCanvas.prototype.resize = function() { HuesCanvas.prototype.resize = function() {
// height is constant 720px, we expand width to suit // height is constant 720px, we expand width to suit
var ratio = window.innerWidth / window.innerHeight; let ratio = window.innerWidth / window.innerHeight;
this.canvas.width = Math.ceil(720 * ratio); this.canvas.width = Math.ceil(720 * ratio);
this.offCanvas.height = this.canvas.height; this.offCanvas.height = this.canvas.height;
this.offCanvas.width = this.canvas.width; this.offCanvas.width = this.canvas.width;
@ -118,11 +118,11 @@ HuesCanvas.prototype.resize = function() {
}; };
HuesCanvas.prototype.redraw = function() { HuesCanvas.prototype.redraw = function() {
var offset; // for centering/right/left align let offset; // for centering/right/left align
var bOpacity; let bOpacity;
var width = this.canvas.width; let width = this.canvas.width;
var cTime = this.audio.currentTime; let cTime = this.audio.currentTime;
// white BG for the hard light filter // white BG for the hard light filter
this.context.globalAlpha = 1; this.context.globalAlpha = 1;
this.context.globalCompositeOperation = "source-over"; this.context.globalCompositeOperation = "source-over";
@ -141,7 +141,7 @@ HuesCanvas.prototype.redraw = function() {
} }
if(this.image && (this.image.bitmap || this.image.bitmaps)) { if(this.image && (this.image.bitmap || this.image.bitmaps)) {
var bitmap = this.image.animated ? let bitmap = this.image.animated ?
this.image.bitmaps[this.animFrame] : this.image.bitmap; this.image.bitmaps[this.animFrame] : this.image.bitmap;
if(this.smartAlign) { if(this.smartAlign) {
switch(this.image.align) { switch(this.image.align) {
@ -191,9 +191,9 @@ HuesCanvas.prototype.redraw = function() {
// x blur moves inwards from the corners, y comes out // x blur moves inwards from the corners, y comes out
// So the base colour is inverted for y, normal for x // So the base colour is inverted for y, normal for x
// Thus if the y start is more recent, we invert // Thus if the y start is more recent, we invert
var baseInvert = this.trippyStart[1] > this.trippyStart[0]; let baseInvert = this.trippyStart[1] > this.trippyStart[0];
var invertC = this.intToHex(0xFFFFFF ^ this.colour); let invertC = this.intToHex(0xFFFFFF ^ this.colour);
var normalC = this.intToHex(this.colour); let normalC = this.intToHex(this.colour);
this.offContext.fillStyle = baseInvert ? invertC : normalC; this.offContext.fillStyle = baseInvert ? invertC : normalC;
this.offContext.fillRect(0,0,width,720); this.offContext.fillRect(0,0,width,720);
@ -202,7 +202,7 @@ HuesCanvas.prototype.redraw = function() {
return b - a; return b - a;
}); });
var invert = !baseInvert; let invert = !baseInvert;
for(let i = 0; i < 2; i++) { for(let i = 0; i < 2; i++) {
if(this.trippyRadii[i] === 0) { if(this.trippyRadii[i] === 0) {
continue; continue;
@ -242,7 +242,7 @@ HuesCanvas.prototype.intToHex = function(num) {
HuesCanvas.prototype.animationLoop = function() { HuesCanvas.prototype.animationLoop = function() {
if (this.colourFade) { if (this.colourFade) {
let delta = this.audio.currentTime - this.colourFadeStart; let delta = this.audio.currentTime - this.colourFadeStart;
var fadeVal = delta / this.colourFadeLength; let fadeVal = delta / this.colourFadeLength;
if (fadeVal >= 1) { if (fadeVal >= 1) {
this.stopFade(); this.stopFade();
this.colour = this.newColour; this.colour = this.newColour;
@ -256,7 +256,7 @@ HuesCanvas.prototype.animationLoop = function() {
} }
if(this.image && this.image.animated){ if(this.image && this.image.animated){
if(this.image.beatsPerAnim && this.core.currentSong && this.core.currentSong.charsPerBeat) { if(this.image.beatsPerAnim && this.core.currentSong && this.core.currentSong.charsPerBeat) {
var a = this.animFrame; let a = this.animFrame;
this.syncAnim(); this.syncAnim();
if(this.animFrame != a) { if(this.animFrame != a) {
this.needsRedraw = true; this.needsRedraw = true;
@ -277,7 +277,7 @@ HuesCanvas.prototype.animationLoop = function() {
this.blurDistance = this.blurAmount * Math.exp(-this.blurDecay * delta); this.blurDistance = this.blurAmount * Math.exp(-this.blurDecay * delta);
// Update UI // Update UI
var dist = this.blurDistance / this.blurAmount; let dist = this.blurDistance / this.blurAmount;
if(this.xBlur) if(this.xBlur)
this.core.blurUpdated(dist, 0); this.core.blurUpdated(dist, 0);
else else
@ -343,20 +343,20 @@ HuesCanvas.prototype.beat = function() {
}; };
HuesCanvas.prototype.syncAnim = function() { HuesCanvas.prototype.syncAnim = function() {
var song = this.core.currentSong; let song = this.core.currentSong;
if(!song) { // fallback to default if(!song) { // fallback to default
return; return;
} }
var index = this.core.beatIndex; let index = this.core.beatIndex;
// When animation has more frames than song has beats, or part thereof // When animation has more frames than song has beats, or part thereof
if(this.lastBeat && this.core.getBeatLength()) { if(this.lastBeat && this.core.getBeatLength()) {
var interp = (this.audio.currentTime - this.lastBeat) / this.core.getBeatLength(); let interp = (this.audio.currentTime - this.lastBeat) / this.core.getBeatLength();
index += Math.min(interp, 1); index += Math.min(interp, 1);
} }
// This loops A-OK because the core's beatIndex never rolls over for a new loop // This loops A-OK because the core's beatIndex never rolls over for a new loop
var beatLoc = (index / song.charsPerBeat) % this.image.beatsPerAnim; let beatLoc = (index / song.charsPerBeat) % this.image.beatsPerAnim;
var aLen = this.image.bitmaps.length; let aLen = this.image.bitmaps.length;
this.animFrame = Math.floor(aLen * (beatLoc / this.image.beatsPerAnim)); this.animFrame = Math.floor(aLen * (beatLoc / this.image.beatsPerAnim));
if(this.image.syncOffset) { if(this.image.syncOffset) {
this.animFrame += this.image.syncOffset; this.animFrame += this.image.syncOffset;
@ -426,15 +426,15 @@ HuesCanvas.prototype.stopFade = function() {
HuesCanvas.prototype.mixColours = function(percent) { HuesCanvas.prototype.mixColours = function(percent) {
percent = Math.min(1, percent); percent = Math.min(1, percent);
var oldR = this.oldColour >> 16 & 0xFF; let oldR = this.oldColour >> 16 & 0xFF;
var oldG = this.oldColour >> 8 & 0xFF; let oldG = this.oldColour >> 8 & 0xFF;
var oldB = this.oldColour & 0xFF; let oldB = this.oldColour & 0xFF;
var newR = this.newColour >> 16 & 0xFF; let newR = this.newColour >> 16 & 0xFF;
var newG = this.newColour >> 8 & 0xFF; let newG = this.newColour >> 8 & 0xFF;
var newB = this.newColour & 0xFF; let newB = this.newColour & 0xFF;
var mixR = oldR * (1 - percent) + newR * percent; let mixR = oldR * (1 - percent) + newR * percent;
var mixG = oldG * (1 - percent) + newG * percent; let mixG = oldG * (1 - percent) + newG * percent;
var mixB = oldB * (1 - percent) + newB * percent; let mixB = oldB * (1 - percent) + newB * percent;
this.colour = mixR << 16 | mixG << 8 | mixB; this.colour = mixR << 16 | mixG << 8 | mixB;
}; };
@ -486,8 +486,8 @@ HuesCanvas.prototype.setAnimating = function(anim) {
HuesCanvas.prototype.startSnow = function() { HuesCanvas.prototype.startSnow = function() {
this.snowing = true; this.snowing = true;
this.snowCanvas.style.display = "block"; this.snowCanvas.style.display = "block";
var height = this.canvas.height; let height = this.canvas.height;
var width = this.canvas.width; let width = this.canvas.width;
this.snowAngle = 0; this.snowAngle = 0;
this.snowflakes = []; this.snowflakes = [];
for(let i = 0; i < this.maxSnow; i++) { for(let i = 0; i < this.maxSnow; i++) {
@ -507,9 +507,9 @@ HuesCanvas.prototype.stopSnow = function() {
}; };
HuesCanvas.prototype.drawSnow = function() { HuesCanvas.prototype.drawSnow = function() {
var width = this.snowCanvas.width; let width = this.snowCanvas.width;
var height = this.snowCanvas.height; let height = this.snowCanvas.height;
var delta = this.lastSnow - this.audio.currentTime; let delta = this.lastSnow - this.audio.currentTime;
this.snowContext.clearRect(0, 0, width, height); this.snowContext.clearRect(0, 0, width, height);
this.snowContext.fillStyle = "rgba(255, 255, 255, 0.8)"; this.snowContext.fillStyle = "rgba(255, 255, 255, 0.8)";

98
src/js/HuesCore.js
Unescape View File

@ -124,7 +124,7 @@ function HuesCore(defaults) {
return false; return false;
}; };
var versionString = "v" + (parseInt(this.version)/10).toFixed(1); let versionString = "v" + (parseInt(this.version)/10).toFixed(1);
console.log("0x40 Hues " + versionString + " - start your engines!"); console.log("0x40 Hues " + versionString + " - start your engines!");
populateHuesInfo(this.version); populateHuesInfo(this.version);
this.colours = this.oldColours; this.colours = this.oldColours;
@ -157,9 +157,9 @@ function HuesCore(defaults) {
if(defaults.load) { if(defaults.load) {
return this.resourceManager.addAll(defaults.respacks, function(progress) { return this.resourceManager.addAll(defaults.respacks, function(progress) {
var prog = document.getElementById("preMain"); let prog = document.getElementById("preMain");
var scale = Math.floor(progress * defaults.preloadMax); let scale = Math.floor(progress * defaults.preloadMax);
var padding = defaults.preloadMax.toString(defaults.preloadBase).length; let padding = defaults.preloadMax.toString(defaults.preloadBase).length;
prog.textContent = defaults.preloadPrefix + (Array(padding).join("0")+scale.toString(defaults.preloadBase)).slice(-padding); prog.textContent = defaults.preloadPrefix + (Array(padding).join("0")+scale.toString(defaults.preloadBase)).slice(-padding);
}); });
} else { } else {
@ -198,13 +198,13 @@ function HuesCore(defaults) {
e.target.contentEditable === "true") { e.target.contentEditable === "true") {
return true; return true;
} }
var key = e.keyCode || e.which; let key = e.keyCode || e.which;
return this.keyHandler(key); return this.keyHandler(key);
}; };
} }
HuesCore.prototype.callEventListeners = function(ev) { HuesCore.prototype.callEventListeners = function(ev) {
var 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) {
callback.apply(null, args); callback.apply(null, args);
}); });
@ -239,25 +239,25 @@ HuesCore.prototype.updateVisualiser = function() {
return; return;
} }
var logArrays = this.soundManager.getVisualiserData(); let logArrays = this.soundManager.getVisualiserData();
if(!logArrays) { if(!logArrays) {
return; return;
} }
this.vCtx.clearRect(0, 0, this.vCtx.canvas.width, this.vCtx.canvas.height); this.vCtx.clearRect(0, 0, this.vCtx.canvas.width, this.vCtx.canvas.height);
var gradient=this.vCtx.createLinearGradient(0,64,0,0); let gradient=this.vCtx.createLinearGradient(0,64,0,0);
gradient.addColorStop(1,"rgba(255,255,255,0.6)"); gradient.addColorStop(1,"rgba(255,255,255,0.6)");
gradient.addColorStop(0,"rgba(20,20,20,0.6)"); gradient.addColorStop(0,"rgba(20,20,20,0.6)");
this.vCtx.fillStyle = gradient; this.vCtx.fillStyle = gradient;
var barWidth = 2; let barWidth = 2;
var barHeight; let barHeight;
var x = 0; let x = 0;
for(var a = 0; a < logArrays.length; a++) { for(let a = 0; a < logArrays.length; a++) {
var vals = logArrays[a]; let vals = logArrays[a];
for(var i = 0; i < vals.length; i++) { for(let i = 0; i < vals.length; i++) {
var index = 0; let index = 0;
if(logArrays.length == 2 && a === 0) { if(logArrays.length == 2 && a === 0) {
index = vals.length - i - 1; index = vals.length - i - 1;
} else { } else {
@ -279,7 +279,7 @@ HuesCore.prototype.animationLoop = function() {
return; return;
} }
this.updateVisualiser(); this.updateVisualiser();
var now = this.soundManager.currentTime(); let now = this.soundManager.currentTime();
if(now < 0) { if(now < 0) {
this.callEventListeners("time", 0); this.callEventListeners("time", 0);
} else { } else {
@ -288,9 +288,9 @@ HuesCore.prototype.animationLoop = function() {
this.currentSong.buildupPlayed = true; this.currentSong.buildupPlayed = true;
} }
} }
for(var beatTime = this.beatIndex * this.getBeatLength(); beatTime < now; for(let beatTime = this.beatIndex * this.getBeatLength(); beatTime < now;
beatTime = ++this.beatIndex * this.getBeatLength()) { beatTime = ++this.beatIndex * this.getBeatLength()) {
var beat = this.getBeat(this.beatIndex); let beat = this.getBeat(this.beatIndex);
this.beater(beat); this.beater(beat);
} }
this.callEventListeners("frame"); this.callEventListeners("frame");
@ -300,9 +300,9 @@ HuesCore.prototype.recalcBeatIndex = function() {
this.beatIndex = Math.floor(this.soundManager.currentTime() / this.getBeatLength()); this.beatIndex = Math.floor(this.soundManager.currentTime() / this.getBeatLength());
// We should sync up to how many inverts there are // We should sync up to how many inverts there are
var build = this.currentSong.buildupRhythm; let build = this.currentSong.buildupRhythm;
var rhythm = this.currentSong.rhythm; let rhythm = this.currentSong.rhythm;
var mapSoFar; let mapSoFar;
if(this.beatIndex < 0) { if(this.beatIndex < 0) {
mapSoFar = build.slice(0, this.beatIndex + build.length); mapSoFar = build.slice(0, this.beatIndex + build.length);
} else { } else {
@ -314,7 +314,7 @@ HuesCore.prototype.recalcBeatIndex = function() {
mapSoFar = build + rhythm.slice(0, this.beatIndex); mapSoFar = build + rhythm.slice(0, this.beatIndex);
} }
// If there's an odd amount of inverts thus far, invert our display // If there's an odd amount of inverts thus far, invert our display
var invertCount = (mapSoFar.match(/i|I/g)||[]).length; let invertCount = (mapSoFar.match(/i|I/g)||[]).length;
this.setInvert(invertCount % 2); this.setInvert(invertCount % 2);
}; };
@ -329,7 +329,7 @@ HuesCore.prototype.getBeatIndex = function() {
}; };
HuesCore.prototype.getSafeBeatIndex = function() { HuesCore.prototype.getSafeBeatIndex = function() {
var index = this.getBeatIndex(); let index = this.getBeatIndex();
if(index < 0) { if(index < 0) {
return 0; return 0;
} else { } else {
@ -343,19 +343,19 @@ HuesCore.prototype.blurUpdated = function(x, y) {
HuesCore.prototype.nextSong = function() { HuesCore.prototype.nextSong = function() {
this.lastSongArray = []; this.lastSongArray = [];
var index = (this.songIndex + 1) % this.resourceManager.enabledSongs.length; let index = (this.songIndex + 1) % this.resourceManager.enabledSongs.length;
this.setSong(index); this.setSong(index);
}; };
HuesCore.prototype.previousSong = function() { HuesCore.prototype.previousSong = function() {
this.lastSongArray = []; this.lastSongArray = [];
var index = ((this.songIndex - 1) + this.resourceManager.enabledSongs.length) % this.resourceManager.enabledSongs.length; let index = ((this.songIndex - 1) + this.resourceManager.enabledSongs.length) % this.resourceManager.enabledSongs.length;
this.setSong(index); this.setSong(index);
}; };
HuesCore.prototype.setSongByName = function(name) { HuesCore.prototype.setSongByName = function(name) {
var songs = this.resourceManager.enabledSongs; let songs = this.resourceManager.enabledSongs;
for(var i = 0; i < songs.length; i++) { for(let i = 0; i < songs.length; i++) {
if(songs[i].title == name) { if(songs[i].title == name) {
return this.setSong(i); return this.setSong(i);
} }
@ -365,7 +365,7 @@ HuesCore.prototype.setSongByName = function(name) {
/* To set songs via reference instead of index - used in HuesEditor */ /* To set songs via reference instead of index - used in HuesEditor */
HuesCore.prototype.setSongOject = function(song) { HuesCore.prototype.setSongOject = function(song) {
for(var i = 0; i < this.resourceManager.enabledSongs.length; i++) { for(let i = 0; i < this.resourceManager.enabledSongs.length; i++) {
if(this.resourceManager.enabledSongs[i] === song) { if(this.resourceManager.enabledSongs[i] === song) {
return this.setSong(i); return this.setSong(i);
} }
@ -438,7 +438,7 @@ HuesCore.prototype.fillBuildup = function() {
// Do nothing // Do nothing
} else { } else {
console.log("Flash behaviour - filling buildup"); console.log("Flash behaviour - filling buildup");
var buildBeats = Math.floor(this.soundManager.buildLength / this.loopLength); let buildBeats = Math.floor(this.soundManager.buildLength / this.loopLength);
if(buildBeats < 1) { if(buildBeats < 1) {
buildBeats = 1; buildBeats = 1;
} }
@ -455,14 +455,14 @@ HuesCore.prototype.fillBuildup = function() {
}; };
HuesCore.prototype.randomSong = function() { HuesCore.prototype.randomSong = function() {
var songCount = this.resourceManager.enabledSongs.length; let songCount = this.resourceManager.enabledSongs.length;
var index=Math.floor((Math.random() * songCount)); let index=Math.floor((Math.random() * songCount));
if (songCount > 1 && (index == this.songIndex || this.lastSongArray.indexOf(index) != -1)) { if (songCount > 1 && (index == this.songIndex || this.lastSongArray.indexOf(index) != -1)) {
this.randomSong(); this.randomSong();
} else { } else {
console.log("Randoming a song!"); console.log("Randoming a song!");
this.setSong(index); this.setSong(index);
var noRepeat = Math.min(5, Math.floor(songCount / 2)); let noRepeat = Math.min(5, Math.floor(songCount / 2));
while (this.lastSongArray.length > noRepeat && noRepeat >= 0) { while (this.lastSongArray.length > noRepeat && noRepeat >= 0) {
this.lastSongArray.shift(); this.lastSongArray.shift();
} }
@ -498,7 +498,7 @@ HuesCore.prototype.onLoop = function() {
}; };
HuesCore.prototype.doAutoSong = function() { HuesCore.prototype.doAutoSong = function() {
var func = null; let func = null;
if(localStorage["autoSongShuffle"] == "on") { if(localStorage["autoSongShuffle"] == "on") {
func = this.randomSong; func = this.randomSong;
} else { } else {
@ -530,20 +530,20 @@ HuesCore.prototype.resetAudio = function() {
HuesCore.prototype.randomImage = function() { HuesCore.prototype.randomImage = function() {
if(localStorage["shuffleImages"] == "on") { if(localStorage["shuffleImages"] == "on") {
var len = this.resourceManager.enabledImages.length; let len = this.resourceManager.enabledImages.length;
var 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) {
this.randomImage(); this.randomImage();
} else { } else {
this.setImage(index); this.setImage(index);
this.lastImageArray.push(index); this.lastImageArray.push(index);
var cull = Math.min(20, Math.floor((len / 2))); let cull = Math.min(20, Math.floor((len / 2)));
while (this.lastImageArray.length > cull && cull >= 0) { while (this.lastImageArray.length > cull && cull >= 0) {
this.lastImageArray.shift(); this.lastImageArray.shift();
} }
} }
} else { // jk, not actually random } else { // jk, not actually random
var img=(this.imageIndex + 1) % this.resourceManager.enabledImages.length; let img=(this.imageIndex + 1) % this.resourceManager.enabledImages.length;
this.setImage(img); this.setImage(img);
} }
}; };
@ -551,7 +551,7 @@ HuesCore.prototype.randomImage = function() {
HuesCore.prototype.setImage = function(index) { HuesCore.prototype.setImage = function(index) {
// If there are no images, this corrects NaN to 0 // If there are no images, this corrects NaN to 0
this.imageIndex = index ? index : 0; this.imageIndex = index ? index : 0;
var img=this.resourceManager.enabledImages[this.imageIndex]; let img=this.resourceManager.enabledImages[this.imageIndex];
if (img == this.currentImage && img !== null) { if (img == this.currentImage && img !== null) {
return; return;
} }
@ -566,8 +566,8 @@ HuesCore.prototype.setImage = function(index) {
}; };
HuesCore.prototype.setImageByName = function(name) { HuesCore.prototype.setImageByName = function(name) {
var images = this.resourceManager.enabledImages; let images = this.resourceManager.enabledImages;
for(var i = 0; i < images.length; i++) { for(let i = 0; i < images.length; i++) {
if(images[i].name == name || images[i].fullname == name) { if(images[i].name == name || images[i].fullname == name) {
this.setImage(i); this.setImage(i);
return; return;
@ -578,20 +578,20 @@ HuesCore.prototype.setImageByName = function(name) {
HuesCore.prototype.nextImage = function() { HuesCore.prototype.nextImage = function() {
this.setIsFullAuto(false); this.setIsFullAuto(false);
var img=(this.imageIndex + 1) % this.resourceManager.enabledImages.length; let img=(this.imageIndex + 1) % this.resourceManager.enabledImages.length;
this.setImage(img); this.setImage(img);
this.lastImageArray = []; this.lastImageArray = [];
}; };
HuesCore.prototype.previousImage = function() { HuesCore.prototype.previousImage = function() {
this.setIsFullAuto(false); this.setIsFullAuto(false);
var img=((this.imageIndex - 1) + this.resourceManager.enabledImages.length) % this.resourceManager.enabledImages.length; let img=((this.imageIndex - 1) + this.resourceManager.enabledImages.length) % this.resourceManager.enabledImages.length;
this.setImage(img); this.setImage(img);
this.lastImageArray = []; this.lastImageArray = [];
}; };
HuesCore.prototype.randomColourIndex = function() { HuesCore.prototype.randomColourIndex = function() {
var index=Math.floor((Math.random() * 64)); let index=Math.floor((Math.random() * 64));
if (index == this.colourIndex) { if (index == this.colourIndex) {
return this.randomColourIndex(); return this.randomColourIndex();
} }
@ -599,13 +599,13 @@ HuesCore.prototype.randomColourIndex = function() {
}; };
HuesCore.prototype.randomColour = function(isFade) { HuesCore.prototype.randomColour = function(isFade) {
var index=this.randomColourIndex(); let index=this.randomColourIndex();
this.setColour(index, isFade); this.setColour(index, isFade);
}; };
HuesCore.prototype.setColour = function(index, isFade) { HuesCore.prototype.setColour = function(index, isFade) {
this.colourIndex = index; this.colourIndex = index;
var colour = this.colours[this.colourIndex]; let colour = this.colours[this.colourIndex];
this.callEventListeners("newcolour", colour, isFade); this.callEventListeners("newcolour", colour, isFade);
}; };
@ -655,11 +655,11 @@ HuesCore.prototype.beater = function(beat) {
/* falls through */ /* falls through */
case '~': case '~':
// case: fade in build, not in rhythm. Must max out fade timer. // case: fade in build, not in rhythm. Must max out fade timer.
var maxSearch = this.currentSong.rhythm.length; let maxSearch = this.currentSong.rhythm.length;
if(this.beatIndex < 0) { if(this.beatIndex < 0) {
maxSearch -= this.beatIndex; maxSearch -= this.beatIndex;
} }
var fadeLen; let fadeLen;
for (fadeLen = 1; fadeLen <= maxSearch; fadeLen++) { for (fadeLen = 1; fadeLen <= maxSearch; fadeLen++) {
if (this.getBeat(fadeLen + this.beatIndex) != ".") { if (this.getBeat(fadeLen + this.beatIndex) != ".") {
break; break;
@ -691,8 +691,8 @@ HuesCore.prototype.beater = function(beat) {
HuesCore.prototype.getBeatString = function(length) { HuesCore.prototype.getBeatString = function(length) {
length = length ? length : 256; length = length ? length : 256;
var beatString = ""; let beatString = "";
var song = this.currentSong; let song = this.currentSong;
if (song) { if (song) {
if(this.beatIndex < 0) { if(this.beatIndex < 0) {
beatString = song.buildupRhythm.slice( beatString = song.buildupRhythm.slice(

240
src/js/HuesEditor.js
Unescape View File

@ -22,8 +22,8 @@
(function(window, document) { (function(window, document) {
"use strict"; "use strict";
var WAVE_PIXELS_PER_SECOND = 100; let WAVE_PIXELS_PER_SECOND = 100;
var WAVE_HEIGHT_PIXELS = 20; let WAVE_HEIGHT_PIXELS = 20;
function HuesEditor(core) { function HuesEditor(core) {
this.buildEditSize = 80; // pixels, including header this.buildEditSize = 80; // pixels, including header
@ -64,7 +64,7 @@ function HuesEditor(core) {
} }
HuesEditor.prototype.initUI = function() { HuesEditor.prototype.initUI = function() {
var titleButtons = document.createElement("div"); let titleButtons = document.createElement("div");
titleButtons.id = "edit-titlebuttons"; titleButtons.id = "edit-titlebuttons";
this.root.appendChild(titleButtons); this.root.appendChild(titleButtons);
this.saveBtn = this.createButton("Save XML", titleButtons, true); this.saveBtn = this.createButton("Save XML", titleButtons, true);
@ -73,7 +73,7 @@ HuesEditor.prototype.initUI = function() {
this.copyBtn.onclick = this.copyXML.bind(this); this.copyBtn.onclick = this.copyXML.bind(this);
this.undoBtn = this.createButton("Undo", titleButtons, true); this.undoBtn = this.createButton("Undo", titleButtons, true);
this.redoBtn = this.createButton("Redo", titleButtons, true); this.redoBtn = this.createButton("Redo", titleButtons, true);
var help = this.createButton("Help?", titleButtons); let help = this.createButton("Help?", titleButtons);
help.style.backgroundColor = "rgba(0,160,0,0.3)"; help.style.backgroundColor = "rgba(0,160,0,0.3)";
help.onclick = function() { help.onclick = function() {
window.open("http://0x40hues.blogspot.com/p/0x40-hues-creation-tutorial.html", '_blank'); window.open("http://0x40hues.blogspot.com/p/0x40-hues-creation-tutorial.html", '_blank');
@ -98,16 +98,16 @@ HuesEditor.prototype.initUI = function() {
HuesEditor.prototype.resize = function(noHilightCalc) { HuesEditor.prototype.resize = function(noHilightCalc) {
this.root.style.height = (window.innerHeight - 200) + "px"; this.root.style.height = (window.innerHeight - 200) + "px";
var boxHeight = this.editArea.offsetHeight; let boxHeight = this.editArea.offsetHeight;
var bHeadHeight = this.buildEdit._header.offsetHeight; let bHeadHeight = this.buildEdit._header.offsetHeight;
var lHeadHeight = this.loopEdit._header.offsetHeight; let lHeadHeight = this.loopEdit._header.offsetHeight;
var handleHeight = this.resizeHandle.offsetHeight; let handleHeight = this.resizeHandle.offsetHeight;
var minHeight = bHeadHeight; let minHeight = bHeadHeight;
var maxHeight = boxHeight - handleHeight - lHeadHeight - bHeadHeight; let maxHeight = boxHeight - handleHeight - lHeadHeight - bHeadHeight;
var buildHeight = Math.min(maxHeight, Math.max(minHeight, this.buildEditSize - handleHeight)); let buildHeight = Math.min(maxHeight, Math.max(minHeight, this.buildEditSize - handleHeight));
this.buildEdit.style.height = buildHeight + "px"; this.buildEdit.style.height = buildHeight + "px";
this.buildEdit._box.style.height = (buildHeight - bHeadHeight) + "px"; this.buildEdit._box.style.height = (buildHeight - bHeadHeight) + "px";
var loopHeight = maxHeight - buildHeight + lHeadHeight; let loopHeight = maxHeight - buildHeight + lHeadHeight;
this.loopEdit.style.height = loopHeight + "px"; this.loopEdit.style.height = loopHeight + "px";
this.loopEdit._box.style.height = (loopHeight - lHeadHeight) + "px"; this.loopEdit._box.style.height = (loopHeight - lHeadHeight) + "px";
@ -122,7 +122,7 @@ HuesEditor.prototype.resize = function(noHilightCalc) {
// Save to fix Chrome rendering and to enable right click to seek // Save to fix Chrome rendering and to enable right click to seek
// We only resize on a window resize event, not when dragging the handle // We only resize on a window resize event, not when dragging the handle
if(!noHilightCalc) { if(!noHilightCalc) {
var hilight = document.createElement("div"); let hilight = document.createElement("div");
hilight.className = "beat-hilight"; hilight.className = "beat-hilight";
hilight.innerHTML = "&block;"; hilight.innerHTML = "&block;";
this.root.appendChild(hilight); this.root.appendChild(hilight);
@ -136,15 +136,15 @@ HuesEditor.prototype.resize = function(noHilightCalc) {
}; };
HuesEditor.prototype.createTextInput = function(label, id, subtitle, parent) { HuesEditor.prototype.createTextInput = function(label, id, subtitle, parent) {
var div = document.createElement("div"); let div = document.createElement("div");
div.className = "edit-label"; div.className = "edit-label";
var caption = document.createElement("label"); let caption = document.createElement("label");
caption.innerHTML = label; caption.innerHTML = label;
caption.htmlFor = id; caption.htmlFor = id;
div.appendChild(caption); div.appendChild(caption);
var container = document.createElement("span"); let container = document.createElement("span");
container.className = "edit-textbox-container"; container.className = "edit-textbox-container";
var input = document.createElement("input"); let input = document.createElement("input");
input.className = "edit-textbox"; input.className = "edit-textbox";
input.type = "text"; input.type = "text";
input.id = id; input.id = id;
@ -158,7 +158,7 @@ HuesEditor.prototype.createTextInput = function(label, id, subtitle, parent) {
}; };
HuesEditor.prototype.createButton = function(label, parent, disabled, extraClass) { HuesEditor.prototype.createButton = function(label, parent, disabled, extraClass) {
var button = document.createElement("span"); let button = document.createElement("span");
button.className = "hues-button"; button.className = "hues-button";
if(disabled) { if(disabled) {
button.className += " disabled"; button.className += " disabled";
@ -172,11 +172,11 @@ HuesEditor.prototype.createButton = function(label, parent, disabled, extraClass
}; };
HuesEditor.prototype.uiCreateInfo = function() { HuesEditor.prototype.uiCreateInfo = function() {
var info = document.createElement("div"); let info = document.createElement("div");
this.topBar.appendChild(info); this.topBar.appendChild(info);
info.id = "edit-info"; info.id = "edit-info";
var songUpdate = function(name) { let songUpdate = function(name) {
if(!this.song ) { if(!this.song ) {
return; return;
} }
@ -217,7 +217,7 @@ HuesEditor.prototype.onBeat = function(map, index) {
if(!this.song || this.core.currentSong != this.song) { if(!this.song || this.core.currentSong != this.song) {
return; return;
} }
var editor; let editor;
if(index < 0) { if(index < 0) {
index += this.core.currentSong.buildupRhythm.length; index += this.core.currentSong.buildupRhythm.length;
editor = this.buildEdit; editor = this.buildEdit;
@ -229,8 +229,8 @@ HuesEditor.prototype.onBeat = function(map, index) {
} }
} }
editor._hilight.className = "beat-hilight"; editor._hilight.className = "beat-hilight";
var offsetX = index % editor._breakAt; let offsetX = index % editor._breakAt;
var offsetY = Math.floor(index / editor._breakAt); let offsetY = Math.floor(index / editor._breakAt);
// Not computing width/height here due to Chrome bug // Not computing width/height here due to Chrome bug
editor._hilight.style.left = (offsetX * this.hilightWidth) + "px"; editor._hilight.style.left = (offsetX * this.hilightWidth) + "px";
editor._hilight.style.top = (offsetY * this.hilightHeight) + "px"; editor._hilight.style.top = (offsetY * this.hilightHeight) + "px";
@ -248,13 +248,13 @@ HuesEditor.prototype.reflow = function(editor, map) {
} else { } else {
editor._hilight.innerHTML = "&block;"; editor._hilight.innerHTML = "&block;";
} }
var charsPerLine = Math.floor(this.editorWidth / this.hilightWidth); let charsPerLine = Math.floor(this.editorWidth / this.hilightWidth);
// if it's too long to wrap, just give up // if it's too long to wrap, just give up
var wrap = Math.min(this.wrapAt, charsPerLine); let wrap = Math.min(this.wrapAt, charsPerLine);
charsPerLine -= charsPerLine % wrap; charsPerLine -= charsPerLine % wrap;
editor._beatCount.textContent = map.length + " beats"; editor._beatCount.textContent = map.length + " beats";
// http://stackoverflow.com/a/27012001 // http://stackoverflow.com/a/27012001
var regex = new RegExp("(.{" + charsPerLine + "})", "g"); let regex = new RegExp("(.{" + charsPerLine + "})", "g");
editor._beatmap.innerHTML = map.replace(regex, "$1<br />"); editor._beatmap.innerHTML = map.replace(regex, "$1<br />");
editor._breakAt = charsPerLine; editor._breakAt = charsPerLine;
}; };
@ -264,7 +264,7 @@ HuesEditor.prototype.loadAudio = function(editor) {
return; return;
} }
// Disable load button TODO // Disable load button TODO
var file = editor._fileInput.files[0]; let file = editor._fileInput.files[0];
// load audio // load audio
this.blobToArrayBuffer(file) this.blobToArrayBuffer(file)
.then(buffer => { .then(buffer => {
@ -273,7 +273,7 @@ HuesEditor.prototype.loadAudio = function(editor) {
this.song[editor._sound] = buffer; this.song[editor._sound] = buffer;
// Save filename for XML export // Save filename for XML export
var noExt = file.name.replace(/\.[^/.]+$/, ""); let noExt = file.name.replace(/\.[^/.]+$/, "");
if(editor._sound == "sound") { if(editor._sound == "sound") {
this.song.name = noExt; this.song.name = noExt;
} else { } else {
@ -323,7 +323,7 @@ HuesEditor.prototype.removeAudio = function(editor) {
HuesEditor.prototype.blobToArrayBuffer = function(blob) { HuesEditor.prototype.blobToArrayBuffer = function(blob) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
var fr = new FileReader(); let fr = new FileReader();
fr.onload = () => { fr.onload = () => {
resolve(fr.result); resolve(fr.result);
}; };
@ -387,9 +387,9 @@ HuesEditor.prototype.updateInfo = function() {
return; return;
} }
var loopLen = this.core.soundManager.loopLength; let loopLen = this.core.soundManager.loopLength;
var buildLen = this.core.soundManager.buildLength; let buildLen = this.core.soundManager.buildLength;
var beatLen = (loopLen / this.song.rhythm.length) * 1000; let beatLen = (loopLen / this.song.rhythm.length) * 1000;
this.loopLen.textContent = loopLen.toFixed(2); this.loopLen.textContent = loopLen.toFixed(2);
this.buildLen.textContent = buildLen.toFixed(2); this.buildLen.textContent = buildLen.toFixed(2);
@ -451,7 +451,7 @@ HuesEditor.prototype.undoRedo = function(from, to) {
return; return;
} }
// Remove old data // Remove old data
var fromData = from.pop(); let fromData = from.pop();
// Make restore from current // Make restore from current
to.push({songVar: fromData.songVar, editor: fromData.editor, text: this.song[fromData.songVar]}); to.push({songVar: fromData.songVar, editor: fromData.editor, text: this.song[fromData.songVar]});
// Restore to editor // Restore to editor
@ -491,7 +491,7 @@ HuesEditor.prototype.halveBeats = function(editor) {
} }
if(!this.song.independentBuild) { if(!this.song.independentBuild) {
// halve them both // halve them both
var other = editor._rhythm == "rhythm" ? this.buildEdit : this.loopEdit; let other = editor._rhythm == "rhythm" ? this.buildEdit : this.loopEdit;
if(this.getText(other).length < 2) { if(this.getText(other).length < 2) {
return; return;
} }
@ -508,7 +508,7 @@ HuesEditor.prototype.doubleBeats = function(editor) {
} }
if(!this.song.independentBuild) { if(!this.song.independentBuild) {
// Double them both // Double them both
var other = editor._rhythm == "rhythm" ? this.buildEdit : this.loopEdit; let other = editor._rhythm == "rhythm" ? this.buildEdit : this.loopEdit;
if(this.getText(other).length === 0) { if(this.getText(other).length === 0) {
return; return;
} }
@ -520,18 +520,18 @@ HuesEditor.prototype.doubleBeats = function(editor) {
}; };
HuesEditor.prototype.uiCreateImport = function() { HuesEditor.prototype.uiCreateImport = function() {
var imports = document.createElement("div"); let imports = document.createElement("div");
this.topBar.appendChild(imports); this.topBar.appendChild(imports);
imports.id = "edit-imports"; imports.id = "edit-imports";
var songEdits = document.createElement("div"); let songEdits = document.createElement("div");
imports.appendChild(songEdits); imports.appendChild(songEdits);
var newSongBtn = this.createButton("New song", songEdits, false, "glow"); let newSongBtn = this.createButton("New song", songEdits, false, "glow");
newSongBtn.onclick = () => { newSongBtn.onclick = () => {
this.newSong(); this.newSong();
}; };
this.newSongBtn = newSongBtn; this.newSongBtn = newSongBtn;
var fromSong = this.createButton("Edit current song", songEdits, false, "glow"); let fromSong = this.createButton("Edit current song", songEdits, false, "glow");
fromSong.onclick = () => { fromSong.onclick = () => {
if(this.core.currentSong) { if(this.core.currentSong) {
this.newSong(this.core.currentSong); this.newSong(this.core.currentSong);
@ -539,7 +539,7 @@ HuesEditor.prototype.uiCreateImport = function() {
}; };
this.fromSongBtn = fromSong; this.fromSongBtn = fromSong;
var songInfos = document.createElement("div"); let songInfos = document.createElement("div");
songInfos.className = "settings-individual"; songInfos.className = "settings-individual";
songInfos.id = "edit-songstats"; songInfos.id = "edit-songstats";
imports.appendChild(songInfos); imports.appendChild(songInfos);
@ -550,12 +550,12 @@ HuesEditor.prototype.uiCreateImport = function() {
}; };
HuesEditor.prototype.uiCreateSongStat = function(name, value, parent) { HuesEditor.prototype.uiCreateSongStat = function(name, value, parent) {
var container = document.createElement("div"); let container = document.createElement("div");
parent.appendChild(container); parent.appendChild(container);
var label = document.createElement("span"); let label = document.createElement("span");
label.textContent = name; label.textContent = name;
container.appendChild(label); container.appendChild(label);
var valueSpan = document.createElement("span"); let valueSpan = document.createElement("span");
valueSpan.textContent = value; valueSpan.textContent = value;
valueSpan.className = "edit-songstat-value"; valueSpan.className = "edit-songstat-value";
container.appendChild(valueSpan); container.appendChild(valueSpan);
@ -563,7 +563,7 @@ HuesEditor.prototype.uiCreateSongStat = function(name, value, parent) {
}; };
HuesEditor.prototype.uiCreateEditArea = function() { HuesEditor.prototype.uiCreateEditArea = function() {
var editArea = document.createElement("div"); let editArea = document.createElement("div");
this.editArea = editArea; this.editArea = editArea;
editArea.id = "edit-area"; editArea.id = "edit-area";
this.root.appendChild(editArea); this.root.appendChild(editArea);
@ -574,7 +574,7 @@ HuesEditor.prototype.uiCreateEditArea = function() {
this.timeLock.id = "edit-timelock"; this.timeLock.id = "edit-timelock";
this.timeLock.className = "hues-icon"; this.timeLock.className = "hues-icon";
// CHAIN, use &#xe904; for CHAIN-BROKEN // CHAIN, use &#xe904; for CHAIN-BROKEN
var locker = this.createButton("&#xe905;", this.timeLock); let locker = this.createButton("&#xe905;", this.timeLock);
locker.onclick = () => { locker.onclick = () => {
if(!this.song) { if(!this.song) {
return; return;
@ -598,10 +598,10 @@ HuesEditor.prototype.uiCreateEditArea = function() {
}; };
// drag handle // drag handle
var handleContainer = document.createElement("div"); let handleContainer = document.createElement("div");
handleContainer.id = "edit-resize-handle-container"; handleContainer.id = "edit-resize-handle-container";
editArea.appendChild(handleContainer); editArea.appendChild(handleContainer);
var handle = document.createElement("div"); let handle = document.createElement("div");
handle.id = 'edit-resize-handle'; handle.id = 'edit-resize-handle';
handle.className = 'hues-icon'; handle.className = 'hues-icon';
handle.innerHTML = "&#xe908;"; // DRAG HANDLE handle.innerHTML = "&#xe908;"; // DRAG HANDLE
@ -610,15 +610,15 @@ HuesEditor.prototype.uiCreateEditArea = function() {
handleContainer.addEventListener("mousedown", (e) => { handleContainer.addEventListener("mousedown", (e) => {
e.preventDefault(); e.preventDefault();
var editTop = this.editArea.getBoundingClientRect().top; let editTop = this.editArea.getBoundingClientRect().top;
var handleSize = this.resizeHandle.clientHeight; let handleSize = this.resizeHandle.clientHeight;
var resizer = (e) => { let resizer = (e) => {
this.buildEditSize = Math.floor(e.clientY - editTop + handleSize/2); this.buildEditSize = Math.floor(e.clientY - editTop + handleSize/2);
this.resize(true); this.resize(true);
}; };
var mouseup = function(e) { let mouseup = function(e) {
document.removeEventListener("mousemove", resizer); document.removeEventListener("mousemove", resizer);
document.removeEventListener("mouseup", mouseup); document.removeEventListener("mouseup", mouseup);
}; };
@ -655,23 +655,23 @@ HuesEditor.prototype.uiCreateEditArea = function() {
}; };
HuesEditor.prototype.uiCreateSingleEditor = function(title, soundName, rhythmName, id, parent) { HuesEditor.prototype.uiCreateSingleEditor = function(title, soundName, rhythmName, id, parent) {
var container = document.createElement("div"); let container = document.createElement("div");
container.id = id; container.id = id;
parent.appendChild(container); parent.appendChild(container);
var header = document.createElement("div"); let header = document.createElement("div");
header.className = "edit-area-header"; header.className = "edit-area-header";
container.appendChild(header); container.appendChild(header);
var nameLabel = document.createElement("span"); let nameLabel = document.createElement("span");
header.appendChild(nameLabel); header.appendChild(nameLabel);
nameLabel.innerHTML = title; nameLabel.innerHTML = title;
var seek = this.createButton("", header, true, "hues-icon"); let seek = this.createButton("", header, true, "hues-icon");
header.appendChild(seek); header.appendChild(seek);
container._seek = seek; container._seek = seek;
var beatCount = document.createElement("span"); let beatCount = document.createElement("span");
header.appendChild(beatCount); header.appendChild(beatCount);
beatCount.className = "beat-count"; beatCount.className = "beat-count";
beatCount.textContent = "0 beats"; beatCount.textContent = "0 beats";
@ -680,12 +680,12 @@ HuesEditor.prototype.uiCreateSingleEditor = function(title, soundName, rhythmNam
if(container._locked) { if(container._locked) {
this.setLocked(container, 0); this.setLocked(container, 0);
} else { } else {
var textLen = this.getText(container).length; let textLen = this.getText(container).length;
this.setLocked(container, textLen); this.setLocked(container, textLen);
} }
}; };
var rightHeader = document.createElement("span"); let rightHeader = document.createElement("span");
rightHeader.className = "edit-area-right-header"; rightHeader.className = "edit-area-right-header";
header.appendChild(rightHeader); header.appendChild(rightHeader);
@ -694,27 +694,27 @@ HuesEditor.prototype.uiCreateSingleEditor = function(title, soundName, rhythmNam
container._doubleBtn = this.createButton("Double", rightHeader); container._doubleBtn = this.createButton("Double", rightHeader);
container._doubleBtn.onclick = this.doubleBeats.bind(this, container); container._doubleBtn.onclick = this.doubleBeats.bind(this, container);
var fileInput = document.createElement("input"); let fileInput = document.createElement("input");
fileInput.type ="file"; fileInput.type ="file";
fileInput.accept="audio/mpeg3"; fileInput.accept="audio/mpeg3";
fileInput.multiple = false; fileInput.multiple = false;
fileInput.onchange = this.loadAudio.bind(this, container); fileInput.onchange = this.loadAudio.bind(this, container);
var load = this.createButton("Load " + title.replace(/&nbsp;/g,""), rightHeader); let load = this.createButton("Load " + title.replace(/&nbsp;/g,""), rightHeader);
load.onclick = () => {fileInput.click();}; load.onclick = () => {fileInput.click();};
container._removeBtn = this.createButton("Remove", rightHeader, true); container._removeBtn = this.createButton("Remove", rightHeader, true);
container._removeBtn.onclick = this.removeAudio.bind(this, container); container._removeBtn.onclick = this.removeAudio.bind(this, container);
var editBox = document.createElement("div"); let editBox = document.createElement("div");
editBox.className = "edit-box"; editBox.className = "edit-box";
var beatmap = document.createElement("div"); let beatmap = document.createElement("div");
beatmap.className = "beatmap"; beatmap.className = "beatmap";
beatmap.contentEditable = true; beatmap.contentEditable = true;
beatmap.spellcheck = false; beatmap.spellcheck = false;
beatmap.oninput = this.textUpdated.bind(this, container); beatmap.oninput = this.textUpdated.bind(this, container);
beatmap.oncontextmenu = this.rightClick.bind(this, container); beatmap.oncontextmenu = this.rightClick.bind(this, container);
var beatHilight = document.createElement("div"); let beatHilight = document.createElement("div");
beatHilight.className = "beat-hilight"; beatHilight.className = "beat-hilight";
editBox.appendChild(beatHilight); editBox.appendChild(beatHilight);
@ -742,15 +742,15 @@ HuesEditor.prototype.rightClick = function(editor, event) {
return; return;
} }
// We abuse the fact that right clicking moves the caret. Hooray! // We abuse the fact that right clicking moves the caret. Hooray!
var caret = this.getCaret(editor._beatmap); let caret = this.getCaret(editor._beatmap);
var totalLen = this.getText(editor).length; let totalLen = this.getText(editor).length;
var percent = caret / totalLen; let percent = caret / totalLen;
if(caret <= totalLen) { if(caret <= totalLen) {
var seekTime = 0; let seekTime = 0;
if(editor._rhythm == "rhythm") { // loop if(editor._rhythm == "rhythm") { // loop
seekTime = this.core.soundManager.loopLength * percent; seekTime = this.core.soundManager.loopLength * percent;
} else { // build } else { // build
var bLen = this.core.soundManager.buildLength; let bLen = this.core.soundManager.buildLength;
seekTime = -bLen + bLen * percent; seekTime = -bLen + bLen * percent;
} }
this.core.soundManager.seek(seekTime); this.core.soundManager.seek(seekTime);
@ -767,7 +767,7 @@ HuesEditor.prototype.textUpdated = function(editor) {
return; return;
} }
// Space at start of line is nonbreaking, get it with \u00a0 // Space at start of line is nonbreaking, get it with \u00a0
var input = editor._beatmap.textContent.replace(/ |\u00a0/g, ""); let input = editor._beatmap.textContent.replace(/ |\u00a0/g, "");
if(input.length === 0) { if(input.length === 0) {
input = "."; input = ".";
} }
@ -787,7 +787,7 @@ HuesEditor.prototype.setText = function(editor, text, caretFromEnd) {
this.reflow(editor, ""); this.reflow(editor, "");
return; return;
} }
var caret = caretFromEnd ? text.length : this.getCaret(editor._beatmap); let caret = caretFromEnd ? text.length : this.getCaret(editor._beatmap);
if(editor._locked) { if(editor._locked) {
caret = Math.min(editor._locked, caret); caret = Math.min(editor._locked, caret);
if(text.length > editor._locked) { if(text.length > editor._locked) {
@ -800,8 +800,8 @@ HuesEditor.prototype.setText = function(editor, text, caretFromEnd) {
} }
// time to scale things to fit // time to scale things to fit
} else if(!this.song.independentBuild && this.song.buildupRhythm && this.song.rhythm) { } else if(!this.song.independentBuild && this.song.buildupRhythm && this.song.rhythm) {
var ratio = this.core.soundManager.loopLength / this.core.soundManager.buildLength; let ratio = this.core.soundManager.loopLength / this.core.soundManager.buildLength;
var newLen, otherMap; let newLen, otherMap;
if(editor._rhythm == "rhythm") { // editing rhythm, adjust beatmap if(editor._rhythm == "rhythm") { // editing rhythm, adjust beatmap
otherMap = this.buildEdit; otherMap = this.buildEdit;
newLen = Math.floor(text.length / ratio); newLen = Math.floor(text.length / ratio);
@ -809,7 +809,7 @@ HuesEditor.prototype.setText = function(editor, text, caretFromEnd) {
otherMap = this.loopEdit; otherMap = this.loopEdit;
newLen = Math.floor(text.length * ratio); newLen = Math.floor(text.length * ratio);
} }
var wasLocked = otherMap._locked; let wasLocked = otherMap._locked;
// avoid infinite loop // avoid infinite loop
this.song.independentBuild = true; this.song.independentBuild = true;
// clamp the length // clamp the length
@ -840,10 +840,10 @@ HuesEditor.prototype.setText = function(editor, text, caretFromEnd) {
}; };
HuesEditor.prototype.getCaret = function(editable) { HuesEditor.prototype.getCaret = function(editable) {
var caret = 0; let caret = 0;
var sel = window.getSelection(); let sel = window.getSelection();
if (sel.rangeCount) { if (sel.rangeCount) {
var range = sel.getRangeAt(0); let range = sel.getRangeAt(0);
// <br> elements are empty, and pastes do weird things. // <br> elements are empty, and pastes do weird things.
// So don't go up in multiples of 2 for getCaret // So don't go up in multiples of 2 for getCaret
for(let i = 0; i < editable.childNodes.length; i++) { for(let i = 0; i < editable.childNodes.length; i++) {
@ -859,11 +859,11 @@ HuesEditor.prototype.getCaret = function(editable) {
}; };
HuesEditor.prototype.setCaret = function(editable, caret) { HuesEditor.prototype.setCaret = function(editable, caret) {
var range = document.createRange(); let range = document.createRange();
var sel = window.getSelection(); let sel = window.getSelection();
// <br> elements mean children go up in multiples of 2 // <br> elements mean children go up in multiples of 2
for(let i = 0; i < editable.childNodes.length; i+= 2) { for(let i = 0; i < editable.childNodes.length; i+= 2) {
var textLen = editable.childNodes[i].textContent.length; let textLen = editable.childNodes[i].textContent.length;
if(caret > textLen) { if(caret > textLen) {
caret -= textLen; caret -= textLen;
} else { } else {
@ -881,7 +881,7 @@ HuesEditor.prototype.updateHalveDoubleButtons = function(editor) {
editor._doubleBtn.className = "hues-button disabled"; editor._doubleBtn.className = "hues-button disabled";
if(!editor._locked) { if(!editor._locked) {
var txtLen = this.getText(editor).length; let txtLen = this.getText(editor).length;
if(txtLen > 0) { if(txtLen > 0) {
editor._doubleBtn.className = "hues-button"; editor._doubleBtn.className = "hues-button";
} }
@ -902,43 +902,43 @@ HuesEditor.prototype.setLocked = function(editor, locked) {
}; };
HuesEditor.prototype.uiCreateControls = function() { HuesEditor.prototype.uiCreateControls = function() {
var controls = document.createElement("div"); let controls = document.createElement("div");
controls.id = "edit-controls"; controls.id = "edit-controls";
this.root.appendChild(controls); this.root.appendChild(controls);
var changeRate = function(change) { let changeRate = function(change) {
var rate = this.core.soundManager.playbackRate; let rate = this.core.soundManager.playbackRate;
rate += change; rate += change;
this.core.soundManager.setRate(rate); this.core.soundManager.setRate(rate);
// In case it gets clamped, check // In case it gets clamped, check
var newRate = this.core.soundManager.playbackRate; let newRate = this.core.soundManager.playbackRate;
playRateLab.textContent = newRate.toFixed(2) + "x"; playRateLab.textContent = newRate.toFixed(2) + "x";
}; };
var speedControl = document.createElement("div"); let speedControl = document.createElement("div");
controls.appendChild(speedControl); controls.appendChild(speedControl);
// BACKWARD // BACKWARD
var speedDown = this.createButton("&#xe909;", speedControl, false, "hues-icon"); let speedDown = this.createButton("&#xe909;", speedControl, false, "hues-icon");
speedDown.onclick = changeRate.bind(this, -0.25); speedDown.onclick = changeRate.bind(this, -0.25);
// FORWARD // FORWARD
var speedUp = this.createButton("&#xe90a;", speedControl, false, "hues-icon"); let speedUp = this.createButton("&#xe90a;", speedControl, false, "hues-icon");
speedUp.onclick = changeRate.bind(this, 0.25); speedUp.onclick = changeRate.bind(this, 0.25);
var playRateLab = document.createElement("span"); let playRateLab = document.createElement("span");
playRateLab.className = "settings-individual"; playRateLab.className = "settings-individual";
playRateLab.textContent = "1.00x"; playRateLab.textContent = "1.00x";
speedControl.appendChild(playRateLab); speedControl.appendChild(playRateLab);
var wrapControl = document.createElement("div"); let wrapControl = document.createElement("div");
controls.appendChild(wrapControl); controls.appendChild(wrapControl);
var wrapLab = document.createElement("span"); let wrapLab = document.createElement("span");
wrapLab.className = "settings-individual"; wrapLab.className = "settings-individual";
wrapLab.textContent = "New line at beat "; wrapLab.textContent = "New line at beat ";
wrapControl.appendChild(wrapLab); wrapControl.appendChild(wrapLab);
var wrapAt = document.createElement("input"); let wrapAt = document.createElement("input");
wrapAt.className = "settings-input"; wrapAt.className = "settings-input";
wrapAt.value = this.wrapAt; wrapAt.value = this.wrapAt;
wrapAt.type = "text"; wrapAt.type = "text";
@ -958,7 +958,7 @@ HuesEditor.prototype.uiCreateControls = function() {
HuesEditor.prototype.uiCreateVisualiser = function() { HuesEditor.prototype.uiCreateVisualiser = function() {
// TODO placeholder // TODO placeholder
var wave = document.createElement("canvas"); let wave = document.createElement("canvas");
wave.id = "edit-waveform"; wave.id = "edit-waveform";
wave.height = WAVE_HEIGHT_PIXELS; wave.height = WAVE_HEIGHT_PIXELS;
this.root.appendChild(wave); this.root.appendChild(wave);
@ -984,33 +984,33 @@ HuesEditor.prototype.renderWave = function(buffer, length) {
return null; return null;
} }
// The individual wave section // The individual wave section
var wave = document.createElement("canvas"); let wave = document.createElement("canvas");
var waveContext = wave.getContext("2d"); let waveContext = wave.getContext("2d");
wave.height = WAVE_HEIGHT_PIXELS; wave.height = WAVE_HEIGHT_PIXELS;
wave.width = Math.floor(WAVE_PIXELS_PER_SECOND * length); wave.width = Math.floor(WAVE_PIXELS_PER_SECOND * length);
var samplesPerPixel = Math.floor(buffer.sampleRate / WAVE_PIXELS_PER_SECOND); let samplesPerPixel = Math.floor(buffer.sampleRate / WAVE_PIXELS_PER_SECOND);
var waveData = []; let waveData = [];
for(let i = 0; i < buffer.numberOfChannels; i++) { for(let i = 0; i < buffer.numberOfChannels; i++) {
waveData.push(buffer.getChannelData(i)); waveData.push(buffer.getChannelData(i));
} }
// Half pixel offset makes things look crisp // Half pixel offset makes things look crisp
var pixel = 0.5; let pixel = 0.5;
waveContext.strokeStyle = "black"; waveContext.strokeStyle = "black";
var halfHeight = WAVE_HEIGHT_PIXELS/2; let halfHeight = WAVE_HEIGHT_PIXELS/2;
for(let i = 0; i < buffer.length; i += samplesPerPixel) { for(let i = 0; i < buffer.length; i += samplesPerPixel) {
var min = 0, max = 0; let min = 0, max = 0;
for(var j = 0; j < samplesPerPixel && i + j < buffer.length; j++) { for(let j = 0; j < samplesPerPixel && i + j < buffer.length; j++) {
for(var chan = 0; chan < waveData.length; chan++) { for(let chan = 0; chan < waveData.length; chan++) {
var sample = waveData[chan][i+j]; let sample = waveData[chan][i+j];
if(sample > max) max = sample; if(sample > max) max = sample;
if(sample < min) min = sample; if(sample < min) min = sample;
} }
} }
var maxPix = Math.floor(halfHeight + max * halfHeight); let maxPix = Math.floor(halfHeight + max * halfHeight);
// Min is negative, addition is correct // Min is negative, addition is correct
var minPix = Math.floor(halfHeight + min * halfHeight); let minPix = Math.floor(halfHeight + min * halfHeight);
waveContext.beginPath(); waveContext.beginPath();
waveContext.moveTo(pixel, maxPix); waveContext.moveTo(pixel, maxPix);
waveContext.lineTo(pixel, minPix); waveContext.lineTo(pixel, minPix);
@ -1022,27 +1022,27 @@ HuesEditor.prototype.renderWave = function(buffer, length) {
}; };
HuesEditor.prototype.drawWave = function() { HuesEditor.prototype.drawWave = function() {
var width = this.waveCanvas.width; let width = this.waveCanvas.width;
var now = this.core.soundManager.currentTime(); let now = this.core.soundManager.currentTime();
var span = width / WAVE_PIXELS_PER_SECOND / 2; let span = width / WAVE_PIXELS_PER_SECOND / 2;
var minTime = now - span; let minTime = now - span;
var maxTime = now + span; let maxTime = now + span;
this.waveContext.clearRect(0, 0, width, WAVE_HEIGHT_PIXELS); this.waveContext.clearRect(0, 0, width, WAVE_HEIGHT_PIXELS);
if(this.buildWave && minTime < 0) { if(this.buildWave && minTime < 0) {
var bLen = this.core.soundManager.buildLength; let bLen = this.core.soundManager.buildLength;
let center = Math.floor((now + bLen) / bLen * this.buildWave.width); let center = Math.floor((now + bLen) / bLen * this.buildWave.width);
this.drawOneWave(this.buildWave, center, width); this.drawOneWave(this.buildWave, center, width);
} }
if(this.loopWave && maxTime > 0) { if(this.loopWave && maxTime > 0) {
var loopLen = this.core.soundManager.loopLength; let loopLen = this.core.soundManager.loopLength;
var clampedNow = (minTime % loopLen) + span; let clampedNow = (minTime % loopLen) + span;
let center = Math.floor(clampedNow / loopLen * this.loopWave.width); let center = Math.floor(clampedNow / loopLen * this.loopWave.width);
this.drawOneWave(this.loopWave, center, width); this.drawOneWave(this.loopWave, center, width);
var clampedNext = (maxTime % loopLen) - span; let clampedNext = (maxTime % loopLen) - span;
// We've looped and need to draw 2 things // We've looped and need to draw 2 things
if(clampedNext < clampedNow) { if(clampedNext < clampedNow) {
let center = Math.floor(clampedNext / loopLen * this.loopWave.width); let center = Math.floor(clampedNext / loopLen * this.loopWave.width);
@ -1072,7 +1072,7 @@ HuesEditor.prototype.generateXML = function() {
} }
// Yes, this is just a bunch of strings. Simple XML, simple method. // Yes, this is just a bunch of strings. Simple XML, simple method.
var result = " <song name=\"" + this.song.name + "\">\n"; let result = " <song name=\"" + this.song.name + "\">\n";
result += " <title>" + this.song.title + "</title>\n"; result += " <title>" + this.song.title + "</title>\n";
if(this.song.source) { if(this.song.source) {
result += " <source>" + this.song.source + "</source>\n"; result += " <source>" + this.song.source + "</source>\n";
@ -1090,16 +1090,16 @@ HuesEditor.prototype.generateXML = function() {
}; };
HuesEditor.prototype.saveXML = function() { HuesEditor.prototype.saveXML = function() {
var xml = this.generateXML(); let xml = this.generateXML();
if(!xml) { if(!xml) {
return; return;
} }
var result = "<songs>\n"; let result = "<songs>\n";
result += xml; result += xml;
result += "</songs>\n"; result += "</songs>\n";
// http://stackoverflow.com/a/18197341 // http://stackoverflow.com/a/18197341
var element = document.createElement('a'); let element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(result)); element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(result));
element.setAttribute('download', "0x40Hues - " + this.song.name + ".xml"); element.setAttribute('download', "0x40Hues - " + this.song.name + ".xml");
@ -1113,14 +1113,14 @@ HuesEditor.prototype.saveXML = function() {
// http://stackoverflow.com/a/30810322 // http://stackoverflow.com/a/30810322
HuesEditor.prototype.copyXML = function() { HuesEditor.prototype.copyXML = function() {
var text = this.generateXML(); let text = this.generateXML();
// Clicking when disabled // Clicking when disabled
if(!text) { if(!text) {
return; return;
} }
var textArea = document.createElement("textarea"); let textArea = document.createElement("textarea");
textArea.id = "edit-copybox"; textArea.id = "edit-copybox";
textArea.value = text; textArea.value = text;
@ -1129,7 +1129,7 @@ HuesEditor.prototype.copyXML = function() {
textArea.select(); textArea.select();
var success; let success;
try { try {
success = document.execCommand('copy'); success = document.execCommand('copy');

22
src/js/HuesInfo.js
Unescape View File

@ -29,13 +29,13 @@
* like a custom info page, simply leave them out. * like a custom info page, simply leave them out.
*/ */
var huesInfo = { let huesInfo = {
versionID: "versionText", versionID: "versionText",
referenceID: "reference", referenceID: "reference",
referenceClass: "info-ref" referenceClass: "info-ref"
}; };
var beatGlossary = [ let beatGlossary = [
"x Vertical blur (snare)", "x Vertical blur (snare)",
"o Horizontal blur (bass)", "o Horizontal blur (bass)",
"- No blur", "- No blur",
@ -51,7 +51,7 @@ var beatGlossary = [
"I Invert & change image" "I Invert & change image"
]; ];
var shortcuts = [ let shortcuts = [
"↑↓ Change song", "↑↓ Change song",
"←→ Change image", "←→ Change image",
"[N] Random song", "[N] Random song",
@ -69,9 +69,9 @@ var shortcuts = [
]; ];
function populateHuesInfo(version) { function populateHuesInfo(version) {
var versionInt = parseInt(version); let versionInt = parseInt(version);
var versionElem = document.getElementById(huesInfo.versionID); let versionElem = document.getElementById(huesInfo.versionID);
if(versionElem) { if(versionElem) {
versionElem.textContent = "v" + (versionInt/10).toFixed(1); versionElem.textContent = "v" + (versionInt/10).toFixed(1);
} }
@ -80,23 +80,23 @@ function populateHuesInfo(version) {
addInfo("Keyboard shortcuts", shortcuts); addInfo("Keyboard shortcuts", shortcuts);
} }
var addInfo = function(titleText, list) { let addInfo = function(titleText, list) {
var refElem = document.getElementById(huesInfo.referenceID); let refElem = document.getElementById(huesInfo.referenceID);
if(!refElem) { if(!refElem) {
return; return;
} }
var info = document.createElement("div"); let info = document.createElement("div");
info.className = huesInfo.referenceClass; info.className = huesInfo.referenceClass;
refElem.appendChild(info); refElem.appendChild(info);
var title = document.createElement("h3"); let title = document.createElement("h3");
title.textContent = titleText; title.textContent = titleText;
info.appendChild(title); info.appendChild(title);
var listElem = document.createElement("ul"); let listElem = document.createElement("ul");
list.forEach(function(elem) { list.forEach(function(elem) {
var item = document.createElement("li"); let item = document.createElement("li");
item.textContent = elem; item.textContent = elem;
listElem.appendChild(item); listElem.appendChild(item);
}); });

48
src/js/HuesSettings.js
Unescape View File

@ -163,7 +163,7 @@ HuesSettings.prototype.settingsOptions = {
} }
}, },
{type:"varText", text:function() { {type:"varText", text:function() {
var ret = ""; let ret = "";
switch(localStorage["autoSong"]) { switch(localStorage["autoSong"]) {
case "loop": case "loop":
ret = "loop"; ret = "loop";
@ -210,7 +210,7 @@ function HuesSettings(defaults) {
this.textCallbacks = []; this.textCallbacks = [];
this.visCallbacks = []; this.visCallbacks = [];
for(var attr in this.defaultSettings) { for(let attr in this.defaultSettings) {
if(this.defaultSettings.hasOwnProperty(attr)) { if(this.defaultSettings.hasOwnProperty(attr)) {
if(defaults[attr] === undefined) { if(defaults[attr] === undefined) {
defaults[attr] = this.defaultSettings[attr]; defaults[attr] = this.defaultSettings[attr];
@ -241,15 +241,15 @@ function HuesSettings(defaults) {
document.getElementById("closeButton").onclick = this.hide.bind(this); document.getElementById("closeButton").onclick = this.hide.bind(this);
// we also care about tabs looking nice. // we also care about tabs looking nice.
var checkListener = function() { let checkListener = function() {
for(let i = 0; i < tabs.length; i++) { for(let i = 0; i < tabs.length; i++) {
tabs[i].className = "tab-label"; tabs[i].className = "tab-label";
} }
this._label.className = "tab-label checked"; this._label.className = "tab-label checked";
}; };
var tabs = document.getElementsByClassName("tab-label"); let tabs = document.getElementsByClassName("tab-label");
for(let i = 0; i < tabs.length; i++) { for(let i = 0; i < tabs.length; i++) {
var check = document.getElementById(tabs[i].htmlFor); let check = document.getElementById(tabs[i].htmlFor);
check._label = tabs[i]; check._label = tabs[i];
check.addEventListener("change", checkListener); check.addEventListener("change", checkListener);
} }
@ -306,10 +306,10 @@ HuesSettings.prototype.showInfo = function() {
}; };
HuesSettings.prototype.initUI = function() { HuesSettings.prototype.initUI = function() {
var doc = this.root.ownerDocument; let doc = this.root.ownerDocument;
// Don't make in every loop // Don't make in every loop
var intValidator = function(self, variable) { let intValidator = function(self, variable) {
this.value = this.value.replace(/\D/g,''); this.value = this.value.replace(/\D/g,'');
if(this.value === "" || this.value < 1) { if(this.value === "" || this.value < 1) {
this.value = ""; this.value = "";
@ -321,25 +321,25 @@ HuesSettings.prototype.initUI = function() {
}; };
// To order things nicely // To order things nicely
for(var cat in this.settingsCategories) { for(let cat in this.settingsCategories) {
if(this.settingsCategories.hasOwnProperty(cat)) { if(this.settingsCategories.hasOwnProperty(cat)) {
var catContainer = doc.createElement("div"); let catContainer = doc.createElement("div");
catContainer.textContent = cat; catContainer.textContent = cat;
catContainer.className = "settings-category"; catContainer.className = "settings-category";
var cats = this.settingsCategories[cat]; let cats = this.settingsCategories[cat];
for(let i = 0; i < cats.length; i++) { for(let i = 0; i < cats.length; i++) {
var setName = cats[i]; let setName = cats[i];
var setContainer = doc.createElement("div"); let setContainer = doc.createElement("div");
var setting = this.settingsOptions[setName]; let setting = this.settingsOptions[setName];
setContainer.textContent = setting.name; setContainer.textContent = setting.name;
setContainer.className = "settings-individual"; setContainer.className = "settings-individual";
var buttonContainer = doc.createElement("div"); let buttonContainer = doc.createElement("div");
buttonContainer.className = "settings-buttons"; buttonContainer.className = "settings-buttons";
for(var j = 0; j < setting.options.length; j++) { for(let j = 0; j < setting.options.length; j++) {
var option = setting.options[j]; let option = setting.options[j];
if(typeof option === "string") { if(typeof option === "string") {
var checkbox = doc.createElement("input"); let checkbox = doc.createElement("input");
checkbox.className = "settings-checkbox"; checkbox.className = "settings-checkbox";
checkbox.type = "radio"; checkbox.type = "radio";
checkbox.name = setName; checkbox.name = setName;
@ -353,19 +353,19 @@ HuesSettings.prototype.initUI = function() {
}.bind(checkbox, this); }.bind(checkbox, this);
buttonContainer.appendChild(checkbox); buttonContainer.appendChild(checkbox);
// So we can style this nicely // So we can style this nicely
var label = doc.createElement("label"); let label = doc.createElement("label");
label.className = "settings-label"; label.className = "settings-label";
label.htmlFor = checkbox.id; label.htmlFor = checkbox.id;
label.textContent = option.toUpperCase(); label.textContent = option.toUpperCase();
buttonContainer.appendChild(label); buttonContainer.appendChild(label);
} else { // special option } else { // special option
if(option.type == "varText") { if(option.type == "varText") {
var text = doc.createElement("span"); let text = doc.createElement("span");
text.textContent = option.text(); text.textContent = option.text();
buttonContainer.appendChild(text); buttonContainer.appendChild(text);
this.textCallbacks.push({func:option.text, element:text}); this.textCallbacks.push({func:option.text, element:text});
} else if(option.type == "input") { } else if(option.type == "input") {
var input = doc.createElement("input"); let input = doc.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 = localStorage[option.variable];
@ -395,7 +395,7 @@ HuesSettings.prototype.initUI = function() {
// 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
HuesSettings.prototype.set = function(setting, value) { HuesSettings.prototype.set = function(setting, value) {
value = value.toLowerCase(); value = value.toLowerCase();
var opt = this.settingsOptions[setting]; let opt = this.settingsOptions[setting];
if(!opt || opt.options.indexOf(value) == -1) { if(!opt || opt.options.indexOf(value) == -1) {
console.log(value, "is not a valid value for", setting); console.log(value, "is not a valid value for", setting);
return false; return false;
@ -413,11 +413,11 @@ HuesSettings.prototype.set = function(setting, value) {
HuesSettings.prototype.updateConditionals = function() { HuesSettings.prototype.updateConditionals = function() {
// update any conditionally formatted settings text // update any conditionally formatted settings text
for(let i = 0; i < this.textCallbacks.length; i++) { for(let i = 0; i < this.textCallbacks.length; i++) {
var text = this.textCallbacks[i]; let text = this.textCallbacks[i];
text.element.textContent = text.func(); text.element.textContent = text.func();
} }
for(let i = 0; i < this.visCallbacks.length; i++) { for(let i = 0; i < this.visCallbacks.length; i++) {
var callback = this.visCallbacks[i]; let callback = this.visCallbacks[i];
callback.element.style.visibility = callback.func() ? "visible" : "hidden"; callback.element.style.visibility = callback.func() ? "visible" : "hidden";
} }
}; };
@ -425,7 +425,7 @@ HuesSettings.prototype.updateConditionals = function() {
// Note: This is not defaults as per defaultSettings, but those merged with // Note: This is not defaults as per defaultSettings, but those merged with
// the defaults given in the initialiser // the defaults given in the initialiser
HuesSettings.prototype.setDefaults = function() { HuesSettings.prototype.setDefaults = function() {
for(var attr in this.defaults) { for(let attr in this.defaults) {
if(this.defaults.hasOwnProperty(attr)) { if(this.defaults.hasOwnProperty(attr)) {
if(this.ephemeralSettings.indexOf(attr) != -1) { if(this.ephemeralSettings.indexOf(attr) != -1) {
continue; continue;

134
src/js/HuesUI.js
Unescape View File

@ -80,46 +80,46 @@ HuesUI.prototype.addCoreCallback = function(name, func) {
HuesUI.prototype.initUI = function() { HuesUI.prototype.initUI = function() {
// Major info, image, song names // Major info, image, song names
var imageName = document.createElement("div"); let imageName = document.createElement("div");
this.imageName = imageName; this.imageName = imageName;
this.imageLink = document.createElement("a"); this.imageLink = document.createElement("a");
this.imageLink.target = "_blank"; this.imageLink.target = "_blank";
this.imageName.appendChild(this.imageLink); this.imageName.appendChild(this.imageLink);
var songName = document.createElement("div"); let songName = document.createElement("div");
this.songName = songName; this.songName = songName;
this.songLink = document.createElement("a"); this.songLink = document.createElement("a");
this.songLink.target = "_blank"; this.songLink.target = "_blank";
this.songName.appendChild(this.songLink); this.songName.appendChild(this.songLink);
var hueName = document.createElement("div"); let hueName = document.createElement("div");
this.hueName = hueName; this.hueName = hueName;
// Prev/next controls // Prev/next controls
var imagePrev = document.createElement("div"); let imagePrev = document.createElement("div");
imagePrev.textContent = "<"; imagePrev.textContent = "<";
imagePrev.onclick = () => {this.core.previousImage();}; imagePrev.onclick = () => {this.core.previousImage();};
this.imagePrev = imagePrev; this.imagePrev = imagePrev;
var imageNext = document.createElement("div"); let imageNext = document.createElement("div");
imageNext.textContent = ">"; imageNext.textContent = ">";
imageNext.onclick = () =>{this.core.nextImage();}; imageNext.onclick = () =>{this.core.nextImage();};
this.imageNext = imageNext; this.imageNext = imageNext;
var songPrev = document.createElement("div"); let songPrev = document.createElement("div");
songPrev.textContent = "<"; songPrev.textContent = "<";
this.songPrev = songPrev; this.songPrev = songPrev;
songPrev.onclick = () =>{this.core.previousSong();}; songPrev.onclick = () =>{this.core.previousSong();};
var songNext = document.createElement("div"); let songNext = document.createElement("div");
songNext.textContent = ">"; songNext.textContent = ">";
songNext.onclick = () =>{this.core.nextSong();}; songNext.onclick = () =>{this.core.nextSong();};
this.songNext = songNext; this.songNext = songNext;
var songList = document.createElement("div"); let songList = document.createElement("div");
songList.textContent = "SONGS"; songList.textContent = "SONGS";
songList.onclick = () =>{this.core.toggleSongList();}; songList.onclick = () =>{this.core.toggleSongList();};
this.songList = songList; this.songList = songList;
var imageList = document.createElement("div"); let imageList = document.createElement("div");
imageList.textContent = "IMAGES"; imageList.textContent = "IMAGES";
imageList.onclick = () =>{this.core.toggleImageList();}; imageList.onclick = () =>{this.core.toggleImageList();};
this.imageList = imageList; this.imageList = imageList;
@ -229,7 +229,7 @@ HuesUI.prototype.newImage = function(image) {
return; return;
} }
var name = image.fullname ? image.fullname : image.name; let name = image.fullname ? image.fullname : image.name;
this.imageLink.textContent = name.toUpperCase(); this.imageLink.textContent = name.toUpperCase();
this.imageLink.href = image.source ? image.source : ""; this.imageLink.href = image.source ? image.source : "";
@ -290,7 +290,7 @@ RetroUI.prototype.constructor = RetroUI;
RetroUI.prototype.initUI = function() { RetroUI.prototype.initUI = function() {
HuesUI.prototype.initUI.call(this); HuesUI.prototype.initUI.call(this);
var container = document.createElement("div"); let container = document.createElement("div");
container.className = "hues-r-container"; container.className = "hues-r-container";
this.root.appendChild(container); this.root.appendChild(container);
this.container = container; this.container = container;
@ -319,7 +319,7 @@ RetroUI.prototype.initUI = function() {
this.controls = document.createElement("div"); this.controls = document.createElement("div");
this.controls.className = "hues-r-controls"; this.controls.className = "hues-r-controls";
var imageMode = document.createElement("div"); let imageMode = document.createElement("div");
this.imageModeManual = document.createElement("div"); this.imageModeManual = document.createElement("div");
this.imageModeManual.textContent = "NORMAL"; this.imageModeManual.textContent = "NORMAL";
this.imageModeManual.onclick = () => { this.imageModeManual.onclick = () => {
@ -350,7 +350,7 @@ RetroUI.prototype.initUI = function() {
this.root.appendChild(this.controls); this.root.appendChild(this.controls);
var subControl = document.createElement("div"); let subControl = document.createElement("div");
subControl.className = "hues-r-subcontrols"; subControl.className = "hues-r-subcontrols";
subControl.appendChild(this.settingsToggle); subControl.appendChild(this.settingsToggle);
this.imageList.textContent = "C"; this.imageList.textContent = "C";
@ -420,7 +420,7 @@ RetroUI.prototype.newColour = function(colour) {
}; };
RetroUI.prototype.beat = function(beats, index) { RetroUI.prototype.beat = function(beats, index) {
var rest = beats.slice(1); let rest = beats.slice(1);
this.beatBar.textContent = ">>" + rest; this.beatBar.textContent = ">>" + rest;
if(index < 0) { if(index < 0) {
index = 0; index = 0;
@ -451,17 +451,17 @@ WeedUI.prototype.initUI = function() {
this.controls.className = "hues-w-controls"; this.controls.className = "hues-w-controls";
this.subControls.className = "hues-w-subcontrols"; this.subControls.className = "hues-w-subcontrols";
var beatBar = document.createElement("div"); let beatBar = document.createElement("div");
beatBar.className = "hues-w-beatbar"; beatBar.className = "hues-w-beatbar";
this.root.appendChild(beatBar); this.root.appendChild(beatBar);
this.beatBar = beatBar; this.beatBar = beatBar;
var beatLeft = document.createElement("div"); let beatLeft = document.createElement("div");
beatLeft.className = "hues-w-beatleft"; beatLeft.className = "hues-w-beatleft";
beatBar.appendChild(beatLeft); beatBar.appendChild(beatLeft);
this.beatLeft = beatLeft; this.beatLeft = beatLeft;
var beatRight = document.createElement("div"); let beatRight = document.createElement("div");
beatRight.className = "hues-w-beatright"; beatRight.className = "hues-w-beatright";
beatBar.appendChild(beatRight); beatBar.appendChild(beatRight);
this.beatRight = beatRight; this.beatRight = beatRight;
@ -482,7 +482,7 @@ WeedUI.prototype.toggleHide = function() {
}; };
WeedUI.prototype.beat = function(beats, index) { WeedUI.prototype.beat = function(beats, index) {
var rest = beats.slice(1); let rest = beats.slice(1);
this.beatLeft.textContent = rest; this.beatLeft.textContent = rest;
this.beatRight.textContent = rest; this.beatRight.textContent = rest;
@ -493,12 +493,12 @@ WeedUI.prototype.beat = function(beats, index) {
this.beatCount.textContent = "B=" + this.intToHex4(index); this.beatCount.textContent = "B=" + this.intToHex4(index);
if(["x", "o", "X", "O"].indexOf(beats[0]) != -1) { if(["x", "o", "X", "O"].indexOf(beats[0]) != -1) {
var beatCenter = document.createElement("div"); let beatCenter = document.createElement("div");
beatCenter.className = "hues-w-beataccent"; beatCenter.className = "hues-w-beataccent";
var rot = this.round10(15 - Math.random() * 30); let rot = this.round10(15 - Math.random() * 30);
var x = this.round10(- this.xVariance / 2 + Math.random() * this.xVariance); let x = this.round10(- this.xVariance / 2 + Math.random() * this.xVariance);
var y = this.round10(30 - this.yVariance / 2 + Math.random() * this.yVariance); let y = this.round10(30 - this.yVariance / 2 + Math.random() * this.yVariance);
var transform = "rotate(" + rot + "deg) translate(" + x + "px, " + y + "px)"; let transform = "rotate(" + rot + "deg) translate(" + x + "px, " + y + "px)";
beatCenter.style.MozTransform = transform; beatCenter.style.MozTransform = transform;
beatCenter.style.webkitTransform = transform; beatCenter.style.webkitTransform = transform;
beatCenter.style.transform = transform; beatCenter.style.transform = transform;
@ -546,7 +546,7 @@ ModernUI.prototype.initUI = function() {
this.imageName.className = "hues-m-imagename"; this.imageName.className = "hues-m-imagename";
this.songName.className = "hues-m-songtitle"; this.songName.className = "hues-m-songtitle";
var controls = document.createElement("div"); let controls = document.createElement("div");
controls.className = "hues-m-controls"; controls.className = "hues-m-controls";
this.root.appendChild(controls); this.root.appendChild(controls);
this.controls = controls; this.controls = controls;
@ -554,7 +554,7 @@ ModernUI.prototype.initUI = function() {
controls.appendChild(this.imageName); controls.appendChild(this.imageName);
controls.appendChild(this.songName); controls.appendChild(this.songName);
var leftBox = document.createElement("div"); let leftBox = document.createElement("div");
leftBox.className = "hues-m-leftbox"; leftBox.className = "hues-m-leftbox";
controls.appendChild(leftBox); controls.appendChild(leftBox);
this.leftBox = leftBox; this.leftBox = leftBox;
@ -562,7 +562,7 @@ ModernUI.prototype.initUI = function() {
this.hueName.className = "hues-m-huename"; this.hueName.className = "hues-m-huename";
leftBox.appendChild(this.hueName); leftBox.appendChild(this.hueName);
var volCluster = document.createElement("div"); let volCluster = document.createElement("div");
volCluster.className = "hues-m-vol-cluster"; volCluster.className = "hues-m-vol-cluster";
leftBox.appendChild(volCluster); leftBox.appendChild(volCluster);
@ -572,12 +572,12 @@ ModernUI.prototype.initUI = function() {
this.hideToggle.className = "hues-m-hide"; this.hideToggle.className = "hues-m-hide";
volCluster.appendChild(this.hideToggle); volCluster.appendChild(this.hideToggle);
var volBar = document.createElement("div"); let volBar = document.createElement("div");
volBar.className = "hues-m-vol-bar"; volBar.className = "hues-m-vol-bar";
this.volBar = volBar; this.volBar = volBar;
volCluster.appendChild(volBar); volCluster.appendChild(volBar);
var label = document.createElement("div"); let label = document.createElement("div");
label.textContent = "VOL"; label.textContent = "VOL";
label.className = "hues-m-vol-label"; label.className = "hues-m-vol-label";
label.onclick = () => { label.onclick = () => {
@ -594,7 +594,7 @@ ModernUI.prototype.initUI = function() {
}; };
volCluster.appendChild(this.infoToggle); volCluster.appendChild(this.infoToggle);
var input = document.createElement("input"); let input = document.createElement("input");
input.type = "range"; input.type = "range";
input.min = 0; input.min = 0;
input.max = 1; input.max = 1;
@ -605,18 +605,18 @@ ModernUI.prototype.initUI = function() {
this.core.soundManager.setVolume(parseFloat(input.value)); this.core.soundManager.setVolume(parseFloat(input.value));
}; };
var rightBox = document.createElement("div"); let rightBox = document.createElement("div");
rightBox.className = "hues-m-rightbox"; rightBox.className = "hues-m-rightbox";
controls.appendChild(rightBox); controls.appendChild(rightBox);
this.rightBox = rightBox; this.rightBox = rightBox;
//Song/image controls //Song/image controls
var songs = document.createElement("div"); let songs = document.createElement("div");
songs.className = "hues-m-controlblock"; songs.className = "hues-m-controlblock";
this.songBlock = songs; this.songBlock = songs;
this.songList.className = "hues-m-songbutton"; this.songList.className = "hues-m-songbutton";
var songControls = document.createElement("div"); let songControls = document.createElement("div");
songControls.className = "hues-m-controlbuttons"; songControls.className = "hues-m-controlbuttons";
this.songPrev.className = "hues-m-prevbutton"; this.songPrev.className = "hues-m-prevbutton";
this.songNext.className = "hues-m-nextbutton"; this.songNext.className = "hues-m-nextbutton";
@ -631,12 +631,12 @@ ModernUI.prototype.initUI = function() {
songs.appendChild(songControls); songs.appendChild(songControls);
rightBox.appendChild(songs); rightBox.appendChild(songs);
var images = document.createElement("div"); let images = document.createElement("div");
images.className = "hues-m-controlblock"; images.className = "hues-m-controlblock";
this.imageList.className = "hues-m-songbutton"; this.imageList.className = "hues-m-songbutton";
this.imageBlock = images; this.imageBlock = images;
var imageControls = document.createElement("div"); let imageControls = document.createElement("div");
imageControls.className = "hues-m-controlbuttons"; imageControls.className = "hues-m-controlbuttons";
this.imageMode = document.createElement("div"); this.imageMode = document.createElement("div");
@ -652,9 +652,9 @@ ModernUI.prototype.initUI = function() {
images.appendChild(imageControls); images.appendChild(imageControls);
rightBox.appendChild(images); rightBox.appendChild(images);
var leftInfo = document.createElement("div"); let leftInfo = document.createElement("div");
leftInfo.className = "hues-m-leftinfo"; leftInfo.className = "hues-m-leftinfo";
var rightInfo = document.createElement("div"); let rightInfo = document.createElement("div");
rightInfo.className = "hues-m-rightinfo"; rightInfo.className = "hues-m-rightinfo";
leftInfo.appendChild(this.xBlur); leftInfo.appendChild(this.xBlur);
leftInfo.appendChild(this.yBlur); leftInfo.appendChild(this.yBlur);
@ -668,22 +668,22 @@ ModernUI.prototype.initUI = function() {
this.visualiserContainer.className = "hues-m-visualisercontainer"; this.visualiserContainer.className = "hues-m-visualisercontainer";
controls.appendChild(this.visualiserContainer); controls.appendChild(this.visualiserContainer);
var beatBar = document.createElement("div"); let beatBar = document.createElement("div");
beatBar.className = "hues-m-beatbar"; beatBar.className = "hues-m-beatbar";
this.root.appendChild(beatBar); this.root.appendChild(beatBar);
this.beatBar = beatBar; this.beatBar = beatBar;
var beatLeft = document.createElement("div"); let beatLeft = document.createElement("div");
beatLeft.className = "hues-m-beatleft"; beatLeft.className = "hues-m-beatleft";
beatBar.appendChild(beatLeft); beatBar.appendChild(beatLeft);
this.beatLeft = beatLeft; this.beatLeft = beatLeft;
var beatRight = document.createElement("div"); let beatRight = document.createElement("div");
beatRight.className = "hues-m-beatright"; beatRight.className = "hues-m-beatright";
beatBar.appendChild(beatRight); beatBar.appendChild(beatRight);
this.beatRight = beatRight; this.beatRight = beatRight;
var beatCenter = document.createElement("div"); let beatCenter = document.createElement("div");
beatCenter.className = "hues-m-beatcenter"; beatCenter.className = "hues-m-beatcenter";
this.root.appendChild(beatCenter); this.root.appendChild(beatCenter);
this.beatCenter = beatCenter; this.beatCenter = beatCenter;
@ -739,7 +739,7 @@ ModernUI.prototype.newMode = function(isAuto) {
ModernUI.prototype.beat = function(beats, index) { ModernUI.prototype.beat = function(beats, index) {
this.currentBeat = beats[0]; this.currentBeat = beats[0];
var rest = beats.slice(1); let rest = beats.slice(1);
this.beatLeft.textContent = rest; this.beatLeft.textContent = rest;
this.beatRight.textContent = rest; this.beatRight.textContent = rest;
@ -749,7 +749,7 @@ ModernUI.prototype.beat = function(beats, index) {
while (this.beatCenter.firstElementChild) { while (this.beatCenter.firstElementChild) {
this.beatCenter.removeChild(this.beatCenter.firstElementChild); this.beatCenter.removeChild(this.beatCenter.firstElementChild);
} }
var span = this.beatCenter.ownerDocument.createElement("span"); let span = this.beatCenter.ownerDocument.createElement("span");
span.textContent = this.currentBeat; span.textContent = this.currentBeat;
this.beatCenter.appendChild(span); this.beatCenter.appendChild(span);
} }
@ -824,35 +824,35 @@ function XmasUI() {
this.lights = []; this.lights = [];
var wires = document.createElement("div"); let wires = document.createElement("div");
wires.className = "hues-x-wires"; wires.className = "hues-x-wires";
var left = document.createElement("div"); let left = document.createElement("div");
left.className = "hues-x-wiresleft"; left.className = "hues-x-wiresleft";
xleft.forEach(function(l, i, a) { xleft.forEach(function(l, i, a) {
var light = this.newLight(l, left); let light = this.newLight(l, left);
light.style.transform = "rotate(" + l.angle + "deg)"; light.style.transform = "rotate(" + l.angle + "deg)";
light.style.left = l.x + "px"; light.style.left = l.x + "px";
light.style.top = l.y + "px"; light.style.top = l.y + "px";
this.lights.push(light); this.lights.push(light);
}, this); }, this);
var right = document.createElement("div"); let right = document.createElement("div");
right.className = "hues-x-wiresright"; right.className = "hues-x-wiresright";
xright.forEach(function(l, i, a) { xright.forEach(function(l, i, a) {
var light = this.newLight(l, right); let light = this.newLight(l, right);
light.style.transform = "rotate(" + (-l.angle) + "deg)"; light.style.transform = "rotate(" + (-l.angle) + "deg)";
light.style.right = l.x + "px"; light.style.right = l.x + "px";
light.style.top = l.y + "px"; light.style.top = l.y + "px";
this.lights.push(light); this.lights.push(light);
}, this); }, this);
var bottomHelper = document.createElement("div"); let bottomHelper = document.createElement("div");
bottomHelper.className = "hues-x-wiresbottomhelper"; bottomHelper.className = "hues-x-wiresbottomhelper";
var bottom = document.createElement("div"); let bottom = document.createElement("div");
bottom.className = "hues-x-wiresbottom"; bottom.className = "hues-x-wiresbottom";
xbottom.forEach(function(l, i, a) { xbottom.forEach(function(l, i, a) {
var light = this.newLight(l, bottom); let light = this.newLight(l, bottom);
light.style.transform = "rotate(" + l.angle + "deg)"; light.style.transform = "rotate(" + l.angle + "deg)";
light.style.left = l.x + "px"; light.style.left = l.x + "px";
light.style.bottom = l.y + "px"; light.style.bottom = l.y + "px";
@ -899,7 +899,7 @@ XmasUI.prototype.lightFadeOut = function(light) {
}; };
XmasUI.prototype.lightRecolour = function(light) { XmasUI.prototype.lightRecolour = function(light) {
var hue = Math.floor(Math.random() * 7) * -56; let hue = Math.floor(Math.random() * 7) * -56;
light.on.style.backgroundPosition = hue + "px, 0, center"; light.on.style.backgroundPosition = hue + "px, 0, center";
light.off.style.backgroundPosition = hue + "px, 0, center"; light.off.style.backgroundPosition = hue + "px, 0, center";
}; };
@ -913,11 +913,11 @@ XmasUI.prototype.randomLight = function(light) {
}; };
XmasUI.prototype.newLight = function(l, parent) { XmasUI.prototype.newLight = function(l, parent) {
var light = document.createElement("div"); let light = document.createElement("div");
light.className = "hues-x-light"; light.className = "hues-x-light";
var bulb = document.createElement("div"); let bulb = document.createElement("div");
var on = document.createElement("div"); let on = document.createElement("div");
var off = document.createElement("div"); let off = document.createElement("div");
bulb.appendChild(on); bulb.appendChild(on);
bulb.appendChild(off); bulb.appendChild(off);
light.appendChild(bulb); light.appendChild(bulb);
@ -994,33 +994,33 @@ HalloweenUI.prototype.initUI = function() {
this.xBlur.className = "hues-h-textfade"; this.xBlur.className = "hues-h-textfade";
this.yBlur.className = "hues-h-textfade"; this.yBlur.className = "hues-h-textfade";
var leftBoxTomb = document.createElement("div"); let leftBoxTomb = document.createElement("div");
leftBoxTomb.className = "hues-h-tombstone"; leftBoxTomb.className = "hues-h-tombstone";
this.leftBox.appendChild(leftBoxTomb); this.leftBox.appendChild(leftBoxTomb);
var songTomb = document.createElement("div"); let songTomb = document.createElement("div");
songTomb.className = "hues-h-tombstone"; songTomb.className = "hues-h-tombstone";
this.songBlock.insertBefore(songTomb,this.songBlock.firstChild); this.songBlock.insertBefore(songTomb,this.songBlock.firstChild);
var imageTomb = document.createElement("div"); let imageTomb = document.createElement("div");
imageTomb.className = "hues-h-tombstone"; imageTomb.className = "hues-h-tombstone";
this.imageBlock.insertBefore(imageTomb,this.imageBlock.firstChild); this.imageBlock.insertBefore(imageTomb,this.imageBlock.firstChild);
var topLeft = document.createElement("div"); let topLeft = document.createElement("div");
topLeft.className = "hues-h-topleft"; topLeft.className = "hues-h-topleft";
var topRight = document.createElement("div"); let topRight = document.createElement("div");
topRight.className = "hues-h-topright"; topRight.className = "hues-h-topright";
var bottomRight = document.createElement("div"); let bottomRight = document.createElement("div");
bottomRight.className = "hues-h-bottomright"; bottomRight.className = "hues-h-bottomright";
this.root.appendChild(topLeft); this.root.appendChild(topLeft);
this.root.appendChild(topRight); this.root.appendChild(topRight);
this.root.appendChild(bottomRight); this.root.appendChild(bottomRight);
var leftHand = document.createElement("div"); let leftHand = document.createElement("div");
leftHand.className = "hues-h-left-hand"; leftHand.className = "hues-h-left-hand";
this.beatBar.appendChild(leftHand); this.beatBar.appendChild(leftHand);
var rightHand = document.createElement("div"); let rightHand = document.createElement("div");
rightHand.className = "hues-h-right-hand"; rightHand.className = "hues-h-right-hand";
this.beatBar.appendChild(rightHand); this.beatBar.appendChild(rightHand);
@ -1035,7 +1035,7 @@ HalloweenUI.prototype.beat = function(beats, index) {
ModernUI.prototype.beat.call(this, beats, index); ModernUI.prototype.beat.call(this, beats, index);
if (this.currentBeat != ".") { if (this.currentBeat != ".") {
var eyes = this.beatCenter.ownerDocument.createElement("div"); let eyes = this.beatCenter.ownerDocument.createElement("div");
eyes.className = "hues-m-beatcenter hues-h-eyes"; eyes.className = "hues-m-beatcenter hues-h-eyes";
this.beatCenter.appendChild(eyes); this.beatCenter.appendChild(eyes);
} }
@ -1064,7 +1064,7 @@ HalloweenUI.prototype.disconnect = function() {
}; };
// Positions and angles for the Xmas lights // Positions and angles for the Xmas lights
var xleft = [ let xleft = [
{"angle": 122.529582194, "x": 19.4, "y": -19.35}, {"angle": 122.529582194, "x": 19.4, "y": -19.35},
{"angle": 92.5309436511, "x": 25.4, "y": 38.7}, {"angle": 92.5309436511, "x": 25.4, "y": 38.7},
{"angle": 107.530202659, "x": 39.4, "y": 107.75}, {"angle": 107.530202659, "x": 39.4, "y": 107.75},
@ -1083,7 +1083,7 @@ var xleft = [
{"angle": 74.9981580491, "x": 45.75, "y": 1158.5}, {"angle": 74.9981580491, "x": 45.75, "y": 1158.5},
{"angle": 88.3307935055, "x": 35.85, "y": 1238.55} {"angle": 88.3307935055, "x": 35.85, "y": 1238.55}
]; ];
var xright = [ let xright = [
{"angle": 120.001009518, "x": 33.3, "y": -29.75}, {"angle": 120.001009518, "x": 33.3, "y": -29.75},
{"angle": 90.0026227926, "x": 35.35, "y": 53.65}, {"angle": 90.0026227926, "x": 35.35, "y": 53.65},
{"angle": 102.469029922, "x": 41.5, "y": 136.5}, {"angle": 102.469029922, "x": 41.5, "y": 136.5},
@ -1103,7 +1103,7 @@ var xright = [
{"angle": 87.4690563489, "x": 40.45, "y": 1119.9}, {"angle": 87.4690563489, "x": 40.45, "y": 1119.9},
{"angle": 102.46813454, "x": 20.9, "y": 1193.85} {"angle": 102.46813454, "x": 20.9, "y": 1193.85}
]; ];
var xbottom = [ let xbottom = [
{"angle": 32.5804579323, "x": 110.35, "y": -12.1}, {"angle": 32.5804579323, "x": 110.35, "y": -12.1},
{"angle": 3.28979777069, "x": 168.05, "y": -5.55}, {"angle": 3.28979777069, "x": 168.05, "y": -5.55},
{"angle": 17.6989154099, "x": 238.35, "y": 7.7}, {"angle": 17.6989154099, "x": 238.35, "y": 7.7},

174
src/js/ResourceManager.js
Unescape View File

@ -23,7 +23,7 @@
"use strict"; "use strict";
// NOTE: Any packs referenced need CORS enabled or loads fail // NOTE: Any packs referenced need CORS enabled or loads fail
var packsURL = "http://cdn.0x40hu.es/getRespacks.php"; let packsURL = "http://cdn.0x40hu.es/getRespacks.php";
function Resources(core) { function Resources(core) {
this.core = core; this.core = core;
@ -84,9 +84,9 @@ Resources.prototype.addAll = function(urls, progressCallback) {
this.progressState = Array.apply(null, Array(urls.length)).map(Number.prototype.valueOf,0); this.progressState = Array.apply(null, Array(urls.length)).map(Number.prototype.valueOf,0);
} }
var respackPromises = []; let respackPromises = [];
var progressFunc = function(index, progress, pack) { let progressFunc = function(index, progress, pack) {
this.progressState[index] = progress; this.progressState[index] = progress;
this.updateProgress(pack); this.updateProgress(pack);
}; };
@ -106,7 +106,7 @@ Resources.prototype.addAll = function(urls, progressCallback) {
}; };
Resources.prototype.updateProgress = function(pack) { Resources.prototype.updateProgress = function(pack) {
var total = 0; let total = 0;
for(let i = 0; i < this.progressState.length; i++) { for(let i = 0; i < this.progressState.length; i++) {
total += this.progressState[i]; total += this.progressState[i];
} }
@ -116,13 +116,13 @@ Resources.prototype.updateProgress = function(pack) {
Resources.prototype.addPack = function(pack) { Resources.prototype.addPack = function(pack) {
console.log("Added", pack.name, "to respacks"); console.log("Added", pack.name, "to respacks");
var id = this.resourcePacks.length; let id = this.resourcePacks.length;
this.resourcePacks.push(pack); this.resourcePacks.push(pack);
this.addResourcesToArrays(pack); this.addResourcesToArrays(pack);
this.rebuildEnabled(); this.rebuildEnabled();
this.updateTotals(); this.updateTotals();
var self = this; let self = this;
this.appendListItem("respacks", pack.name, "res" + id, this.packsView.respackList, this.appendListItem("respacks", pack.name, "res" + id, this.packsView.respackList,
function() { function() {
pack.enabled = this.checked; pack.enabled = this.checked;
@ -153,7 +153,7 @@ Resources.prototype.rebuildEnabled = function() {
this.enabledImages = []; this.enabledImages = [];
for(let i = 0; i < this.resourcePacks.length; i++) { for(let i = 0; i < this.resourcePacks.length; i++) {
var pack = this.resourcePacks[i]; let pack = this.resourcePacks[i];
if (pack.enabled !== true) { if (pack.enabled !== true) {
continue; continue;
} }
@ -171,11 +171,11 @@ Resources.prototype.rebuildEnabled = function() {
} }
} }
if(this.hasUI) { if(this.hasUI) {
var songList = this.enabledSongList; let songList = this.enabledSongList;
while(songList.firstElementChild) { while(songList.firstElementChild) {
songList.removeChild(songList.firstElementChild); songList.removeChild(songList.firstElementChild);
} }
var imageList = this.enabledImageList; let imageList = this.enabledImageList;
while(imageList.firstElementChild) { while(imageList.firstElementChild) {
imageList.removeChild(imageList.firstElementChild); imageList.removeChild(imageList.firstElementChild);
} }
@ -197,7 +197,7 @@ Resources.prototype.rebuildEnabled = function() {
}; };
Resources.prototype.removePack = function(pack) { Resources.prototype.removePack = function(pack) {
var index = this.resourcePacks.indexOf(pack); let index = this.resourcePacks.indexOf(pack);
if (index != -1) { if (index != -1) {
this.resourcePacks.splice(index, 1); this.resourcePacks.splice(index, 1);
this.rebuildArrays(); this.rebuildArrays();
@ -210,7 +210,7 @@ Resources.prototype.removeAllPacks = function() {
}; };
Resources.prototype.getSongNames = function() { Resources.prototype.getSongNames = function() {
var names = []; let names = [];
for(let i = 0; i < this.allSongs.length; i++) { for(let i = 0; i < this.allSongs.length; i++) {
names.push(this.allSongs[i]); names.push(this.allSongs[i]);
} }
@ -220,8 +220,8 @@ Resources.prototype.getSongNames = function() {
Resources.prototype.loadLocal = function() { Resources.prototype.loadLocal = function() {
console.log("Loading local zip(s)"); console.log("Loading local zip(s)");
var files = this.fileInput.files; let files = this.fileInput.files;
var p = Promise.resolve(); let p = Promise.resolve();
for(let i = 0; i < files.length; i++) { for(let i = 0; i < files.length; i++) {
let r = new Respack(); let r = new Respack();
/*jshint -W083 */ /*jshint -W083 */
@ -250,7 +250,7 @@ Resources.prototype.localProgress = function(progress, respack) {
}; };
Resources.prototype.localComplete = function(progress) { Resources.prototype.localComplete = function(progress) {
var progStat = this.packsView.progressStatus; let progStat = this.packsView.progressStatus;
progStat.textContent = "Complete"; progStat.textContent = "Complete";
window.setTimeout(function() {progStat.textContent = "Idle";}, 2000); window.setTimeout(function() {progStat.textContent = "Idle";}, 2000);
@ -263,20 +263,20 @@ Resources.prototype.localComplete = function(progress) {
Resources.prototype.initUI = function() { Resources.prototype.initUI = function() {
this.root = document.getElementById("huesResources"); this.root = document.getElementById("huesResources");
var packsContainer = document.createElement("div"); let packsContainer = document.createElement("div");
packsContainer.className = "res-packscontainer"; packsContainer.className = "res-packscontainer";
var packHeader = document.createElement("div"); let packHeader = document.createElement("div");
packHeader.textContent = "Current respacks"; packHeader.textContent = "Current respacks";
packHeader.className = "res-header"; packHeader.className = "res-header";
packHeader.id = "res-curheader"; packHeader.id = "res-curheader";
var packList = document.createElement("div"); let packList = document.createElement("div");
packList.className = "res-list"; packList.className = "res-list";
packList.id = "res-packlist"; packList.id = "res-packlist";
this.packsView.respackList = packList; this.packsView.respackList = packList;
// 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
var remoteHeader = null; let remoteHeader = null;
var remoteList = null; let remoteList = null;
if(!this.core.settings.defaults.disableRemoteResources) { if(!this.core.settings.defaults.disableRemoteResources) {
remoteHeader = document.createElement("div"); remoteHeader = document.createElement("div");
remoteHeader.textContent = "Remote respacks"; remoteHeader.textContent = "Remote respacks";
@ -291,13 +291,13 @@ Resources.prototype.initUI = function() {
packList.className += " noremotes"; packList.className += " noremotes";
} }
var buttons = document.createElement("div"); let buttons = document.createElement("div");
buttons.className = "res-buttons"; buttons.className = "res-buttons";
var loadRemote = document.createElement("div"); let loadRemote = document.createElement("div");
loadRemote.className = "hues-button hidden"; loadRemote.className = "hues-button hidden";
loadRemote.textContent = "LOAD REMOTE"; loadRemote.textContent = "LOAD REMOTE";
loadRemote.onclick = this.loadCurrentRemote.bind(this); loadRemote.onclick = this.loadCurrentRemote.bind(this);
var loadLocal = document.createElement("div"); let loadLocal = document.createElement("div");
loadLocal.className = "hues-button"; loadLocal.className = "hues-button";
loadLocal.textContent = "LOAD ZIPS"; loadLocal.textContent = "LOAD ZIPS";
loadLocal.onclick = () => {this.fileInput.click();}; loadLocal.onclick = () => {this.fileInput.click();};
@ -311,25 +311,25 @@ Resources.prototype.initUI = function() {
this.fileInput.multiple = true; this.fileInput.multiple = true;
this.fileInput.onchange = this.loadLocal.bind(this); this.fileInput.onchange = this.loadLocal.bind(this);
var progressContainer = document.createElement("div"); let progressContainer = document.createElement("div");
progressContainer.id = "res-progress-container"; progressContainer.id = "res-progress-container";
var progressBar = document.createElement("div"); let progressBar = document.createElement("div");
progressBar.id = "res-progress-bar"; progressBar.id = "res-progress-bar";
var progressFilled = document.createElement("span"); let progressFilled = document.createElement("span");
progressFilled.id = "res-progress-filled"; progressFilled.id = "res-progress-filled";
progressBar.appendChild(progressFilled); progressBar.appendChild(progressFilled);
var progressStatus = document.createElement("div"); let progressStatus = document.createElement("div");
progressStatus.textContent = "Idle"; progressStatus.textContent = "Idle";
var progressTexts = document.createElement("div"); let progressTexts = document.createElement("div");
progressTexts.id = "res-progress-texts"; progressTexts.id = "res-progress-texts";
var progressCurrent = document.createElement("div"); let progressCurrent = document.createElement("div");
progressCurrent.id = "res-progress-current"; progressCurrent.id = "res-progress-current";
progressCurrent.textContent = "0b"; progressCurrent.textContent = "0b";
var progressTop = document.createElement("div"); let progressTop = document.createElement("div");
progressTop.id = "res-progress-top"; progressTop.id = "res-progress-top";
progressTop.textContent = "0b"; progressTop.textContent = "0b";
var progressPercent = document.createElement("div"); let progressPercent = document.createElement("div");
progressPercent.id = "res-progress-percent"; progressPercent.id = "res-progress-percent";
progressPercent.textContent = "0%"; progressPercent.textContent = "0%";
progressTexts.appendChild(progressCurrent); progressTexts.appendChild(progressCurrent);
@ -354,73 +354,73 @@ Resources.prototype.initUI = function() {
packsContainer.appendChild(buttons); packsContainer.appendChild(buttons);
packsContainer.appendChild(progressContainer); packsContainer.appendChild(progressContainer);
var indivView = document.createElement("div"); let indivView = document.createElement("div");
indivView.className = "res-packcontainer"; indivView.className = "res-packcontainer";
var packName = document.createElement("div"); let packName = document.createElement("div");
packName.textContent = "<select a respack>"; packName.textContent = "<select a respack>";
var packInfo = document.createElement("div"); let packInfo = document.createElement("div");
packInfo.id = "res-packinfo"; packInfo.id = "res-packinfo";
var packCreator = document.createElement("div"); let packCreator = document.createElement("div");
packCreator.id = "res-packcreator"; packCreator.id = "res-packcreator";
var packCreatorText = document.createElement("a"); let packCreatorText = document.createElement("a");
packCreatorText.textContent = "<author>"; packCreatorText.textContent = "<author>";
packCreator.appendChild(packCreatorText); packCreator.appendChild(packCreatorText);
packInfo.appendChild(packCreator); packInfo.appendChild(packCreator);
var packSize = document.createElement("div"); let packSize = document.createElement("div");
packSize.textContent = "0b"; packSize.textContent = "0b";
packInfo.appendChild(packSize); packInfo.appendChild(packSize);
var packDesc = document.createElement("div"); let packDesc = document.createElement("div");
packDesc.id = "res-packdesc"; packDesc.id = "res-packdesc";
packDesc.textContent = "<no description>"; packDesc.textContent = "<no description>";
var packTabs = document.createElement("div"); let packTabs = document.createElement("div");
packTabs.id = "res-packtabs"; packTabs.id = "res-packtabs";
var songCheck = document.createElement("input"); let songCheck = document.createElement("input");
songCheck.type = "radio"; songCheck.type = "radio";
songCheck.name = "packtab"; songCheck.name = "packtab";
songCheck.value = "songs"; songCheck.value = "songs";
songCheck.checked = true; songCheck.checked = true;
songCheck.id = "res-songtab"; songCheck.id = "res-songtab";
var songCount = document.createElement("label"); let songCount = document.createElement("label");
songCount.textContent = "Songs:"; songCount.textContent = "Songs:";
songCount.htmlFor = "res-songtab"; songCount.htmlFor = "res-songtab";
packTabs.appendChild(songCheck); packTabs.appendChild(songCheck);
packTabs.appendChild(songCount); packTabs.appendChild(songCount);
var imageCheck = document.createElement("input"); let imageCheck = document.createElement("input");
imageCheck.type = "radio"; imageCheck.type = "radio";
imageCheck.name = "packtab"; imageCheck.name = "packtab";
imageCheck.value = "images"; imageCheck.value = "images";
imageCheck.id = "res-imagetab"; imageCheck.id = "res-imagetab";
var imageCount = document.createElement("label"); let imageCount = document.createElement("label");
imageCount.textContent = "Images:"; imageCount.textContent = "Images:";
imageCount.htmlFor = "res-imagetab"; imageCount.htmlFor = "res-imagetab";
packTabs.appendChild(imageCheck); packTabs.appendChild(imageCheck);
packTabs.appendChild(imageCount); packTabs.appendChild(imageCount);
var songList = document.createElement("div"); let songList = document.createElement("div");
songList.id = "res-songlist"; songList.id = "res-songlist";
songList.className = "res-list"; songList.className = "res-list";
var imageList = document.createElement("div"); let imageList = document.createElement("div");
imageList.id = "res-imagelist"; imageList.id = "res-imagelist";
imageList.className = "res-list"; imageList.className = "res-list";
packTabs.appendChild(songList); packTabs.appendChild(songList);
packTabs.appendChild(imageList); packTabs.appendChild(imageList);
var packButtons = document.createElement("div"); let packButtons = document.createElement("div");
packButtons.className = "res-buttons hidden"; packButtons.className = "res-buttons hidden";
packButtons.id = "res-packbuttons"; packButtons.id = "res-packbuttons";
var enableAll = document.createElement("div"); let enableAll = document.createElement("div");
enableAll.textContent = "ENABLE ALL"; enableAll.textContent = "ENABLE ALL";
enableAll.className = "hues-button"; enableAll.className = "hues-button";
enableAll.onclick = this.enableAll.bind(this); enableAll.onclick = this.enableAll.bind(this);
var invert = document.createElement("div"); let invert = document.createElement("div");
invert.textContent = "INVERT"; invert.textContent = "INVERT";
invert.className = "hues-button"; invert.className = "hues-button";
invert.onclick = this.invert.bind(this); invert.onclick = this.invert.bind(this);
var disableAll = document.createElement("div"); let disableAll = document.createElement("div");
disableAll.textContent = "DISABLE ALL"; disableAll.textContent = "DISABLE ALL";
disableAll.className = "hues-button"; disableAll.className = "hues-button";
disableAll.onclick = this.disableAll.bind(this); disableAll.onclick = this.disableAll.bind(this);
@ -428,21 +428,21 @@ Resources.prototype.initUI = function() {
packButtons.appendChild(invert); packButtons.appendChild(invert);
packButtons.appendChild(disableAll); packButtons.appendChild(disableAll);
var totalCounts = document.createElement("div"); let totalCounts = document.createElement("div");
totalCounts.id = "res-countscontainer"; totalCounts.id = "res-countscontainer";
var totalSongsCont = document.createElement("div"); let totalSongsCont = document.createElement("div");
var totalSongsLabel = document.createElement("span"); let totalSongsLabel = document.createElement("span");
totalSongsLabel.textContent = "Total Songs:"; totalSongsLabel.textContent = "Total Songs:";
var totalSongs = document.createElement("span"); let totalSongs = document.createElement("span");
totalSongs.className = "res-counts"; totalSongs.className = "res-counts";
totalSongsCont.appendChild(totalSongsLabel); totalSongsCont.appendChild(totalSongsLabel);
totalSongsCont.appendChild(totalSongs); totalSongsCont.appendChild(totalSongs);
var totalImagesCont = document.createElement("div"); let totalImagesCont = document.createElement("div");
var totalImagesLabel = document.createElement("span"); let totalImagesLabel = document.createElement("span");
totalImagesLabel.textContent = "Total images:"; totalImagesLabel.textContent = "Total images:";
var totalImages = document.createElement("span"); let totalImages = document.createElement("span");
totalImages.className = "res-counts"; totalImages.className = "res-counts";
totalImagesCont.appendChild(totalImagesLabel); totalImagesCont.appendChild(totalImagesLabel);
totalImagesCont.appendChild(totalImages); totalImagesCont.appendChild(totalImages);
@ -525,7 +525,7 @@ Resources.prototype.truncateNum = function(num) {
}; };
Resources.prototype.selectPack = function(id) { Resources.prototype.selectPack = function(id) {
var pack = this.resourcePacks[id]; let pack = this.resourcePacks[id];
this.packView.pack = pack; this.packView.pack = pack;
this.packView.packButtons.className = "res-buttons"; this.packView.packButtons.className = "res-buttons";
@ -534,7 +534,7 @@ Resources.prototype.selectPack = function(id) {
this.packView.name.textContent = pack.name; this.packView.name.textContent = pack.name;
this.packView.creator.textContent = pack.author; this.packView.creator.textContent = pack.author;
this.packView.creator.href = pack.link ? pack.link : ""; this.packView.creator.href = pack.link ? pack.link : "";
var size = pack.size / 1024; let size = pack.size / 1024;
if(size < 512) { if(size < 512) {
this.packView.size.textContent = this.truncateNum(size) + "kB"; this.packView.size.textContent = this.truncateNum(size) + "kB";
} else { } else {
@ -544,8 +544,8 @@ Resources.prototype.selectPack = function(id) {
this.packView.songCount.textContent = "Songs: " + pack.songs.length; this.packView.songCount.textContent = "Songs: " + pack.songs.length;
this.packView.imageCount.textContent = "Images: " + pack.images.length; this.packView.imageCount.textContent = "Images: " + pack.images.length;
var songList = this.packView.songList; let songList = this.packView.songList;
var imageList = this.packView.imageList; let imageList = this.packView.imageList;
while (songList.firstElementChild) { while (songList.firstElementChild) {
songList.removeChild(songList.firstElementChild); songList.removeChild(songList.firstElementChild);
} }
@ -554,7 +554,7 @@ Resources.prototype.selectPack = function(id) {
} }
for(let i = 0; i < pack.songs.length; i++) { for(let i = 0; i < pack.songs.length; i++) {
var song = pack.songs[i]; let song = pack.songs[i];
this.appendListItem("songs", song.title, "song" + i, songList, this.appendListItem("songs", song.title, "song" + i, songList,
this.selectResourceCallback(song), this.selectResourceCallback(song),
this.clickResourceCallback.bind(this, song, true), this.clickResourceCallback.bind(this, song, true),
@ -562,7 +562,7 @@ Resources.prototype.selectPack = function(id) {
} }
for(let i = 0; i < pack.images.length; i++) { for(let i = 0; i < pack.images.length; i++) {
var image = pack.images[i]; let image = pack.images[i];
this.appendListItem("images", image.name, "image" + i, imageList, this.appendListItem("images", image.name, "image" + i, imageList,
this.selectResourceCallback(image), this.selectResourceCallback(image),
this.clickResourceCallback.bind(this, image, false), this.clickResourceCallback.bind(this, image, false),
@ -571,7 +571,7 @@ Resources.prototype.selectPack = function(id) {
}; };
Resources.prototype.selectResourceCallback = function(res) { Resources.prototype.selectResourceCallback = function(res) {
var self = this; let self = this;
return function() { return function() {
res.enabled = this.checked; res.enabled = this.checked;
self.rebuildEnabled(); self.rebuildEnabled();
@ -594,11 +594,11 @@ Resources.prototype.clickResourceCallback = function(res, isSong) {
}; };
Resources.prototype.getEnabledTabContents = function() { Resources.prototype.getEnabledTabContents = function() {
var pack = this.packView.pack; let pack = this.packView.pack;
if(!pack) { if(!pack) {
return null; return null;
} }
var ret = {arr: pack.images, let ret = {arr: pack.images,
elName: "image"}; elName: "image"};
if(document.getElementById("res-songtab").checked) { if(document.getElementById("res-songtab").checked) {
ret.arr = pack.songs; ret.arr = pack.songs;
@ -608,7 +608,7 @@ Resources.prototype.getEnabledTabContents = function() {
}; };
Resources.prototype.enableAll = function() { Resources.prototype.enableAll = function() {
var tab = this.getEnabledTabContents(); let tab = this.getEnabledTabContents();
if(!tab) if(!tab)
return; return;
for(let i = 0; i < tab.arr.length; i++) { for(let i = 0; i < tab.arr.length; i++) {
@ -619,7 +619,7 @@ Resources.prototype.enableAll = function() {
}; };
Resources.prototype.disableAll = function() { Resources.prototype.disableAll = function() {
var tab = this.getEnabledTabContents(); let tab = this.getEnabledTabContents();
if(!tab) if(!tab)
return; return;
for(let i = 0; i < tab.arr.length; i++) { for(let i = 0; i < tab.arr.length; i++) {
@ -630,7 +630,7 @@ Resources.prototype.disableAll = function() {
}; };
Resources.prototype.invert = function() { Resources.prototype.invert = function() {
var tab = this.getEnabledTabContents(); let tab = this.getEnabledTabContents();
if(!tab) if(!tab)
return; return;
for(let i = 0; i < tab.arr.length; i++) { for(let i = 0; i < tab.arr.length; i++) {
@ -645,18 +645,18 @@ Resources.prototype.appendListItem = function(name, value, id, root, oncheck, on
if(checked === undefined) { if(checked === undefined) {
checked = true; checked = true;
} }
var div = document.createElement("div"); let div = document.createElement("div");
div.className = "res-listitem"; div.className = "res-listitem";
var checkbox = document.createElement("input"); let checkbox = document.createElement("input");
checkbox.type = "checkbox"; checkbox.type = "checkbox";
checkbox.name = name; checkbox.name = name;
checkbox.value = value; checkbox.value = value;
checkbox.id = id; checkbox.id = id;
checkbox.checked = checked; checkbox.checked = checked;
checkbox.onclick = oncheck; checkbox.onclick = oncheck;
var checkStyler = document.createElement("label"); let checkStyler = document.createElement("label");
checkStyler.htmlFor = checkbox.id; checkStyler.htmlFor = checkbox.id;
var label = document.createElement("span"); let label = document.createElement("span");
label.textContent = value; label.textContent = value;
label.onclick = onclick; label.onclick = onclick;
div.appendChild(checkbox); div.appendChild(checkbox);
@ -666,13 +666,13 @@ Resources.prototype.appendListItem = function(name, value, id, root, oncheck, on
}; };
Resources.prototype.loadRemotes = function() { Resources.prototype.loadRemotes = function() {
var remoteList = this.packsView.remoteList; let remoteList = this.packsView.remoteList;
while(remoteList.firstElementChild) { while(remoteList.firstElementChild) {
remoteList.removeChild(remoteList.firstElementChild); remoteList.removeChild(remoteList.firstElementChild);
} }
var item = this.appendSimpleListItem("Loading...", remoteList); let item = this.appendSimpleListItem("Loading...", remoteList);
var req = new XMLHttpRequest(); let req = new XMLHttpRequest();
req.open('GET', packsURL, true); req.open('GET', packsURL, true);
req.responseType = 'json'; req.responseType = 'json';
req.onload = () => { req.onload = () => {
@ -690,7 +690,7 @@ Resources.prototype.loadRemotes = function() {
}; };
Resources.prototype.populateRemotes = function() { Resources.prototype.populateRemotes = function() {
var remoteList = this.packsView.remoteList; let remoteList = this.packsView.remoteList;
while(remoteList.firstElementChild) { while(remoteList.firstElementChild) {
remoteList.removeChild(remoteList.firstElementChild); remoteList.removeChild(remoteList.firstElementChild);
} }
@ -704,7 +704,7 @@ Resources.prototype.populateRemotes = function() {
}; };
Resources.prototype.selectRemotePack = function(id) { Resources.prototype.selectRemotePack = function(id) {
var pack = this.remotes[id]; let pack = this.remotes[id];
this.packView.pack = pack; this.packView.pack = pack;
this.packView.packButtons.className = "res-buttons hidden"; this.packView.packButtons.className = "res-buttons hidden";
@ -719,7 +719,7 @@ Resources.prototype.selectRemotePack = function(id) {
this.packView.name.textContent = pack.name; this.packView.name.textContent = pack.name;
this.packView.creator.textContent = pack.author; this.packView.creator.textContent = pack.author;
this.packView.creator.href = pack.link ? pack.link : ""; this.packView.creator.href = pack.link ? pack.link : "";
var size = pack.size / 1024; let size = pack.size / 1024;
if(size < 512) { if(size < 512) {
this.packView.size.textContent = this.truncateNum(size) + "kB"; this.packView.size.textContent = this.truncateNum(size) + "kB";
} else { } else {
@ -729,8 +729,8 @@ Resources.prototype.selectRemotePack = function(id) {
this.packView.songCount.textContent = "Songs: " + pack.songcount; this.packView.songCount.textContent = "Songs: " + pack.songcount;
this.packView.imageCount.textContent = "Images: " + pack.imagecount; this.packView.imageCount.textContent = "Images: " + pack.imagecount;
var songList = this.packView.songList; let songList = this.packView.songList;
var imageList = this.packView.imageList; let imageList = this.packView.imageList;
while (songList.firstElementChild) { while (songList.firstElementChild) {
songList.removeChild(songList.firstElementChild); songList.removeChild(songList.firstElementChild);
} }
@ -739,10 +739,10 @@ Resources.prototype.selectRemotePack = function(id) {
} }
for(let i = 0; i < pack.songs.length; i++) { for(let i = 0; i < pack.songs.length; i++) {
var song = pack.songs[i]; let song = pack.songs[i];
this.appendSimpleListItem(song, songList); this.appendSimpleListItem(song, songList);
} }
var moreSongs = pack.songcount - pack.songs.length; let moreSongs = pack.songcount - pack.songs.length;
if(moreSongs > 0) { if(moreSongs > 0) {
let text = "... and " + moreSongs + " more song"; let text = "... and " + moreSongs + " more song";
if(moreSongs > 1) { if(moreSongs > 1) {
@ -753,10 +753,10 @@ Resources.prototype.selectRemotePack = function(id) {
} }
for(let i = 0; i < pack.images.length; i++) { for(let i = 0; i < pack.images.length; i++) {
var image = pack.images[i]; let image = pack.images[i];
this.appendSimpleListItem(image, imageList); this.appendSimpleListItem(image, imageList);
} }
var moreImages = pack.imagecount - pack.images.length; let moreImages = pack.imagecount - pack.images.length;
if(moreImages > 0) { if(moreImages > 0) {
let text = "... and " + moreImages + " more image"; let text = "... and " + moreImages + " more image";
if(moreImages > 1) { if(moreImages > 1) {
@ -768,7 +768,7 @@ Resources.prototype.selectRemotePack = function(id) {
}; };
Resources.prototype.loadCurrentRemote = function() { Resources.prototype.loadCurrentRemote = function() {
var pack = this.packView.pack; let pack = this.packView.pack;
// Not actually a remote, ignore. How did you press this :< // Not actually a remote, ignore. How did you press this :<
if(pack.loaded === undefined || pack.loaded) { if(pack.loaded === undefined || pack.loaded) {
@ -802,7 +802,7 @@ Resources.prototype.remoteProgress = function(progress, respack) {
}; };
Resources.prototype.remoteComplete = function() { Resources.prototype.remoteComplete = function() {
var progStat = this.packsView.progressStatus; let progStat = this.packsView.progressStatus;
progStat.textContent = "Complete"; progStat.textContent = "Complete";
window.setTimeout(function() {progStat.textContent = "Idle";}, 2000); window.setTimeout(function() {progStat.textContent = "Idle";}, 2000);
this.packsView.loadRemote.textContent = "LOADED"; this.packsView.loadRemote.textContent = "LOADED";
@ -814,9 +814,9 @@ Resources.prototype.remoteComplete = function() {
}; };
Resources.prototype.appendSimpleListItem = function(value, root, onclick) { Resources.prototype.appendSimpleListItem = function(value, root, onclick) {
var div = document.createElement("div"); let div = document.createElement("div");
div.className = "res-listitem"; div.className = "res-listitem";
var label = document.createElement("span"); let label = document.createElement("span");
// Because we're using textContent, we replace with literal & // Because we're using textContent, we replace with literal &
label.textContent = value.replace(/&amp;/g, '&'); label.textContent = value.replace(/&amp;/g, '&');
label.onclick = onclick; label.onclick = onclick;

93
src/js/ResourcePack.js
Unescape View File

@ -22,7 +22,7 @@
(function(window, document) { (function(window, document) {
"use strict"; "use strict";
var debugConsole = false; let debugConsole = false;
function debug() { function debug() {
if(debugConsole) { if(debugConsole) {
console.log.apply(window.console, arguments); console.log.apply(window.console, arguments);
@ -63,7 +63,7 @@ Respack.prototype.animRegex = new RegExp("(.*?)_\\d+$");
Respack.prototype.updateProgress = function() { Respack.prototype.updateProgress = function() {
if(this.progressCallback) { if(this.progressCallback) {
var percent = this.filesLoaded / this.filesToLoad; let percent = this.filesLoaded / this.filesToLoad;
if(this.loadedFromURL) { if(this.loadedFromURL) {
percent = (percent / 2) + 0.5; percent = (percent / 2) + 0.5;
} }
@ -88,7 +88,7 @@ Respack.prototype.getBlob = function(url, progress) {
this.progressCallback = progress; this.progressCallback = progress;
} }
return new Promise ((resolve, reject) => { return new Promise ((resolve, reject) => {
var req = new XMLHttpRequest(); let req = new XMLHttpRequest();
req.open('GET', url, true); req.open('GET', url, true);
req.responseType = 'blob'; req.responseType = 'blob';
req.onload = () => { req.onload = () => {
@ -105,7 +105,7 @@ Respack.prototype.getBlob = function(url, progress) {
if (event.lengthComputable) { if (event.lengthComputable) {
this.size = event.total; this.size = event.total;
this.downloaded = event.loaded; this.downloaded = event.loaded;
var percent = event.loaded / event.total; let percent = event.loaded / event.total;
if(this.progressCallback) { if(this.progressCallback) {
this.progressCallback(percent / 2, this); // because of processing too this.progressCallback(percent / 2, this); // because of processing too
} }
@ -128,7 +128,7 @@ Respack.prototype.loadFromBlob = function(blob, progress) {
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.size = blob.size; this.size = blob.size;
var file = new zip.fs.FS(); let file = new zip.fs.FS();
file.importBlob(blob, file.importBlob(blob,
() => { () => {
resolve(file); resolve(file);
@ -145,7 +145,7 @@ Respack.prototype.loadFromBlob = function(blob, progress) {
}; };
Respack.prototype.parseZip = function(zip) { Respack.prototype.parseZip = function(zip) {
var entries = zip.entries; let entries = zip.entries;
this.totalFiles = 0; this.totalFiles = 0;
// Progress events // Progress events
@ -153,7 +153,7 @@ Respack.prototype.parseZip = function(zip) {
this.filesLoaded = 0; this.filesLoaded = 0;
// Get everything started // Get everything started
for(var i = 0; i < entries.length; i++) { for(let i = 0; i < entries.length; i++) {
if(!entries[i].directory && entries[i].name) { if(!entries[i].directory && entries[i].name) {
this.totalFiles++; this.totalFiles++;
this.parseFile(entries[i]); this.parseFile(entries[i]);
@ -176,7 +176,7 @@ Respack.prototype.parseZip = function(zip) {
}; };
Respack.prototype.parseFile = function(file) { Respack.prototype.parseFile = function(file) {
var name = file.name; let name = file.name;
if (name.match(this.audioExtensions)) { if (name.match(this.audioExtensions)) {
this.songQueue.push(this.parseSong(file)); this.songQueue.push(this.parseSong(file));
this.filesToLoad++; this.filesToLoad++;
@ -201,13 +201,13 @@ Respack.prototype.parseFile = function(file) {
}; };
Respack.prototype.parseSong = function(file) { Respack.prototype.parseSong = function(file) {
var name = file.name.replace(this.audioExtensions, ""); let name = file.name.replace(this.audioExtensions, "");
debug("parsing song: " + name); debug("parsing song: " + name);
if (this.containsSong(name)) { if (this.containsSong(name)) {
var oldSong = this.getSong(name); let oldSong = this.getSong(name);
debug("WARNING: Song", name, "already exists! Conflict with", name, "and", oldSong.name); debug("WARNING: Song", name, "already exists! Conflict with", name, "and", oldSong.name);
} else { } else {
var newSong = {"name":name, let newSong = {"name":name,
"title":null, "title":null,
"rhythm":null, "rhythm":null,
"source":null, "source":null,
@ -216,8 +216,8 @@ Respack.prototype.parseSong = function(file) {
"enabled":true, "enabled":true,
"filename":file.name, "filename":file.name,
"charsPerBeat": null}; "charsPerBeat": null};
var extension = file.name.split('.').pop().toLowerCase(); let extension = file.name.split('.').pop().toLowerCase();
var mime = ""; let mime = "";
switch(extension) { switch(extension) {
case "mp3": case "mp3":
mime = "audio/mpeg3"; mime = "audio/mpeg3";
@ -236,7 +236,7 @@ Respack.prototype.parseSong = function(file) {
}).then(blob => { }).then(blob => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
// Because blobs are crap // Because blobs are crap
var fr = new FileReader(); let fr = new FileReader();
fr.onload = () => { fr.onload = () => {
resolve(fr.result); resolve(fr.result);
}; };
@ -260,9 +260,9 @@ Respack.prototype.parseSongQueue = function() {
}; };
Respack.prototype.parseImage = function(file) { Respack.prototype.parseImage = function(file) {
var match; let match;
var name = file.name.replace(this.imageExtensions, ""); let name = file.name.replace(this.imageExtensions, "");
var img; let img;
// Animation // Animation
if((match = name.match(new RegExp("^(.*)_(\\d+)$")))) { if((match = name.match(new RegExp("^(.*)_(\\d+)$")))) {
@ -293,7 +293,7 @@ Respack.prototype.parseImage = function(file) {
"animated":false}; "animated":false};
this.images.push(img); this.images.push(img);
} else { } else {
var existing = this.getImage(name); let existing = this.getImage(name);
debug("WARNING: Image", name, "already exists! Conflict with", file.name, "and", existing.name); debug("WARNING: Image", name, "already exists! Conflict with", file.name, "and", existing.name);
return; return;
} }
@ -302,8 +302,8 @@ Respack.prototype.parseImage = function(file) {
}; };
Respack.prototype.loadImage = function(imgFile, imageObj) { Respack.prototype.loadImage = function(imgFile, imageObj) {
var extension = imgFile.name.split('.').pop().toLowerCase(); let extension = imgFile.name.split('.').pop().toLowerCase();
var mime = ""; let mime = "";
switch(extension) { switch(extension) {
case "png": case "png":
mime = "image/png"; mime = "image/png";
@ -333,7 +333,7 @@ Respack.prototype.parseImageQueue = function() {
// Maintain order // Maintain order
return imagePromise; return imagePromise;
}).then(response => { }).then(response => {
var newImg = new Image(); let newImg = new Image();
newImg.src = response.bitmap; newImg.src = response.bitmap;
if (response.img.animated) { if (response.img.animated) {
response.img.bitmaps.push(newImg); response.img.bitmaps.push(newImg);
@ -356,7 +356,7 @@ Respack.prototype.loadXML = function(file) {
}; };
Respack.prototype.parseXML = function() { Respack.prototype.parseXML = function() {
var p = Promise.resolve(); let p = Promise.resolve();
// info xml? // info xml?
if(this._infoXMLPromise) { if(this._infoXMLPromise) {
p = p.then(() => { p = p.then(() => {
@ -390,26 +390,24 @@ Respack.prototype.parseXML = function() {
// Save some chars // Save some chars
Element.prototype.getTag = function(tag, def) { Element.prototype.getTag = function(tag, def) {
var t = this.getElementsByTagName(tag)[0]; let t = this.getElementsByTagName(tag)[0];
return t ? t.textContent : (def ? def : null); return t ? t.textContent : (def ? def : null);
}; };
Respack.prototype.parseSongFile = function(text) { Respack.prototype.parseSongFile = function(text) {
debug(" - Parsing songFile"); debug(" - Parsing songFile");
var oParser = new DOMParser(); let oParser = new DOMParser();
var oDOM = oParser.parseFromString(text, "text/xml"); let oDOM = oParser.parseFromString(text, "text/xml");
if(oDOM.documentElement.nodeName !== "songs"){ if(oDOM.documentElement.nodeName !== "songs"){
console.log("songs.xml error, corrupt file?"); console.log("songs.xml error, corrupt file?");
return; return;
} }
var newSongs = []; let newSongs = [];
// Not supported in mobile safari let el = oDOM.documentElement.firstElementChild;
// var songsXML = oDOM.documentElement.children;
var el = oDOM.documentElement.firstElementChild;
for(; el; el = el.nextElementSibling) { for(; el; el = el.nextElementSibling) {
var song = this.getSong(el.attributes[0].value); let song = this.getSong(el.attributes[0].value);
if(song) { if(song) {
song.title = el.getTag("title"); song.title = el.getTag("title");
if(!song.title) { if(!song.title) {
@ -428,7 +426,7 @@ Respack.prototype.parseSongFile = function(text) {
song.buildupName = el.getTag("buildup"); song.buildupName = el.getTag("buildup");
if(song.buildupName) { if(song.buildupName) {
debug(" Finding a buildup '" + song.buildupName + "' for ", song.name); debug(" Finding a buildup '" + song.buildupName + "' for ", song.name);
var build = this.getSong(song.buildupName); let build = this.getSong(song.buildupName);
if(build) { if(build) {
song.buildup = build.sound; song.buildup = build.sound;
song.buildupPlayed = false; song.buildupPlayed = false;
@ -455,7 +453,7 @@ Respack.prototype.parseSongFile = function(text) {
"- no song '" + el.attributes[0].value + "' found"); "- no song '" + el.attributes[0].value + "' found");
} }
} }
for(var i = 0; i < this.songs.length; i++) { for(let i = 0; i < this.songs.length; i++) {
if(newSongs.indexOf(this.songs[i]) == -1) { if(newSongs.indexOf(this.songs[i]) == -1) {
debug(" WARNING!", "We have a file for", this.songs[i].name, "but no information for it"); debug(" WARNING!", "We have a file for", this.songs[i].name, "but no information for it");
} }
@ -466,9 +464,9 @@ Respack.prototype.parseSongFile = function(text) {
Respack.prototype.parseInfoFile = function(text) { Respack.prototype.parseInfoFile = function(text) {
debug(" - Parsing infoFile"); debug(" - Parsing infoFile");
var oParser = new DOMParser(); let oParser = new DOMParser();
var oDOM = oParser.parseFromString(text, "text/xml"); let oDOM = oParser.parseFromString(text, "text/xml");
var info = oDOM.documentElement; let info = oDOM.documentElement;
if(info.nodeName !== "info"){ if(info.nodeName !== "info"){
console.log("info.xml error, corrupt file?"); console.log("info.xml error, corrupt file?");
return; return;
@ -484,17 +482,15 @@ Respack.prototype.parseInfoFile = function(text) {
Respack.prototype.parseImageFile = function(text) { Respack.prototype.parseImageFile = function(text) {
debug(" - Parsing imagefile"); debug(" - Parsing imagefile");
var oParser = new DOMParser(); let oParser = new DOMParser();
var oDOM = oParser.parseFromString(text, "text/xml"); let oDOM = oParser.parseFromString(text, "text/xml");
if(oDOM.documentElement.nodeName !== "images"){ if(oDOM.documentElement.nodeName !== "images"){
console.log("images.xml error, corrupt file?"); console.log("images.xml error, corrupt file?");
return; return;
} }
var newImages = []; let newImages = [];
// not in mobile safari let el = oDOM.documentElement.firstElementChild;
// var imagesXML = oDOM.documentElement.children;
var el = oDOM.documentElement.firstElementChild;
for(; el; el = el.nextElementSibling) { for(; el; el = el.nextElementSibling) {
let image = this.getImage(el.attributes[0].value); let image = this.getImage(el.attributes[0].value);
if(image) { if(image) {
@ -507,11 +503,11 @@ Respack.prototype.parseImageFile = function(text) {
image.align = el.getTag("align", image.align); image.align = el.getTag("align", image.align);
image.beatsPerAnim = parseFloat(el.getTag("beatsPerAnim")); image.beatsPerAnim = parseFloat(el.getTag("beatsPerAnim"));
image.syncOffset = parseFloat(el.getTag("syncOffset")); image.syncOffset = parseFloat(el.getTag("syncOffset"));
var frameDur = el.getTag("frameDuration"); let frameDur = el.getTag("frameDuration");
if(frameDur) { if(frameDur) {
image.frameDurations = []; image.frameDurations = [];
var strSplit = frameDur.split(","); let strSplit = frameDur.split(",");
for(var j = 0; j < strSplit.length; j++) { for(let j = 0; j < strSplit.length; j++) {
image.frameDurations.push(parseInt(strSplit[j])); image.frameDurations.push(parseInt(strSplit[j]));
} }
while (image.frameDurations.length < image.bitmaps.length) { while (image.frameDurations.length < image.bitmaps.length) {
@ -527,11 +523,10 @@ Respack.prototype.parseImageFile = function(text) {
debug(" WARNING!!", "Image", image.name, "has no bitmap nor animation frames!"); debug(" WARNING!!", "Image", image.name, "has no bitmap nor animation frames!");
} }
} else { } else {
debug(" WARNING!", "images.xml: <image> element", debug(" WARNING!", "images.xml: no image '" + el.attributes[0].value + "' found");
i + 1, "- no image '" + el.attributes[0].value + "' found");
} }
} }
for(var i = 0; i < this.images.length; i++) { for(let i = 0; i < this.images.length; i++) {
let image = this.images[i]; let image = this.images[i];
// Add all images with no info // Add all images with no info
if(newImages.indexOf(image) == -1) { if(newImages.indexOf(image) == -1) {
@ -553,7 +548,7 @@ Respack.prototype.containsImage = function(name) {
}; };
Respack.prototype.getSong = function(name) { Respack.prototype.getSong = function(name) {
for(var i = 0; i < this.songs.length; i++) { for(let i = 0; i < this.songs.length; i++) {
if (name == this.songs[i].name) { if (name == this.songs[i].name) {
return this.songs[i]; return this.songs[i];
} }
@ -562,7 +557,7 @@ Respack.prototype.getSong = function(name) {
}; };
Respack.prototype.getImage = function(name) { Respack.prototype.getImage = function(name) {
for(var i = 0; i < this.images.length; i++) { for(let i = 0; i < this.images.length; i++) {
if (name == this.images[i].name) { if (name == this.images[i].name) {
return this.images[i]; return this.images[i];
} }

78
src/js/SoundManager.js
Unescape View File

@ -80,14 +80,14 @@ SoundManager.prototype.init = function() {
}).then(response => { }).then(response => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
// See if our MP3 decoder is working // See if our MP3 decoder is working
var mp3Worker; let mp3Worker;
try { try {
mp3Worker = this.createWorker(); mp3Worker = this.createWorker();
} catch(e) { } catch(e) {
console.log(e); console.log(e);
reject(Error("MP3 Worker cannot be started - correct path set in defaults?")); reject(Error("MP3 Worker cannot be started - correct path set in defaults?"));
} }
var pingListener = event => { let pingListener = event => {
mp3Worker.removeEventListener('message', pingListener); mp3Worker.removeEventListener('message', pingListener);
mp3Worker.terminate(); mp3Worker.terminate();
resolve(); resolve();
@ -104,10 +104,10 @@ SoundManager.prototype.init = function() {
// it starts in a suspended state // it starts in a suspended state
if(this.context.state != "running") { if(this.context.state != "running") {
this.core.warning("We're about to load about 10MB of stuff. Tap to begin!"); this.core.warning("We're about to load about 10MB of stuff. Tap to begin!");
var unlocker = () => { let unlocker = () => {
// create empty buffer // create empty buffer
var buffer = this.context.createBuffer(1, 1, 22050); let buffer = this.context.createBuffer(1, 1, 22050);
var source = this.context.createBufferSource(); let source = this.context.createBufferSource();
source.buffer = buffer; source.buffer = buffer;
// connect to output (your speakers) // connect to output (your speakers)
@ -133,7 +133,7 @@ SoundManager.prototype.init = function() {
}; };
SoundManager.prototype.playSong = function(song, playBuild, forcePlay) { SoundManager.prototype.playSong = function(song, playBuild, forcePlay) {
var p = Promise.resolve(); let p = Promise.resolve();
// Editor forces play on audio updates // Editor forces play on audio updates
if(this.song == song && !forcePlay) { if(this.song == song && !forcePlay) {
return p; return p;
@ -209,7 +209,7 @@ SoundManager.prototype.setRate = function(rate) {
// Double speed is more than enough. Famous last words? // Double speed is more than enough. Famous last words?
rate = Math.max(Math.min(rate, 2), 0.25); rate = Math.max(Math.min(rate, 2), 0.25);
var time = this.clampedTime(); let time = this.clampedTime();
this.playbackRate = rate; this.playbackRate = rate;
this.seek(time); this.seek(time);
}; };
@ -260,7 +260,7 @@ SoundManager.prototype.currentTime = function() {
}; };
SoundManager.prototype.clampedTime = function() { SoundManager.prototype.clampedTime = function() {
var time = this.currentTime(); let time = this.currentTime();
if(time > 0) { if(time > 0) {
time %= this.loopLength; time %= this.loopLength;
@ -269,7 +269,7 @@ SoundManager.prototype.clampedTime = function() {
}; };
SoundManager.prototype.displayableTime = function() { SoundManager.prototype.displayableTime = function() {
var time = this.clampedTime(); let time = this.clampedTime();
if(time < 0) { if(time < 0) {
return 0; return 0;
} else { } else {
@ -284,9 +284,9 @@ SoundManager.prototype.loadSong = function(song) {
return; return;
} }
var buffers = {loop: null, buildup: null}; let buffers = {loop: null, buildup: null};
var promises = [this.loadBuffer(song, "sound").then(buffer => { let promises = [this.loadBuffer(song, "sound").then(buffer => {
buffers.loop = buffer; buffers.loop = buffer;
})]; })];
if(song.buildup) { if(song.buildup) {
@ -306,20 +306,20 @@ SoundManager.prototype.loadSong = function(song) {
SoundManager.prototype.loadBuffer = function(song, soundName) { SoundManager.prototype.loadBuffer = function(song, soundName) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
var mp3Worker = this.createWorker(); let mp3Worker = this.createWorker();
mp3Worker.addEventListener('error', () => { mp3Worker.addEventListener('error', () => {
reject(Error("MP3 Worker failed to convert track")); reject(Error("MP3 Worker failed to convert track"));
}, false); }, false);
mp3Worker.addEventListener('message', e => { mp3Worker.addEventListener('message', e => {
var decoded = e.data; let decoded = e.data;
mp3Worker.terminate(); mp3Worker.terminate();
// restore transferred buffer // restore transferred buffer
song[soundName] = decoded.arrayBuffer; song[soundName] = decoded.arrayBuffer;
// Convert to real audio buffer // Convert to real audio buffer
var audio = this.audioBufFromRaw(decoded.rawAudio); let audio = this.audioBufFromRaw(decoded.rawAudio);
resolve(audio); resolve(audio);
}, false); }, false);
@ -330,16 +330,16 @@ SoundManager.prototype.loadBuffer = function(song, soundName) {
// Converts continuous PCM array to Web Audio API friendly format // Converts continuous PCM array to Web Audio API friendly format
SoundManager.prototype.audioBufFromRaw = function(raw) { SoundManager.prototype.audioBufFromRaw = function(raw) {
var buffer = raw.array; let buffer = raw.array;
var channels = raw.channels; let channels = raw.channels;
var samples = buffer.length/channels; let samples = buffer.length/channels;
var audioBuf = this.context.createBuffer(channels, samples, raw.sampleRate); let audioBuf = this.context.createBuffer(channels, samples, raw.sampleRate);
//var audioBuf = this.context.createBuffer(1, buffer.length, raw.sampleRate); //let audioBuf = this.context.createBuffer(1, buffer.length, raw.sampleRate);
//audioBuf.copyToChannel(buffer, 0, 0); //audioBuf.copyToChannel(buffer, 0, 0);
for(let i = 0; i < channels; i++) { for(let i = 0; i < channels; i++) {
//console.log("Making buffer at offset",i*samples,"and length",samples,".Original buffer is",channels,"channels and",buffer.length,"elements"); //console.log("Making buffer at offset",i*samples,"and length",samples,".Original buffer is",channels,"channels and",buffer.length,"elements");
// Offset is in bytes, length is in elements // Offset is in bytes, length is in elements
var channel = new Float32Array(buffer.buffer , i * samples * 4, samples); let channel = new Float32Array(buffer.buffer , i * samples * 4, samples);
//console.log(channel); //console.log(channel);
audioBuf.copyToChannel(channel, i, 0); audioBuf.copyToChannel(channel, i, 0);
} }
@ -382,7 +382,7 @@ SoundManager.prototype.attachVisualiser = function() {
} }
// Get our info from the loop // Get our info from the loop
var channels = this.loopSource.channelCount; let channels = this.loopSource.channelCount;
// In case channel counts change, this is changed each time // In case channel counts change, this is changed each time
this.splitter = this.context.createChannelSplitter(channels); this.splitter = this.context.createChannelSplitter(channels);
// Connect to the gainNode so we get buildup stuff too // Connect to the gainNode so we get buildup stuff too
@ -394,7 +394,7 @@ SoundManager.prototype.attachVisualiser = function() {
this.vBars = Math.floor(this.vTotalBars/channels); this.vBars = Math.floor(this.vTotalBars/channels);
for(let i = 0; i < channels; i++) { for(let i = 0; i < channels; i++) {
var analyser = this.context.createAnalyser(); let analyser = this.context.createAnalyser();
// big fft buffers are new-ish // big fft buffers are new-ish
try { try {
analyser.fftSize = 8192; analyser.fftSize = 8192;
@ -411,29 +411,29 @@ SoundManager.prototype.attachVisualiser = function() {
this.analysers.push(analyser); this.analysers.push(analyser);
this.logArrays.push(new Uint8Array(this.vBars)); this.logArrays.push(new Uint8Array(this.vBars));
} }
var binCount = this.analysers[0].frequencyBinCount; let binCount = this.analysers[0].frequencyBinCount;
var binWidth = this.loopSource.buffer.sampleRate / binCount; let binWidth = this.loopSource.buffer.sampleRate / binCount;
// first 2kHz are linear // first 2kHz are linear
this.maxBinLin = Math.floor(2000/binWidth); this.maxBinLin = Math.floor(2000/binWidth);
// Don't stretch the first 2kHz, it looks awful // Don't stretch the first 2kHz, it looks awful
this.linBins = Math.min(this.maxBinLin, Math.floor(this.vBars/2)); this.linBins = Math.min(this.maxBinLin, Math.floor(this.vBars/2));
// Only go up to 22KHz // Only go up to 22KHz
var maxBinLog = Math.floor(22000/binWidth); let maxBinLog = Math.floor(22000/binWidth);
var logBins = this.vBars - this.linBins; let logBins = this.vBars - this.linBins;
var logLow = Math.log2(2000); let logLow = Math.log2(2000);
var logDiff = Math.log2(22000) - logLow; let logDiff = Math.log2(22000) - logLow;
for(let i = 0; i < logBins; i++) { for(let i = 0; i < logBins; i++) {
var cutoff = i * (logDiff/logBins) + logLow; let cutoff = i * (logDiff/logBins) + logLow;
var freqCutoff = Math.pow(2, cutoff); let freqCutoff = Math.pow(2, cutoff);
var binCutoff = Math.floor(freqCutoff / binWidth); let binCutoff = Math.floor(freqCutoff / binWidth);
this.binCutoffs.push(binCutoff); this.binCutoffs.push(binCutoff);
} }
this.vReady = true; this.vReady = true;
}; };
SoundManager.prototype.sumArray = function(array, low, high) { SoundManager.prototype.sumArray = function(array, low, high) {
var total = 0; let total = 0;
for(let i = low; i <= high; i++) { for(let i = low; i <= high; i++) {
total += array[i]; total += array[i];
} }
@ -444,18 +444,18 @@ SoundManager.prototype.getVisualiserData = function() {
if(!this.vReady) { if(!this.vReady) {
return null; return null;
} }
for(var a = 0; a < this.analyserArrays.length; a++) { for(let a = 0; a < this.analyserArrays.length; a++) {
var data = this.analyserArrays[a]; let data = this.analyserArrays[a];
var result = this.logArrays[a]; let result = this.logArrays[a];
this.analysers[a].getByteFrequencyData(data); this.analysers[a].getByteFrequencyData(data);
for(let i = 0; i < this.linBins; i++) { for(let i = 0; i < this.linBins; i++) {
var scaled = Math.round(i * this.maxBinLin / this.linBins); let scaled = Math.round(i * this.maxBinLin / this.linBins);
result[i] = data[scaled]; result[i] = data[scaled];
} }
result[this.linBins] = data[this.binCutoffs[0]]; result[this.linBins] = data[this.binCutoffs[0]];
for(let i = this.linBins+1; i < this.vBars; i++) { for(let i = this.linBins+1; i < this.vBars; i++) {
var cutoff = i - this.linBins; let cutoff = i - this.linBins;
result[i] = this.sumArray(data, this.binCutoffs[cutoff-1], result[i] = this.sumArray(data, this.binCutoffs[cutoff-1],
this.binCutoffs[cutoff]); this.binCutoffs[cutoff]);
} }
@ -483,13 +483,13 @@ SoundManager.prototype.toggleMute = function() {
SoundManager.prototype.decreaseVolume = function() { SoundManager.prototype.decreaseVolume = function() {
this.setMute(false); this.setMute(false);
var val = Math.max(this.gainNode.gain.value - 0.1, 0); let val = Math.max(this.gainNode.gain.value - 0.1, 0);
this.setVolume(val); this.setVolume(val);
}; };
SoundManager.prototype.increaseVolume = function() { SoundManager.prototype.increaseVolume = function() {
this.setMute(false); this.setMute(false);
var val = Math.min(this.gainNode.gain.value + 0.1, 1); let val = Math.min(this.gainNode.gain.value + 0.1, 1);
this.setVolume(val); this.setVolume(val);
}; };

Write Preview
Loading…
Cancel
Save