From f85b644506f02c4764f3188ed4aa823e46ef3e57 Mon Sep 17 00:00:00 2001 From: William Toohey Date: Fri, 25 Sep 2015 21:12:09 +1000 Subject: [PATCH] Add hiding for UI, optimise CSS some --- css/hues-m.css | 54 ++++++++- css/hues-r.css | 89 ++++++++++++++- css/hues-w.css | 53 ++++++++- css/hues-x.css | 25 +++++ css/style.css | 30 ++--- index.html | 13 +-- js/HuesCore.js | 17 ++- js/HuesSettings.js | 17 ++- js/HuesUI.js | 269 ++++++++++++++++++++++++++++++++++++++++----- js/ResourcePack.js | 6 +- js/SoundManager.js | 18 ++- 11 files changed, 507 insertions(+), 84 deletions(-) diff --git a/css/hues-m.css b/css/hues-m.css index 532b538..3e1baa4 100644 --- a/css/hues-m.css +++ b/css/hues-m.css @@ -5,6 +5,30 @@ font-family: 'PetMe64Web'; } +.hues-m-beatbar, .hues-m-beatcenter{ + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; +} + +.hues-m-controls { + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; +} + +.hues-m-beatbar.hidden, .hues-m-beatcenter.hidden{ + transform: translateY(-40px); + -webkit-transform: translateY(-40px); +} + +.hues-m-controls.hidden { + transform: translateY(104px); + -webkit-transform: translateY(104px); +} + .hues-m-beatbar { position: absolute; top: 0; @@ -198,7 +222,7 @@ } .hues-m-controlblock { - /* It gets selected by accident somehow */ + /* Don't want double click to select */ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; @@ -229,7 +253,7 @@ .hues-m-prevbutton, .hues-m-nextbutton { color: white; - background: rgba(0,0,0,0.7); + background: rgb(32,32,32); height: 20px; line-height: 20px; font-size: 12px; @@ -255,7 +279,7 @@ width: 40px; left: 15px; color: white; - background: rgb(64,64,64); + background: rgb(32,32,32); font-size: 20px; line-height: 40px; border-radius: 20px; @@ -267,15 +291,33 @@ bottom: 5px; } +.hues-m-question, .hues-m-cog { + cursor: pointer; +} + +.hues-m-cog { + position: absolute; + left: 8px; + top: 5px; + font-size: 25px; +} + +.hues-m-question { + position: absolute; + right: 8px; + top: 8px; + font-size: 25px; +} + .hues-m-vol-bar { position: absolute; height: 20px; bottom: 21px; - left: 32px; - right: 32px; + left: 40px; + right: 40px; } -.hues-m-vol-bar > button { +.hues-m-vol-label { display: block; position: absolute; left: 0; diff --git a/css/hues-r.css b/css/hues-r.css index 95fc8b8..45f1c43 100644 --- a/css/hues-r.css +++ b/css/hues-r.css @@ -1,14 +1,13 @@ /* TODO: Fix scrollbar */ .RetroUI { + font-family: 'PetMe64Web'; } .hues-r-container { position: absolute; bottom: 0px; - white-space: nowrap; - font-family: 'PetMe64Web'; font-size: 5pt; } @@ -17,4 +16,90 @@ color: inherit; text-decoration: none; overflow: hidden; +} + +.hues-r-controls { + display:flex; + align-items:center; + position: absolute; + right: 0px; + bottom: 10px; + font-size: 30px; +} + +.hues-r-button { + float: left; + cursor: pointer; + text-align: center; + opacity: 0.5; +} + +.hues-r-button:hover { + opacity: 1; +} + +.hues-r-songs { + font-size: 13px; + margin: 0px -8px; +} + +.hues-r-manualmode, .hues-r-automode { + float: none; + clear: both; +} + +.hues-r-manualmode { + font-size: 15px; +} + +.hues-r-automode { + font-size: 10px; +} + +.hues-r-subcontrols { + position: absolute; + right: 0px; + bottom: 40px; + font-size: 25px; + text-align: center; +} + +.hues-r-subcontrols > div{ + margin: 3px; + cursor: pointer; + opacity: 0.5; +} + +.hues-r-subcontrols > div:hover { + opacity: 1; +} + +.hues-r-hiderestore { + position: absolute; + bottom: 5px; + right: 5px; + display: none; + font-size: 25px; + cursor: pointer; + opacity: 0.5; +} + +.hues-r-hiderestore.hidden { + display: block; +} + +.hues-r-hiderestore:hover { + opacity: 1; +} + +.hues-r-container, .hues-r-controls, .hues-r-subcontrols { + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; +} + +.hues-r-container.hidden, .hues-r-controls.hidden, .hues-r-subcontrols.hidden { + transform: translateY(200px); + -webkit-transform: translateY(200px); } \ No newline at end of file diff --git a/css/hues-w.css b/css/hues-w.css index 0d1f66e..f9204ca 100644 --- a/css/hues-w.css +++ b/css/hues-w.css @@ -1,9 +1,58 @@ -/* TODO: Fix scrollbar */ - .WeedUI { font-family: 'PetMe64Web'; } +.hues-w-controls { + display:flex; + align-items:center; + position: absolute; + right: 0px; + bottom: 0px; + font-size: 30px; +} + +.hues-w-subcontrols { + position: absolute; + right: 0px; + bottom: 30px; + font-size: 25px; + text-align: center; +} + +.hues-w-subcontrols > div{ + margin: 3px; + cursor: pointer; + opacity: 0.5; +} + +.hues-w-subcontrols > div:hover { + opacity: 1; +} + +.hues-w-controls, .hues-w-subcontrols { + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; +} + +.hues-w-controls.hidden, .hues-w-subcontrols.hidden { + transform: translateY(200px); + -webkit-transform: translateY(200px); +} + +.hues-w-beatbar { + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; +} + +.hues-w-beatbar.hidden { + transform: translateY(-40px); + -webkit-transform: translateY(-40px); +} + .hues-w-beatleft, .hues-w-beatright { font-size: 13px; position: absolute; diff --git a/css/hues-x.css b/css/hues-x.css index 8689e21..c565dbe 100644 --- a/css/hues-x.css +++ b/css/hues-x.css @@ -27,4 +27,29 @@ left: 8px; right: 8px; color: white; +} + +.hues-x-beatbar{ + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; +} + +.hues-x-controls { + transform: translateY(0px); + -webkit-transform: translateY(0px); + transition: transform 1s linear; + -webkit-transition: transform 1s linear; + +} + +.hues-x-beatbar.hidden{ +transform: translateY(-40px); + -webkit-transform: translateY(-40px); +} + +.hues-x-controls.hidden { + transform: translateY(104px); + -webkit-transform: translateY(104px); } \ No newline at end of file diff --git a/css/style.css b/css/style.css index 68b092c..8ae6079 100644 --- a/css/style.css +++ b/css/style.css @@ -86,14 +86,13 @@ h1, h2, h3 { top: 0; left: 0; z-index: 10; + opacity: 1; + transition: opacity 2s linear; + -webkit-transition: opacity 2s linear; } #preloadHelper.loaded { opacity: 0; - animation-name: fadeout; - animation-duration: 1s; - -webkit-animation-name: fadeout; - -webkit-animation-duration: 3s; } #preloader { @@ -159,13 +158,6 @@ input.tab-input[type="radio"]:checked + label { border-width: 2px; border-style: solid; font-family: 'PetMe64Web'; - /* It gets selected by accident somehow */ - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } #huesSettings { @@ -182,6 +174,13 @@ input.tab-input[type="radio"]:checked + label { .settings-buttons{ margin: 10px 2px 10px 0px; + /* Don't want double click to select */ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .settings-checkbox{ @@ -205,13 +204,4 @@ label.settings-label:hover { #huesSettings input[type="radio"]:checked + label { background: rgba(255,255,255, 0.5); -} - -@keyframes fadeout { - from {opacity: 1;} - to {opacity: 0;} -} -@-webkit-keyframes fadeout { - from {opacity: 1;} - to {opacity: 0;} } \ No newline at end of file diff --git a/index.html b/index.html index 99bf3b9..5d80f88 100644 --- a/index.html +++ b/index.html @@ -22,9 +22,10 @@ window.onload = function() { zip.workerScriptsPath = "js/lib/"; var defaults = { - respacks : ["./respacks/Defaults_v5.0.zip", + respacks : [//"./respacks/Defaults_v5.0.zip", "./respacks/CharPackagev0.03.zip", - "./respacks/HuesMixA.zip"], + //"./respacks/HuesMixB.zip", + "./respacks/PackShit.zip"], load : false, //debug autoplay : false // debug }; @@ -44,10 +45,10 @@
- + - - + +
Soon
@@ -77,7 +78,6 @@
  • O Horizontal blur only
  • ~ Fade color
  • = Fade and change image
    • -
  • ยค Whiteout
    • @@ -95,7 +95,6 @@
  • [S] Song list
  • [W] Toggle window
  • [R] Resource packs
    • -
  • [E] Editor
  • [O] Options
  • [I] Information
  • [1-4] Change UI
    • diff --git a/js/HuesCore.js b/js/HuesCore.js index 5590a97..71bcd5a 100644 --- a/js/HuesCore.js +++ b/js/HuesCore.js @@ -16,6 +16,13 @@ HuesCore = function(defaults) { this.doBuildup=true; this.userInterface = null; + var that = this; + window.onerror = function(msg, url, line, col, error) { + that.error(msg); + // Get more info in console + return false; + }; + console.log("0x40 Hues - start your engines!"); this.colours = this.oldColours; this.uiArray = []; @@ -24,7 +31,7 @@ HuesCore = function(defaults) { this.settings = new HuesSettings(defaults); //this.autoSong = this.settings.autosong; this.resourceManager = new Resources(); - this.soundManager = new SoundManager(); + this.soundManager = new SoundManager(this); if(!this.soundManager.canUse) { this.error("Web Audio API not supported in this browser."); return; @@ -34,7 +41,6 @@ HuesCore = function(defaults) { this.uiArray.push(new RetroUI(), new WeedUI(), new ModernUI(), new XmasUI()); this.settings.connectCore(this); - var that = this; if(defaults.load) { this.resourceManager.addAll(defaults.respacks, function() { document.getElementById("preloadHelper").className = "loaded"; @@ -68,13 +74,6 @@ HuesCore = function(defaults) { return that.keyHandler(key); }; - window.onerror = function(msg, url, line, col, error) { - that.error(msg); - - // Get more info in console - return false; - }; - this.animationLoop(); } diff --git a/js/HuesSettings.js b/js/HuesSettings.js index 6fe72ac..ce46787 100644 --- a/js/HuesSettings.js +++ b/js/HuesSettings.js @@ -11,7 +11,7 @@ HuesSettings.prototype.defaultSettings = { smartAlign: "on", blurAmount: "medium", blurDecay: "fast", - blurQuality: "high", + blurQuality: "medium", currentUI: "modern", colourSet: "normal", blackoutUI: "off", @@ -120,6 +120,21 @@ HuesSettings.prototype.toggle = function() { } } +HuesSettings.prototype.showRespacks = function() { + this.show(); + document.getElementById("tab1").checked = true; +} + +HuesSettings.prototype.showOptions = function() { + this.show(); + document.getElementById("tab2").checked = true; +} + +HuesSettings.prototype.showInfo = function() { + this.show(); + document.getElementById("tab3").checked = true; +} + HuesSettings.prototype.initUI = function() { var doc = this.root.ownerDocument; diff --git a/js/HuesUI.js b/js/HuesUI.js index 6513515..4eaedcc 100644 --- a/js/HuesUI.js +++ b/js/HuesUI.js @@ -22,6 +22,11 @@ function HuesUI(parent) { this.hueName = null; + this.imagePrev = null; + this.imageNext = null; + this.songPrev = null; + this.songNext = null; + this.volInput = null; this.volLabel = null; @@ -30,11 +35,17 @@ function HuesUI(parent) { this.xBlur = null; this.yBlur = null; + this.settingsToggle = null; + this.hideToggle = null; + + this.hidden = false; + this.initUI(); } HuesUI.prototype.initUI = function() { var doc = this.root.ownerDocument + var that = this; // Major info, image, song names var imageName = doc.createElement("div"); @@ -54,6 +65,33 @@ HuesUI.prototype.initUI = function() { var hueName = doc.createElement("div"); this.hueName = hueName; + // Prev/next controls + var imagePrev = doc.createElement("div"); + imagePrev.textContent = "<"; + imagePrev.onclick = function() {that.core.previousImage();}; + this.imagePrev = imagePrev; + var imageNext = doc.createElement("div"); + imageNext.textContent = ">"; + imageNext.onclick = function() {that.core.nextImage();}; + this.imageNext = imageNext; + var songPrev = doc.createElement("div"); + songPrev.textContent = "<"; + this.songPrev = songPrev; + songPrev.onclick = function() {that.core.previousSong();}; + var songNext = doc.createElement("div"); + songNext.textContent = ">"; + songNext.onclick = function() {that.core.nextSong();}; + this.songNext = songNext; + + var songList = document.createElement("div"); + songList.textContent = "SONGS"; + songList.onclick = function() {that.core.toggleSongList()}; + this.songList = songList; + var imageList = document.createElement("div"); + imageList.textContent = "IMAGES"; + imageList.onclick = function() {that.core.toggleImageList()}; + this.imageList = imageList; + // Beat timer, x and y blur, millis timer this.timer = doc.createElement("div"); this.timer.textContent = "T=$0x0000"; @@ -66,8 +104,19 @@ HuesUI.prototype.initUI = function() { this.yBlur = doc.createElement("div"); this.yBlur.textContent = "Y=$0x00"; - - //this.setupVolume(leftBox) + + // Config stuff + this.settingsToggle = doc.createElement("div"); + this.settingsToggle.innerHTML = ''; + this.settingsToggle.onclick = function() { + that.core.settings.toggle(); + } + + this.hideToggle = doc.createElement("div"); + this.hideToggle.innerHTML = "▼"; + this.hideToggle.onclick = function() { + that.toggleHide(); + } } HuesUI.prototype.connectCore = function(core) { @@ -80,18 +129,30 @@ HuesUI.prototype.disconnect = function() { this.root.style.display = "none"; } +// ONLY FOR CHANGING UI, NOT FOR "HIDE" FEATURE HuesUI.prototype.show = function() { this.root.style.display = "block"; } +// ONLY FOR CHANGING UI, NOT FOR "HIDE" FEATURE HuesUI.prototype.hide = function() { this.root.style.display = "none"; } +HuesUI.prototype.toggleHide = function() { + this.hidden = !this.hidden; + if(this.hidden) { + this.root.className = this.constructor.name + " hidden"; + } else { + this.root.className = this.constructor.name; + } +} + // May do nothing, may scale elements if needed etc etc HuesUI.prototype.resize = function() {} HuesUI.prototype.modeUpdated = function() {} HuesUI.prototype.beat = function() {} +HuesUI.prototype.updateVolume = function(vol) {} HuesUI.prototype.setSongText = function() { var song = this.core.currentSong; @@ -108,8 +169,10 @@ HuesUI.prototype.setImageText = function() { if(!image) return; + + var name = image.fullname ? image.fullname : image.name; - this.imageLink.textContent = image.fullname.toUpperCase(); + this.imageLink.textContent = name.toUpperCase(); this.imageLink.href = image.source ? image.source : ""; } @@ -155,6 +218,10 @@ function RetroUI() { this.beatBar = null; this.colourIndex = null; this.version = null; + this.imageModeAuto = null; + this.imageModeAuto = null; + this.subControls = null; + HuesUI.call(this); } RetroUI.prototype = Object.create(HuesUI.prototype); @@ -164,6 +231,7 @@ RetroUI.prototype.initUI = function() { HuesUI.prototype.initUI.call(this); var doc = this.root.ownerDocument; + var that = this; var container = doc.createElement("div"); container.className = "hues-r-container"; @@ -190,6 +258,70 @@ RetroUI.prototype.initUI = function() { this.beatBar = doc.createElement("div"); container.appendChild(this.beatBar); + + this.controls = doc.createElement("div"); + this.controls.className = "hues-r-controls"; + + var imageMode = doc.createElement("div"); + this.imageModeManual = doc.createElement("div"); + this.imageModeManual.textContent = "NORMAL"; + this.imageModeManual.onclick = function() {that.core.setIsFullAuto(false);}; + this.imageModeManual.className = "hues-r-manualmode hues-r-button"; + this.imageModeAuto = doc.createElement("div"); + this.imageModeAuto.textContent = "FULL AUTO"; + this.imageModeAuto.onclick = function() {that.core.setIsFullAuto(true);}; + this.imageModeAuto.className = "hues-r-automode hues-r-button"; + imageMode.appendChild(this.imageModeManual); + imageMode.appendChild(this.imageModeAuto); + + this.imagePrev.className = "hues-r-button"; + this.imageNext.className = "hues-r-button"; + this.songPrev.className = "hues-r-button"; + this.songNext.className = "hues-r-button"; + this.controls.appendChild(this.imagePrev); + this.controls.appendChild(imageMode); + this.controls.appendChild(this.imageNext); + + this.songList.className = "hues-r-songs hues-r-button"; + this.controls.appendChild(this.songPrev); + this.controls.appendChild(this.songList); + this.controls.appendChild(this.songNext); + + this.root.appendChild(this.controls); + + var subControl = doc.createElement("div"); + subControl.className = "hues-r-subcontrols"; + subControl.appendChild(this.settingsToggle); + this.imageList.textContent = "C"; + subControl.appendChild(this.imageList); + subControl.appendChild(this.hideToggle); + this.subControls = subControl; + + this.root.appendChild(subControl); + + this.hideRestore = doc.createElement("div"); + this.hideRestore.className = "hues-r-hiderestore"; + this.hideRestore.innerHTML = "▲"; + this.hideRestore.onclick = function() { + that.toggleHide(); + } + this.root.appendChild(this.hideRestore); +} + +RetroUI.prototype.toggleHide = function(stylename) { + stylename = stylename ? stylename : 'r'; + if(this.hidden) { + this.subControls.className = "hues-" + stylename + "-subcontrols"; + this.controls.className = "hues-" + stylename + "-controls"; + this.container.className = "hues-r-container"; + this.hideRestore.className = "hues-r-hiderestore"; + } else { + this.subControls.className = "hues-" + stylename + "-subcontrols hidden"; + this.controls.className = "hues-" + stylename + "-controls hidden"; + this.container.className = "hues-r-container hidden"; + this.hideRestore.className = "hues-r-hiderestore hidden"; + } + this.hidden = !this.hidden; } RetroUI.prototype.connectCore = function(core) { @@ -238,8 +370,11 @@ function ModernUI() { this.rightInfo = null; this.leftInfo = null; this.controls = null; + this.volInput = null; HuesUI.call(this); + + this.hidden = 0; // we have a 3 stage hide } ModernUI.prototype = Object.create(HuesUI.prototype); ModernUI.prototype.constructor = ModernUI; @@ -269,6 +404,41 @@ ModernUI.prototype.initUI = function() { this.hueName.className = "hues-m-huename"; leftBox.appendChild(this.hueName); + var volCluster = doc.createElement("div"); + volCluster.className = "hues-m-vol-cluster"; + leftBox.appendChild(volCluster); + + this.settingsToggle.className = "hues-m-cog"; + volCluster.appendChild(this.settingsToggle); + + var volBar = doc.createElement("div"); + volBar.className = "hues-m-vol-bar"; + volCluster.appendChild(volBar); + + var label = doc.createElement("div"); + label.textContent = "VOL"; + label.className = "hues-m-vol-label"; + volBar.appendChild(label); + + var infoToggle = doc.createElement("div"); + infoToggle.innerHTML = '?'; + infoToggle.className = "hues-m-question"; + infoToggle.onclick = function() { + that.core.settings.showInfo(); + } + volCluster.appendChild(infoToggle); + + var input = doc.createElement("input"); + input.type = "range"; + input.min = 0; + input.max = 1; + input.step = 0.1; + volBar.appendChild(input); + this.volInput = input; + input.oninput = function() { + that.core.soundManager.setVolume(parseFloat(input.value)); + } + var rightBox = doc.createElement("div"); rightBox.className = "hues-m-rightbox"; controls.appendChild(rightBox); @@ -277,28 +447,20 @@ ModernUI.prototype.initUI = function() { //Song/image controls var songs = doc.createElement("div"); songs.className = "hues-m-controlblock"; - var songList = document.createElement("div"); - songList.textContent = "SONGS"; - songList.className = "hues-m-songbutton"; + this.songList.className = "hues-m-songbutton"; var songControls = doc.createElement("div"); songControls.className = "hues-m-controlbuttons"; - var songLeft = doc.createElement("div"); - songLeft.textContent = "<"; - songLeft.className = "hues-m-prevbutton" - songLeft.onclick = function() {that.core.previousSong();}; - var songRight = doc.createElement("div"); - songRight.textContent = ">"; - songRight.className = "hues-m-nextbutton" - songRight.onclick = function() {that.core.nextSong();}; + this.songPrev.className = "hues-m-prevbutton" + this.songNext.className = "hues-m-nextbutton" var songShuffle = doc.createElement("div"); songShuffle.innerHTML = ''; songShuffle.className = "hues-m-actbutton"; songShuffle.onclick = function() {that.core.randomSong();}; - songs.appendChild(songList); - songControls.appendChild(songLeft); + songs.appendChild(this.songList); + songControls.appendChild(this.songPrev); songControls.appendChild(songShuffle); - songControls.appendChild(songRight); + songControls.appendChild(this.songNext); songs.appendChild(songControls); rightBox.appendChild(songs); @@ -310,22 +472,17 @@ ModernUI.prototype.initUI = function() { var imageControls = doc.createElement("div"); imageControls.className = "hues-m-controlbuttons"; - var imageLeft = doc.createElement("div"); - imageLeft.textContent = "<"; - imageLeft.className = "hues-m-prevbutton" - imageLeft.onclick = function() {that.core.previousImage();}; - var imageRight = doc.createElement("div"); - imageRight.textContent = ">"; - imageRight.className = "hues-m-nextbutton" - imageRight.onclick = function() {that.core.nextImage();}; + this.imageMode = doc.createElement("div"); this.imageMode.innerHTML = "▶"; // PLAY this.imageMode.className = "hues-m-actbutton"; this.imageMode.onclick = function() {that.core.toggleFullAuto();}; + this.imagePrev.className = "hues-m-prevbutton"; + this.imageNext.className = "hues-m-nextbutton"; images.appendChild(imageList); - imageControls.appendChild(imageLeft); + imageControls.appendChild(this.imagePrev); imageControls.appendChild(this.imageMode); - imageControls.appendChild(imageRight); + imageControls.appendChild(this.imageNext); images.appendChild(imageControls); rightBox.appendChild(images); @@ -337,6 +494,8 @@ ModernUI.prototype.initUI = function() { leftInfo.appendChild(this.yBlur); rightInfo.appendChild(this.timer); rightInfo.appendChild(this.beatCount); + this.rightInfo = rightInfo + this.leftInfo = leftInfo; controls.appendChild(leftInfo); controls.appendChild(rightInfo); @@ -361,6 +520,24 @@ ModernUI.prototype.initUI = function() { this.beatCenter = beatCenter; } +ModernUI.prototype.toggleHide = function() { + this.beatBar.className = "hues-m-beatbar"; + this.beatCenter.className = "hues-m-beatcenter"; + this.controls.className = "hues-m-controls"; + switch(this.hidden) { + case 1: + this.beatBar.className = "hues-m-beatbar hidden"; + this.beatCenter.className = "hues-m-beatcenter hidden"; + case 0: + this.controls.className = "hues-m-controls hidden"; + } + this.hidden = (this.hidden+1) % 3; +} + +ModernUI.prototype.updateVolume = function(vol) { + this.volInput.value = vol; +} + ModernUI.prototype.modeUpdated = function() { if(this.core.isFullAuto) { this.imageMode.innerHTML = ''; // PAUSE; @@ -439,6 +616,9 @@ WeedUI.prototype.initUI = function() { this.container.removeChild(this.beatBar) var doc = this.root.ownerDocument; + this.controls.className = "hues-w-controls"; + this.subControls.className = "hues-w-subcontrols"; + var beatBar = doc.createElement("div"); beatBar.className = "hues-w-beatbar"; this.root.appendChild(beatBar); @@ -453,6 +633,18 @@ WeedUI.prototype.initUI = function() { beatRight.className = "hues-w-beatright"; beatBar.appendChild(beatRight); this.beatRight = beatRight; + + this.imageModeManual.textContent = "ONE"; + this.imageModeAuto.textContent = "MANY"; +} + +WeedUI.prototype.toggleHide = function() { + if(this.hidden) { + this.beatBar.className = "hues-w-beatbar"; + } else { + this.beatBar.className = "hues-w-beatbar hidden"; + } + RetroUI.prototype.toggleHide.call(this, 'w'); } WeedUI.prototype.beat = function() { @@ -497,8 +689,11 @@ function XmasUI() { this.controls.removeChild(this.leftBox); this.controls.removeChild(this.rightBox); + this.controls.removeChild(this.rightInfo); + this.controls.removeChild(this.leftInfo); - this.leftBox = this.rightBox = this.hueName = null; + this.leftBox = this.rightBox = this.hueName = this.xBlur = this.yBlur + = this.timer = null; this.controls.className = "hues-x-controls"; this.beatBar.className = "hues-x-beatbar"; @@ -506,4 +701,20 @@ function XmasUI() { XmasUI.prototype = Object.create(ModernUI.prototype); XmasUI.prototype.constructor = XmasUI; -XmasUI.prototype.setColourText = function(colour) {}; \ No newline at end of file +XmasUI.prototype.toggleHide = function() { + this.beatBar.className = "hues-x-beatbar"; + this.beatCenter.className = "hues-m-beatcenter"; + this.controls.className = "hues-x-controls"; + switch(this.hidden) { + case 1: + this.beatBar.className = "hues-x-beatbar hidden"; + this.beatCenter.className = "hues-m-beatcenter hidden"; + case 0: + this.controls.className = "hues-x-controls hidden"; + } + this.hidden = (this.hidden+1) % 3; +} + +XmasUI.prototype.setColourText = function(colour) {}; +XmasUI.prototype.blurUpdated = function(x, y) {}; +XmasUI.prototype.updateTime = function(time) {}; \ No newline at end of file diff --git a/js/ResourcePack.js b/js/ResourcePack.js index 20a1674..6ed2365 100644 --- a/js/ResourcePack.js +++ b/js/ResourcePack.js @@ -158,7 +158,7 @@ Respack.prototype.parseXML = function() { if (this._songFile) { this._songFile.getText(function(text) { //XML parser will complain about a bare '&' - text = text.replace(/&/g, '&amp;'); + text = text.replace(/&/g, '&'); that.parseSongFile(text); // Go to next in series that._songFile = null; @@ -173,7 +173,7 @@ Respack.prototype.parseXML = function() { } if (this.images.length > 0 && this._imageFile) { this._imageFile.getText(function(text) { - text = text.replace(/&/g, '&amp;'); + text = text.replace(/&/g, '&'); that.parseImageFile(text); that._imageFile = null; that.parseXML(); @@ -182,7 +182,7 @@ Respack.prototype.parseXML = function() { } if (this._infoFile) { this._infoFile.getText(function(text) { - text = text.replace(/&/g, '&amp;'); + text = text.replace(/&/g, '&'); that.parseInfoFile(text); that._infoFile = null; that.parseXML(); diff --git a/js/SoundManager.js b/js/SoundManager.js index c802e76..4599488 100644 --- a/js/SoundManager.js +++ b/js/SoundManager.js @@ -1,7 +1,8 @@ var LAME_DELAY_START = 2258; var LAME_DELAY_END = 1000; -function SoundManager() { +function SoundManager(core) { + this.core = core; this.playing = false; this.song = null; @@ -39,7 +40,7 @@ function SoundManager() { } var that = this; - window.addEventListener('touchstart', function() { + window.addEventListener('touchend', function() { // create empty buffer var buffer = that.context.createBuffer(1, 1, 22050); @@ -193,11 +194,11 @@ SoundManager.prototype.onSongLoad = function(song) { // because MP3 is bad, we nuke silence SoundManager.prototype.trimMP3 = function(buffer) { - var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; + /*var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; if(!isFirefox) { // Webkit is better than Gecko, clearly return buffer; - } + }*/ var ret = this.context.createBuffer(buffer.numberOfChannels, buffer.length - LAME_DELAY_START - LAME_DELAY_END, buffer.sampleRate); for(var i=0; i